/******************************
    zulfikar demirel
	https://www.cankayawebtasarim.net/
	0555 697 34 11
******************************/

.spaniletisim span{ display:block!important; }

.spaniletisim .f-left{ min-height:90px!important; }

.iletisim_kenarlik{ border-bottom:1px #dcddde solid!important; margin-bottom:20px; margin-top:10px; }

.bg_beyaz{ background-color: #fff; padding: 10px; }

.link_item_sag_all{ margin-bottom:1px!important; }



.link_item_sag_aktif {
  display: block;
  width: 100%;
  background-color: #000; /* Daha derin siyah tonu */
  color: #fff;
  padding: 15px 20px;
  font-weight: 600;
  text-decoration: none;
  margin-bottom: 6px;
  border-radius: 8px; /* Köseleri yumusatir */
  transition: all 0.25s ease;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
  letter-spacing: 0.3px;
}

/* Hover efekti */
.link_item_sag_aktif:hover {
  background-color: #222; /* Bir ton açik */
  color: #ffcc00; /* Altin vurgulu metin rengi */
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}



.link_item_sag_pasif {
  display: block;
  width: 100%;
  background-color: #f2f2f2; /* Açik gri arka plan */
  color: #000; /* Orta gri metin */
  padding: 15px 20px;
  font-weight: 500;
  text-decoration: none;
  margin-bottom: 6px;
  border-radius: 8px;
  transition: all 0.25s ease;
  letter-spacing: 0.3px;
}

/* Hover efekti - hafif belirginlesir ama aktif kadar güçlü degil */
.link_item_sag_pasif:hover {
  background-color: #000;
  color: #fff;
}

/* Eger tiklanamazsa bu eklenebilir */
.link_item_sag_pasif.disabled,
.link_item_sag_pasif[aria-disabled="true"] {
  pointer-events: none;
  opacity: 0.6;
}








/*** revize ****/

.yazi_siyah{ color:#000!important;}
.yazi_beyaz{ color:#FFF!important;}
.yazi_kalin{ font-weight:bold!important; }
.yazi_11px{ font-size:11px!important;}
.yazi_12px{ font-size:12px!important;}
.yazi_13px{ font-size:13px!important;}
.yazi_14px{ font-size:14px!important;}
.yazi_15px{ font-size:15px!important;}
.yazi_16px{ font-size:16px!important;}
.yazi_17px{ font-size:17px!important;}
.yazi_18px{ font-size:18px!important;}
.yazi_19px{ font-size:19px!important;}
.yazi_20px{ font-size:20px!important;}
.yazi_21px{ font-size:21px!important;}

.margin_all10{ margin:10px!important;}
.margin_b10{ margin-bottom:10px!important;}
.margin_b20{ margin-bottom:20px!important;}
.margin_l10{ margin-left:10px!important;}
.margin_r10{ margin-right:10px!important;}
.margin_t10{ margin-top:10px!important;}
.margin_t15_{ margin-top:-15px!important;}

.margin_all20{ margin:20px!important;}
.margin_b20{ margin-bottom:20px!important;}
.margin_l20{ margin-left:20px!important;}
.margin_r20{ margin-right:20px!important;}
.margin_t20{ margin-top:20px!important;}
.margin_t40{ margin-top:40px!important;}
.margin_l40{ margin-left:40px!important;}

.padding_all0{ padding:0px!important;}
.padding_b0{ padding-bottom:0px!important;}
.padding_l0{ padding-left:0px!important;}
.padding_r0{ padding-right:0px!important;}
.padding_t0{ padding-top:0px!important;}


.padding_all5{ padding:5px!important;}
.padding_b5{ padding-bottom:5px!important;}
.padding_l5{ padding-left:5px!important;}
.padding_r5{ padding-right:5px!important;}
.padding_t5{ padding-top:5px!important;}

.padding_all10{ padding:10px!important;}
.padding_b10{ padding-bottom:10px!important;}
.padding_l10{ padding-left:10px!important;}
.padding_r10{ padding-right:10px!important;}
.padding_t10{ padding-top:10px!important;}
.padding_t15{ padding-top:15px!important;}

.padding_all20{ padding:20px!important;}
.padding_b20{ padding-bottom:20px!important;}
.padding_l20{ padding-left:20px!important;}
.padding_r20{ padding-right:20px!important;}
.padding_t20{ padding-top:20px!important;}
.padding_t40{ padding-top:40px!important;}



.link_beyaz_kalin{ color: #fff!important; font-weight: bold; }
a.link_beyaz_kalin:hover{ color: #fff!important; }

.link_beyaz_ince{ color: #fff!important; font-weight: normal; }
a.link_beyaz_ince:hover{ color: #fff!important; }

.link_siyah_kalin{ color: #000!important; font-weight: bold; }
a.link_siyah_kalin:hover{ color: #000!important; }

.link_siyah_ince{ color: #000!important; font-weight: normal; }
a.link_siyah_ince:hover{ color: #000!important; }





/*** img ***/

.banner_home4 img{  border:1px solid #C5C5C5; width:100%!important; height:210px!important; object-fit:cover!important;  }

.matbaa_list_home img{  border:1px solid #C5C5C5; width:100%!important; height:180px!important; object-fit:cover!important;  }

.ustbanner{ width:100%!important; height:90px!important; object-fit:cover!important;}

.blog_home_all img{  border:1px solid #C5C5C5; width:100%!important; height:250px!important; object-fit:cover!important;  }

.photo_gal_all img{  border:1px solid #C5C5C5; width:100%!important; height:150px!important; object-fit:cover!important;  }








.icerik_list_all img{  border:1px solid #C5C5C5; width:100%!important; height:250px!important; object-fit:cover!important;  }
.icerik_kenarlik{ padding:15px; border-bottom:1px #dcddde solid; border-left:1px #dcddde solid; border-right:1px #dcddde solid; }

.link_btn{ font-size:15px!important; margin-top:10px!important; padding:10px 23px 10px 15px!important; border-radius:5px!important; }


/**** linkler ***/

.link_footer{ color: #d1d9f7!important; text-decoration: none }
a.link_footer:hover{ color: #f36033!important; text-decoration: underline; }









/**** butonlar ***/



/* 🔽 Sabit ikon butonları */
.whatsapp, .telefon, .instagram {
	position: fixed;
	left: 15px;
	transition: all .5s ease-in-out;
	z-index: 9999;
}
.whatsapp a, .telefon a, .instagram a {
	height: 50px;
	width: 50px;
	border-radius: 50%;
	box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4);
	font-size: 28px;
	display: block;
	text-align: center;
	line-height: 50px;
	color: white;
}
.whatsapp { bottom: 100px; }
.telefon { bottom: 170px; }
.instagram { bottom: 240px; }

.whatsapp a { background: #4dc247; }
.telefon a { background: #337ab7; }
.instagram a { background: #fd3a67; }

.whatsapp .tooltiptext, .telefon .tooltiptext, .instagram .tooltiptext {
	visibility: hidden;
	width: 120px;
	background-color: black;
	color: #fff;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	position: absolute;
	left: 105%;
	font-size: 15px;
	top: 13px;
	line-height: normal;
}
.whatsapp:hover a, .telefon:hover a, .instagram:hover a {
	transform: rotate(45deg);
}
.whatsapp:hover .tooltiptext,
.telefon:hover .tooltiptext,
.instagram:hover .tooltiptext {
	visibility: visible;
}


/**** Contact Form 7 - Form Tasarimi ****/

/* Genel alan (label + input) düzeni */
form.wpcf7-form label {
  display: block;
  font-size: 0.95rem;
  color: #fff;
  font-weight: 500;
  margin-bottom: 0px; /* Etiket ile input arasi mesafe */
}

/* Input, tel, e-posta ve textarea alanlari */
form.wpcf7-form input[type="text"],
form.wpcf7-form input[type="tel"],
form.wpcf7-form input[type="email"],
form.wpcf7-form textarea {
  width: 100%;
  padding: 14px 16px;
  font-size: 1rem;
  color: #333;
  background-color: #f9f9f9;
  border: 1px solid #ddd;
  border-radius: 6px;
  box-sizing: border-box;
  transition: border-color 0.25s ease, background-color 0.25s ease;
  margin-bottom: 8px; 
}





form.wpcf7-form textarea {
  min-height: 140px;
  resize: vertical;
}


form.wpcf7-form input[type="text"]:focus,
form.wpcf7-form input[type="tel"]:focus,
form.wpcf7-form input[type="email"]:focus,
form.wpcf7-form textarea:focus {
  outline: none;
  border-color: #0073e6;
  background-color: #fff;
}


form.wpcf7-form input[type="submit"] {
  display: inline-block;
  padding: 14px 24px;
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
  background-color: #0073e6;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.25s ease, transform 0.15s ease;
  margin-top: 0px; 
}


form.wpcf7-form input[type="submit"]:hover {
  background-color: #005bb5;
  transform: translateY(-2px);
}


@media (max-width: 600px) {
  form.wpcf7-form input[type="text"],
  form.wpcf7-form input[type="tel"],
  form.wpcf7-form input[type="email"],
  form.wpcf7-form textarea,
  form.wpcf7-form input[type="submit"] {
    width: 100%;
  }
}


.iletisim_formu p{ margin-bottom:0px!important; margin-top:0px!important; }















/* Body'deki üst boslugu sifirlama */
body {
    margin: 0px !important;
    padding: 0px !important;
}
    html {
        margin-top:0px !important;
		top:0!important;
    }
}

@media screen and (max-width: 782px) {
    html {
        margin-top:0px !important;
		top:0!important;
    }
    margin: 0px !important;
    padding: 0px !important;
	

}


/* Bu kural, logoyu içeren img etiketini hedef alir. */
.logo img {
    max-width: 100%; /* Kapsayici genisliginin %100'ünü geçmesin */
    height: auto;    /* Oranlari koruyarak otomatik yükseklik ayarla */
    display: block;  /* Bazi tarayici sorunlarini gidermek için */
}

/* Logonun bulundugu kapsayici div'e (eger logoyu daraltmaya yardimci olacaksa) */
.header-middle-area .col-lg-3 {
    max-width: 300px; /* Veya istediginiz bir piksel degeri */
    width: 100%; /* Küçük ekranlarda esnek olmasini saglar */
}


/* --- MOBILDE SIYAH ARKA PLAN SORUNUNU ÇÖZÜMÜ --- */

/* Kullanicinin isletim sistemi karanlik modu tercih ettiginde devreye girer */
@media (prefers-color-scheme: dark) {
    /* Genel body arka planini beyaz (veya istediginiz renk) yapin */
    body {
        background-color: #ffffff !important; 
        color: #000 !important; /* Metni siyah yapin */
    }
    
    /* Header/Menü arka planini da beyaz (veya istediginiz renk) yapin */
    header, 
    .header-middle-area, 
    .main-menu nav > ul > li .sub-menu {
        background-color: #ffffff !important;
        color: #222 !important;
    }
}





/***** mega menü ****/
/* Mega Menü Genel Konteynir Düzenlemesi */
.main-menu ul li.static .mega-menu {
    display: flex !important;
    flex-wrap: wrap;
    background: #ffffff;
    padding: 25px !important;
    border-top: 3px solid #f36233 !important; /* Temanizin ana rengi */
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

/* Her bir menü ögesi (Sütunlar) */
.main-menu ul li.static .mega-menu li.mega-item {
    flex: 0 0 25%; /* Yan yana 4 sütun */
    max-width: 25%;
    list-style: none;
    margin-bottom: 5px;
}

/* Linklerin Görünümü ve Ok Isareti */
.main-menu ul li.static .mega-menu li.mega-item a {
    display: block;
    position: relative;
    padding: 8px 15px 8px 25px !important; /* Sol tarafta ok için bosluk biraktik */
    color: #333 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease;
    text-transform: capitalize;
}

/* Sag Ok Isareti (Before ile ekliyoruz) */
.main-menu ul li.static .mega-menu li.mega-item a::before {
    content: "\f105"; /* FontAwesome sag ok ikonu */
    font-family: "Font Awesome 5 Pro"; /* Temanizda yüklü olan font ailesi */
    font-weight: 900;
    position: absolute;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    color: #f36233; /* Ok rengi */
    transition: all 0.3s ease;
    opacity: 0.7;
}

/* Hover Efekti: Üzerine gelince ok kayar ve renk degisir */
.main-menu ul li.static .mega-menu li.mega-item a:hover {
    padding-left: 32px !important; /* Yaziyi biraz daha saga itiyoruz */
    color: #f36233 !important;
    background: rgba(243, 98, 51, 0.05); /* Çok hafif arka plan rengi */
    border-radius: 4px;
}

.main-menu ul li.static .mega-menu li.mega-item a:hover::before {
    left: 15px; /* Ok isareti yazi ile beraber saga kayar */
    opacity: 1;
}

/* Mobil Uyumluluk */
@media (max-width: 991px) {
    .main-menu ul li.static .mega-menu li.mega-item {
        flex: 0 0 100%;
        max-width: 100%;
    }
}