/* ===== Theme Color System (CSS vars) ===== */
:root{
  --clr-bg: #0f1220;
  --clr-card: #12162b;
  --clr-soft: #1b2142;
  --clr-text: #e6e8f2;
  --clr-muted:#9aa3b2;
  --clr-primary:#5b4cf0;
  --clr-primary-2:#7a6dff;
  --clr-accent:#13b0ff;
  --radius-xl:16px;
  --radius-lg:12px;
  --radius-md:10px;
  --shadow-1: 0 8px 24px rgba(0,0,0,.25);
  --shadow-2: 0 10px 30px rgba(0,0,0,.35);
}

/* Base */
body { background: var(--clr-bg); color: var(--clr-text); }
a { color: var(--clr-accent); }
a:hover, a:focus { color: #55c6ff; text-decoration: none; }

#front-wrapper .container,
#archive-wrapper .container,
#single-wrapper .container { padding-top: 1.25rem; padding-bottom: 2.5rem; }

/* Navbar (sticky gradient) */
.navbar { position: sticky; top:0; z-index: 1030; background: linear-gradient(90deg, #4c3de8, #6b5bff); }
.navbar-dark .navbar-brand, .navbar-dark .navbar-nav .nav-link { color: #fff; }
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { color: #e6e8f2; }
.navbar.is-scrolled { box-shadow: var(--shadow-1); }

/* Hero / Jumbotron */
.jumbotron { background: var(--clr-card); color: var(--clr-text); border-radius: var(--radius-xl); padding: 3rem 2rem; box-shadow: var(--shadow-1); }
.jumbotron .display-4 { font-weight: 700; letter-spacing: .2px; }
.jumbotron p.lead { color: var(--clr-muted); }

/* Cards */
.card { background: #0f1430; border: 1px solid rgba(255,255,255,.06); border-radius: var(--radius-lg); overflow: hidden; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-2); border-color: rgba(123,110,255,.35); }
.card .card-body { color: var(--clr-text); }
.card .text-muted { color: var(--clr-muted) !important; }
.card-img-top { aspect-ratio: 3/2; object-fit: cover; background: #0e1a2b; }

/* Buttons */
.btn { border-radius: 10px; }
.btn-primary { background: var(--clr-primary); border-color: var(--clr-primary); }
.btn-primary:hover, .btn-primary:focus { background: var(--clr-primary-2); border-color: var(--clr-primary-2); }
.btn-outline-primary { color:#fff; border-color: rgba(255,255,255,.25); }
.btn-outline-primary:hover{ background: rgba(255,255,255,.08); border-color:#fff; }

/* Utilities */
.badge { border-radius: 8px; }
hr { border-color: rgba(255,255,255,.08); }

/* Footer */
.site-footer, footer, .wrapper + footer { background: #0c0f1d; color: var(--clr-muted); }
.site-footer a { color: var(--clr-accent); }

/* Tables in sidebar */
.table { color: var(--clr-text); }
.table td, .table th { border-color: rgba(255,255,255,.07); }

/* Comments */
.comment-list .comment { background: var(--clr-soft); border-radius: var(--radius-md); padding: .75rem; }

/* Archive filters */
#archive-wrapper form.bg-light { background: var(--clr-card) !important; color: var(--clr-text); border-color: rgba(255,255,255,.08) !important; }
.custom-control-label { cursor: pointer; }

/* Rating stars spacing */
.small.text-warning i { margin-right: 2px; }

/* ===== Navbar mobile overflow fix ===== */
@media (max-width: 576px){
  /* Tüm satır tek satırda kalmasın, kırp/ellipsis uygula */
  .navbar { overflow-x: hidden; }
  .navbar .container, .navbar .container-fluid { flex-wrap: nowrap; }

  /* Marka alanı: toggler (hamburger) genişliğini hesaba kat */
  .navbar-brand {
    flex: 1 1 auto;
    min-width: 0;
    max-width: calc(100% - 56px); /* toggler ~ 40px + boşluk */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;          /* tek satır + ... */
    font-size: 1rem;              /* biraz küçült */
    line-height: 1.2;
    margin-right: .25rem;
  }

  /* Toggler sabit kalsın, çakışma olmasın */
  .navbar-toggler {
    flex: 0 0 auto;
    margin-left: .25rem;
  }
}

/* İstersen 2 satırda sar: sadece aşağıdaki iki satırı aç, yukarıdaki 'white-space: nowrap' satırını sil */
/*
@media (max-width: 576px){
  .navbar-brand { white-space: normal; word-break: break-word; text-overflow: clip; }
}
*/

/* Güvenli tarafta kal: olası yatay scroll'u tamamen engelle */
html, body { overflow-x: hidden; }
