/* Blog Detay Sayfası Stilleri */
.blog-container { max-width: 1200px; margin: 30px auto; padding: 0 15px; }
.blog-detail-container { background-color: #fff; border-radius: 8px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); padding: 30px; margin-bottom: 30px; }
.blog-header { margin-bottom: 25px; }
.blog-title { font-size: 2.2rem; font-weight: 700; color: #333; margin-bottom: 15px; line-height: 1.3; }
.blog-meta { display: flex; flex-wrap: wrap; gap: 15px; font-size: 0.9rem; color: #777; margin-bottom: 20px; }
.blog-category a, .blog-date, .blog-author, .blog-read-time { display: inline-flex; align-items: center; color: #555; text-decoration: none; }
.blog-category a:hover { color: #145f34; text-decoration: none; }
.blog-meta i { margin-right: 6px; color: #145f34; }
.blog-featured-image { margin-bottom: 25px; border-radius: 8px; overflow: hidden; }
.blog-featured-image img { width: 100%; height: auto; border-radius: 8px; }
.blog-content { color: #333; font-size: 1.05rem; line-height: 1.8; margin-bottom: 30px; }
.blog-content h3 { font-size: 1.5rem; color: #145f34; margin: 25px 0 15px; font-weight: 600; }
.blog-content p { margin-bottom: 20px; }
.blog-detail-container .blog-content p { min-height: auto !important; overflow: visible !important; display: block !important; -webkit-line-clamp: none !important; -webkit-box-orient: initial !important; }
.blog-content ul, .blog-content ol { margin-bottom: 20px; padding-left: 20px; }
.blog-content li { margin-bottom: 10px; }
.blog-content blockquote { border-left: 5px solid #145f34; padding: 15px 20px; margin: 25px 0; background-color: #f8f9fa; font-style: italic; font-size: 1.1rem; color: #555; }
.blog-tags { margin-bottom: 30px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.tags-title { color: #555; font-weight: 600; margin-right: 5px; }
.tag { display: inline-block; background-color: #f0f0f0; color: #555; padding: 5px 12px; border-radius: 20px; font-size: 0.85rem; text-decoration: none; transition: all 0.3s; }
.tag:hover { background-color: #145f34; color: white; text-decoration: none; }
.blog-navigation { border-top: 1px solid #eee; border-bottom: 1px solid #eee; padding: 25px 0; margin-bottom: 30px; }
.blog-nav-link { display: block; color: #555; text-decoration: none; transition: color 0.3s; }
.blog-nav-link:hover { color: #145f34; text-decoration: none; }
.blog-nav-direction { display: block; font-size: 0.85rem; font-weight: 600; text-transform: uppercase; margin-bottom: 5px; }
.blog-nav-title { display: block; font-size: 1rem; font-weight: 500; }
.blog-share { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; }
.share-title { font-weight: 600; color: #555; }
.share-buttons { display: flex; gap: 10px; }
.share-button { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; color: white; font-size: 1rem; transition: all 0.3s; }
.share-button.facebook { background-color: #3b5998; }
.share-button.twitter { background-color: #1da1f2; }

.share-button.whatsapp { background-color: #25d366; }
.share-button.telegram { background-color: #0088cc; }
.share-button.email { background-color: #ea4335; }
.share-button:hover { opacity: 0.9; transform: translateY(-3px); color: white; text-decoration: none; }
.sidebar-section { margin-bottom: 30px; }
.search-container { margin-bottom: 20px; }
.search-form { display: flex; position: relative; }
.search-input { width: 100%; padding: 12px 50px 12px 15px; border: 1px solid #ddd; border-radius: 8px; font-size: 1rem; transition: all 0.3s; }
.search-input:focus { outline: none; border-color: #145f34; box-shadow: 0 0 0 2px rgba(20, 95, 52, 0.1); }
.search-button { position: absolute; right: 0; top: 0; height: 100%; width: 50px; background-color: #145f34; color: white; border: none; border-top-right-radius: 8px; border-bottom-right-radius: 8px; cursor: pointer; transition: background-color 0.3s; }
.search-button:hover { background-color: #0d4525; }
.categories-container { background-color: #f8f9fa; border-radius: 8px; padding: 20px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); }
.categories-title { font-size: 1.3rem; color: #145f34; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 2px solid #e9ecef; }
.categories-list { list-style: none; padding: 0; margin: 0; }
.category-item { margin-bottom: 10px; }
.category-link { color: #333; text-decoration: none; display: flex; justify-content: space-between; padding: 6px 0; transition: color 0.3s; }
.category-link:hover { color: #145f34; text-decoration: none; }
.category-count { color: #777; font-size: 0.9rem; }
body.dark .blog-detail-container { background-color: #1e2126; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); }
body.dark .blog-title { color: #e1e1e1; }
body.dark .blog-meta { color: #aaa; }
body.dark .blog-category a, body.dark .blog-date, body.dark .blog-author, body.dark .blog-read-time { color: #bbb; }
body.dark .blog-meta i, body.dark .blog-category a:hover { color: #19b069; }
body.dark .blog-content { color: #e1e1e1; }
body.dark .blog-content h3 { color: #19b069; }
body.dark .blog-content blockquote { border-left-color: #19b069; background-color: #2a2d33; color: #e1e1e1; }
body.dark .tag { background-color: #2a2d33; color: #bbb; }
body.dark .tag:hover { background-color: #19b069; color: white; }
body.dark .blog-navigation { border-color: #3e4452; }
body.dark .blog-nav-link { color: #bbb; }
body.dark .blog-nav-link:hover { color: #19b069; }
body.dark .share-title { color: #bbb; }
body.dark .categories-container { background-color: #2a2d33; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }
body.dark .categories-title { color: #19b069; border-bottom-color: #3e4452; }
body.dark .category-link { color: #e1e1e1; }
body.dark .category-link:hover { color: #19b069; }
body.dark .category-count { color: #aaa; }
body.dark .search-input { background-color: #2a2d33; border-color: #3e4452; color: #e1e1e1; }
body.dark .search-input:focus { border-color: #19b069; box-shadow: 0 0 0 2px rgba(25, 176, 105, 0.2); }
body.dark .search-button { background-color: #19b069; }
body.dark .search-button:hover { background-color: #148c53; }
@media (max-width: 768px) { .blog-title { font-size: 1.8rem; } .blog-detail-container { padding: 20px; } .blog-content { font-size: 1rem; } .blog-meta { gap: 10px; font-size: 0.8rem; } .blog-share { flex-direction: column; align-items: flex-start; gap: 10px; } }
@media (max-width: 576px) { .blog-title { font-size: 1.5rem; } .blog-detail-container { padding: 15px; } .blog-navigation .row { margin: 0; } .blog-nav-title { font-size: 0.9rem; } }