/*
Theme Name: XTheme
Theme URI: https://example.com/xtheme
Author: Nakican Akyürek
Description: Modern, responsive, Tailwind tabanlı WordPress haber teması
Version: 1.0.0
Text Domain: xtheme
*/

/* ==================================================
   BASE RESET & TYPOGRAPHY
================================================== */

html {
  font-size: 16px;
}

body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  color: #111827;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
}

/* HEADINGS */
h1,h2,h3,h4,h5,h6 {
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 700;
  line-height: 1.25;
  margin: 0 0 .6em;
}

h1 { font-size: 2.25rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.35rem; }
h4 { font-size: 1.1rem; }

/* CONTENT */
article p, .entry-content {
  font-family: "Onest", system-ui, sans-serif;
 
  color: dimgray;
}

/* CONTENT */
aside ul, .widget ul {
  font-family: "Onest", system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.70;
  font-weight: 500;
  color: dimgray;
}

p { margin-bottom: 1.25em; }

/* ==================================================
   GLOBAL ELEMENTS
================================================== */

img {
  max-width: 100%;
  height: auto;
}

a {
  text-decoration: none;
  transition: color .2s ease;
}

a:hover {
  color: inherit;
}

/* ==================================================
   WORDPRESS FIXES
================================================== */

.wp-block-image img { max-width: 100%; height: auto; }
.page-numbers { display: inline-block; margin: 0 4px; }
.comment-form input,
.comment-form textarea { max-width: 100%; }
.widget ul { list-style: none; padding: 0; margin: 0; }
.gallery { margin: 0; }
body.admin-bar #site-header {
  top: 32px;
}

/* ==================================================
   FORMS
================================================== */

input,
textarea,
select {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: 14px;
  background: transparent;
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: #0f172a;
  box-shadow: 0 0 0 2px rgba(15,23,42,.15);
}

/* ==================================================
   BUTTONS
================================================== */



/* ==================================================
   HEADER (STICKY / SHRINK)
================================================== */

#site-header {
  position: sticky;
  top: 0;
  z-index: 999;
  transition: padding .35s ease, box-shadow .35s ease;
}

#site-header.shrink {
  box-shadow: 0 10px 28px rgba(0,0,0,.12);
}

/* LOGO (ORANTILI – DINAMIK BOYUT functions.php’DEN) */
.custom-logo {
  width: auto;
  max-width: 100%;
  transition: height .35s cubic-bezier(.22,1,.36,1);
}

/* ==================================================
   SWIPER – ORTALI CONTROLS
================================================== */

.author-controls,
.surmanset-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 22px auto 0;
 
}

 
/* HERO DOTS */
.hero-pagination {
  display: flex;
  justify-content: center;
}

.hero-pagination .swiper-pagination-bullet {
  width: 17px;
  height: 17px; opacity: 1 !important;
  background: #d2d2d2; 
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;  transition: all .3s ease;
}

.hero-pagination .swiper-pagination-bullet-active {
  background: #dc2626; opacity: 1 !important;
  color: #fff;  
  width: 50px;
  border-radius: 15px;
   transition: all .3s ease;
}
 

/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 640px) {
  h1 { font-size: 1.75rem; }
  h2 { font-size: 1.5rem; }
  h3 { font-size: 1.25rem; }
}


/* ==================================================
   AUTHOR SWIPER – CENTERED DOTS + ARROWS
================================================== */
.author-swiper .swiper-button-prev,
.author-swiper .swiper-button-next {
  position: static !important;
  width: 22px;
  height: 22px;
  margin: 0 !important;
  transform: none !important; color: #0f172a;
  padding: 15px;
}
 .author-swiper .swiper-pagination{
display:flex;
align-items:center;
justify-content:center;
gap:6px;
}
 
.author-swiper .swiper-pagination-bullet{
width:8px;
height:8px;
background:#d1d5db;
opacity:1;
border-radius:50%;
transform:scale(.6);
transition:all .35s ease;
}

.author-swiper .swiper-pagination-bullet-active{
background:#dc2626;
transform:scale(1.8);
}

.author-swiper .swiper-pagination-bullet-active + .swiper-pagination-bullet,
.author-swiper .swiper-pagination-bullet:has(+ .swiper-pagination-bullet-active){
transform:scale(1.1);
}
 


/* ==================================================
   SURMANŞET SWIPER – BOTTOM CENTER ARROWS (><)
================================================== */

.surmanset-swiper {
  position: relative;
  padding-bottom: 44px; /* oklar için alan */
}
.surmanset-pagination .swiper-pagination-bullet{
background: rgba(255, 255, 255, 0.778);
opacity: 1;
width: 12px;
height: 12px;border-radius: 50%;
}

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

/* ALT ORTA OKLAR */
.surmanset-swiper .surmanset-controls {
 
  transform: translateX(0);
 
  gap: 0;

  z-index: 10;
}

/* OKLAR */
.surmanset-swiper .swiper-button-prev,
.surmanset-swiper .swiper-button-next {
  position: static !important;
  width: 22px;
  height: 22px;
  margin: 0 !important;
  transform: none !important;
  padding: 15px;
}

/* OK İKON */
.surmanset-swiper .swiper-button-prev::after,
.surmanset-swiper .swiper-button-next::after {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  line-height:  1;
}

 
 /* ==================================================
   SINGLE POST – ARTICLE STYLES
================================================== */

/* Ana içerik alanı */
.single article {
  font-size: 17px;
  line-height: 1.8;
  color: #1f2937; /* gray-800 */
}

/* Başlık */
.single article h1 {
  font-size: 2.25rem;
  font-weight: 800;
  line-height: 1.25;
  margin-bottom: 1rem;
}

/* Alt başlıklar */
.single article h2 {
  font-size: 1.5rem;
  margin-top: 2.5rem;
  margin-bottom: 1rem;
  font-weight: 600;
}

.single article h3 {
  font-size: 1.25rem;
  margin-top: 2rem;
  margin-bottom: .75rem;
   font-weight: 600;
}

/* Paragraflar */
 

/* Liste */
.single article ul,
.single article ol {
  padding-left: 1.25rem;
  margin: 1.5rem 0;
}

.single article li {
  margin-bottom: .6em;
}

/* Alıntı */
.single article blockquote {
  border-left: 4px solid #dc2626;
  padding-left: 1rem;
  margin: 2rem 0;
  font-style: italic;
  color: #374151;
  background: #f9fafb;
}

 

/* ==================================================
   META BAR (Yazar / Tarih / Güncelleme)
================================================== */

.single .post-meta {
  font-size: 0.75rem;
  color: #6b7280;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  border-bottom: 1px solid #e5e7eb;
  padding-bottom: .75rem;
  margin-bottom: 1rem;
}

/* ==================================================
   OKUMA ARAÇLARI (FONT / SHARE / READ ALOUD)
================================================== */

 
 
/* ==================================================
   SHARE MENU
================================================== */

.share-wrapper {
  position: relative;
}

.share-menu {
  min-width: 44px;
}

/* ==================================================
   RELATED POSTS
================================================== */

.single .related-posts article h4 {
  font-size: .95rem;
  line-height: 1.4;
}

/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 768px) {

  .single article {
    font-size: 16px;
    line-height: 1.7;
  }

  .single article h1 {
    font-size: 1.75rem;
  }

  #post-tools {
    font-size: .9rem;
  }
}
	/* ==================================================
   HERO SLIDER – CUSTOM NAVIGATION
================================================== */
	.slider-nav{
    position:absolute;
    right:10px;
    bottom:10px;
    display:flex;
    align-items:center;
    background:rgba(255, 255, 255, 0.845);
    backdrop-filter:blur(6px);
    border-radius:8px;
    overflow:hidden;
    z-index:30;
}

/* hover efekti */
.slider-nav .surmanset-prev:hover,
.slider-nav .surmanset-next:hover{
    background:rgba(255,255,255,0.15);
}

/* hover ikon büyüme */
.slider-nav .surmanset-prev:hover:after,
.slider-nav .surmanset-next:hover:after{
    transform:scale(1.15); padding:10px;  background-color: #dc2626;
}

.slider-nav .swiper-button-prev,
.slider-nav .swiper-button-next{
    position:relative;
    width:32px;
    height:32px;
    margin:0;
    left:auto;
    right:auto;
    top:auto;
}

.slider-nav .surmanset-prev:after,
.slider-nav .surmanset-next:after{
    font-size:15px;
    color:rgb(0, 0, 0);
}

.nav-divider{
    width:1px;
    height:32px;
    background:rgba(0, 0, 0, 0.15);
}
	.swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical>.swiper-pagination-bullets {
    right: var(--swiper-pagination-right, 8px);
    left: var(--swiper-pagination-left, auto);
    top: 50%;
    transform: translate3d(0px, -30%, 0);}




    
@keyframes livePulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  70% {
    transform: scale(2);
    opacity: 0;
  }
  100% {
    transform: scale(2);
    opacity: 0;
  }
}

.live-wrapper {
  position: relative;
}

.live-wrapper::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(220,38,38,0.5);
  border-radius: 9999px;
  animation: livePulse 1.5s infinite;
}



@keyframes marquee {
0% {transform: translateX(0)}
100% {transform: translateX(-50%)}
}

.animate-marquee{
display:flex;
animation: marquee 25s linear infinite;
} 
.archive-timeline{
position:relative;
padding-left:40px;
}

.archive-timeline::before{
content:"";
position:absolute;
left:10px;
top:0;
bottom:0;
width:2px;
background:#d1d5db;
}

.archive-item{
position:relative;
margin-bottom:25px;
}

.archive-dot{
position:absolute;
left:-36px;
top:6px;
width:15px;
height:15px;
background:#dc2626;
border-radius:50%;
border:2px solid #ffffff;
}

.archive-content{
display:flex;
gap:12px;
 
font-weight:600;
}

.archive-time{
color:#6b7280;
font-size:12px;
width:50px;
}

 .footer-menu li {
position: relative;
}

.footer-menu .sub-menu {
display: none;
position: absolute;
top: 100%;
left: 0;
background: #111;
border-radius: 8px;
padding: 8px;
min-width: 160px;
flex-direction: column;
}

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

.footer-menu .sub-menu li a {
  font-size: 0.8rem;
display: block;
padding: 6px 10px;
color: white;
}

.footer-menu .sub-menu li a:hover {
background: #374a65a1;
}

.myswiper-pagination .swiper-pagination-bullet{
background: rgba(255, 255, 255, 0.778);
opacity: 1;
width: 12px;
height: 12px;border-radius: 50%;
}

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


 .lazy-img{
filter:blur(10px);
transition:filter .4s ease;
}

.lazy-img[src]{
filter:blur(0);
}


 .navigation.pagination{
 
justify-content:center;
}

.page-numbers{
display:flex;
gap:8px;
list-style:none;
}

.page-numbers a,
.page-numbers span{
padding:8px 14px;
border:1px solid #ddd;
border-radius:8px;
text-decoration:none;
color:#333;
transition:.2s;
}

.page-numbers a:hover{
background:#dc2626;
color:white;
border-color:#dc2626;
}

.page-numbers .current{
background:#dc2626;
color:white;
border-color:#dc2626;
font-weight:600;
}

.icon-politics > a::before{
content:"\f3c1";
font-family:"Font Awesome 6 Free";
font-weight:900;
margin-right:8px;
}

.icon-sports > a::before{
content:"\f1e3";
font-family:"Font Awesome 6 Free";
font-weight:900;
margin-right:8px;
}

.icon-tech > a::before{
content:"\f109";
font-family:"Font Awesome 6 Free";
font-weight:900;
margin-right:8px;
}


/* Swiper navigation button size */
 
 

.swiper-button-next:after,
.swiper-button-prev:after{
font-size:24px;
font-weight:bold;
}