/*
Theme Name: Kutay Chat Teması
Theme URI: https://kutayutku.com/web-sitesi-icin-en-uygun-ucretsiz-wordpress-temalari/
Author: Kutay Utku
Author URI: https://kutayutku.com
Description: Kutay Utku web sitesi için özel olarak geliştirilmiş sade ve fonksiyonel bir WordPress teması.
Version: 1.0.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kutay-chat-tema-v1
*/

/* Temel Stil Ayarları */
* {

  outline: none;
  box-sizing: border-box;
}
body {
    font-family: Arial, sans-serif;
    background: #fff;
    color: #000;
    margin: 0;
    padding: 0;
	font-size: 12px;
}

a {
    color: #000;
    text-decoration: none;
	transition: background-color 0.3s ease;
}

a:hover {
    text-decoration: underline;
}
h1 ,h2 ,h3 ,h4 ,h5 ,h6 {
	font-weight: normal;
	font-size: 16px;
}


::selection {
	background: #111;
	color: #ffffff;
	text-shadow: none;
}
::-moz-selection {
 background: #222;
 color: #ffffff;
 text-shadow: none;
}


.wp-block-heading strong {
	font-size: 16px;
}


strong {
    font-weight: normal;
	font-size: 12px;
}



.post-content a {
    color: #c0392b;
	background-color: #f4f4f4;
    text-decoration: none;
	padding: 4px 10px;
}
.post-content a:hover {
    text-decoration: underline;
}

#header-color {
	border-top: 6px solid #c0392b;
}

.header-top {
	background: #f4f4f4;
	list-style: none;
	display: flow-root;
}
.header-top ul {
	list-style: none;
}
.header-top a {
	color: #000;
	font-size: 12px;
}
.header-top a:hover {
	color: #c0392b;
}
.header-top-2 {
	margin: 0 auto;
	padding: 0;

	max-width: 1200px;
}
ul.header-top-1 {
	max-width: 1200px;

	margin: 0px auto;
	padding: 10px;
		float:right;
	display: flex;
}
ul.header-top-1 li {
	margin-left: 24px;
}



.header-center .logo {
	width: 48px;
	height: 48px;
	float: left;
	margin-right: 20px;
}
.header-center {
    background: #fff;
    color: #fff;
    padding: 20px;
	min-height: 160px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

.site-title a {
	color: #000;
	font-size: 20px;
	text-decoration: none;
}


.header-center h1 {
	margin: 0 auto;
	padding: 0;
}


p.site-description {
	margin: 0 auto;
	padding: 0;
	font-size: 14px;
	font-weight: normal;
	color: #000;
}
nav {
	margin: 0 auto;
	max-width: 1200px;

}

nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

nav ul li {
    margin: 0px;
	padding: 0;
}

nav ul li a {
    color: #fff;
}

.header {
	margin: 0 auto;
	max-width: 1200px;
	margin-top: 30px;
	
}








.recent-posts {
	font-size: 12px;
}


.recent-posts li a:hover {
    text-decoration: underline;
}

.recent-posts li {
    padding: 5px 0;
    margin: 5px 0;
    border-bottom: 1px solid #eee;
}











.yearly-archive {
	font-size: 12px;
}
.yearly-archive a:hover {
    text-decoration: underline;
}

.yearly-archive li {
    padding: 5px 0;
    margin: 5px 0;
    border-bottom: 1px solid #eee;
}

.monthly-archive {
	font-size: 12px;
}
.monthly-archive a:hover {
    text-decoration: underline;
}

.monthly-archive li {
    padding: 5px 0;
    margin: 5px 0;
    border-bottom: 1px solid #eee;
}




.monthly-archive ul li {
    position: relative;
    padding-right: 60px;
}

.monthly-archive .post-count {
    position: absolute;
    right: 0;
    top: 0;
    color: #000;
}

.yearly-archive ul li {
    position: relative;
    padding-right: 60px;
}

.yearly-archive .post-count {
    position: absolute;
    right: 0;
    top: 0;
    color: #000;
}







.yearly-archive {
	font-size: 12px;
}

.monthly-archive {
	font-size: 12px;
}







.category-archive ul {
    list-style: none;
    padding: 0 0 0 20px;
}

.category-archive ul li {
    display: flex;
    justify-content: space-between;
    padding: 5px 0;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 1.5em;
}

.category-archive ul li::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #666;
    font-size: 1.2em;
    line-height: 1;
}






.sidebar-default {
	font-size: 12px;
}
.sidebar-default a:hover {
    text-decoration: underline;
}
.sidebar-default li {
    padding: 5px 0;
    margin: 5px 0;
    border-bottom: 1px solid #eee;
}
.sidebar-default ul li {
    position: relative;
    padding-right: 60px;
}









.sidebar-two-default {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    font-size: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.sidebar-two-default .sidebar-column {
    flex: 1;
    min-width: 160px;
}

.sidebar-two-default h2 {
    margin-bottom: 10px;
    font-size: 14px;
    border-bottom: 2px solid #eee;
    padding-bottom: 5px;
}

.sidebar-two-default ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.sidebar-two-default li {
    padding: 5px 0;
    margin: 5px 0;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-right: 60px;
}

.sidebar-two-default a {
    text-decoration: none;
    color: #333;
}

.sidebar-two-default a:hover {
    text-decoration: underline;

}





.post-meta {
    display: flex;
    gap: 10px; /* öğeler arası boşluk */
    flex-wrap: wrap; /* dar ekranlarda alt alta geçmesi için */
    font-size: 14px;
    color: #666;
    margin-bottom: 15px;
}

.post-meta div {

    align-items: left;
}



/* Genel stil ayarları */
body {
    font-family: 'Arial', sans-serif;
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    color: #333;
    line-height: 1.6;
}

/* Ana kapsayıcı stil */
.container {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
    padding: 20px;
    max-width: 1200px;
    margin: 0 auto;
    background-color: #fff;
}

/* Ana içerik bölmesi */
.main-content {
    background: #fff;
    padding: 20px;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

/* Yan menü */
.sidebar {
    background: #fafafa;
    padding: 20px;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}


.sidebar h2 {
	font-size: 16px;
}
/* Yazı ve başlık stilleri */
.post {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
}

h1.post-title {
    font-size: 16px;
    color: #333;
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-weight: normal;
	border-bottom: 1px solid #111;
}

h2.post-title {
    font-size: 16px;
    color: #333;
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-weight: normal;
	border-bottom: 1px solid #111;
}

.post h1 {
    font-size: 16px;
    color: #333;
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-weight: normal;

}

.post h2 {
    font-size: 16px;
    color: #333;
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-weight: normal;

}

.post .meta {
    font-size: 13px;
    color: #888;
    margin-bottom: 10px;
}

.post p {
    font-size: 12px;
    color: #555;
}

.post-content p {
    font-size: 12px;
    color: #555;
}



a.read-more {
	font-size: 12px;
	padding: 8px 0px;
    font-weight: normal;
	pointer-events: auto;
}


/* Footer (alt bilgi) */
footer {
    background: #fff;
    color: #000;
    text-align: center;
    padding: 20px;
    margin-top: 40px;
    border-radius: 6px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

.footer {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	    text-align: right;

}







.main-content .box {

      opacity: 0;
      transform: translateY(50px);
      transition: all 0.6s ease-out;
    }
.main-content .appeared {
      opacity: 1;
      transform: translateY(0);
    }














/* Sayfalama */
.pagination {
    text-align: center;
    margin: 20px 0;
}

.pagination a {
    display: inline-block;
    margin: 0 5px;
    padding: 6px 14px;
    background: #f4f4f4;
    color: #000;
    font-size: 12px;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.pagination a:hover {
    background: #000;
	color: #fff;
}

.pagination a.active,
.pagination a.active:visited {
    background: #f4f4f4 !important;  /* Arka plan net şekilde #555 */
    color: #000 !important;       /* Yazı rengi beyaz */
    cursor: default;
    font-weight: bold;
}

.pagination a.disabled {
    background: #f4f4f4;
    color: #000;
    cursor: not-allowed;
}






.menu {
    background: #fff;
    padding: 0 10px;
	margin-top: 1px;
	margin-bottom: 40px;

	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}

/* === Ana Menü === */
.main-nav {

    padding: 10px 20px;
}

.main-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.main-menu li {
    position: relative;
}

.main-menu li a {
    color: #000;
    font-size: 12px;
    padding: 10px 15px;
    display: block;
    text-decoration: none;
    transition: background 0.3s ease, color 0.3s ease;
}

.main-menu li a:hover {
    background-color: #f4f4f4;
    color: #000;
}

/* === Üst menü öğesi normal görünür, aktifmiş gibi görünmesin === */
.main-menu > li.current-menu-ancestor > a,
.main-menu > li.current-menu-parent > a,
.main-menu > li.current_page_ancestor > a,
.main-menu > li.current_page_parent > a,
.main-menu > li.current-menu-item > a,
.main-menu > li.current_page_item > a {
    background-color: #f4f4f4 !important;
    color: #000 !important;
}

/* === Alt Menü === */
/* === Alt Menü (WordPress Uyumlu) === */
.main-menu .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 180px;
    background-color: #fff;
    list-style: none;
    padding: 0;
    margin: 0;
    display: none;
    z-index: 99;
}

.main-menu li:hover > .sub-menu {
    display: block;
}

.main-menu .sub-menu li {
    border-bottom: 1px solid #444;
    width: auto;
}

.main-menu .sub-menu li a {
    display: block;
    padding: 10px 15px;
    color: #000;
    text-decoration: none;
    white-space: nowrap;
}

.main-menu .sub-menu li a:hover {
    background-color: #f4f4f4;
    color: #000;
}

/* === Alt menüdeki aktif öğe düzgün şekilde vurgulanır === */
.main-menu .sub-menu .current-menu-item > a,
.main-menu .sub-menu .current_page_item > a {
    background-color: #f4f4f4 !important;
    color: #000 !important;
}

/* === Alt menüde hover olsa da görünüm bozulmaz === */
.main-menu .sub-menu .current-menu-item > a:hover,
.main-menu .sub-menu .current_page_item > a:hover {
    background-color: #f4f4f4 !important;
    color: #000 !important;
}










/* === Responsive Menü === */
@media screen and (max-width: 768px) {
    .main-menu {
        flex-direction: column;
        gap: 0;
    }

    .main-menu li ul {
        position: static;
    }

    .main-menu li:hover > ul {
        display: block;
    }
	.sidebar {
		display: none;

	}
	.container {
		grid-template-columns: none;
	}
}


































































/* .post-content içerisindeki genel liste stili */
.post-content ul, .post-content ol {
    margin: 0;
    padding: 0;
    list-style-position: inside; /* Liste işaretçileri içeride görünür */
}

/* Sırasız liste (ul) */
.post-content ul {
    list-style-type: disc; /* Disk şeklinde işaretçi */
}

/* Sıralı liste (ol) */
.post-content ol {
    list-style-type: decimal; /* Sayı ile sıralama */
}

/* Liste öğeleri */
.post-content ul li, .post-content ol li {
    font-size: 12px; /* Yazı boyutunu ayarla */
    line-height: 1.5; /* Satır aralığını ayarla */
    margin-bottom: 10px; /* Öğeler arasına boşluk ekle */
    padding-left: 20px; /* Sol kenardan boşluk bırak */
}

/* Liste öğelerinin işaretçileri */
.post-content ul li::before, .post-content ol li::before {
    font-size: 12px; /* İşaretçi boyutunu artır */
    margin-right: 10px; /* İşaretçi ile yazı arasına boşluk ekle */
    color: #3498db; /* İşaretçi rengini değiştir */
}

/* Hover durumu için liste öğeleri */
.post-content ul li:hover, .post-content ol li:hover {

}

/* İç içe listeler (nested lists) */
.post-content ul ul, .post-content ol ol {
    margin-left: 20px; /* İç içe liste için sol boşluk */
}

/* Kod blokları */
.post-content code {
    font-family: 'Courier New', Courier, monospace; /* Monospace fontu */
    font-size: 12px; /* Yazı boyutunu ayarla */
    background-color: #f4f4f4; /* Arka plan rengi */
    padding: 2px 4px; /* İç boşluk */
    border-radius: 4px; /* Kenarları yuvarla */
    color: #c0392b; /* Yazı rengi */
    word-wrap: break-word; /* Kelimeleri kırarak taşmayı engelle */
}

/* Çok satırlı kod blokları */
.post-content pre {
    font-family: 'Courier New', Courier, monospace; /* Monospace fontu */
    font-size: 12px; /* Yazı boyutunu ayarla */
    background-color: #2c3e50; /* Arka plan rengi */
    color: #ecf0f1; /* Yazı rengi */
    padding: 0px; /* İç boşluk */
    border-radius: 5px; /* Kenarları yuvarla */
    overflow-x: auto; /* Yatay kaydırma çubuğu ekle */
    white-space: pre-wrap; /* Satırlar kayar ve taşmaz */
    margin-bottom: 20px; /* Kod bloğunun altına boşluk ekle */
}

/* Kod bloklarında bağlantılar */
.post-content pre a, .post-content code a {
    color: #3498db; /* Bağlantı rengi */
    text-decoration: none; /* Alt çizgiyi kaldır */
}

.post-content pre a:hover, .post-content code a:hover {
    text-decoration: underline; /* Hoverda alt çizgi ekle */
}

/* Listelerde ilk öğe stilini özelleştirme */
.post-content ul > li:first-child, .post-content ol > li:first-child {
    font-weight: normal; /* İlk öğeyi kalın yap */
    font-size: 12px; /* Yazı boyutunu büyüt */
}

/* Yazar Hakkında Bilgi: Profil açıklaması */
.post-content .author-bio {
    background-color: #f9f9f9;
    border-left: 4px solid #3498db;
    padding: 10px 20px;
    font-size: 12px;
    margin-top: 20px;
}

.post-content .author-bio p {
    margin: 0;
    line-height: 1.6;
}

/* Yorumlar */
.post-content .comment {
    background-color: #ecf0f1;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}

.post-content .comment .comment-author {
    font-weight: bold;
    color: #3498db;
}

.post-content .comment .comment-content {
    margin-top: 10px;
    font-size: 12px;
    color: #555;
}





























/* Yorumlar Alanı */
.comments-area {
    background-color: #fff;
    padding: 20px;
    border-radius: 6px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
    margin-top: 40px;
}

/* Yorum Başlığı */
.comments-title {
    font-size: 22px;
    color: #333;
    margin-bottom: 20px;
}

/* Yorumlar Listesi */
.comment-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.comment-list li {
    background: #f9f9f9;
    padding: 15px;
    margin-bottom: 15px;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
}

/* Yorum Yazarının Bilgileri */
.comment-author {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.comment-author .avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    margin-right: 10px;
}

.comment-author .fn a {
    font-weight: bold;
    color: #3498db;
    text-decoration: none;
	font-size: 12px;
}

.comment-author .fn a:hover {
    text-decoration: underline;
}

.comment-author .says {
    font-style: italic;
	font-size: 12px;
    color: #777;
margin-left: 10px;
}
.commentmetadata a {
	font-size: 12px;
}
.reply a {
	font-size: 12px;
}

/* Yorum Tarihi ve Düzenleme Linki */
.comment-metadata {
    font-size: 12px;
    color: #777;
}

.comment-metadata a {
    color: #3498db;
    text-decoration: none;
}

.comment-metadata a:hover {
    text-decoration: underline;
}

.comment-metadata .edit-link {
    font-size: 12px;
    margin-left: 10px;
    color: #3498db;
}

.comment-metadata .edit-link a {
    color: #3498db;
    text-decoration: none;
}

.comment-metadata .edit-link a:hover {
    text-decoration: underline;
}

/* Yorum İçeriği */
.comment-content {
    font-size: 12;
    color: #555;
    margin-top: 10px;
}

/* Yorum Formu */
.comment-form {
    background: #f9f9f9;
    padding: 20px;
    margin-top: 30px;
    border-radius: 6px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
}

/* Yorum Formu Alanları */
.comment-form textarea,
.comment-form input[type="text"],
.comment-form input[type="email"] {
    width: 100%; /* Genişlik: Tam genişlik */
    padding: 10px; /* İçerik etrafında boşluk */
    font-size: 14px; /* Yazı boyutu */
    border: 1px solid #ccc; /* Çerçeve rengi */
    border-radius: 4px; /* Köşeleri yuvarlat */
    box-sizing: border-box; /* Padding ve border dahil genişlik hesaplaması */
    outline: none; /* Odaklanıldığında kenarlık olmaması için */
    transition: border-color 0.3s ease; /* Kenarlık değişimi için geçiş ekle */
}

/* Yorum Formu Gönder Butonu */
.comment-form input[type="submit"] {
    background-color: #222;
    color: #fff;
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
}

.comment-form input[type="submit"]:hover {
    background-color: #111;
}

/* Yorum Sayfalaması */
.comment-pagination {
    text-align: center;
    margin-top: 30px;
}

.comment-pagination a {
    display: inline-block;
    margin: 0 5px;
    padding: 6px 12px;
    background-color: #3498db;
    color: #fff;
    font-size: 14px;
    text-decoration: none;
    border-radius: 4px;
}

.comment-pagination a:hover {
    background-color: #2980b9;
}

.comment-pagination a.active {
    background-color: #2980b9;
    color: #fff;
}

.comment-pagination a.disabled {
    background-color: #ddd;
    color: #bbb;
    cursor: not-allowed;
}

/* Yorum Yoksa Mesaj */
.no-comments {
    text-align: center;
    font-size: 12px;
    color: #777;
}


/* İnternet Sitesi Alanı */
.comment-form-url {
    margin-bottom: 20px; /* Alt boşluk ekle */
}

.comment-form-url label {
    display: block; /* Etiketi blok seviyesinde göster */
    font-size: 12px; /* Yazı boyutu */
    font-weight: normal; /* Etiketi kalın yap */
    color: #333; /* Yazı rengi */
    margin-bottom: 5px; /* Etiket ile input arasına boşluk ekle */
}

.comment-form-url input[type="url"] {
    width: 100%; /* Genişlik: Tam genişlik */
    padding: 10px; /* İçerik etrafında boşluk */
    font-size: 14px; /* Yazı boyutu */
    border: 1px solid #ccc; /* Çerçeve rengi */
    border-radius: 4px; /* Köşeleri yuvarlat */
    box-sizing: border-box; /* Padding ve border dahil genişlik hesaplaması */
    outline: none; /* Odaklanıldığında kenarlık olmaması için */
    transition: border-color 0.3s ease; /* Kenarlık değişimi için geçiş ekle */
}

.comment-form-url input[type="url"]:focus {
    border-color: #3498db; /* Odaklanıldığında kenarlık rengi değişir */
    box-shadow: 0 0 5px rgba(52, 152, 219, 0.5); /* Hafif gölge ekle */
}

.comment-form-url input[type="url"]::placeholder {
    color: #aaa; /* Placeholder metni rengini belirle */
    font-style: italic; /* Placeholder metnini italik yap */
}



.search-form {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}

.search-form .search-field {
    flex: 1;
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
	font-size: 12px;
}

.search-form .search-submit {
    background-color: #222;
    color: #fff;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
	font-size: 12px;
}

.search-form .search-submit:hover {
    background-color: #111;
}
.search-form label {
	    display: contents;
}