/*
Theme Name: EteliaNexus
Theme URI: https://eteliadigital.com
Author: Etelia Digital
Author URI: https://eteliadigital.com
Author Email: info@eteliadigital.com
Description: Gelişmiş özelliklere sahip modern ve güçlü bir WordPress blog teması. EteliaNexus, güzel tasarım, duyarlı düzen ve kusursuz gezinme ile okuyucuları içerikle buluşturur. Teknoloji blogları, haber siteleri ve dijital dergiler için mükemmel. | A modern, powerful WordPress blog theme with advanced features. EteliaNexus connects readers with content through beautiful design, responsive layout, and seamless navigation. Perfect for tech blogs, news websites, and digital magazines.
Version: 1.0.0
Requires at least: 5.0
Tested up to: 6.4
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: etelianexus
Tags: blog, haberler, news, magazine, dergi, two-columns, iki-sutun, right-sidebar, sag-kenar-cubugu, custom-logo, ozel-logo, custom-menu, ozel-menu, featured-images, one-cikan-gorseller, threaded-comments, yorumlar, translation-ready, ceviri-hazir, responsive-layout, uyumlu-yerlesim, modern, temiz, clean

EteliaNexus - İçerik tasarımla buluşuyor | Where content meets design. Etelia Digital tarafından geliştirilen premium WordPress teması | A premium WordPress theme by Etelia Digital.
*/

/* Reset & Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Work Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* WordPress Core Styles */
.alignnone {
    margin: 1.5rem 0;
}

.aligncenter {
    display: block;
    margin: 1.5rem auto;
}

.alignleft {
    float: left;
    margin: 0.5rem 1.5rem 1.5rem 0;
}

.alignright {
    float: right;
    margin: 0.5rem 0 1.5rem 1.5rem;
}

.wp-caption {
    max-width: 100%;
}

.wp-caption-text {
    font-size: 0.875rem;
    color: #64748b;
    margin-top: 0.5rem;
}

.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 1rem;
    margin: 1.5rem 0;
}

.gallery-item {
    margin: 0;
}

.sticky {
    /* Sticky post styles handled by featured section */
}

.bypostauthor {
    /* Post author styles */
}

/* Screen Reader Text */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* Navigation Menu Styles */
nav a {
    text-decoration: none;
}

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

nav ul li {
    display: inline-block;
    margin: 0;
    position: relative;
}

/* Desktop nav li inside flex container */
header nav > div > ul > li,
header nav > ul > li {
    position: relative;
    display: block;
}

nav ul li a {
    display: block;
}

/* Dropdown Menu Styles */
nav ul li ul.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    min-width: 200px;
    padding: 0.5rem 0;
    display: none;
    z-index: 9999;
}

nav ul li ul.sub-menu li {
    display: block;
    width: 100%;
}

nav ul li ul.sub-menu li a {
    padding: 0.5rem 1rem;
    color: #475569;
    font-size: 0.875rem;
    white-space: nowrap;
}

nav ul li ul.sub-menu li a:hover {
    background-color: #f1f5f9;
    color: #1160e8;
}

/* Dropdown Arrow - desktop only */
nav ul li.menu-item-has-children > a::after {
    content: '';
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 0.5rem;
    vertical-align: middle;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid currentColor;
}

/* Hide dropdown arrow in mobile menu */
#mobile-menu nav ul li.menu-item-has-children > a::after {
    display: none;
}

/* Mobile Menu Styles - Modern Design */
#mobile-menu nav ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mobile-menu nav ul li {
    display: block !important;
    width: 100%;
    margin: 0 0 0.25rem 0 !important;
    padding: 0 !important;
}

#mobile-menu nav ul li a {
    display: flex !important;
    align-items: center !important;
    padding: 1rem 1.25rem !important;
    color: #1e293b !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    border-radius: 0.75rem;
    transition: all 0.3s ease;
    text-decoration: none !important;
    gap: 0.75rem;
    background: transparent;
    border: 2px solid transparent;
}

#mobile-menu nav ul li a .material-symbols-outlined {
    font-size: 1.5rem !important;
    margin-right: 0 !important;
    font-weight: 400 !important;
}

#mobile-menu nav ul li a:hover {
    background: linear-gradient(135deg, #f0f7ff 0%, #e0f0ff 100%) !important;
    border-color: #1160e8 !important;
    color: #1160e8 !important;
    transform: translateX(5px);
}

/* Mobile Menu Submenu - flat list, no dropdown appearance */
#mobile-menu .sub-menu {
    display: none;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

#mobile-menu li.open > .sub-menu {
    display: block !important;
}

#mobile-menu .sub-menu li {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mobile-menu .sub-menu li a {
    display: flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    padding: 1rem 1.25rem 1rem 2rem !important;
    font-size: 1rem !important;
    color: #1e293b !important;
    font-weight: 600 !important;
    border-radius: 0.75rem !important;
    border: 2px solid transparent !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    background: transparent !important;
}

#mobile-menu .sub-menu li a::before {
    content: none !important;
}

#mobile-menu .sub-menu li a .material-symbols-outlined {
    font-size: 1.5rem !important;
    font-weight: 400 !important;
}

#mobile-menu .sub-menu li a:hover {
    background: linear-gradient(135deg, #f0f7ff 0%, #e0f0ff 100%) !important;
    border-color: #1160e8 !important;
    color: #1160e8 !important;
}

/* Mobile Menu - submenu must be static, not absolute */
#mobile-menu nav ul li ul.sub-menu,
#mobile-menu .sub-menu {
    position: static !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    min-width: 0 !important;
    padding: 0 !important;
    white-space: normal !important;
}
#mobile-menu li.menu-item-has-children > a {
    position: relative;
}

#mobile-menu li.menu-item-has-children > a::before {
    content: none;
}

#mobile-menu li.open > a,
#mobile-menu li.open:has(.sub-menu) > a {
    color: #1e293b !important;
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

#mobile-menu li.open > a .material-symbols-outlined,
#mobile-menu li.open:has(.sub-menu) > a .material-symbols-outlined {
    color: #1e293b !important;
}

/* Force all mobile menu icons to same color regardless of parent state */
#mobile-menu nav ul li a .material-symbols-outlined,
#mobile-menu .sub-menu li a .material-symbols-outlined {
    color: #1e293b !important;
}

#mobile-menu nav ul li a:hover .material-symbols-outlined,
#mobile-menu .sub-menu li a:hover .material-symbols-outlined {
    color: #1160e8 !important;
}

/* Divider between menu items */
#mobile-menu nav > ul > li:not(:last-child) {
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 0.25rem;
    margin-bottom: 0.25rem !important;
}

#mobile-menu .menu-item-has-children.open > a::after {
    transform: rotate(180deg);
}

/* Scrollbar Hide */
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Prose Styles for Article Content */
.prose {
    max-width: 65ch;
}

.prose p {
    margin-bottom: 1.5rem;
    line-height: 1.75;
}

.prose h2 {
    font-size: 1.875rem;
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}

.prose h3 {
    font-size: 1.5rem;
    font-weight: 600;
    margin-top: 2rem;
    margin-bottom: 0.75rem;
}

.prose a {
    color: #1160e8;
    text-decoration: underline;
}

.prose a:hover {
    color: #0d4db8;
}

.prose img {
    border-radius: 0.75rem;
    margin: 2rem 0;
}

.prose blockquote {
    border-left: 4px solid #1160e8;
    padding-left: 1.5rem;
    font-style: italic;
    color: #475569;
    margin: 2rem 0;
}

.prose ul,
.prose ol {
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

.prose li {
    margin-bottom: 0.5rem;
}

.prose code {
    background-color: #f1f5f9;
    padding: 0.125rem 0.375rem;
    border-radius: 0.25rem;
    font-size: 0.875em;
}

.prose pre {
    background-color: #1e293b;
    color: #e2e8f0;
    padding: 1.5rem;
    border-radius: 0.5rem;
    overflow-x: auto;
    margin: 1.5rem 0;
}

.prose pre code {
    background-color: transparent;
    padding: 0;
    color: inherit;
}

/* Comments */
.comment-list {
    list-style: none;
    padding: 0;
}

.comment-body {
    margin-bottom: 2rem;
    padding: 1.5rem;
    background-color: #f8fafc;
    border-radius: 0.75rem;
}

.comment-author {
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.comment-meta {
    font-size: 0.875rem;
    color: #64748b;
    margin-bottom: 1rem;
}

.comment-content p {
    margin-bottom: 1rem;
}

.reply {
    margin-top: 1rem;
}

.reply a {
    color: #1160e8;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
}

.reply a:hover {
    text-decoration: underline;
}

/* Pagination */
.pagination {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 2rem;
}

.pagination a,
.pagination span {
    padding: 0.5rem 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    text-decoration: none;
    color: #475569;
}

.pagination a:hover {
    background-color: #1160e8;
    color: white;
    border-color: #1160e8;
}

.pagination .current {
    background-color: #1160e8;
    color: white;
    border-color: #1160e8;
}

/* Responsive Utilities */
@media (max-width: 768px) {
    .prose {
        font-size: 1rem;
    }
    
    .prose h2 {
        font-size: 1.5rem;
    }
    
    .prose h3 {
        font-size: 1.25rem;
    }
}

/* Print Styles */
@media print {
    header,
    footer,
    aside,
    .no-print {
        display: none;
    }
}

/* Social Media Icons */
.social-media-icons {
    display: flex;
    gap: 0.75rem;
    align-items: center;
}

.social-media-mobile {
    flex-wrap: wrap;
    gap: 0.5rem !important;
}

.social-media-mobile .social-icon {
    width: 2rem !important;
    height: 2rem !important;
}

.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background-color: #f1f5f9;
    color: #475569;
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 1rem;
}

.social-icon:hover {
    background-color: #1160e8;
    color: white;
    transform: translateY(-2px);
}

.social-icon i {
    font-size: 1rem;
}

/* Header Social Icons */
.header-social .social-icon {
    width: 2rem;
    height: 2rem;
    font-size: 0.875rem;
}

/* Footer Social Icons */
.footer-social .social-icon {
    width: 2.5rem;
    height: 2.5rem;
    background-color: rgba(255, 255, 255, 0.1);
    color: #e2e8f0;
}

.footer-social .social-icon:hover {
    background-color: #1160e8;
    color: white;
}

/* Mobile Menu Toggle */
.mobile-menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    color: #475569;
    transition: color 0.3s ease;
}

.mobile-menu-toggle:hover {
    color: #1160e8;
}

.mobile-menu-toggle .material-symbols-outlined {
    font-size: 1.75rem;
}

/* Custom Logo */
.custom-logo-link {
    display: inline-block;
    line-height: 0;
}

.custom-logo {
    max-height: 60px;
    width: auto;
    height: auto;
}

/* Footer Widget Styles */
.footer-widget h3 {
    margin-bottom: 1rem;
}

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

.footer-widget ul li {
    margin-bottom: 0.5rem;
}

.footer-widget ul li a {
    color: #cbd5e1;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-widget ul li a:hover {
    color: white;
}

/* Header Sticky Effect */
.site-header {
    transition: all 0.3s ease;
}

.site-header.scrolled {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* Dark Mode Support */
.dark .social-icon {
    background-color: rgba(255, 255, 255, 0.1);
    color: #e2e8f0;
}

.dark .social-icon:hover {
    background-color: #1160e8;
    color: white;
}

.dark .mobile-menu-toggle {
    color: #e2e8f0;
}

.dark .mobile-menu-toggle:hover {
    color: #1160e8;
}

/* Widget Spacing Adjustments */
.etelianexus-section-header-widget {
    margin-bottom: 0.75rem !important;
    margin-top: 0 !important;
}

.etelianexus-featured-posts-widget {
    margin-bottom: 0.5rem !important;
    margin-top: 0.5rem !important;
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
}

.etelianexus-recent-grid-widget {
    margin-top: 0 !important;
}

/* Ad widget spacing - Override Tailwind space-y */
.ad-top-container {
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
}

.ad-left,
.ad-right {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Reduce spacing between section header and featured posts */
.etelianexus-section-header-widget + .etelianexus-featured-posts-widget {
    margin-top: 0.5rem !important;
}

/* Reduce spacing between ad areas and featured posts */
.ad-top-container + .etelianexus-featured-posts-widget {
    margin-top: 0.5rem !important;
}

/* Reduce spacing between featured and recent posts widgets */
.etelianexus-featured-posts-widget + .etelianexus-recent-grid-widget {
    margin-top: 0.5rem !important;
}

/* Footer Subscribe Button Text Color Fix */
footer button[type="submit"] {
    color: #ffffff !important;
}

/* Desktop Header Menu Styles */
header nav ul li a {
    position: relative;
    padding: 0.5rem 1rem;
    color: #475569;
    transition: color 0.3s ease;
}

/* Desktop nav menu icon size */
header > div > div nav ul li > a .material-symbols-outlined {
    font-size: 1.1rem;
    line-height: 1;
    flex-shrink: 0;
}

/* Ensure header nav doesn't clip dropdowns */
header nav,
header nav ul,
header nav ul li {
    overflow: visible !important;
}

header nav ul li a:hover {
    color: #1160e8;
}

header nav ul li a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 2px;
    background-color: #1160e8;
    transition: width 0.3s ease;
}

/* No underline on items with dropdown */
header nav ul li.menu-item-has-children > a::after {
    display: none;
}

header nav ul li a:hover::after {
    width: 80%;
}

header nav ul li.current-menu-item a,
header nav ul li.current_page_item a {
    color: #1160e8;
}

header nav ul li.current-menu-item a::after,
header nav ul li.current_page_item a::after {
    width: 80%;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .social-media-icons {
        gap: 0.5rem;
    }
    
    .social-icon {
        width: 2rem;
        height: 2rem;
        font-size: 0.875rem;
    }
    
    .custom-logo {
        max-height: 40px;
    }
    
    /* Tighter spacing on mobile */
    .etelianexus-featured-posts-widget + .etelianexus-recent-grid-widget {
        margin-top: 0.75rem;
    }
}

/* Recent Posts Grid - Mobile responsive override */
@media (max-width: 767px) {
    .etelianexus-recent-grid-widget .grid[data-columns] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 768px) {
    .etelianexus-recent-grid-widget .grid[data-columns="4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
    .etelianexus-recent-grid-widget .grid[data-columns="5"] {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
    .etelianexus-recent-grid-widget .grid[data-columns="6"] {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    }
}

/* News Ticker - Sticky below header */

/* Mobile menu icon color fix */
#mobile-menu nav ul li a .material-symbols-outlined,
#mobile-menu nav ul li a svg {
    color: #1e293b !important;
}


/* ============================================
   MOBILE MENU ANIMATIONS
   ============================================ */
#mobile-menu {
    animation: mobileMenuFadeIn 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes mobileMenuFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes slideInUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

#mobile-menu .space-y-3 > a { animation: slideInUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) backwards; }
#mobile-menu .space-y-3 > a:nth-child(1) { animation-delay: 0.10s; }
#mobile-menu .space-y-3 > a:nth-child(2) { animation-delay: 0.15s; }
#mobile-menu .space-y-3 > a:nth-child(3) { animation-delay: 0.20s; }
#mobile-menu .space-y-3 > a:nth-child(4) { animation-delay: 0.25s; }
#mobile-menu .space-y-3 > a:nth-child(5) { animation-delay: 0.30s; }
#mobile-menu .space-y-3 > a:nth-child(6) { animation-delay: 0.35s; }
#mobile-menu .space-y-3 > a:nth-child(7) { animation-delay: 0.40s; }
#mobile-menu .space-y-3 > a:nth-child(8) { animation-delay: 0.45s; }
#mobile-menu .space-y-3 > a:nth-child(9) { animation-delay: 0.50s; }

#mobile-menu .overflow-y-auto::-webkit-scrollbar       { width: 4px; }
#mobile-menu .overflow-y-auto::-webkit-scrollbar-track { background: transparent; }
#mobile-menu .overflow-y-auto::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.3); border-radius: 2px; }
#mobile-menu .overflow-y-auto::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.5); }

/* ============================================
   STICKY SHRINK HEADER
   ============================================ */
header { transition: all 0.3s ease; }
header.scrolled { box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
header.scrolled .container > div { padding-top: 0.5rem; padding-bottom: 0.5rem; }
header.scrolled nav .menu > li > a { padding: 0.375rem 1rem; font-size: 0.875rem; }
header.scrolled img { max-height: 45px !important; transition: all 0.3s ease; }

/* ============================================
   SEARCH OVERLAY
   ============================================ */
#search-overlay p {
    color: #ffffff !important;
    text-shadow: 0 2px 12px rgba(0,0,0,0.9), 0 0 20px rgba(0,0,0,0.7);
}
#search-overlay a:hover { color: #ffffff !important; }

/* ============================================
   SOCIAL MEDIA ICON HOVER COLORS
   (Hover efektleri inline JS ile yönetiliyor — class-social-media.php)
   ============================================ */
.social-share-icon {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    color: #64748b !important;
    background-color: #ffffff !important;
    border-color: #e2e8f0 !important;
}
.social-share-icon svg {
    color: inherit !important;
    fill: currentColor;
}

/* ============================================
   HEADER CONTAINER - ALWAYS FULL WIDTH
   ============================================ */
header .container { max-width: 100% !important; }

/* ============================================
   SIDEBAR POSITION
   ============================================ */
body.sidebar-left .lg\:grid-cols-12 > aside { order: -1; }
body.sidebar-none aside { display: none !important; }
body.sidebar-none .lg\:col-span-8 { grid-column: span 12 / span 12 !important; }

/* ============================================
   RESPONSIVE VIDEO / IFRAME
   ============================================ */

/* Yazı içindeki tüm iframe ve video'ları responsive yap */
.prose iframe,
.prose video,
.prose embed,
.prose object {
    max-width: 100% !important;
    width: 100% !important;
    height: auto;
}

/* YouTube / Vimeo gibi sabit boyutlu iframe'ler için aspect-ratio wrapper */
.prose iframe[src*="youtube"],
.prose iframe[src*="youtu.be"],
.prose iframe[src*="vimeo"],
.prose iframe[src*="dailymotion"],
.prose iframe[src*="twitch"] {
    aspect-ratio: 16 / 9;
    height: auto !important;
}

/* WordPress'in wp-block-embed wrapper'ı */
.wp-block-embed__wrapper {
    position: relative;
    width: 100%;
}

.wp-block-embed__wrapper iframe {
    max-width: 100% !important;
    width: 100% !important;
}

/* Gutenberg video bloğu */
.wp-block-video video {
    max-width: 100% !important;
    width: 100% !important;
    height: auto;
}

/* Genel güvenlik: prose dışında da taşmayı önle */
article iframe,
article video {
    max-width: 100% !important;
}