/* menubar-light.css */
/* MENU --------------------------------------------------------------------------------------------------------------------------------------------*/
/* Navbar başlangıçta dark */
#mainNavbar.navbar-dark, #mainNavbar.navbar-dark .navbar-inner {
	background-color: #fff; /*#222;*/
	color: #195629; /* #f5f3d4;*/
}

#mainNavbar.navbar-dark .nav-link, #mainNavbar.navbar-dark .btn {
	color: #195629; /* #f5f3d4;*/
}

#mainNavbar .dropdown-item i {
	width: 22px;
}

/* Navbar linkleri başlangıçta */
#mainNavbar .nav-link {
	color: #195629; /* #f5f3d4;*/ /* Başlangıç text rengi */
	padding: 5px 10px;
	border-radius: 5px; /* Hafif köşe yuvarlama */
	transition: all 0.3s ease; /* Yumuşak geçiş */
}

/* Hover efekti */
#mainNavbar .nav-link:hover, #mainNavbar.navbar-dark .btn:hover {
	color: #195629; /* Hover text rengi */
	background-color: #f5f3d4; /* Hover arka plan rengi */
}

#mainNavbar .btn-outline-light {
	border-color: #195629 !important; /* Başlangıç border */
	color: #f5f3d4 !important;
	background-color: #195629 !important; /* Text */
	transition: all 0.3s ease;
}

/* Hover olunca */
#mainNavbar .btn-outline-light:hover {
	border-color: #195629 !important;
	background-color: #f5f3d4 !important;
	color: #195629 !important;
}

#mainNavbar {
	position: relative;
	width: 100%;
	z-index: 10;
	padding: 20px 0;
}

/* Navbar içi */
.navbar-inner {
	width: 1200px; /* Sabit genişlik */
	max-width: 95%; /* Mobilde taşmayı önler */
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: all 0.3s ease;
	border-radius: 0;
	background: transparent; /* Başlangıçta şeffaf */
}

/* Scroll sonrası navbar değişimi */
#mainNavbar.scrolled .navbar-inner {
	background-color: #222; /* Arka plan sadece navbar’ın arkasında */
	padding: 10px 20px;
	border-radius: 10px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	position: fixed; /* Sayfa kaydırıldığında yukarıda durur */
	top: 10px; /* Üstten boşluk */
	left: 50%;
	transform: translateX(-50%);
	transition: all 0.3s ease;
}

#mainNavbar.scrolled.navbar-light .navbar-inner {
	background-color: #f8f9fa; /* açık arka plan */
	color: #195629; /* koyu yazı */
}

#mainNavbar.scrolled.navbar-light .nav-link, #mainNavbar.scrolled.navbar-light .btn
	{
	color: #195629 !important; /* text koyu olsun */
}

#mainNavbar.scrolled.navbar-light .nav-link {
	color: #195629; /* scroll sonrası text rengi */
}

#mainNavbar.scrolled.navbar-light .nav-link:hover, #mainNavbar.scrolled.navbar-light .btn:hover
	{
	color: #f8f9fa !important; /* hover text rengi */
	background-color: #195629; /* hover arka plan rengi */
}

#mainNavbar.scrolled .btn-outline-light {
	border-color: #195629; /* Başlangıç border */
	color: #f5f3d4; /* Text */
	background-color: #f5f3d4;
	transition: all 0.3s ease;
}

/* ---- only apply hover dropdown on wide screens ---- */
@media ( min-width : 992px) {
	/* Hover ve açıkkıkta üst menü text rengi sabit kalsın */
	.hover-dropdown>.nav-link, .hover-dropdown:hover>.nav-link,
		.hover-dropdown.show>.nav-link {
		color: #195629 !important; /* #f5f3d4 !important;*/ /* sabit renk */
	}

	/* Bootstrap’ın dropdown-toggle aktif rengini iptal et */
	.navbar .nav-link.dropdown-toggle:focus, .navbar .nav-link.dropdown-toggle:active
		{
		color: #195629 !important; /* #f5f3d4 !important;*/
		background-color: transparent !important;
	}

	/* Alt menü üstünde gezinirken de üst menü rengi değişmesin */
	.hover-dropdown:hover>.nav-link, .hover-dropdown:focus-within>.nav-link
		{
		color: #195629 !important;
	}

	/* Hover anında üst item köşelerin alt taraflarını düzleştir */
	.hover-dropdown:hover>.nav-link {
		background-color: #f5f3d4; /* navbar dark ise */
		color: #195629;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	/* Dropdown menü aynı arka planda olsun */
	.hover-dropdown .dropdown-menu {
		background-color: #f5f3d4 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}
	.scrolled.navbar-light .hover-dropdown .dropdown-menu {
		background-color: #f5f3d4 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}

	/* Menü item renkleri */
	.hover-dropdown .dropdown-menu .dropdown-item {
		color: #195629;
	}
	.hover-dropdown .dropdown-menu .dropdown-item:hover {
		background-color: #195629 !important;
		color: #f5f3d4;
	}

	/* scrolled olduğunda */

	/* Hover ve açıkkıkta üst menü text rengi sabit kalsın */
	#mainNavbar.scrolled .hover-dropdown>.nav-link, .hover-dropdown:hover>.nav-link,
		.hover-dropdown.show>.nav-link {
		color: #195629 !important; /* sabit renk */
	}

	/* Bootstrap’ın dropdown-toggle aktif rengini iptal et */
	#mainNavbar.scrolled .navbar .nav-link.dropdown-toggle:focus, .navbar .nav-link.dropdown-toggle:active
		{
		color: #195629 !important;
		background-color: transparent !important;
	}

	/* Alt menü üstünde gezinirken de üst menü rengi değişmesin */
	#mainNavbar.scrolled .hover-dropdown:hover>.nav-link, #mainNavbar.scrolled .hover-dropdown:focus-within>.nav-link
		{
		color: #f5f3d4 !important;
	}

	/* Hover anında üst item köşelerin alt taraflarını düzleştir */
	#mainNavbar.scrolled .hover-dropdown:hover>.nav-link {
		background-color: #195629; /* navbar dark ise */
		color: #f5f3d4;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	/* Dropdown menü aynı arka planda olsun */
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu {
		background-color: #195629 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu {
		background-color: #195629 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}

	/* Menü item renkleri */
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu .dropdown-item {
		color: #f5f3d4;
	}
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu .dropdown-item:hover
		{
		background-color: #f5f3d4 !important;
		color: #195629;
	}
}

#mainNavbar i {
	color:inherit;
	margin-right:3px;
}


/* makpeyzaj.css */
body {
	font-family: 'Inter', sans-serif;
}

h1, h2, h3, p, a, li, label, option, select, div {
	font-family: 'Montserrat', sans-serif;
}

/* Menu Light CSS ---------------------------------------------------------------------------------------------------------------*/
/* Navbar başlangıçta dark */
#mainNavbar.navbar-dark, #mainNavbar.navbar-dark .navbar-inner {
	background-color: #fff; /*#222;*/
	color: #195629; /* #f5f3d4;*/
}

#mainNavbar.navbar-dark .nav-link, #mainNavbar.navbar-dark .btn {
	color: #195629; /* #f5f3d4;*/
}

#mainNavbar .dropdown-item i {
	width: 22px;
}

/* Navbar linkleri başlangıçta */
#mainNavbar .nav-link {
	color: #195629; /* #f5f3d4;*/ /* Başlangıç text rengi */
	padding: 5px 10px;
	border-radius: 5px; /* Hafif köşe yuvarlama */
	transition: all 0.3s ease; /* Yumuşak geçiş */
}

/* Hover efekti */
#mainNavbar .nav-link:hover, #mainNavbar.navbar-dark .btn:hover {
	color: #195629; /* Hover text rengi */
	background-color: #f5f3d4; /* Hover arka plan rengi */
}

#mainNavbar .btn-outline-light {
	border-color: #195629 !important; /* Başlangıç border */
	color: #f5f3d4 !important;
	background-color: #195629 !important; /* Text */
	transition: all 0.3s ease;
}

/* Hover olunca */
#mainNavbar .btn-outline-light:hover {
	border-color: #195629 !important;
	background-color: #f5f3d4 !important;
	color: #195629 !important;
}

#mainNavbar {
	position: relative;
	width: 100%;
	z-index: 10;
	padding: 20px 0;
}

/* Navbar içi */
.navbar-inner {
	width: 1200px; /* Sabit genişlik */
	max-width: 95%; /* Mobilde taşmayı önler */
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: all 0.3s ease;
	border-radius: 0;
	background: transparent; /* Başlangıçta şeffaf */
}

/* Scroll sonrası navbar değişimi */
#mainNavbar.scrolled .navbar-inner {
	background-color: #222; /* Arka plan sadece navbar’ın arkasında */
	padding: 10px 20px;
	border-radius: 10px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	position: fixed; /* Sayfa kaydırıldığında yukarıda durur */
	top: 10px; /* Üstten boşluk */
	left: 50%;
	transform: translateX(-50%);
	transition: all 0.3s ease;
}

#mainNavbar.scrolled.navbar-light .navbar-inner {
	background-color: #f8f9fa; /* açık arka plan */
	color: #195629; /* koyu yazı */
}

#mainNavbar.scrolled.navbar-light .nav-link, #mainNavbar.scrolled.navbar-light .btn
	{
	color: #195629 !important; /* text koyu olsun */
}

#mainNavbar.scrolled.navbar-light .nav-link {
	color: #195629; /* scroll sonrası text rengi */
}

#mainNavbar.scrolled.navbar-light .nav-link:hover, #mainNavbar.scrolled.navbar-light .btn:hover
	{
	color: #f8f9fa !important; /* hover text rengi */
	background-color: #195629; /* hover arka plan rengi */
}

#mainNavbar.scrolled .btn-outline-light {
	border-color: #195629; /* Başlangıç border */
	color: #f5f3d4; /* Text */
	background-color: #f5f3d4;
	transition: all 0.3s ease;
}

/* ---- only apply hover dropdown on wide screens ---- */
@media ( min-width : 992px) {
	/* Hover ve açıkkıkta üst menü text rengi sabit kalsın */
	.hover-dropdown>.nav-link, .hover-dropdown:hover>.nav-link,
		.hover-dropdown.show>.nav-link {
		color: #195629 !important; /* #f5f3d4 !important;*/ /* sabit renk */
	}

	/* Bootstrap’ın dropdown-toggle aktif rengini iptal et */
	.navbar .nav-link.dropdown-toggle:focus, .navbar .nav-link.dropdown-toggle:active
		{
		color: #195629 !important; /* #f5f3d4 !important;*/
		background-color: transparent !important;
	}

	/* Alt menü üstünde gezinirken de üst menü rengi değişmesin */
	.hover-dropdown:hover>.nav-link, .hover-dropdown:focus-within>.nav-link
		{
		color: #195629 !important;
	}

	/* Hover anında üst item köşelerin alt taraflarını düzleştir */
	.hover-dropdown:hover>.nav-link {
		background-color: #f5f3d4; /* navbar dark ise */
		color: #195629;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	/* Dropdown menü aynı arka planda olsun */
	.hover-dropdown .dropdown-menu {
		background-color: #f5f3d4 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}
	.scrolled.navbar-light .hover-dropdown .dropdown-menu {
		background-color: #f5f3d4 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}

	/* Menü item renkleri */
	.hover-dropdown .dropdown-menu .dropdown-item {
		color: #195629;
	}
	.hover-dropdown .dropdown-menu .dropdown-item:hover {
		background-color: #78ac48 !important;
		color: #f5f3d4;
	}

	/* scrolled olduğunda */

	/* Hover ve açıkkıkta üst menü text rengi sabit kalsın */
	#mainNavbar.scrolled .hover-dropdown>.nav-link, .hover-dropdown:hover>.nav-link,
		.hover-dropdown.show>.nav-link {
		color: #195629 !important; /* sabit renk */
	}

	/* Bootstrap’ın dropdown-toggle aktif rengini iptal et */
	#mainNavbar.scrolled .navbar .nav-link.dropdown-toggle:focus, .navbar .nav-link.dropdown-toggle:active
		{
		color: #195629 !important;
		background-color: transparent !important;
	}

	/* Alt menü üstünde gezinirken de üst menü rengi değişmesin */
	#mainNavbar.scrolled .hover-dropdown:hover>.nav-link, #mainNavbar.scrolled .hover-dropdown:focus-within>.nav-link
		{
		color: #f5f3d4 !important;
	}

	/* Hover anında üst item köşelerin alt taraflarını düzleştir */
	#mainNavbar.scrolled .hover-dropdown:hover>.nav-link {
		background-color: #195629; /* navbar dark ise */
		color: #f5f3d4;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	/* Dropdown menü aynı arka planda olsun */
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu {
		background-color: #195629 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu {
		background-color: #195629 !important;
		border: none;
		border-radius: 0 0 8px 8px; /* sadece alt köşeler yuvarlak */
		margin-top: 0; /* boşluk kalmasın */
		padding-top: 0; /* birleşik dursun */
	}

	/* Menü item renkleri */
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu .dropdown-item {
		color: #f5f3d4;
	}
	#mainNavbar.scrolled .hover-dropdown .dropdown-menu .dropdown-item:hover
		{
		background-color: #f5f3d4 !important;
		color: #195629;
	}
}

#mainNavbar i {
	color: inherit;
	margin-right: 3px;
}

.dropdown-toggle::after {
	display: none !important;
}

.dropdown-toggle {
	padding-right: .75rem  !important;
}

/* Slider CSS -------------------------------------------------------------------------------------*/
.slider-wrapper, .info-wrapper, .main-section {
	width: 100%;
	position: relative;
}

/* Swiper slide tam ekran (navbar sonrası) */
.mySwiper, .swiper-slide {
	width: 100%;
	height: calc(100vh - var(--navbar-height, 60px));
	display: flex;
	position: relative;
	background-size: cover;
	background-position: top;
}

.swiper-slide {
	display: flex;
	justify-content: center;
	align-items: center;
	background-size: cover;
	background-position: top;
	position: relative;
}

.slider-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.35);
	z-index: 1;
}

.slider-caption {
	position: absolute;
	z-index: 2;
	color: #fff;
	text-align: center;
	width: auto;
	max-width: 500px;
}

/* Pozisyonlar */
.slide-top-left {
	top: 20px;
	left: 20px;
	text-align: left;
}

.slide-center {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.slide-bottom-right {
	bottom: 20px;
	right: 20px;
	text-align: right;
}

.slider-caption h2 {
	font-size: 3rem;
	font-weight: 700;
	text-shadow: 0 0 8px rgba(0, 0, 0, 0.7);
	animation: fadeInUp 1s forwards;
}

.slider-caption p {
	font-size: 1.2rem;
	margin: 12px 0;
	text-shadow: 0 0 6px rgba(0, 0, 0, 0.6);
	animation: fadeIn 1.5s forwards;
}

.slider-caption a.btn {
	animation: fadeInScale 2s forwards;
	transition: transform 0.3s, background 0.3s;
}

.slider-caption a.btn:hover {
	transform: scale(1.1);
	background-color: #fff !important;
	color: #000 !important;
}

/* Pagination daire */
.swiper-pagination-bullet {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.8);
}

.swiper-pagination-bullet-active {
	background:   #fff;
}

/* Info CSS ---------------------------------------------------------------------------------------------------------*/

/* İçerik kısmı 1100px olacak ve ortalanacak */
.info-content {
	width: 1100px;
	max-width: 90%; /* Mobil için */
	margin: 20px auto; /* Ortalamayı sağlar */
	background: white;
	padding: 20px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

/* Satır: iki kolon olacak */
.info-row {
	display: flex;
	gap: 20px; /* kolonlar arası boşluk */
	align-items: top; /* dikey ortalama */
}

/* Sol kolon: başlık + metin */
.info-left {
	flex: 1;
	min-width: 0;
	padding: 0 !important; /* Sol ve sağ boşlukları tamamen sıfırla */
	margin: 0 !important; /* Her ihtimale karşı */
	text-align: left; /* Yazıların sola hizalı olduğundan emin ol */
}

/* Başlık */
.info-title {
	margin: 0 0 12px 0;
	font-size: 28px;
	line-height: 1.15;
	color: #222;
	font-weight: bold;
}

/* Alt Başlık */
.info-sub-title {
	margin: 0 0 12px 0;
	font-size: 24px;
	line-height: 1.15;
	color: #4f4f4f;
}

/* Metin */
.info-text {
	margin-top: 10px;
	font-size: 16px;
	color: #444;
	line-height: 1.6;
	text-align: justify;
}

/* Sağ kolon: sabit boyutlu resim kutusu */
.info-right {
	width: 400px; /* sabit genişlik */
	flex: 0 0 400px; /* esneme yok, tam 300px */
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Resim: 300x300, kırpma ve düzgün yerleşim */
.info-right img {
	width: 400px;
	height: 400px;
	object-fit: cover; /* kırpar, bozulmaz */
	object-position: top; /* üst kısmı görünür */
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
	display: block;
}

/* ---------- Responsive: mobilde alt alta ----------- */
@media ( max-width : 900px) {
	.info-content {
		padding: 18px;
	}
	.info-row {
		flex-direction: column;
		gap: 18px;
		align-items: stretch;
	}
	.info-right {
		width: 100%;
		flex: 0 0 auto;
	}
	.info-right img {
		width: 100%;
		height: auto;
		max-height: 400px; /* istersen sınırlandır */
		object-fit: cover;
	}
	.info-title {
		font-size: 24px;
	}
}

/* Küçük telefonlar için biraz daha sıkı ayar */
@media ( max-width : 480px) {
	.info-content {
		padding: 12px;
	}
	.info-title {
		font-size: 20px;
	}
	.info-text {
		font-size:  15px;
	}
}

/* Main CSS ----------------------------------------------------------------------------------------------------------- */
.main-section {
	height: 150px; /* menü altı yüksekliği */
	min-height: 150px;
	background-size: cover;
	background-position: top center;
	display: flex;
	justify-content: center;
	overflow: hidden;
}

.main-container {
	width: 1100px;
	max-width: 90%;
	margin: 0 auto;
	position: relative;
}

.main-title {
	color: #fff;
	font-size: 32px;
	font-weight: bold;
	opacity: 0;
	transform: translateY(30px);
	animation: titleFadeIn 1s forwards;
	animation-delay: 0.5s;
	/* solda alt */
	position: absolute;
	left: 30px;
	bottom: 30px;
	/* text shadow ile gölge */
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

.main-title i {
	font-size: 24px;
	width: 40px;
	transform: translateX(30px);
	animation: titleFadeIn 1s forwards;
	animation-delay: 0.5s;
}

/* Başlıktan sonraki içerik bölümü */
.main-content-section {
	width: 100%;
	background: #f5f5f5; /* dilersen renk ekleyebilirsin */
}

.main-content-container {
	width: 1100px;
	padding: 20px;
	max-width: 95%;
	min-height:400px;
	margin: 0 auto; /* ortalama */
	font-size:  18px;
	background: #fff;
}

.main-content-container p {
	padding: 20px 20px 0px 20px;
	text-align: justify;
	line-height: 1.8;
}

.main-content-container h2 {
	padding: 20px 20px 0px 20px; 
}

.main-content-container ul {
	margin-left: 30px;
}

.main-content-container b {
	color: #195629;
}

.main-content-container span.www {
	color: #ff5300;
	font-weight: bold;
	font-family: 'Poppins', sans-serif;
}

.main-content-container a {
	text-decoration: none;
	font-weight: bold;
	color: #0000ff;
}

.main-content-container a:hover {
	color: #7575ff;
}

.main-content-container img, .main-content-container img.right {
	transform: translateY(30px);
	animation: titleFadeIn 1s forwards;
	animation-delay: 0.5s;
	width: 260px;
	height: 260px;
	float: left;
	overflow: hidden;
	margin: 30px 20px 10px 20px;
	/* text shadow ile gölge */
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	border-radius: 10px;
}

.main-content-container img.right {
	float: right;
}

.topbar-logo {
	height: 40px;
}

/* icon-list CSS ----------------------------------------------------------------------------------------------*/
.icon-content {
	width: 1100px;
	max-width: 90%; /* Mobil için */
	margin: 0 auto; /* Ortalamayı sağlar */
	padding: 20px;
}

.icon-list {
	display: flex;
	flex-wrap: wrap; /* satır dolunca alt satıra geç */
	gap: 20px; /* ikonlar arası boşluk */
	justify-content: center;
	align-items: center;
}

.icon-item {
	padding-top: 30px;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 180px; /* toplam alan 100px */
}

.icon-circle {
	width: 100px;
	height: 100px;
	border-radius: 50px; /* yuvarlak daire */
	border: 2px solid #f5f3d4; /* çerçeve rengi */
	overflow: hidden; /* taşan resmi kes */
	display: flex;
	opacity: 0.7;
	padding: 10px;
	background-color: #f5f3d4;
	justify-content: center;
	align-items: center;
	box-shadow: 0 5px 15px #195629;
}

.icon-circle img {
	width: 80%;
	height: 80%;
	object-fit: cover; /* resim daireyi doldursun, bozulmasın */
}

.icon-title {
	margin-top: 18px;
	font-size: 14px;
	text-align: center;
	font-weight: bold;
	color: #195629;
	height: 50px;
}

.icon-item:hover .icon-title {
	display: flex;
	color: #36ba57;
	border-top: 2px dotted #777;
	padding-top: 10px;
}

.icon-circle:hover {
	border-radius: 20px;
	transform: scale(1.05);
	border: 2px dotted #777;
	box-shadow: 0 5px 15px #195629;
}

.icon-circle:hover img {
	transform: scale(0.75);
	transition: all 0.3s ease;
}
/* loginModal CSS ------------------------------------------------------------------------------------------------------------*/

/* Genel Tasarım */
#globalModal .modal-content {
	border-radius: 0;
	border-bottom-left-radius: 12px;
	border-bottom-right-radius: 12px;
}

#globalModal .row-line {
	/* border-bottom: 1px solid #e5e5e5; */
	padding: 15px 20px;
}

#globalModal .row-line img {
	margin-right: 20px;
}

#globalModal a {
	text-decoration: none; /* İsteğe bağlı */
}

#globalModal p {
	line-height: 1.8;
}

.login-header {
	background: #f5f3d4;
	height: 50px;
	overflow: hidden;
	margin-bottom: 10px
}

.modal-close-white {
	color: fff;
}

/* 1. Satır - Header */
.login-header-logo {
	height: 30px;
	margin-right: 10px;
}

.login-header-company {
	font-size: 20px;
	font-weight: 600;
	color: #195629;
}

/* Floating label input alanları */
.form-floating>label {
	padding-left: 12px;
}

/* Captcha alanı */
.captcha-box {
	background: #f1f1f1;
	padding: 8px 12px;
	font-size: 18px;
	letter-spacing: 3px;
	border-radius: 5px;
	display: inline-block;
	user-select: none;
}

.modal-success-width {
	max-width: 700px; /* veya width: 600px; */
}

#successModalBody {
	margin-top: 20px;
}

.modal-success-width p {
	margin: 0 40px 0 20px;
	line-height: 1.4;
	font-size: 14px;
	text-align: justify;
}

/* footer CSS ----------------------------------------------------------------------------------------------------*/
.footer-info-bar {
	background: #222;
	color: #fff;
	padding: 20px 0;
}

.footer-info-bar a {
	color: #ccc;
	margin-right: 15px;
	text-decoration: none;
}

.footer-info-bar a:hover {
	color: #fff;
}

/* Service CSS --------------------------------------------------------------------------------------------------------*/
.service-section {
	width: 100%;
	background: #f5f5f5; /* dilersen renk ekleyebilirsin */
}

.service-section-container {
	width: 1100px;
	padding: 20px;
	max-width: 95%;
	margin: 0 auto; /* ortalama */
	font-size:  18px;
	background: #fff;
}

.service-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 25px;
	padding: 0px 20px 30px 20px;
}

.service-item {
	display: block;
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	color: #333;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1);
	transition: all .3s ease;
}

.service-item:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.service-image-wrapper {
	position: relative;
	overflow: hidden;
}

.service-image-wrapper img {
	width: 100%;
	height: 280px;
	object-fit: cover;
	transition: transform .4s ease;
}

.service-item:hover img {
	transform: scale(1.08);
}

.service-item:hover .service-title {
	color: #71ffff;
	transform: scale(1.08);
}

/* Resmin sol altındaki title */
.service-title {
	position: absolute;
	left: 10px;
	bottom: 10px;
	background: rgba(0, 0, 0, 0.55);
	color: #fff;
	padding: 6px 12px;
	border-radius: 8px;
	font-size: 16px;
	font-weight: bold;
}

/* Resmin altındaki kısa metin */
.service-desc {
	text-align: center;
	font-size: 15px;
	padding: 15px;
	line-height: 1.4;
	height: 80px;
	overflow: hidden;
	display: -webkit-box; /* çok satırlı kısaltma */
	-webkit-box-orient: vertical;
	text-overflow:  ellipsis;
}

/* Responsive */
@media ( max-width : 768px) {
	.service-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media ( max-width : 480px) {
	.service-grid {
		grid-template-columns:  1fr;
	}
}

.blur {
	width: 100%;
	height: 200px;
	object-fit: cover;
	filter: blur(12px);
	transition: filter .5s ease, transform .4s ease;
}

.blur-loaded {
	filter:  blur(0) !important;
}

/* Basın, Belge ve Sertifikalar CSS -----------------------------------------------------*/
.basin-section {
	width: 100%;
	background: #f5f5f5; /* dilersen renk ekleyebilirsin */
}

.basin-section-container {
	width: 1100px;
	padding: 20px;
	max-width: 95%;
	margin: 0 auto; /* ortalama */
	font-size:  18px;
	background: #fff;
}

.basin-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 25px;
	padding: 0px 20px 30px 20px;
}

.basin-item {
	display: block;
	height: 400px;
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	color: #333;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1);
	transition: all .3s ease;
}

.basin-item:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.basin-image-wrapper {
	position: relative;
	overflow: hidden;
}

.basin-image-wrapper img {
	width: 100%;
	height: 280px;
	object-fit: cover;
	transition: transform .4s ease;
}

.basin-item:hover img {
	transform: scale(1.08);
}

.basin-item:hover .basin-title {
	color: #71ffff;
	transform: scale(1.08);
}

/* Resmin sol altındaki title */
.basin-title {
	position: absolute;
	left: 10px;
	bottom: 10px;
	background: #195629;
	color: #fff;
	padding: 6px 12px;
	border-radius: 8px;
	font-size: 16px;
	font-weight: bold;
}

/* Resmin altındaki kısa metin */
.basin-desc {
	text-align: left;
	font-size: 15px;
	padding: 15px;
	line-height: 1.4;
	height: 80px;
	overflow: hidden;
	display: -webkit-box; /* çok satırlı kısaltma */
	-webkit-box-orient: vertical;
	text-overflow:  ellipsis;
}

/* Responsive */
@media ( max-width : 768px) {
	.basin-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media ( max-width : 480px) {
	.basin-grid {
		grid-template-columns:  1fr;
	}
}

.blur {
	width: 100%;
	height: 200px;
	object-fit: cover;
	filter: blur(12px);
	transition: filter .5s ease, transform .4s ease;
}

.blur-loaded {
	filter:  blur(0) !important;
}

.doc-row {
	display: flex;
	flex-wrap: wrap; /* satır dolunca alta geç */
	justify-content: left; /* satırdaki öğeleri ortala */
	gap: 20px;
	background: #fff;
	margin-bottom: 30px; /* aralarındaki boşluk */
}

.doc-row img {
	width: 200px;
	height: 300px;
	object-fit: cover; /* taşmaları düzgün keser */
	border-radius: 10px;
	display:  block;
}

/* Etkinlikler CSS ----------------------------------------------------*/
.etkinlik-section {
	width: 100%;
	background: #f5f5f5; /* dilersen renk ekleyebilirsin */
}

.etkinlik-section-container {
	width: 1100px;
	padding: 20px;
	max-width: 95%;
	margin: 0 auto; /* ortalama */
	font-size:  18px;
	background: #fff;
}

.etkinlik-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 25px;
	padding: 0px 20px 30px 20px;
}

.etkinlik-item {
	display: block;
	height: 400px;
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	color: #333;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.1);
	transition: all .3s ease;
}

.etkinlik-item:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.etkinlik-image-wrapper {
	position: relative;
	overflow: hidden;
}

.etkinlik-image-wrapper img {
	width: 100%;
	height: 280px;
	object-fit: cover;
	transition: transform .4s ease;
}

.etkinlik-item:hover img {
	transform: scale(1.08);
}

.etkinlik-item:hover .etkinlik-title {
	color: #71ffff;
	transform: scale(1.08);
}

/* Resmin sol altındaki title */
.etkinlik-title {
	position: absolute;
	left: 10px;
	bottom: 10px;
	background: #195629;
	color: #fff;
	padding: 6px 12px;
	border-radius: 8px;
	font-size: 16px;
	font-weight: bold;
}

/* Resmin altındaki kısa metin */
.etkinlik-desc {
	text-align: left;
	font-size: 15px;
	padding: 15px;
	line-height: 1.4;
	height: 80px;
	overflow: hidden;
	display: -webkit-box; /* çok satırlı kısaltma */
	-webkit-box-orient: vertical;
	text-overflow:  ellipsis;
}

/* Responsive */
@media ( max-width : 768px) {
	.etkinlik-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media ( max-width : 480px) {
	.etkinlik-grid {
		grid-template-columns:  1fr;
	}
}

/* Blog CSS -----------------------------------------------------------------*/
.blog-section {
	width: 100%;
	background: #f5f5f5; /* dilersen renk ekleyebilirsin */
}

.blog-section-container {
	width: 1100px;
	padding: 20px;
	max-width: 95%;
	margin: 0 auto; /* ortalama */
	font-size:  18px;
	background: #fff;
}

.blog-section-container a {
	text-decoration:none;
	font-weight:bold;
	font-size:18px;
}

.blog-section-container a i {
	font-size:12px;
}
.blog-container {
	display: flex;
	gap: 20px;
	max-width: 1100px;
	margin: 0;
	padding: 0;
}

/* Sol ana içerik */
.blog-main {
	flex: 3;
}

/* Blog Grid */
.blog-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.blog-card {
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s ease;
	display: flex;
	flex-direction: column;
}

/* Diğer içerikler aynı */
.blog-card img {
	width: 100%;
	display: block;
}

.blog-card h3 {
	margin: 10px;
	font-size: 18px;
	font-weight: bold;
}

.blog-card p {
	margin: 0 10px 10px 10px;
	color: #555;
	font-size: 14px;
}

/* Detay linkini sağa hizala */
.blog-card .read-more {
	align-self: flex-end; /* Sağ hizalama */
	margin: 10px 10px 20px 10px;
	color: #195629;
	text-decoration: none;
	font-weight: 500;
	transition: all 0.2s ease;
}

.blog-card .read-more:hover {
	color:   #1a237e !important;
	font-weight: bold;
}

/* Hover efekti */
.blog-card:hover {
	transform: translateY(-5px);
}

/* Sayfalama */
.pagination {
	margin-top: 30px;
	text-align: center;
}

.pagination a {
	margin: 0 5px;
	padding: 8px 12px;
	text-decoration: none;
	color: #333;
	border-radius: 5px;
	border: 1px solid #ccc;
	transition: all 0.2s ease;
}

.pagination a.active, .pagination a:hover {
	background: #3f51b5;
	color: white;
	border-color: #3f51b5;
}

/* Sağ sidebar */
.blog-sidebar {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.blog-sidebar .widget {
	background: #fff;
	padding: 15px;
	border-radius: 10px;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

.blog-sidebar .widget h4 {
	margin-top: 0;
	margin-bottom: 10px;
	font-size: 16px;
}

.blog-sidebar .widget input {
	width: 100%;
	padding: 8px 10px;
	border-radius: 5px;
	border: 1px solid #ccc;
}

.blog-sidebar .widget ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.blog-sidebar .widget ul li {
	margin-bottom: 5px;
}

.blog-sidebar .widget ul li a {
	text-decoration: none;
	color: #3f51b5;
	font-size: 14px;
}

.blog-sidebar .widget img {
	width: 100%;
	margin-bottom: 10px;
	border-radius: 5px;
}

/* Responsive */
@media ( max-width : 992px) {
	.blog-container {
		flex-direction: column;
	}
	.blog-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media ( max-width : 600px) {
	.blog-grid {
		grid-template-columns:  1fr;
	}
}

/* Referanslar CSS --------------------------------------------------------*/
:root {
	--accent: #2b5d2b;
	--muted: #6b7280;
	--card-bg: #ffffff;
	--logo-circle-bg: #ffffff;
	--shadow: 0 10px 30px rgba(11, 22, 50, 0.08);
}

/* Bölüm kapsayıcı (isteğe göre arkaplan rengini kaldırabilirsin) */
.refs-section {
	padding: 48px 16px;
	font-family: 'Poppins', system-ui, -apple-system, "Segoe UI", Roboto,
		"Helvetica Neue", Arial;
	background: transparent; /* sayfanın arka planını etkilemesin */
}

/* İç container genişliği */
.refs-section .container {
	max-width: 1200px;
	margin: 0 auto;
}

/* Başlık (opsiyonel) */
.refs-section h2 {
	text-align: center;
	margin-bottom: 28px;
	font-size: 28px;
	color: var(--accent);
}

/* Grid: 4 kolon */
.refs-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 22px;
	align-items: start;
}

/* Kart: içerik ortalanmış, arkaplan şeffaf tutup sadece logo dairesini vurguluyoruz */
.ref-card {
	background: transparent; /* sadece logo dairesi beyaz olacak */
	border-radius: 12px;
	padding: 14px 10px;
	text-align: center;
	transition: transform .22s ease, box-shadow .22s ease;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

/* Hover hafif yükselme (isteğe bağlı) */
.ref-card:hover {
	transform: translateY(-6px);
}

/* Logo dairesi: beyaz arka plan + gölge */
.logo-wrap {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background: var(--logo-circle-bg); /* beyaz */
	box-shadow: var(--shadow);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	flex-shrink: 0;
}

/* İçteki logo resmi: daire içinde ortalı, taşma yok */
.logo-wrap img {
	max-width: 82%;
	max-height: 82%;
	object-fit: contain;
	display: block;
	transition: transform .35s ease, filter .35s ease;
	filter: saturate(0.95) contrast(0.98);
}

/* Hover etkisi: logo hafif büyüsün ve canlılaşsın */
.ref-card:hover .logo-wrap img {
	transform: scale(1.06);
	filter: saturate(1) contrast(1);
}

/* Firma adı */
.ref-name {
	margin: 6px 0 0;
	font-size: 15px;
	color: #111827;
	font-weight: 600;
	text-align: center;
}

/* Detay linki (buton görünümü) */
.ref-link {
	margin-top: 8px;
	padding: 8px 12px;
	border-radius: 8px;
	background: transparent;
	color: var(--accent);
	text-decoration: none;
	border: 1px solid rgba(43, 93, 43, 0.10);
	font-size: 14px;
	transition: background .18s, color .18s, transform .12s;
}

/* Link hover */
.ref-link:hover {
	background: var(--accent);
	color: #fff;
	transform: translateY(-2px);
}

/* Responsive: 3,2,1 kolonlara düşsün */
@media ( max-width : 1024px) {
	.refs-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 18px;
	}
	.logo-wrap {
		width: 110px;
		height: 110px;
	}
}

@media ( max-width : 768px) {
	.refs-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
	.logo-wrap {
		width: 100px;
		height: 100px;
	}
}

@media ( max-width : 480px) {
	.refs-grid {
		grid-template-columns: 1fr;
		gap: 14px;
	}
	.logo-wrap {
		width: 120px;
		height: 120px;
	} /* mobilde biraz büyük göster */
}

/* Admin title bar */
.header-row {
	display: flex;
	justify-content: space-between;
	align-items: top; /* DİKEY ORTALAMA */
	padding:  2px 15px 2px 5px;
}

.header-row .title {
	padding-top: 7px;
	font-size: 24px;
	font-weight: bold;
	opacity: 0;
	transform: translateX(-40px);
	animation: slideRight .7s ease forwards;
}

.header-row .right-group {
	display: flex;
	align-items: center; /* DİKEY ORTALAMA */
	gap:  12px;
}

.header-row .search-box {
	position: relative;
	display: flex;
	margin-top: 10px;
	margin-right: 20px;
	justify-content:  center;
	align-items: center; /* DİKEY ORTALAMA */
	transition: .3s;
}

.header-row .search-box:focus-within {
	border-color: #f5f3d4;
}

.header-row .search-box input {
	width: 180px;
	height: 30px; /* DAHA İNCE */
	padding: 4px 32px 4px 12px;
	font-size: 14px;
	border: 1px solid #ccc;
	border-radius: 50px !important; /* YARIM DAİRE */
	outline: none;
	transition: 0.2s ease;
}

.header-row .search-box input:focus {
	border-color: #f5f3d4;
	box-shadow: 0 0 0 2px rgba(0, 119, 255, 0.2);
}

.header-row .search-box .search-btn {
	position: absolute;
	right: 8px;
	background: none;
	border: none;
	cursor: pointer;
	font-size: 16px;
	padding: 0;
}

.header-row .search-box .loader {
	width: 14px;
	height: 14px;
	border: 2px solid #ccc;
	border-top-color: #333;
	border-radius: 50%;
	animation: spin 0.6s linear infinite;
	position: absolute;
	right: -22px;
	display: none;
}

.header-row .icons {
	display: flex;
	align-items: center; /* DİKEY ORTALAMA */
	gap: 10px;
}

.header-row .icon {
	font-size: 28px;
	opacity: 0;
	transform: translateY(-20px);
	animation: fallDown .6s ease forwards;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	transition: .2s ease; /* hover ve active için yumuşak animasyon */
	cursor: pointer;
}

/* her ikona gecikme veriyoruz */
.header-row .icon:nth-child(1) {
	animation-delay: .2s;
}

.header-row .icon:nth-child(2) {
	animation-delay: .4s;
}

/* 🔵 HOVER — Ikon 1.15x büyüsün ve gölge çıksın */
.header-row .icon:hover {
	transform: translateY(0) scale(1.15);
	font-size: 24px;
	box-shadow: 0 3px 8px rgba(255, 255, 255, 0.75);
}

/* 🔵 AKTIF (tıklama anı) — Hafif daha büyük + güçlü gölge */
.header-row .icon:active {
	transform: translateY(0) scale(1.25);
	font-size: 24px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
}

/* =========================================
   GENEL FORM TASARIMI
========================================= */
.support-form {
	max-width: 600px;
	margin: 30px auto;
	padding: 25px;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

.support-form h2 {
	text-align: center;
	margin-bottom: 25px;
	font-size: 26px;
	color: #333;
}

/* =========================================
   INPUT GROUP
========================================= */
.contactForm .input-group {
	position: relative;
	padding-right: 5px;
	margin-bottom: 12px;
	padding-right: 5px;
}

.contactForm h2 {
	margin-bottom: 30px;
}

.contactForm .error-message {
	font-size: 12px;
	display: none;
}

.contactForm input.error, .contactForm select.error, .contactForm textarea.error
	{
	border-color: red !important;
	border: 2px solid red !important;
}

.contactForm label.error {
	color: red !important;
}

.contactForm input.success, .contactForm select.success, .contactForm select.success,
	.contactForm textarea.success {
	border-color: #195629 !important;
	border: 2px solid #195629 !important;
}

.contactForm label.success {
	color: #195629 !important;
	font-weight: bold;
}

.contactForm .input-group input, .contactForm .input-group select,
	.contactForm .input-group textarea {
	width: 100%;
	padding: 12px 14px;
	font-size: 15px;
	border: 1px solid #ccc;
	border-radius: 8px;
	outline: none;
	transition: 0.2s ease;
	background: #fff;
}

.contactForm .input-group textarea {
	min-height: 100px;
	resize: vertical;
}

.contactForm .input-group input:not(:focus), .contactForm .input-group select:not(:focus),
	.contactForm .input-group textarea:not(:focus) {
	border: 1px solid #ccc !important;
	box-shadow: none;
}

.contactForm .input-group input:not(:focus)+label, .contactForm .input-group select:not(:focus)+label,
	.contactForm .input-group select:not(:placeholder-shown)+label,
	.contactForm .input-group textarea:not(:focus)+label, .contactForm .input-group textarea:not(:placeholder-shown)+label
	{
	color: #999 !important;
	font-weight: normal;
}

/* Hover ve focus */
.contactForm .input-group input:focus, .contactForm .input-group select:focus,
	.contactForm .input-group textarea:focus {
	border-color: #195629;
	box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.15);
}

/* =========================================
   FLOATING LABEL (GENEL)
========================================= */
.contactForm .input-group label {
	position: absolute;
	top: 50%;
	left: 14px;
	transform: translateY(-50%);
	background: #fff;
	padding: 0 4px;
	font-size: 14px;
	color: #999;
	pointer-events: none;
	transition: 0.2s ease;
}

/* Yukarı kalkma animasyonu */
.contactForm .input-group input:focus+label, .contactForm .input-group input:not(:placeholder-shown)+label,
	.contactForm .input-group textarea:focus+label, .contactForm .input-group textarea:not(:placeholder-shown)+label
	{
	top: 0px;
	font-size: 12px;
	color: #195629;
	background: #fff;
}

/* =========================================
   SELECT VE FILE – LABEL HER ZAMAN ÜSTTE
========================================= */
.contactForm .input-group select+label, .contactForm .input-group input[type="file"]+label
	{
	top: 0px !important;
	font-size: 12px !important;
	color: #195629 !important;
	background: #fff;
}

/* Select görünümü düzelsin diye */
.contactForm .input-group select {
	padding: 16px 14px 8px 14px;
}

/* File input düzeni */
.contactForm .input-group input[type="file"] {
	padding: 16px 14px 8px 14px;
}

/* File input için özel grup */
.contactForm .file-group label {
	position: absolute;
	top: 0px;
	left: 14px;
	font-size: 12px;
	background: #fff;
	padding: 0 4px;
	color: #195629;
	z-index: 2;
}

.contactForm .file-group input[type="file"] {
	padding: 20px 14px 10px 14px; /* üst boşluk labela yer açar */
	cursor:  pointer;
}

/* Select alanı */
.contactForm .input-group select {
	width: 100%;
	padding: 14px 40px 14px 14px; /* solda 14px boşluk */
	border: 1px solid #ccc; /* ilk border */
	border-radius: 8px;
	background-color: #fff;
	/* tarayıcı varsayılan oku kaldır */
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	/* Custom ok */
	background-image:
		url('data:image/svg+xml;utf8,<svg fill="%23666" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 18px;
	/* İç border etkisini engeller */
	outline: none;
	box-shadow: none;
}

/* Select üzerine gelince border değişsin */
.contactForm .input-group select:hover {
	border-color: #0077ff;
}

/* Select fokus olduğunda border rengi DEĞİŞSİN */
.contactForm .input-group select:focus {
	border-color: #195629 !important;
	outline: none !important;
	box-shadow: 0 0 0 1px #0077ff33; /* hafif glow (istersen kaldırırım) */
	border-bottom-left-radius: 0 !important;
	/* Sol alt radius kaldırıldı */
}

/* Disabled option (ilk seçiniz) */
.contactForm .input-group select option[disabled] {
	color:   #999;
}

/* Dropdown genişliğini küçültme ve sağa hizalama */
.contactForm .input-group select::-webkit-dropdown-list {
	width: 180px !important; /* açılır listenin genişliği */
	left: auto !important; /* sola dayamayı iptal */
	right: 0 !important; /* sağa hizala */
}

.contactForm .section-title {
	margin-top: 15px 0;
	color: #1d3557;
	border-left: 4px solid #457b9d;
	padding-left: 10px;
	font-size: 20px;
}

.contactForm .grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 10px;
	margin-bottom: 10px;
}

/* =========================================
   HATA MESAJLARI
========================================= */
.error-message {
	font-size: 13px;
	color: red;
	display: none;
	margin-top: 3px;
}

/* =========================================
   BUTON
========================================= */
.support-form button {
	padding: 7px 25px;
	border: none;
	border-radius: 8px;
	color: white;
	font-size: 16px;
	cursor: pointer;
	opacity: 0.5;
	transition: 0.25s ease;
}

.support-form button:enabled {
	opacity: 1;
}

.support-form button:hover:enabled {
	background: #357acb;
}

/* =========================================
   TOAST
========================================= */
.toast-message {
	position: fixed;
	bottom: 22px;
	right: 22px;
	background: #333;
	color: #fff;
	padding: 14px 20px;
	border-radius: 8px;
	display: none;
	opacity: 0;
	transition: 0.3s ease;
	z-index:  9999;
}

/* Switch */
.switch {
	position: relative;
	display: inline-block;
	width: 55px;
	height: 28px;
}

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

.switch-slider {
	position: absolute;
	cursor: pointer;
	pointer-events: auto;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #a3a3a3; /* Pasif */
	transition: .4s;
	border-radius: 28px;
}

.switch-slider:before {
	position: absolute;
	content: "";
	height: 22px;
	width: 22px;
	left: 3px;
	bottom: 3px;
	background-color: white;
	transition: .4s;
	border-radius: 50%;
}

input:checked+.switch-slider {
	background-color: #28a745; /* Aktif */
}

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

.readonly-select {
	pointer-events: none; /* tıklamayı engeller */
	background-color: #e9ecef !important; /* Bootstrap gri arka plan */
	color:   #bbbbbb !important;
}

/* insan kaynakları, teklif iste, ietişim CSS ------------------------*/
.form-container {
	width: 90%;
	max-width: 900px;
	background: #fff;
	margin: 30px auto;
	padding: 40px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	border-radius: 12px;
}

.form-container h1 {
	text-align: center;
	margin: 0;
	font-size: 32px;
	color: #1d3557;
}

.form-container .subtitle {
	text-align: center;
	margin-bottom: 20px;
	color: #457b9d;
}

.form-container .section-title {
	margin-top: 35px;
	margin-bottom: 10px;
	color: #1d3557;
	border-left: 4px solid #457b9d;
	padding-left: 10px;
	font-size: 20px;
}

.form-container .grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 20px;
}

.form-container .form-group {
	display: flex;
	flex-direction: column;
}

.form-container .form-group.full {
	margin-top: 20px;
}

.form-container label {
	margin-bottom: 5px;
	font-weight: bold;
	color: #333;
}

.form-container input, .form-container textarea, .form-container select
	{
	border: 1px solid #ccc;
	padding: 12px;
	border-radius: 8px;
	font-size: 15px;
	transition: 0.3s;
}

.form-container input:focus, .form-container textarea:focus {
	border-color: #457b9d;
	outline: none;
	box-shadow: 0 0 5px rgba(69, 123, 157, 0.3);
}

.form-container .submit-btn {
	width: 100%;
	padding: 15px;
	background: #1d3557;
	color: #fff;
	border: none;
	border-radius: 8px;
	font-size: 18px;
	margin-top: 25px;
	cursor: pointer;
	transition: 0.3s;
}

.form-container .submit-btn:hover {
	background:   #457b9d;
}

.form-container .error-message {
	font-size: 12px;
	display: none;
}

.form-container input.error, .form-container select.error,
	.form-container textarea.error {
	border-color: red !important;
	border: 2px solid red !important;
}

.form-container label.error {
	color: red !important;
}

.form-container input.success, .form-container select.success,
	.form-container textarea.success {
	border-color: #195629 !important;
	border: 2px solid #195629 !important;
}

.form-container label.success {
	color: #195629 !important;
	font-weight: bold;
}

.form-container .button-container {
	margin-top: 20px;
}

/* Upload CSS -----------------------------------------*/
#dropArea {
	width: 100%;
	padding: 20px;
	border: 2px dashed #999;
	border-radius: 10px;
	text-align: center;
	color: #666;
	cursor: pointer;
}

#dropArea.dragover {
	border-color: #007bff;
	background: #eef5ff;
}

#progressWrapper {
	display: none;
	margin: 15px 0;
}

#progressBar {
	width: 0%;
	height: 100%;
	background: #28a745;
	border-radius: 6px;
}

#uploadBtn {
	display: none;
	margin-top: 10px;
}

.upload-wrap {
	width: 100%;
	/*max-width: 720px;*/
	margin: 0 auto;
}

.drop-zone {
	border: 2px dashed #cfcfcf;
	border-radius: 10px;
	padding: 28px;
	text-align: center;
	color: #666;
	background: #fafafa;
	transition: border-color .15s, background .15s;
}

.drop-zone p {
	font-size: 14px;
	text-align: center;
}

.drop-zone.dragover {
	border-color: #4a90e2;
	background: #f0f8ff;
}

.link-btn {
	background: none;
	border: none;
	color: #0b5ed7;
	text-decoration: underline;
	cursor: pointer;
	font-size: 1em;
	padding: 0;
}

.file-list {
	list-style: none;
	margin: 12px 0;
	padding: 0;
	display: none;
}

.file-item.main-image {
	background-color: #00bb00;
	color: #fff;
}

.file-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4px 10px;
	border: 1px solid #eee;
	border-radius: 6px;
	margin-bottom: 4px;
	background: #fff;
	font-size: 12px;
}

.file-info {
	display: flex;
	gap: 10px;
	align-items: center;
}

.file-name {
	max-width: 420px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.remove-file {
	background: none;
	border: none;
	color: #d9534f;
	cursor: pointer;
	font-weight: 600;
}

/* progress */
.progress-wrapper {
	width: 100%;
	display: block;
	border: 2px dashed #d70000;
	border-radius: 10px;
	padding: 20px;
}

.progress-bar-bg {
	width: 100%;
	height: 13px;
	background: #ffd2d2;
	border-radius: 8px;
	overflow: hidden;
	display: block;
	line-height: 0;
}

.progress-bar {
	height: 100%;
	width: 0%;
	background: linear-gradient(90deg, #4caf50, #2e8b57);
	transition: width .2s linear;
	display:  block;
}

/* small screens */
@media ( max-width :560px) {
	.progress-bar-bg {
		width: 180px;
	}
	.file-name {
		max-width:  200px;
	}
}

.progress-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}

.left {
	flex: 1
}

.right {
	align-self: flex-end;
	padding-bottom: 10px;
}

.btn-small {
	display: none;
	padding: 8px 12px !important;
	font-size: 12px !important;
	line-height: 1 !important;
	height: auto !important;
	width: auto !important;
	padding: 8px 12px !important;
}

.btn i {
	margin-left: 5px;
}

.form-group select {
	padding-right: 20px;
}

/* Custom Full Modal Css -----------------------------------------------------------*/
.modal-fullscreen-custom .modal-dialog {
	max-width: 100% !important;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

.modal-fullscreen-custom .login-header {
	color: #195629; /* Hover text rengi */
	background-color: #f5f3d4;
}

.modal.modal-fullscreen-custom .modal-dialog, .modal.modal-fullscreen-custom .modal-content
	{
	border-radius: 0 !important;
	box-shadow: none !important;
	overflow: visible !important;
	height:  100vh;
}

/* Image Upload ----------------------------------------*/
/* Sol Panel */
.image-container {
	display: flex;
	max-width: 1100px;
	margin: 0;
	padding: 0;
}

.image-container .button-container {
	margin-top: 20px;
}

/* Sol ana içerik */
.image-main {
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

/* Blog Grid grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); */
.image-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, 90px);
	gap: 20px;
	justify-content: center;
}

/* Kart */
.image-card {
	flex: 1;
	height: 90px;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	overflow: hidden;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: 0.2s;
}

.active {
	border: 2px dotted #007d00 !important;
	border-radius: 20px;
	transition: 0.2s;
	padding: 10px;
	background: #eee;
}

.active img {
	width: 95%;
	height: 95%;
	border-radius: 15px;
}

.image-card:hover {
	border-radius: 50px;
	transform: scale(1.05);
	border-color: #777;
}

.image-card img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.image-card.main-image {
	border: 2px dotted #c415b3 !important;
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	align-items: center;
	justify-content: center;
}

/* photo -------*/
.photo-container {
	width: 100%;
	background: #fff;
	padding: 10px 20px 30px 20px;
}

.row-two {
	display: flex;
	align-items: center; /* dikey hizalama */
	gap: 10px;
	padding: 4px;
}

.row-title {
	margin-bottom: 10px;
	color: #1d3557;
	border-left: 4px solid #457b9d;
	padding-left: 10px;
	font-size: 20px;
}

/* Sol taraf geniş — kalan alanı kaplar */
.row-two .left {
	flex: 1; /* tüm boş alanı kapla */
}

/* Sağ taraf dar (örnek: 120px) */
.row-two .right {
	text-align:  right;
}

.row-two .button-container {
  justify-content: top;
}
.photo-container .drop-zone {
	margin-bottom: 20px;
}

/* Temel icon-only buton */
.icon-btn, .icon-badge {
	background: none;
	border: 1px dotted #333;
	border-radius: 20px;
	height: 40px;
	width: 40px;
	cursor: pointer;
	font-size: 20px; /* ikon boyutunu buradan kontrol edersin */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-left: 10px;
}

.icon-icon {
	background: none;
	color: #195629;
	border-radius: 15px;
	height: 30px;
	width: 30px;
	cursor: pointer;
	font-size: 14px; /* ikon boyutunu buradan kontrol edersin */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 15px;
	background: #f5f3d4;
	transform: translateY(-20px);
	animation: fallDown .6s ease forwards;
}

.icon-icon:hover {
	transform: translateY(0) scale(1.15);
	font-size: 12px;
	box-shadow: 0 3px 8px rgba(255, 255, 255, 0.75);
}

.icon-icon:active {
	transform: translateY(0) scale(1.25);
	font-size: 12px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
}

.icon-icon i {
	font-size: 14px;
}

.icon-badge {
	border-radius: 10px;
	height: 26px;
	font-size: 9px;
	padding: 0px 10px;
}

.icon-btn.red {
	border-color: #e74c3c;
}

.icon-btn.blue {
	border-color: #3498db !important;
}

.icon-btn.green {
	border-color: #27ae60;
}

.icon-btn.grey {
	border-color: #c4c4c4;
}

.icon-badge.green {
	background: #b7ffdb;
	border: 2px dotted #27ae60;
}

.icon-badge.grey {
	border-color: #c4c4c4;
	background: #efefef;
	border: 2px dotted #808080;
}

/* Aktifken renkler */
.icon-btn.red i {
	color: #e74c3c;
} /* örnek: kırmızı */
.icon-btn.blue i {
	color: #3498db;
} /* örnek: mavi */
.icon-btn.green i {
	color: #27ae60;
} /* örnek: yeşil */

/* Disabled görünüm — TEK RENK */
.icon-btn:disabled {
	border-color: #b5b5b5 !important;
}

.icon-btn:disabled i {
	color: #b5b5b5 !important; /* tek gri renk */
	opacity: 0.7;
}

/* Disabled davranışı iptal */
.icon-btn:disabled {
	cursor:  not-allowed;
}

/*Row controler --------------------------*/
.row-controls {
	display: flex;
	gap: 20px;
	/* Sol taraf geniş olsun */
	grid-template-columns: 1fr auto;
}

.row-controls .grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 20px;
	justify-content: center;
}

.left-controls, .right-controls {
	display: flex;
	flex-direction: column;
}

/* Sol daha geniş, sağ dar */
.left-controls {
	flex: 1; /* geniş */
}

.right-controls {
	width: 180px;
	margin-right: 10px;
}

.user-photo, .user-photo.single {
	position: absolute;
	border: 2px dashed #999;
	border-bottom-color: #fafafa;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	width: 160px;
	height: 152px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 10px;
	background: #fafafa;
	transition: border-color .15s, background .15s;
}

.user-photo, .user-photo.single {
	border: 2px dashed #999;
	border-radius: 10px;
}

.user-photo img {
	width: 80%;
}

.forms-container {
	padding: 10px 20px 20px 20px;
}

.forms-container .section-title {
	margin: 10px 0px 20px 0px;
}

.forms-container #dropArea {
	margin-bottom: 20px;
	padding: 10px;
}

#gridBody>tr.active, #gridBody>tr.active td {
	background: #fce3e0;
	color: #ce0000;
	border: 1px solid #fff !important;
}

#gridBody tr.activeBold {
	background: #fce3e0;
	color: #ce0000;
	font-weight: bold;
	border: 1px solid #fff !important;
}

/* FontSize */
.fs-10 {font-size:10px;}


/* cssanimkey.css */

@keyframes fadeInUp { 
  0% {
   opacity: 0; transform: translateY(30px);
  }
  100% {
    opacity:1;transform: translateY(0);
  }
}

@keyframes fadeIn { 
  0% {
   opacity: 0;
  }
  100% {
    opacity:1;
  }
}

@keyframes fadeInScale { 
  0% {
   opacity: 0; transform: scale(0.7);
  }
  100% {
    opacity: 1; transform: scale(1);
  }
}

@keyframes titleFadeIn {
	to { 
	 opacity:1;
	 transform: translateY(0);
  }
}

@keyframes slideRight {
	to { 
	 opacity:1;
	 transform: translateX(0);
  }
}

@keyframes spin {
	to { 
	 transform:rotate(360deg);	
  }
}

@keyframes fallDown {
	to { 
	 opacity:1;
	 transform: translateY(0);
  }
}

/* makpeyzaj-admin.css */
:root {
	--sidebar-w: 300px;
	--gap: 30px;
	--accent: #2563eb;
	--muted: #6b7280;
	--card-bg: #fff;
	--page-bg: #f3f6f9;
}

html, body {
	height: 100%;
	margin: 0;
	font-family: 'Montserrat', 'Inter', sans-serif;
	background: var(--page-bg);
	color: #111
}

#info-form-view {
	display: none;
}

.wrap-section {
	width: 100%;
	background: #195629;
	border-top: 1px solid #f5f3d4;
}

.wrap-section-container {
	width: 1100px;
	padding: 10px 20px;
	max-width: 95%;
	margin: 0 auto; /* ortalama */
	font-size:  20px;
	font-weight: bold;
	color: #f5f3d4;
	border-left: 1px solid #f5f3d4;
	border-right: 1px solid #f5f3d4;
}

.wrap-container {
	width: 1100px;
	padding: 20px;
	max-width: 95%;
	margin: 0 auto; /* ortalama */
	font-size:  18px;
	background: #fff;
}

.wrap {
	display: flex;
	gap: var(--gap);
	padding: 12px;
	box-sizing: border-box;
	min-height: 100vh
}
/* SIDEBAR */
.sidebar {
	width: var(--sidebar-w);
	background: #fff;
	border: 1px solid #e6edf3;
	border-radius: 12px;
	padding: 10px;
	box-shadow: 0 4px 18px rgba(16, 24, 40, 0.04);
	position: sticky;
	top: 18px;
	height: fit-content
}

.search-box {
	position: relative;
	margin-bottom: 14px
}

.search-box input {
	width: 100%;
	padding: 10px 38px 10px 12px;
	border-radius: 8px;
	border: 1px solid #e2e8f0;
	font-size: 14px
}

.search-icon {
	position: absolute;
	right: 10px;
	top: 8px;
	color: var(--muted)
}

.category-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px
}

.cat {
	padding: 7px 12px;
	border-radius: 999px;
	border: 1px solid #e6edf3;
	background: transparent;
	cursor: pointer;
	font-size: 13px;
	color: #111
}

.cat.active {
	background: var(--accent);
	color: #fff;
	border-color: var(--accent)
}
/* CONTENT */
.content {
	flex: 1;
	min-height: 60vh
}

.controls {
	display: flex;
	gap: 12px;
	align-items: center;
	margin-top: 14px
}

.controls .info {
	color: var(--muted);
	font-size: 14px
}

.grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 16px
}

.card {
	background: var(--card-bg);
	border: 1px solid #e6edf3;
	padding: 14px;
	border-radius: 10px;
	box-shadow: 0 4px 12px rgba(14, 20, 30, 0.03)
}

.card h3 {
	margin: 0 0 8px;
	font-size: 16px
}

.card p {
	margin: 0;
	color: var(--muted);
	font-size: 13px
}
/* skeleton */
.skeleton {
	height: 100px;
	border-radius: 10px;
	background: linear-gradient(90deg, #f3f7fa, #eef2f6, #f3f7fa);
	background-size: 200% 100%;
	animation: sk 1.1s linear infinite
}

@keyframes sk {
	from {background-position: 200% 0
}

to {
	background-position: -200% 0
}

}
/* load more indicator */
.loading {
	padding: 18px;
	text-align: center;
	color: var(--muted)
}
/* suggestion dropdown */
.suggestions {
	position: absolute;
	left: 0;
	right: 0;
	top: 44px;
	background: #fff;
	border: 1px solid #e6edf3;
	border-radius: 8px;
	z-index: 50;
	max-height: 260px;
	overflow: auto
}

.suggestions div {
	padding: 8px 10px;
	cursor: pointer
}

.suggestions div:hover {
	background: #f1f5fb
}
/* responsive */
@media ( max-width :900px) {
	.wrap {
		flex-direction: column;
		padding: 12px
	}
	.sidebar {
		position: relative;
		width: 100%
	}
}

.cat-link {
	display: inline-block;
	padding: 7px 12px;
	border-radius: 999px;
	border: 1px solid #e6edf3;
	font-size: 13px;
	color: #111;
	text-decoration: none;
	margin: 4px 0;
}

.cat-link:hover {
	background: #2563eb;
	color: #fff;
	border-color: #2563eb;
}

.cat-link.active {
	background: #2563eb;
	color: #fff;
	border-color: #2563eb;
}

#gridTable th {
	font-size: 14px;
}

.info-table {
	width: 100%;
	border-collapse: collapse;
}

.info-table tr th {
	text-align: center; /* Sütun başlıklarını ortaya alır */
	background: #195629; /* Arka plan rengi */
	color: #f5f3d4;
	padding: 10px;
	font-weight: 600;
	border: 1px solid #f5f3d4;
}

.info-table tr th.left {
	text-align: left;
}

.info-table td {
	padding: 8px;
	border-bottom: 1px solid #ddd;
}

.info-table tr:hover {
	background: #fafafa; /* Hover efekti istersen */
}

.icon-square {
	width: 28px;
	height: 28px;
	padding: 2px !important;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius:  6px;
	font-size: 12px;
}

.supports-form {
	width: 100%;
	margin: 0 auto;
	padding: 10px 15px;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

/* background-image.css */
.teklif-iste-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.aydinlatma-metni-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.basinda-biz-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.blog-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.destek-merkezi-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.etkinliklerimiz-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.forgot-password-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.foto-galeri-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.gizlilik-politikasi-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.hakkimizda-inner-bg {
  background-image: url('/assets/images/inner5.jpg');
}

.hizmetlerimiz-inner-bg {
  background-image: url('/assets/images/inner4.jpg');
}

.iletisim-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.insan-kaynaklari-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.kullanim-sozlesmesi-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.login-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.nopage-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.referanslarimiz-inner-bg {
  background-image: url('/assets/images/inner3.jpg');
}

.sertifika-ve-belgeler-inner-bg {
  background-image: url('/assets/images/inner1.jpg');
}

.urunlerimiz-inner-bg {
  background-image: url('/assets/images/inner1.jpg');
}

.video-galeri-inner-bg {
  background-image: url('/assets/images/inner1.jpg');
}

.vizyon-ve-misyon-inner-bg {
  background-image: url('/assets/images/inner1.jpg');
}