/*
Theme Name: QolMedia
Theme URI: https://qolmedia.az
Author: QolMedia
Description: Xəbər saytı üçün xüsusi hazırlanmış WordPress mövzusu.
Version: 1.0
*/

body {
margin: 0;
font-family: Arial, sans-serif;
background: #f2f2f2;
}

.top-header {
background: #006400;
color: white;
padding: 20px;
text-align: center;
font-size: 32px;
font-weight: bold;
}

.navbar {
background: #2a2a2a;
padding: 10px;
display: flex;
align-items: center;
color: white;
}

.menu-btn {
font-size: 24px;
margin-right: 15px;
}

.search-box input {
width: 70%;
padding: 8px;
border-radius: 15px;
border: none;
}

.slider {
background: #00b894;
padding: 20px;
text-align: center;
}

.video-section {
background: black;
padding: 30px;
text-align: center;
}

.tabs {
display: flex;
margin-top: 15px;
}

.tab {
width: 50%;
padding: 12px;
text-align: center;
background: #e5e5e5;
font-weight: bold;
}

.tab.active {
background: #008000;
color: white;
}

.news-card {
background: white;
padding: 10px;
margin: 10px;
border-radius: 10px;
display: flex;
}

.news-card img {
width: 110px;
height: 90px;
border-radius: 5px;
margin-right: 10px;
object-fit: cover;
}

.news-meta {
font-size: 12px;
color: #666;
}
.slider-container {
display: flex;
overflow-x: scroll;
gap: 15px;
padding: 10px;
}

.slide {
min-width: 250px;
position: relative;
}

.slide img {
width: 250px;
height: 150px;
object-fit: cover;
border-radius: 10px;
}

.slide-title {
position: absolute;
bottom: 5px;
left: 10px;
color: white;
font-weight: bold;
text-shadow: 0 0 4px black;
}
.live-scores-box {
background: #0a7f00;
color: white;
padding: 10px;
border-radius: 10px;
margin: 10px;
}

.live-scores-box h3 {
text-align: center;
margin-bottom: 10px;
}

.match-item {
display: flex;
justify-content: space-between;
background: rgba(255,255,255,0.1);
padding: 8px 10px;
margin-bottom: 5px;
border-radius: 6px;
}

.match-item .team {
width: 40%;
font-size: 14px;
}

.match-item .score {
width: 20%;
text-align: center;
font-weight: bold;
}
.live-ticker {
background: #019906;
color: #fff;
padding: 8px 10px;
margin: 15px auto;
width: 95%;
border-radius: 8px;
overflow: hidden;
display: flex;
align-items: center;
font-size: 15px;
font-weight: bold;
}

.live-ticker .title {
margin-right: 10px;
white-space: nowrap;
}

.ticker {
display: inline-block;
animation: scroll 250s linear infinite;
}

.ticker .item {
margin-right: 40px;
white-space: nowrap;
font-weight: 600;
}

@keyframes scroll {
from {
transform: translateX(100%);
}
to {
transform: translateX(-100%);
}
}
.ticker-container {
width: 100%;
overflow: hidden;
background: #008000;
padding: 12px 0;
border-radius: 10px;
margin-bottom: 20px;
}

.ticker-track {
display: inline-block;
white-space: nowrap;
animation: slideTicker 60s linear infinite;
}

.ticker-item {
display: inline-block;
margin: 0 50px;
font-size: 20px;
font-weight: bold;
color: #ffffff;
}

@keyframes slideTicker {
0% { transform: translateX(100%); }
100% { transform: translateX(-100%); }
}
.ticker-wrapper,
.live-scores-box {
background: transparent !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 !important;
}
.live-title {
margin-top: 5px !important;
margin-bottom: 5px !important;
}
/* Canlı nəticə başlığı */
.live-title {
font-size: 16px !important;
font-weight: 600 !important;
text-align: center;
margin: 5px 0 !important;
padding: 0 !important;
}

/* Ümumi wrapper – boşluqları sil */
.ticker-wrapper,
.live-scores-box {
background: transparent !important;
padding: 0 !important;
margin: 0 !important;
}

/* Yaşıl xətt olan skroller /
#liveTicker {
background: #0a8f0a !important;
padding: 6px 10px !important;
border-radius: 5px;
display: flex;
align-items: center;
height: 32px !important;      / sıxlaşdırdı */
}

/* Mətn və ikonlar */
#liveTicker span {
font-size: 14px !important;
margin: 0 10px;
}
.video-container {
position: relative;
width: 100%;
aspect-ratio: 16/9;
background: #000;
overflow: hidden;
border-radius: 8px;
}

.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.video-section {
margin: 15px 0;
text-align: center;
padding: 12px;
background: #111;
border-radius: 10px;
}

.video-section iframe {
border-radius: 10px;
width: 100%;
height: 250px;
}
.video-section {
padding: 0;
margin: 10px 0;
}

.video-section iframe {
width: 100%;
height: 220px; /* istəsən artırıb-azalda bilərsən */
border: none;
display: block;
}

.video-wrapper {
width: 100%;
overflow: hidden;
margin: 0;
padding: 0;
}
.ticker-container {
width: 100%;
overflow: hidden;
background: #0b6623;
padding: 8px 0;
}

.ticker-track {
display: flex;
gap: 40px;
white-space: nowrap;
animation: ticker 12s linear infinite;
}

.ticker-item {
color: #fff;
font-size: 16px;
font-weight: bold;
}

@keyframes ticker {
0% { transform: translateX(100%); }
100% { transform: translateX(-100%); }
}
/* Single Wrapper */
.single-wrapper {
max-width: 800px;
margin: 0 auto;
padding: 15px;
}

/* Title */
.single-title {
font-size: 26px;
font-weight: 700;
margin-bottom: 10px;
line-height: 1.3;
}

/* Meta info */
.single-meta {
color: #777;
font-size: 14px;
margin-bottom: 15px;
}

/* Image */
.single-image-box {
margin: 15px 0;
}

.single-thumb {
width: 100%;
border-radius: 10px;
display: block;
}

/* Content */
.single-content {
font-size: 18px;
line-height: 1.7;
margin-top: 20px;
}

.single-content p {
margin-bottom: 15px;
}

/* Share Box */
.share-box {
margin-top: 30px;
padding: 15px;
background: #f5f5f5;
border-radius: 10px;
}

.share-box span {
font-weight: 600;
margin-right: 10px;
}

.share-btn {
padding: 7px 12px;
background: #007bff;
color: #fff;
border-radius: 6px;
text-decoration: none;
margin-right: 8px;
font-size: 14px;
}

.share-btn:hover {
opacity: 0.8;
}

/* Next / Prev */
.next-prev {
margin-top: 35px;
display: flex;
justify-content: space-between;
}

.next-prev a {
color: #007bff;
font-weight: bold;
text-decoration: none;
}

.next-prev a:hover {
text-decoration: underline;
}
.post-thumbnail img,
.entry-thumb img,
.index-news img {
width: 100% !important;
height: auto !important;
border-radius: 6px;
}
.latest-slider {
    padding: 10px;
    background: white;
}

.latest-slider .slider-container {
    display: flex;
    overflow-x: auto;
    gap: 15px;
    padding-bottom: 10px;
}

.latest-slider .slide {
    min-width: 260px;
    position: relative;
}

.latest-slider .slide img {
    width: 260px;
    height: 150px;
    object-fit: cover;
    border-radius: 10px;
}

.latest-slider .slide-title {
    position: absolute;
    bottom: 8px;
    left: 10px;
    right: 10px;
    color: white;
    font-size: 15px;
    font-weight: bold;
    text-shadow: 0 0 5px black;
}
.navbar {
    background: #1d1d1d;
    padding: 10px;
    display: flex;
    align-items: center;
    gap: 25px;
}

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

.menu-list li a {
    color: #fff;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
}

.menu-list li a:hover {
    opacity: 0.7;
}

.search-box {
    margin-left: auto;
}

.search-box input {
    padding: 6px;
    border: none;
    border-radius: 3px;
}

.search-box button {
    padding: 6px 10px;
    background: #198754;
    color: #fff;
    border: none;
    border-radius: 3px;
}
/* Yazı başlıqları qara olsun */
a {
    color: #000 !important;
    text-decoration: none;
}

/* Hover zamanı bir az tünd görünsün */
a:hover {
    color: #333 !important;
}
/* MENYU KATEQORİYALARI YAŞIL RƏNGDƏ OLSUN */
.menu-list a {
    color: #00b140 !important; /* Yaşıl */
}

/* Hover effekti */
.menu-list a:hover {
    color: #009933 !important;
}
.big-slider {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    margin: 20px 0;
}

.big-slider-wrapper {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.big-slide {
    min-width: 100%;
}

.big-slide img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}

/* Ox düymələri */
.big-prev, .big-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.5);
    border: none;
    color: white;
    padding: 12px 18px;
    cursor: pointer;
    font-size: 22px;
    border-radius: 50%;
}

.big-prev { left: 10px; }
.big-next { right: 10px; }

/* Nöqtələr */
.big-dots {
    text-align: center;
    margin-top: 10px;
}

.big-dot {
    height: 12px;
    width: 12px;
    background: #bbb;
    display: inline-block;
    margin: 3px;
    border-radius: 50%;
    cursor: pointer;
}

.big-dot.active {
    background: #333;
}
/* Logo düzəlişi */
.top-header img.custom-logo {
    max-height: 60px;   /* Logo hündürlüyü */
    width: auto;
    display: block;
    margin: 10px auto;  /* Ortada etmək üçün */
}

/* Mobil üçün daha kiçik */
@media (max-width: 600px) {
    .top-header img.custom-logo {
        max-height: 45px;
    }
}
/* Logo düzəlişi */
.top-header img.custom-logo {
    max-height: 60px;   /* Logo hündürlüyü */
    width: auto;
    display: block;
    margin: 10px auto;  /* Ortada etmək üçün */
}

/* Mobil üçün daha kiçik */
@media (max-width: 600px) {
    .top-header img.custom-logo {
        max-height: 45px;
    }
}
.big-slider {
    z-index: 1;
    position: relative;
}

.tabs,
#news,
#popular {
    position: relative;
    z-index: 5;
}
.big-slider-wrapper {
    pointer-events: none;
}
/* --- TEMP DEBUG: görünməz qatları göstər --- */
* {
  outline: none !important;
}
body * {
  box-shadow: none !important;
}
.big-slider, .big-slider-wrapper, .big-slide, .latest-slider, .slider, .video-section {
  /* müvəqqəti sərhədlər: hansı element populyar bölməni örtürsə görünəcək */
  border: 1px dashed rgba(255,0,0,0.18);
}
/* News kartlarının tam kliklənməsi üçün */
.news-card { position: relative; z-index: 10; }
.news-card .news-link { display: block; position: relative; z-index: 20; text-decoration: none; color: inherit; }

/* əgər overlay var və pointerləri tutur — onu ləğv et */
.big-slider,
.slider,
.latest-slider,
.video-section {
    position: relative;
    z-index: 1;
    pointer-events: none; /* overlay elementlər klikləri tutmasın */
}

/* yalnız slayderin oxları klikləsin (pointer-events: auto) */
.big-prev,
.big-next,
.big-dots span {
    pointer-events: auto;
    z-index: 30;
}

/* tab-ların və məzmunun həmişə slayderdən üstündə olması üçün */
.tabs, .tab-content, .news-card, .video-section, .latest-slider {
    position: relative;
    z-index: 40;
}
/* Slayder klikləri bloklamasın */
.big-slider {
    position: relative;
    z-index: 1;
}

/* Tabs həmişə slayderin üstündə olsun */
.tabs, 
.tab-content {
    position: relative;
    z-index: 9999;
}

/* Slayder üst qat kimi klikləri tutmasın */
.big-slider * {
    pointer-events: none;
}

.big-prev,
.big-next {
    pointer-events: auto; /* oxlar işləsin */
}
.video-section {
    position: relative;
    z-index: 1;
}

.big-slider,
.slider,
.latest-slider {
    position: relative;
    z-index: 5;
}

iframe {
    pointer-events: auto;
}
/* YouTube bölməsi səhifəni bloklamasın */
.video-section {
    position: relative;
    z-index: 1;
}

/* Bütün sliderlər YouTube iframe-in üstündə olsun */
.slider,
.latest-slider,
.big-slider,
.tab-content,
.news-card {
    position: relative;
    z-index: 5;
}

/* iframe klikləri udmasın */
.video-section iframe {
    position: relative;
    z-index: 0;
    pointer-events: auto;
}
.video-section {
    position: relative !important;
    z-index: 1 !important;
}

.video-section iframe {
    display: block;
    width: 100%;
    height: 250px;
    pointer-events: auto !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Bütün səhifəni örtən overlay-i bloklamaq üçün */
iframe, .video-section, .video-section * {
    pointer-events: auto !important;
}

.big-slider,
.latest-slider,
.slider-container,
.slide,
.slide a {
    position: relative !important;
    z-index: 5 !important;
}
/* --- PROBLEMLƏRİN HƏLLİ: pointer-events düzəlişi --- */

/* Slider içindəki linklər kliklənə bilsin */
.big-slider a,
.slide a,
.latest-slider a,
.slider a {
    pointer-events: auto !important;
}

/* Slider overlay-ləri klik qatmmasın */
.big-slider,
.slider,
.latest-slider {
    pointer-events: auto !important;
}

/* Video iframe kliklənə bilsin */
.video-section iframe {
    pointer-events: auto !important;
    position: relative !important;
    z-index: 10 !important;
}

/* Video bölümünün özü overlay kimi klikləri udmasın */
.video-section {
    pointer-events: auto !important;
}

/* YouTube videonun üstündə heç nə durmasın */
iframe {
    pointer-events: auto !important;
}

/* Slayder wrapper klikləri öldürməsin */
.big-slider-wrapper {
    pointer-events: auto !important;
}
/* --- SLIDER KLIKLƏRİNİ BƏRPA ET --- */
.slider,
.latest-slider,
.slider * ,
.latest-slider * {
    pointer-events: auto !important;
}
.slider iframe {
    width: 100% !important;
    max-width: 1200px;
    margin: 0 auto;
    height: auto !important;
}
.ticker-container {
    width: 100%;
    overflow: hidden;
    background: #0a8d2f;
    padding: 8px 0;
    border-radius: 5px;
    margin-bottom: 15px;
}

.ticker-track {
    display: inline-block;
    white-space: nowrap;
    animation: ticker 60s linear infinite;
}

.ticker-item {
    display: inline-block;
    margin-right: 40px;
    font-size: 16px;
    color: white;
    font-weight: bold;
}

@keyframes ticker {
    0%   { transform: translateX(100%); }
    100% { transform: translateX(-100%); }

}
/* Slider-in yaşıl fonunu silən kod */
.slider-container,
.slider,
.slider-wrapper {
    background: transparent !important;
}

/* Arxa fon şəklinin görünməsi üçün */
header {
    background-size: cover !important;
    background-position: center !important;
}
.video-section iframe {
    position: relative;
    z-index: 9999;
}
.latest-slider {
    width: 100%;
    overflow: hidden;
}

.slider-container {
    display: flex;
    transition: transform 0.6s ease;
}

.slide {
    min-width: 100%;
}
/* Xəbər kartları üçün yaşıl tema */
.news-card,
.card,
.article-card {
  background-color: #16a34a; /* yaşıl rəng */
  color: #ffffff;            /* mətn ağdır */
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
  border: 1px solid rgba(0,0,0,.05);
}
/* Yaşıl tema üçün kartlar */
.news-card.card-green {
  background-color: #16a34a; /* yaşıl rəng */
  color: #ffffff;
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
  border: 1px solid rgba(0,0,0,.05);
}
.news-card.card-green h3,
.news-card.card-green p,
.news-card.card-green .date {
  color: #fff;
}
.news-card {
  background: #1b6b2b;      /* tünd yaşıl */
  color: #ffffff;           /* yazılar ağ olsun */
  border-radius: 10px;
  padding: 14px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}
.news-card .news-meta,
.news-card h3 { color: #ffffff; }
.news-card a.news-link { color: inherit; }
.news-card:hover {
  transform: translateY(-4px);
  transition: .25s ease;
}
.ticker-track {
    animation: ticker 45s linear infinite;
}
/* ---------- Weather Ticker CSS (paste into <style> or weather.css) ---------- */

/* T&#601;nziml&#601;n&#601; bil&#601;n d&#601;yi&#351;&#601;n: n&#601; q&#601;d&#601;r böyük olarsa, bir o q&#601;d&#601;r yava&#351; ged&#601;c&#601;k */
:root {
  --ticker-duration: 45s; /* default: 45s. Daha yava&#351; üçün 80s-120s qoy */
  --ticker-bg: linear-gradient(90deg,#0a8f0a,#019906);
  --ticker-color: #ffffff;
  --ticker-font-size: 15px;
  --ticker-gap: 36px;
}

/* &#601;sas konteyner (header-d&#601; v&#601; ya footer-d&#601; yerl&#601;&#351;dir) */
#weather-slider,
.weather-ticker {
  width: 100%;
  box-sizing: border-box;
  background: var(--ticker-bg);
  color: var(--ticker-color);
  padding: 8px 12px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  z-index: 9999;
}

/* iç struktur - m&#601;rk&#601;zl&#601;m&#601; üçün */
.weather-ticker .wt-inner,
#weather-slider .wt-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
}

/* ba&#351;l&#305;q (m&#601;s. "Hava:") */
.weather-ticker .wt-title,
#weather-slider .wt-title {
  white-space: nowrap;
  font-weight: 700;
  font-size: calc(var(--ticker-font-size) * 0.95);
  margin-right: 8px;
}

/* görün&#601;n tray (scroll üçün) */
.wt-track,
#weather-slider .wt-track,
#weather-slider { /* fallback if using direct inner HTML */
  overflow: hidden;
  flex: 1 1 auto;
  position: relative;
  height: 34px;
}

/* h&#601;r&#601;k&#601;t ed&#601;n blok — burada animation-duration dinamikdir */
.wt-mover,
#weather-slider .wt-mover {
  display: inline-block;
  white-space: nowrap;
  will-change: transform;
  animation: wt-scroll var(--ticker-duration) linear infinite;
  /* animasiyan&#305; defaultda oynat; hover il&#601; dayand&#305;raca&#287;&#305;q */
  animation-play-state: running;
}

/* elementl&#601;r (&#351;&#601;h&#601;r + d&#601;r&#601;c&#601; + ikon) */
.wt-item,
#weather-slider .wt-item,
#weather-slider span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 var(--ticker-gap);
  font-size: var(--ticker-font-size);
  font-weight: 600;
  color: var(--ticker-color);
  line-height: 1;
  vertical-align: middle;
}

/* ikon ölçül&#601;ri */
.wt-item img,
#weather-slider img {
  width: 22px;
  height: 22px;
  display: inline-block;
  object-fit: contain;
}

/* hover zaman&#305; dayand&#305;r */
.weather-ticker:hover .wt-mover,
#weather-slider:hover .wt-mover {
  animation-play-state: paused !important;
}

/* alternativ: &#601;g&#601;r element.animate() istifad&#601; olunubsa, hover-da JS il&#601; paus etm&#601;k laz&#305;m g&#601;l&#601;c&#601;k */
/* mobil üçün daha kiçik görünü&#351; */
@media (max-width: 768px) {
  :root {
    --ticker-duration: calc(var(--ticker-duration) * 1.2); /* mobilda biraz daha yava&#351; */
  }
  .wt-item,
  #weather-slider .wt-item,
  #weather-slider span {
    padding: 0 14px;
    font-size: 13px;
  }
  .wt-item img, #weather-slider img { width:18px; height:18px; }
  .weather-ticker .wt-title { display: none; } /* ba&#351;l&#305;&#287;&#305; mobilda gizl&#601;t */
}

/* keyframes: translateX(-50%) istifad&#601; olunan duplicating texnikas&#305; üçün */
@keyframes wt-scroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); } /* mover iç&#601;risind&#601; duplicated content varsay&#305;l&#305;r */
}

/* Z&#601;rur&#601;t olduqda CSS override üçün !important variant&#305; */
/* .wt-mover { animation: wt-scroll 120s linear infinite !important; } */

/* &#399;lav&#601;: daha hamar effekt üçün transition hiss&#601;si */
.wt-item { transition: transform 120ms ease; }
.video-slider {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.video-track {
  display: flex;
  transition: transform .5s ease;
}

.video-item {
  min-width: 20%; /* 5 video yan-yana */
  padding: 10px;
}

video {
  width: 100%;
  border-radius: 10px;
}
.prev, .next {
  position: absolute;
  top: 40%;
  background: #00000080;
  color: #fff;
  border: none;
  font-size: 32px;
  padding: 8px 14px;
  cursor: pointer;
}
.prev { left: 10px; }
.next { right: 10px; }