@charset "UTF-8";
*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {  margin-top: 0;  margin-bottom: 0.5rem; }
h1, .h1 {  font-size: calc(1.375rem + 1.5vw);}
@media (min-width: 1200px) {  h1, .h1 {    font-size: 2.5rem;  }}
h2, .h2 {  font-size: calc(1.325rem + 0.9vw);}
@media (min-width: 1200px) {  h2, .h2 {    font-size: 2rem;  }}
h3, .h3 {  font-size: calc(1.3rem + 0.6vw);}
@media (min-width: 1200px) {  h3, .h3 {    font-size: 1.75rem;  }}
h4, .h4 {  font-size: calc(1.275rem + 0.3vw);}
@media (min-width: 1200px) {  h4, .h4 {    font-size: 1.5rem;  }}
h5, .h5 {  font-size: 1.25rem;}
h6, .h6 {  font-size: 1rem;}
.text-justify {
  text-align: justify;
}
.pointer{ cursor: pointer !important; }

/* Reklam Alanı Tasarımı */
.ad-space {
    background-color: #f8f9fa;
    border: 1px dashed var(--theme-border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #adb5bd;
    font-size: 0.8rem;
    text-transform: uppercase;
    overflow: hidden;
}

.ad-space::before {
    content: "REKLAM ALANI";
}

/* ==========================================
   KAGAN CSS - MARGIN & PADDING (Bootstrap Mantığı)
   ========================================== */

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

.img-thumbnail {
    padding: 0.25rem;
    background-color: var(--theme-white);
    border: 1px solid #dee2e6;
    border-radius: var(--theme-border-radius); /* Az önce yaptığımız rounded-2 ile uyumlu */
    max-width: 100%;
    height: auto;
}
img, svg {
    vertical-align: middle;
}
a{
	text-decoration: none !important;
	
}

.ls-none{ list-style: none; }

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
    line-height: 1.2;
}
/* --- OBJECT FIT --- */
.object-fit-cover   { object-fit: cover !important; }   /* Kutuyu doldurur, taşanı kırpar */
.object-fit-contain { object-fit: contain !important; } /* Resmin tamamını gösterir, boşluk bırakabilir */
.object-fit-fill    { object-fit: fill !important; }    /* Resmi kutuya zorla yayar (tavsiye edilmez) */

/* Görselin odağını belirler */
.object-fit-top    { object-position: top !important; }
.object-fit-center { object-position: center !important; }

.ln-g-dark{background: linear-gradient(rgba(0, 0, 0, 0), #111);}

/* --- MARGIN (DIŞ BOŞLUK) --- */

/* Her Yöne */
.m-0 { margin: 0 !important; }
.m-1 { margin: 0.3125rem !important; } /* 5px */
.m-2 { margin: 0.625rem !important; }  /* 10px */
.m-3 { margin: 0.9375rem !important; } /* 15px */
.m-4 { margin: 1.25rem !important; }   /* 20px */
.m-5 { margin: 2.5rem !important; }    /* 40px */
.m-auto { margin: auto !important; }

/* Yukarı (Top) */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.3125rem !important; }
.mt-2 { margin-top: 0.625rem !important; }
.mt-3 { margin-top: 0.9375rem !important; }
.mt-4 { margin-top: 1.25rem !important; }
.mt-5 { margin-top: 2.5rem !important; }
.mt-auto { margin-top: auto !important; }

/* Aşağı (Bottom) */
.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 0.3125rem !important; }
.mb-2 { margin-bottom: 0.625rem !important; } /* Manşet yanındaki kritik boşluk */
.mb-3 { margin-bottom: 0.9375rem !important; }
.mb-4 { margin-bottom: 1.25rem !important; }
.mb-5 { margin-bottom: 2.5rem !important; }
.mb-auto { margin-bottom: auto !important; }

/* Sol (Start) */
.ms-0 { margin-left: 0 !important; }
.ms-1 { margin-left: 0.3125rem !important; }
.ms-2 { margin-left: 0.625rem !important; }
.ms-3 { margin-left: 0.9375rem !important; }
.ms-4 { margin-left: 1.25rem !important; }
.ms-5 { margin-left: 2.5rem !important; }
.ms-auto { margin-left: auto !important; }

/* Sağ (End) */
.me-0 { margin-right: 0 !important; }
.me-1 { margin-right: 0.3125rem !important; }
.me-2 { margin-right: 0.625rem !important; }
.me-3 { margin-right: 0.9375rem !important; }
.me-4 { margin-right: 1.25rem !important; }
.me-5 { margin-right: 2.5rem !important; }
.me-auto { margin-right: auto !important; }

/* Yatay (X) */
.mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
.mx-1 { margin-left: 0.3125rem !important; margin-right: 0.3125rem !important; }
.mx-2 { margin-left: 0.625rem !important; margin-right: 0.625rem !important; }
.mx-3 { margin-left: 0.9375rem !important; margin-right: 0.9375rem !important; }
.mx-4 { margin-left: 1.25rem !important; margin-right: 1.25rem !important; }
.mx-5 { margin-left: 2.5rem !important; margin-right: 2.5rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }

/* Dikey (Y) */
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.my-1 { margin-top: 0.3125rem !important; margin-bottom: 0.3125rem !important; }
.my-2 { margin-top: 0.625rem !important; margin-bottom: 0.625rem !important; }
.my-3 { margin-top: 0.9375rem !important; margin-bottom: 0.9375rem !important; }
.my-4 { margin-top: 1.25rem !important; margin-bottom: 1.25rem !important; }
.my-5 { margin-top: 2.5rem !important; margin-bottom: 2.5rem !important; }
.my-auto { margin-top: auto !important; margin-bottom: auto !important; }

/* --- PADDING (İÇ BOŞLUK) --- */

/* Her Yöne */
.p-0 { padding: 0 !important; }
.p-1 { padding: 0.3125rem !important; } /* 5px */
.p-2 { padding: 0.625rem !important; }  /* 10px (Grid Boşluğuyla Eşit) */
.p-3 { padding: 0.9375rem !important; } /* 15px */
.p-4 { padding: 1.25rem !important; }   /* 20px */
.p-5 { padding: 2.5rem !important; }    /* 40px */

/* Yukarı (Top) */
.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 0.3125rem !important; }
.pt-2 { padding-top: 0.625rem !important; }
.pt-3 { padding-top: 0.9375rem !important; }
.pt-4 { padding-top: 1.25rem !important; }
.pt-5 { padding-top: 2.5rem !important; }

/* Aşağı (Bottom) */
.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: 0.3125rem !important; }
.pb-2 { padding-bottom: 0.625rem !important; }
.pb-3 { padding-bottom: 0.9375rem !important; }
.pb-4 { padding-bottom: 1.25rem !important; }
.pb-5 { padding-bottom: 2.5rem !important; }

/* Sol (Start) */
.ps-0 { padding-left: 0 !important; }
.ps-1 { padding-left: 0.3125rem !important; }
.ps-2 { padding-left: 0.625rem !important; }
.ps-3 { padding-left: 0.9375rem !important; }
.ps-4 { padding-left: 1.25rem !important; }
.ps-5 { padding-left: 2.5rem !important; }

/* Sağ (End) */
.pe-0 { padding-right: 0 !important; }
.pe-1 { padding-right: 0.3125rem !important; }
.pe-2 { padding-right: 0.625rem !important; }
.pe-3 { padding-right: 0.9375rem !important; }
.pe-4 { padding-right: 1.25rem !important; }
.pe-5 { padding-right: 2.5rem !important; }

/* Yatay (X) */
.px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.px-1 { padding-left: 0.3125rem !important; padding-right: 0.3125rem !important; }
.px-2 { padding-left: 0.625rem !important; padding-right: 0.625rem !important; }
.px-3 { padding-left: 0.9375rem !important; padding-right: 0.9375rem !important; }
.px-4 { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
.px-5 { padding-left: 2.5rem !important; padding-right: 2.5rem !important; }

/* Dikey (Y) */
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-1 { padding-top: 0.3125rem !important; padding-bottom: 0.3125rem !important; }
.py-2 { padding-top: 0.625rem !important; padding-bottom: 0.625rem !important; }
.py-3 { padding-top: 0.9375rem !important; padding-bottom: 0.9375rem !important; }
.py-4 { padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
.py-5 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
@media (min-width: 576px) {
    .container {
        max-width:540px
    }
}

@media (min-width: 768px) {
    .container{
        max-width:720px
    }
}

@media (min-width: 992px) {
    .container{
        max-width:960px
    }
}

@media (min-width: 1200px) {
    .container{
        max-width:1140px
    }
}

@media (min-width: 1400px) {
    .container{
        max-width:1320px
    }
}

/* --- CONTAINER SİSTEMİ --- */
.container, .container-fluid {
    width: 100%;
    padding-right: 10px; /* 10px */
    padding-left: 10px;  /* 10px */
    margin-right: auto;
    margin-left: auto;
}

.row {
    --kagan-gutter-x: 20px;  /* 20px → yarısı 10px */
    --kagan-gutter-y: 20px;  /* satır arası boşluk da 20px */
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--kagan-gutter-y));
    margin-right: -10px;     /* konteyner padding’ini sıfırlar */
    margin-left: -10px;
}

.row > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: 10px;     /* net 10px */
    padding-left: 10px;      /* net 10px */
    margin-top: var(--kagan-gutter-y);
}

/* --- YAN YANA KAÇ KUTU GELECEĞİNİ BELİRTEN ANA SINIFLAR (FLEXBOX UYUMLU) --- */
.row-cols-1 > * { flex: 0 0 auto; width: 100%; }
.row-cols-2 > * { flex: 0 0 auto; width: 50%; }
.row-cols-3 > * { flex: 0 0 auto; width: 33.33333333%; }
.row-cols-4 > * { flex: 0 0 auto; width: 25%; }
.row-cols-5 > * { flex: 0 0 auto; width: 20%; }
.row-cols-6 > * { flex: 0 0 auto; width: 16.66666667%; }

/* --- RESPONSİVE (MOBİL UYUM) DESTEĞİ --- */
/* Ekran küçüldüğünde haberlerin üst üste binmemesi için */

@media (max-width: 992px) {
    /* Tablet boyutunda 3'lü ve 4'lü yapıları 2'ye düşür */
    .row-cols-3 > *, 
    .row-cols-4 > * {
        flex: 0 0 auto;
        width: 50%;
    }
}

@media (max-width: 768px) {
    /* Mobil boyutta tüm yapıları alt alta tek sütun yap */
    .row-cols-2 > *, 
    .row-cols-3 > *, 
    .row-cols-4 > *, 
    .row-cols-5 > *, 
    .row-cols-6 > * {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* --- SÜTUN TEMELLERİ --- */
[class*="col-"], .col {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: 0.625rem; /* 10px */
    padding-left: 0.625rem;  /* 10px */
    margin-top: var(--kagan-gutter-y, 0);
}

.col { flex: 1 0 0%; }
.col-auto { flex: 0 0 auto; width: auto; }

/* Gutter (Boşluk) Kontrolü */
.g-0, .gx-0, .gy-0 { --kagan-gutter-x: 0 !important; --kagan-gutter-y: 0 !important; }
.g-2, .gx-2 { --kagan-gutter-x: 1.25rem !important; } /* Tam 20px */
.g-2, .gy-2 { --kagan-gutter-y: 1.25rem !important; } /* Tam 10px */
.g-3, .gy-3 { --kagan-gutter-y: 1.5rem !important; }
.gy-4 {--kagan-gutter-y: 1.5rem; /* İstediğin alt boşluk miktarı (yaklaşık 24px) */}

/* Sağ bloğun (col-3) bu negatif marginden etkilenip kısalmaması için */
.align-items-stretch {
    align-items: stretch !important;
}
/* --- TAM LİSTE (Yüzdelik Sütunlar) --- */
/* Bootstrap standartlarında 12'lik sistem */
.col-1  { flex: 0 0 auto; width: 8.33333333%; }
.col-2  { flex: 0 0 auto; width: 16.66666667%; }
.col-3  { flex: 0 0 auto; width: 25%; }
.col-4  { flex: 0 0 auto; width: 33.33333333%; }
.col-5  { flex: 0 0 auto; width: 41.66666667%; }
.col-6  { flex: 0 0 auto; width: 50%; }
.col-7  { flex: 0 0 auto; width: 58.33333333%; }
.col-8  { flex: 0 0 auto; width: 66.66666667%; }
.col-9  { flex: 0 0 auto; width: 75%; }
.col-10 { flex: 0 0 auto; width: 83.33333333%; }
.col-11 { flex: 0 0 auto; width: 91.66666667%; }
.col-12 { flex: 0 0 auto; width: 100%; }

@media (min-width: 768px) {
    .col-md { flex !important: 1 0 0% !important; }
    .col-md-auto { flex: 0 0 auto !important; width: auto !important; }
}

@media (min-width: 992px) {
    .col-lg { flex: 1 0 0% !important; }
    .col-lg-auto { flex: 0 0 auto !important; width: auto !important; }
}
/* --- DISPLAY (GÖRÜNÜRLÜK) --- */
.d-none { display: none !important; }
.d-inline { display: inline !important; }
.d-inline-block { display: inline-block !important; }
.d-block { display: block !important; }
.d-grid { display: grid !important; }
.d-flex { display: flex !important; }
.d-inline-flex { display: inline-flex !important; }

/* Responsive Display (Örn: Mobilde gizle, Masaüstünde göster) */
@media (min-width: 768px) {
    .d-md-none { display: none !important; }
    .d-md-block { display: block !important; }
    .d-md-flex { display: flex !important; }
}

@media (min-width: 992px) {
    .d-lg-none { display: none !important; }
    .d-lg-block { display: block !important; }
}

/* Yatayda Hizalama */
.justify-content-start { justify-content: flex-start !important; }
.justify-content-end { justify-content: flex-end !important; }
.justify-content-center { justify-content: center !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-around { justify-content: space-around !important; }

/* Dikeyde Hizalama (Satır yüksekliği içindeki konum) */
.align-items-start { align-items: flex-start !important; }
.align-items-end { align-items: flex-end !important; }
.align-items-center { align-items: center !important; }
.align-items-baseline { align-items: baseline !important; }
.align-items-stretch { align-items: stretch !important; }

.flex-row { flex-direction: row !important; }
.flex-column { flex-direction: column !important; }
.flex-wrap { flex-wrap: wrap !important; }
.flex-nowrap { flex-wrap: nowrap !important; }

/* --- FONT BOYUTLARI (Typography) --- */
.h1, h1 { font-size: 2.5rem !important; }
.h2, h2 { font-size: 2rem !important; }
.h3, h3 { font-size: 1.75rem !important; }
.h4, h4 { font-size: 1.5rem !important; }
.h5, h5 { font-size: 1.25rem !important; }
.h6, h6 { font-size: 1rem !important; }

/* Küçük Metinler */
.small { font-size: 0.875rem !important; }

/* =========================================
   SMYRNA PRO TİPOGRAFİ (TYPOGRAPHY) SİSTEMİ
   ========================================= */

/* --- FONT BOYUTLARI (FONT SIZES) --- */
/* 16px kök boyutu referans alınmıştır (1rem = 16px) */

.fs-1  { font-size: 2.5rem   !important; }   /* 40px */
.fs-2  { font-size: 2.375rem !important; }   /* 38px */
.fs-3  { font-size: 2.25rem  !important; }   /* 36px */
.fs-4  { font-size: 2.125rem !important; }   /* 34px */
.fs-5  { font-size: 2rem     !important; }   /* 32px */
.fs-6  { font-size: 1.875rem !important; }   /* 30px */
.fs-7  { font-size: 1.75rem  !important; }   /* 28px */
.fs-8  { font-size: 1.625rem !important; }   /* 26px */
.fs-9  { font-size: 1.5rem   !important; }   /* 24px */
.fs-10 { font-size: 1.375rem !important; }   /* 22px */
.fs-11 { font-size: 1.25rem  !important; }   /* 20px */
.fs-12 { font-size: 1.125rem !important; }   /* 18px */
.fs-13 { font-size: 1rem     !important; }   /* 16px (body ile aynı) */
.fs-14 { font-size: 0.875rem !important; }   /* 14px */
.fs-15 { font-size: 0.75rem  !important; }   /* 12px */
.fs-16 { font-size: 0.625rem !important; }   /* 10px */

/* === 0.5px adımlı letter-spacing sınıfları (rem) === */
.ls-n2   { letter-spacing: -0.125rem; }
.ls-n1_5 { letter-spacing: -0.09375rem; }
.ls-n1   { letter-spacing: -0.0625rem; }
.ls-n0_5 { letter-spacing: -0.03125rem; }
.ls-0    { letter-spacing: 0; }
.ls-0_5  { letter-spacing: 0.03125rem; }
.ls-1    { letter-spacing: 0.0625rem; }
.ls-1_5  { letter-spacing: 0.09375rem; }
.ls-2    { letter-spacing: 0.125rem; }
.ls-2_5  { letter-spacing: 0.15625rem; }
.ls-3    { letter-spacing: 0.1875rem; }

@media (min-width: 768px) {
  .ls-md-n2   { letter-spacing: -0.125rem; }
  .ls-md-n1_5 { letter-spacing: -0.09375rem; }
  .ls-md-n1   { letter-spacing: -0.0625rem; }
  .ls-md-n0_5 { letter-spacing: -0.03125rem; }
  .ls-md-0    { letter-spacing: 0; }
  .ls-md-0_5  { letter-spacing: 0.03125rem; }
  .ls-md-1    { letter-spacing: 0.0625rem; }
  .ls-md-1_5  { letter-spacing: 0.09375rem; }
  .ls-md-2    { letter-spacing: 0.125rem; }
  .ls-md-2_5  { letter-spacing: 0.15625rem; }
  .ls-md-3    { letter-spacing: 0.1875rem; }
}

/* --- FONT KALINLIKLARI (FONT WEIGHTS) --- */
/* Not: Kullanılacak fontun (örneğin Roboto, Inter) bu ağırlıkları desteklemesi gerekir. */

.fw-lighter   { font-weight: lighter !important; }      /* Göreceli çok ince */
.fw-light     { font-weight: 300 !important; }          /* İnce */
.fw-normal    { font-weight: 400 !important; }          /* Standart (Regular - Gövde metni) */
.fw-medium    { font-weight: 500 !important; }          /* Orta (Medium) */
.fw-semibold  { font-weight: 600 !important; }          /* Yarı kalın (Semi-Bold) */
.fw-bold      { font-weight: 700 !important; }          /* Kalın (Bold - Başlıklar için standart) */
.fw-bolder    { font-weight: bolder !important; }       /* Göreceli çok kalın (Vurgulu manşetler) */


/* --- SATIR YÜKSEKLİKLERİ (LINE HEIGHTS) --- */
/* Not: Satır yükseklikleri birimsiz (unitless) yazılır. Kendi font boyutunun katı olarak hesaplanır. */

/* Standart Sistem */
.lh-1       { line-height: 1 !important; }       /* Sıfır boşluk (Yalnızca tek veya iki satırlık büyük manşetler için) */
.lh-sm      { line-height: 1.25 !important; }    /* Dar (Kart içindeki sıkışık spot metinler için) */
.lh-base    { line-height: 1.5 !important; }     /* Standart (Normal haber özetleri ve site içi paragraflar için) */
.lh-lg      { line-height: 2 !important; }       /* Geniş (İçerik yoğunluğunun az olduğu yerlerde) */

/* Smyrna Pro Ekstra Satır Yükseklikleri */
.lh-1-1     { line-height: 1.1 !important; }     /* .lh-1'in birbirine çok girdiği H1 manşetleri için ince ayar */
.lh-1-75    { line-height: 1.75 !important; }    /* Haber detay sayfasındaki "uzun okumalar" (makaleler) için göz yormayan ideal aralık */

/* Yazı Stilleri */
.fst-italic { font-style: italic !important; }
.text-decoration-none { text-decoration: none !important; }
.text-uppercase { text-transform: uppercase !important; }

/* --- YAZI RENKLERİ (Text Colors) --- */
.text-primary { color: var(--theme-primary) !important; } /* Senin İzmir/Aliağa mavisi tonun */
.text-secondary { color: var(--theme-secondary) !important; }
.text-success { color: var(--theme-success) !important; }
.text-danger { color: var(--theme-danger) !important; }
.text-warning { color: var(--theme-warning) !important; }
.text-info { color: var(--theme-info) !important; }
.text-white { color: var(--theme-white) !important; }
.text-dark { color: var(--theme-dark) !important; }
.text-muted { color: var(--theme-secondary) !important; } /* Yardımcı metin rengi */


/* Harf aralığı (letter-spacing) yardımcı sınıfları */
.ls-1 { letter-spacing: -0.05em; }
.ls-2   { letter-spacing: -0.025em; }
.ls-3  { letter-spacing: normal; }
.ls-4    { letter-spacing: 0.025em; }
.ls-5   { letter-spacing: 0.05em; }
.ls-6  { letter-spacing: 0.1em; }

/* --- TEXT SHADOW (METİN GÖLGELERİ) --- */

/* Hafif ve Modern: Genelde beyaz zemindeki siyah yazılara derinlik katmak için */
.ts-sm {text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);}
/* Standart Haber Başlığı: Gradyan üzerindeki beyaz yazılar için en ideali */
.ts-md {text-shadow: 2px 2px 2px rgba(0,0,0,0.9);}
/* Güçlü Gölge: Çok karışık veya çok parlak arka planlarda yazıyı öne çıkarmak için */
.ts-lg {text-shadow: 0px 4px 8px rgba(0, 0, 0, 0.8);}
/* Kontur Etkisi (Outline): Yazının etrafını ince bir hat gibi sarar */
.ts-outline {text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;}
/* Neon / Parıltı Efekti: Acil veya Flaş haberlerde dikkat çekmek için */
.ts-glow {text-shadow: 0 0 10px rgba(255, 255, 255, 0.8), 0 0 20px rgba(230, 57, 70, 0.5);}
/* --- ARKA PLAN RENKLERİ (Background Colors) --- */
.bg-primary { background-color: var(--theme-primary) !important; }
.bg-primary-dark { background-color: var(--theme-primary-dark) !important; }
.bg-secondary { background-color: var(--theme-secondary) !important; }
.bg-success { background-color: var(--theme-success) !important; }
.bg-danger { background-color: var(--theme-danger) !important; }
.bg-warning { background-color: var(--theme-warning) !important; }
.bg-info { background-color: var(--theme-info) !important; }
.bg-white { background-color: var(--theme-white) !important; }
.bg-light { background-color: var(--theme-light) !important; } /* Panel zeminleri için */
.bg-dark { background-color: var(--theme-dark) !important; }
.bg-transparent { background-color: transparent !important; }

/* --- BORDERS (Kenarlıklar) --- */
.border         { border: 1px solid #dee2e6 !important; }
.border-top     { border-top: 1px solid #dee2e6 !important; }
.border-right   { border-right: 1px solid #dee2e6 !important; }
.border-bottom  { border-bottom: 1px solid #dee2e6 !important; }
.border-left    { border-left: 1px solid #dee2e6 !important; }
.border-0       { border: 0 !important; }

/* Kenarlık Renkleri */
.border-primary   { border-color: var(--theme-primary) !important; }
.border-secondary { border-color: var(--theme-secondary) !important; }
.border-success   { border-color: var(--theme-success) !important; }
.border-danger    { border-color: var(--theme-danger) !important; }
.border-white     { border-color: var(--theme-white) !important; }

/* Kenarlık Kalınlığı */
.border-1 { border-width: 1px !important; }
.border-2 { border-width: 2px !important; }
.border-3 { border-width: 3px !important; }

/* --- SHADOWS (Gölgeler) --- */
.shadow-none { box-shadow: none !important; }

/* Küçük gölge (Hafif bir belirginlik) */
.shadow-sm { 
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important; 
}

/* Standart gölge (Kartlar ve paneller için ideal) */
.shadow { 
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important; 
}

/* Büyük gölge (Modal veya açılır menüler için) */
.shadow-lg { 
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important; 
}

/* --- BORDER RADIUS (Köşe Ovalığı) --- */
.rounded-0 { border-radius: 0 !important; overflow: hidden !important; }
.rounded-1 { border-radius: 0.2rem !important; overflow: hidden !important; }
.rounded { border-radius: 0.25rem !important; overflow: hidden !important; } /* Standart Buton/Kart */
.rounded-3 { border-radius: 0.3rem !important; overflow: hidden !important; }
.rounded-4 { border-radius: 0.5rem !important; overflow: hidden !important; }
.rounded-5 { border-radius: 1rem !important; overflow: hidden !important; }
.rounded-circle { border-radius: 50% !important; overflow: hidden !important; } /* Profil resimleri için */
.rounded-pill { border-radius: 50rem !important; overflow: hidden !important; } /* Oval butonlar/etiketler */

/* Sadece Belirli Köşeler */
.rounded-top { border-top-left-radius: 0.25rem !important; border-top-right-radius: 0.25rem !important; }
.rounded-bottom { border-bottom-left-radius: 0.25rem !important; border-bottom-right-radius: 0.25rem !important; }


/** BUTONLAR **/
.btn {
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    border-radius: 0.25rem; /* Az önce yaptığımız rounded-2 ile uyumlu */
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

/* Tıklanma ve Odaklanma Efekti */
.btn:focus {
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(0, 75, 135, 0.25); /* Primary renginin şeffaf hali */
}

.btn:disabled, .btn.disabled {
    pointer-events: none;
    opacity: .65;
}
/* Primary (Kagan Mavi) */
.btn-primary {
    color: var(--theme-white);
    background-color: var(--theme-primary);
    border-color: var(--theme-primary);
}
.btn-primary:hover {
    background-color: var(--theme-primary);
    border-color: var(--theme-primary);
}

/* Success (Kaydet/Aktif) */
.btn-success {
    color: var(--theme-white);
    background-color: var(--theme-success);
    border-color: var(--theme-success);
}
.btn-success:hover {
    background-color: rgba(var(--theme-success), .7);
    border-color: rgba(var(--theme-success), .7);
}

/* Danger (Sil/İptal) */
.btn-danger {
    color: var(--theme-white);
    background-color: var(--theme-danger);
    border-color: var(--theme-danger);
}
.btn-danger:hover {
    background-color: rgba(var(--theme-danger), .7);
    border-color: rgba(var(--theme-danger), .7);
}
.btn-outline-primary {
    color: var(--theme-primary);
    border-color: var(--theme-primary);
}
.btn-outline-primary:hover {
    color: var(--theme-white);
    background-color: var(--theme-primary);
}

.btn-outline-danger {
    color: var(--theme-danger);
    border-color: var(--theme-danger);
}
.btn-outline-danger:hover {
    color: var(--theme-white);
    background-color: rgba(var(--theme-danger), .7);
}
/* Küçük Buton (Tablolar için ideal) */
.btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    border-radius: 0.2rem;
}

/* Büyük Buton */
.btn-lg {
    padding: 0.5rem 1rem;
    font-size: 1.25rem;
    border-radius: 0.3rem;
}

.flex-center {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Sadece Yatayda (X) Ortala */
.flex-x-center {
    display: flex !important;
    justify-content: center !important;
}

/* Sadece Dikeyde (Y) Ortala */
.flex-y-center {
    display: flex !important;
    align-items: center !important;
}

.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #dee2e6;
    appearance: none;
    border-radius: 0.375rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

/* İnput'a tıklandığında (Mavi odaklanma efekti) */
.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: #004B87; /* Senin Primary Rengin */
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(0, 75, 135, 0.25);
}
/* --- TEXT ALIGNMENT --- */
.text-start   { text-align: left !important; }   /* Sol (X) */
.text-end     { text-align: right !important; }  /* Sağ (X) */
.text-center  { text-align: center !important; } /* Orta (X) */
.text-justify { text-align: justify !important; }

/* --- BADGES (ROZETLER) - TEMEL YAPI --- */
.badge {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-size: 0.75em; /* Varsayılan (Standart) Boyut */
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.375rem; /* rounded-2 ile uyumlu */
}

/* --- BADGE BOYUTLARI (SIZE MODIFIERS) --- */

/* Küçük Rozet (Small) - Tarihler, küçük etiketler veya mobil görünümler için */
.badge-sm {
    font-size: 0.65em;
    padding: 0.25em 0.5em;
    border-radius: 0.25rem; /* Küçük yapıya uygun daha dar kavis */
}

/* Orta Rozet (Medium) - Normal metinlerle aynı boyutta hizalamak için */
.badge-md {
    font-size: 0.85em;
    padding: 0.4em 0.75em;
}

/* Büyük Rozet (Large) - Öne çıkan "Sondakika", "Flaş Haber" gibi vurgular için */
.badge-lg {
    font-size: 1em; /* Bulunduğu alanın font boyutuyla birebir aynı büyüklükte */
    padding: 0.5em 0.9em;
    border-radius: 0.5rem; /* Büyük yapıya uygun daha yumuşak kavis */
}

/* Boş (Metinsiz) Badge - Örn: Bildirim noktası */
.badge:empty {
    display: none;
}

/* Yuvarlak Badge (Hap Stilinde) */
.badge-pill {
    padding-right: 0.6em;
    padding-left: 0.6em;
    border-radius: 50rem;
}

/* --- OUTLINE BADGES --- */
.badge-outline-primary {
    color: var(--theme-primary);
    border: 1px solid var(--theme-primary);
    background-color: transparent;
}

.badge-outline-success {
    color: var(--theme-success);
    border: 1px solid var(--theme-success);
    background-color: transparent;
}

.badge-outline-danger {
    color: var(--theme-danger);
    border: 1px solid var(--theme-danger);
    background-color: transparent;
}

.badge-outline-secondary {
    color: #6c757d;
    border: 1px solid #6c757d;
    background-color: transparent;
}

/* Üzerine gelince dolması için küçük bir efekt (Opsiyonel) */
.badge-outline-primary:hover {
    background-color: rgba(var(--theme-primary),.7);
    color: var(--theme-white);
    transition: 0.3s;
}

/* --- BREADCRUMB --- */
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    list-style: none;
    background-color: var(--theme-light); /* bg-light ile aynı */
    border-radius: 0.375rem;
}

.breadcrumb-item {
    display: flex;
    align-items: center;
    font-size: 0.9rem;
    color: #6c757d;
}

/* Ayırıcı işaret (Slash /) */
.breadcrumb-item + .breadcrumb-item::before {
    display: inline-block;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    color: #adb5bd;
    content: "/"; /* Burayı ">" veya "\" olarak değiştirebilirsin */
}

.breadcrumb-item a {
    color: var(--theme-primary);
    text-decoration: none;
}

.breadcrumb-item a:hover {
    text-decoration: underline;
}

.breadcrumb-item.active {
    color: #495057;
    font-weight: 600;
}

/* --- GENİŞLİK (WIDTH) --- */
.w-25  { width: 25%  !important; }
.w-50  { width: 50%  !important; }
.w-75  { width: 75%  !important; }
.w-100 { width: 100% !important; }
.w-auto { width: auto !important; }

/* --- YÜKSEKLİK (HEIGHT) --- */
.h-25  { height: 25%  !important; }
.h-50  { height: 50%  !important; }
.h-75  { height: 75%  !important; }
.h-100 { height: 100% !important; }
.h-auto { height: auto !important; }

/* --- OPASİTE (OPACITY) --- */
.opacity-0   { opacity: 0    !important; }
.opacity-25  { opacity: 0.25 !important; }
.opacity-50  { opacity: 0.5  !important; }
.opacity-75  { opacity: 0.75 !important; }
.opacity-100 { opacity: 1    !important; }

/* --- TEMEL POZİSYONLAR --- */
.position-static   { position: static !important; }   /* Varsayılan akış */
.position-relative { position: relative !important; } /* Kafes: Absolute olanları içinde tutar */
.position-absolute { position: absolute !important; } /* Özgür: En yakın relative ebeveyne göre konumlanır */
.position-fixed    { position: fixed !important; }    /* Sabit: Ekranın (viewport) bir yerine çivilenir */
.position-sticky   { position: sticky !important; }   /* Yapışkan: Kaydırınca belirlenen yerde asılı kalır */

/* --- KENARLAR (0, 50, 100 - % BAZLI) --- */
/* Üst ve Alt */
.top-0      { top: 0 !important; }
.top-25     { top: 25% !important; }
.top-50     { top: 50% !important; }
.top-75     { top: 75% !important; }
.top-100    { top: 100% !important; }

.bottom-0   { bottom: 0 !important; }
.bottom-25  { bottom: 25% !important; }
.bottom-50  { bottom: 50% !important; }
.bottom-75  { bottom: 75% !important; }
.bottom-100 { bottom: 100% !important; }

/* Sol (Start) ve Sağ (End) */
.start-0    { left: 0 !important; }
.start-25   { left: 25% !important; }
.start-50   { left: 50% !important; }
.start-75   { left: 75% !important; }
.start-100  { left: 100% !important; }

.end-0      { right: 0 !important; }
.end-25     { right: 25% !important; }
.end-50     { right: 50% !important; }
.end-75     { right: 75% !important; }
.end-100    { right: 100% !important; }

/* --- SABİT BOŞLUKLAR (REM BAZLI STANDART SKALA) --- */
/* Not: Varsayılan değerlerde 1rem = 16px olarak hesaplanmıştır */

/* Top (Üstten Boşluk) */
.top-1 { top: 0.25rem !important; }   /* ~4px */
.top-2 { top: 0.5rem !important; }    /* ~8px */
.top-3 { top: 1rem !important; }      /* ~16px */
.top-4 { top: 1.5rem !important; }    /* ~24px */

/* Bottom (Alttan Boşluk) */
.bottom-1 { bottom: 0.25rem !important; }
.bottom-2 { bottom: 0.5rem !important; }
.bottom-3 { bottom: 1rem !important; }
.bottom-4 { bottom: 1.5rem !important; }

/* Start (Soldan Boşluk) */
.start-1 { left: 0.25rem !important; }
.start-2 { left: 0.5rem !important; }
.start-3 { left: 1rem !important; }
.start-4 { left: 1.5rem !important; }

/* End (Sağdan Boşluk) */
.end-1 { right: 0.25rem !important; }
.end-2 { right: 0.5rem !important; }
.end-3 { right: 1rem !important; }
.end-4 { right: 1.5rem !important; }

/* --- ÖZEL İHTİYAÇLAR (Spesifik 10px Karşılığı) --- */
/* Eğer sistemde tam olarak 10px arayışın varsa bu sınıfları kullanabilirsin */
.top-10px   { top: 0.625rem !important; }   /* Tam olarak 10px karşılığı */
.start-10px { left: 0.625rem !important; }
.bottom-10px { bottom: 0.625rem !important; }
.end-10px   { right: 0.625rem !important; }
/* --- MERKEZLEME YARDIMCILARI --- */
/* Elementi kendi boyutu kadar geri çeker */
.translate-middle {
    transform: translate(-50%, -50%) !important;
}

.translate-middle-x {
    transform: translateX(-50%) !important;
}

.translate-middle-y {
    transform: translateY(-50%) !important;
}

/* FİNAS VERİLERİ */
.finance-widget{}
.finance-widget .up{ color: var(--theme-success); }
.finance-widget .down{ color: var(--theme-danger); }