/* ============================================================
   Ment Event — düzen (layout) düzeltmeleri
   Zaira temasının ÜZERİNE yüklenir. Tema dosyaları değiştirilmez,
   böylece tema güncellemesinde bu düzeltmeler kaybolmaz.
   ============================================================ */

/* ------------------------------------------------------------
   1) Yatay taşma koruması
   overflow-x:clip kullanıyoruz; "hidden" olsaydı sayfada scroll
   konteyneri oluşup .sidebar-wrap'teki position:sticky bozulurdu.
   ------------------------------------------------------------ */
body {
    overflow-x: clip;
}

/* ------------------------------------------------------------
   2) Uzun / boşluksuz kelimeler satırı taşırmasın
   (uzun etkinlik adları, URL'ler, birleşik Türkçe başlıklar)
   ------------------------------------------------------------ */
.post-title,
.post-title a,
.section-title .title,
.widget-title .title,
.blog-post-meta li {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* ------------------------------------------------------------
   3) Kart başlıklarını sabit satır sayısına kilitle
   Asıl "düzen kayması" sebebi buydu: 1 satırlık başlıkla 3
   satırlık başlık kartlara farklı yükseklik veriyor, ızgara
   merdiven gibi kayıyordu. 2 satır sabitleniyor + yer rezerve
   ediliyor (lh birimi = elemanın kendi satır yüksekliği).
   ------------------------------------------------------------ */
.featured-post-content .post-title,
.weekly-post-content .post-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2lh;
}

/* Öne çıkan büyük post daha uzun başlık taşıyabilir */
.latest-post-item.big-post .featured-post-content .post-title {
    -webkit-line-clamp: 3;
    line-clamp: 3;
    min-height: 0;
}

/* ------------------------------------------------------------
   4) Kategori/blog ızgarasında kartlar eşit yükseklikte olsun
   ------------------------------------------------------------ */
.weekly-post-item-wrap-three > .row {
    align-items: stretch;
}
.weekly-post-item-wrap-three > .row > [class*="col-"] {
    display: flex;
}
.weekly-post-three {
    display: flex;
    flex-direction: column;
    width: 100%;
}
.weekly-post-three .weekly-post-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

/* ------------------------------------------------------------
   5) "Yaklaşan Etkinlikler" slider'ında slaytlar eşit yükseklikte
   Slick varsayılan olarak float kullanır; başlık uzunluğu farklı
   olduğunda slaytlar dikeyde kayıyordu.
   ------------------------------------------------------------ */
.featured-post-active .slick-track {
    display: flex;
    align-items: stretch;
}
.featured-post-active .slick-slide {
    float: none;
    height: auto;
    flex-shrink: 0;   /* slick genişliği inline veriyor, ezilmesin */
}
.featured-post-active .slick-slide > div,
.featured-post-active .featured-post-item {
    height: 100%;
}

/* ------------------------------------------------------------
   6) Mobil menü logosu taşmasın / orantısı bozulmasın
   ------------------------------------------------------------ */
.mobile-menu .nav-logo img,
.offCanvas-logo img {
    max-width: 150px;
    width: auto;
    height: auto;
    max-height: 60px;
    object-fit: contain;
}

/* ------------------------------------------------------------
   7) MOBİL NAVBAR
   Tema mobilde şu hale geliyordu:
     .menu-wrap (flex) = [ .row (flex-grow:1) ][ .mobile-nav-toggler ]
   .row içindeki 3 kolon da width:100% olduğu için alt alta diziliyor,
   ama ikisinin içi mobilde tamamen boşalıyor:
     - .header-left-side : .offcanvas-toggle <1200px'te display:none,
                           .navbar-wrap ise "d-none d-xl-flex" -> gizli
     - .header-right-side: arama <992px'te gizli,
                           giriş/kayıt "d-none d-md-block" -> <768px gizli
   Geriye 75px'lik kocaman logo ve 30px'lik çıplak hamburger ikonu
   kalıyordu; dengesiz duran kısım buydu.
   ------------------------------------------------------------ */
@media (max-width: 1199.98px) {
    /* İçi boşalan sol kolon yer kaplamasın */
    .menu-wrap .header-left-side {
        display: none;
    }
    .menu-wrap .header-right-side {
        padding-right: 0;   /* boş blokta duran 35px ölü boşluk */
    }

    .menu-area {
        padding: 10px 0;
    }

    /* Hamburger'i gerçek bir butona çevir: 44x44 dokunma hedefi
       (çıplak ikon yerine çerçeveli, logoyla dengeli bir kontrol) */
    .menu-area .mobile-nav-toggler {
        float: none;
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 44px;
        height: 44px;
        margin-left: 12px;
        font-size: 20px;
        border: 1px solid var(--tg-gray);
        border-radius: 8px;
        transition: background-color .2s ease, color .2s ease, border-color .2s ease;
    }
    .menu-area .mobile-nav-toggler:hover,
    .menu-area .mobile-nav-toggler:focus-visible,
    .mobile-menu-visible .menu-area .mobile-nav-toggler {
        background-color: var(--tg-primary-color);
        border-color: var(--tg-primary-color);
        color: var(--tg-white);
    }
}

@media (max-width: 767.98px) {
    /* İçi boşalan sağ kolon da gizlensin -> logo + toggle tek satırda kalır */
    .menu-wrap .header-right-side {
        display: none;
    }
    /* Tema inline style ile height:75px!important veriyor; 44px'lik
       toggle ile orantılı olsun diye 44px'e çekiyoruz. */
    .menu-area .logo img {
        height: 44px !important;
        width: auto;
        max-width: 100%;
    }
    .menu-area .logo.text-center {
        text-align: left !important;
    }
}

/* Üst şerit (Biz Kimiz / SSS / Takip Et) mobilde iki satıra bölünüp
   yer kaplıyordu; tek satırda ortalanıp sıkıştırılıyor. */
@media (max-width: 767.98px) {
    .header-top-wrap .row > [class*="col-"] {
        text-align: center;
    }
    .header-top-menu .list-wrap,
    .header-top-social .list-wrap {
        justify-content: center;
    }
    .header-top-wrap {
        font-size: 13px;
    }
}

/* ------------------------------------------------------------
   8) Görseller hiçbir yerde konteyneri taşırmasın
   ------------------------------------------------------------ */
.blog-details-content img,
.weekly-post-content img,
.featured-post-content img {
    max-width: 100%;
    height: auto;
}

/* ------------------------------------------------------------
   9) Anasayfa sağ sidebar ("Takipte kalın" bölümü)
   Sol kolon ~800px içerik taşırken sidebar'da tek bir Instagram
   linki vardı ve altında büyük bir boşluk kalıyordu. Sidebar artık
   içerik + CTA + sosyal olarak dolduruldu; buradaki stiller o
   bloğun tema ile uyumlu görünmesi için.
   ------------------------------------------------------------ */

/* .btn ile .sidebar-newsletter arka planı aynı değişkeni (--tg-secondary-color)
   kullanıyor; siyah kartın üstünde siyah buton kayboluyordu. */
.sidebar-cta .btn {
    background: var(--tg-white);
    color: var(--tg-secondary-color);
    padding: 15px 34px;
}
.sidebar-cta .btn:hover {
    background: var(--tg-primary-color);
    color: var(--tg-white);
    box-shadow: inset 0 0 0 1px var(--tg-white);
}
[tg-theme=dark] .sidebar-cta .btn:hover {
    background: var(--tg-teal);
    color: var(--tg-white);
}

/* Form yerine tek buton durduğu için alt boşluk fazlaydı */
.sidebar-cta {
    padding-bottom: 40px;
}
.sidebar-cta p {
    margin-bottom: 24px;
}
.sidebar-cta .title {
    font-size: 21px;
    line-height: 1.35;
    margin-bottom: 14px;
}

/* Sidebar sosyal butonu tek satırda tam genişlik kaplasın */
.sidebar-wrap .sidebar-social-wrap .list-wrap li {
    width: 100%;
}
.sidebar-wrap .sidebar-social-wrap .list-wrap li a {
    width: 100%;
    min-width: 0;
}

/* Sidebar'daki liste görselleri sabit oranda kalsın (kayma olmasın) */
.popular-post .thumb img {
    width: 100%;
    height: 80px;
    object-fit: cover;
}
.popular-post .content .post-title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ------------------------------------------------------------
   10) Koyu temada hamburger görünmüyordu
   Tema: .menu-area .mobile-nav-toggler { color: var(--tg-primary-color) }
   ve --tg-primary-color koyu temada da #000000 kalıyor; body ise
   --tg-black (#0C1622). Yani siyah zeminde siyah ikon.
   ------------------------------------------------------------ */
[tg-theme=dark] .menu-area .mobile-nav-toggler {
    color: var(--tg-white);
}
[tg-theme=dark] .menu-area .mobile-nav-toggler:hover,
[tg-theme=dark] .menu-area .mobile-nav-toggler:focus-visible,
[tg-theme=dark] .mobile-menu-visible .menu-area .mobile-nav-toggler {
    background-color: var(--tg-white);
    border-color: var(--tg-white);
    color: var(--tg-black);
}

/* ============================================================
   11) İLETİŞİM SAYFASI
   Form kaldırıldı (çalışmıyordu: CSRF yok, alan adları uyuşmuyordu,
   mail yanlış firmaya gidiyordu). Yerine doğrudan e-posta.
   ============================================================ */
.contact-intro { margin-bottom: 50px; }
.contact-intro__title {
    font-size: 40px;
    line-height: 1.2;
    margin-bottom: 14px;
}
.contact-intro__lead {
    font-size: 17px;
    line-height: 1.7;
    max-width: 560px;
    margin: 0 auto 28px;
}
.contact-intro__btn {
    gap: 10px;
    font-size: 16px;
    padding: 18px 38px;
}
.contact-intro__btn i { font-size: 18px; }

.contact-cards { margin-bottom: 20px; }
.contact-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: 100%;
    margin-bottom: 24px;
    padding: 30px 28px;
    border: 1px solid var(--tg-border-color);
    border-radius: 12px;
    background: var(--tg-white);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
[tg-theme=dark] .contact-card {
    background: var(--tg-teal);
    border-color: var(--tg-border-dark);
}
.contact-card:hover {
    transform: translateY(-4px);
    border-color: var(--tg-heading-font-color);
    box-shadow: 0 14px 34px rgba(12, 22, 34, .10);
}
.contact-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px; height: 48px;
    border-radius: 10px;
    background: var(--tg-teal);
    color: var(--tg-heading-font-color);
    font-size: 20px;
    margin-bottom: 18px;
}
[tg-theme=dark] .contact-card__icon { background: rgba(255,255,255,.08); }
.contact-card__label {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--tg-paragraph-color);
    margin-bottom: 6px;
}
.contact-card__value {
    font-family: var(--tg-heading-font-family);
    font-size: 18px;
    font-weight: 800;
    color: var(--tg-heading-font-color);
    line-height: 1.35;
    overflow-wrap: anywhere;
    margin-bottom: 8px;
}
.contact-card__hint {
    font-size: 14px;
    line-height: 1.6;
    color: var(--tg-paragraph-color);
}

.contact-map__title {
    font-size: 26px;
    margin: 30px 0 20px;
}

@media (max-width: 767.98px) {
    .contact-intro__title { font-size: 29px; }
    .contact-intro__lead { font-size: 15.5px; }
    .contact-intro__btn { width: 100%; justify-content: center; padding: 17px 20px; font-size: 15px; }
    .contact-card { padding: 24px 20px; }
    .contact-card__value { font-size: 16px; }
}

/* ============================================================
   12) YASAL METİN SAYFALARI (KVKK / Çerez)
   ============================================================ */
.legal-doc {
    font-size: 16px;
    line-height: 1.8;
    color: var(--tg-paragraph-color);
}
.legal-doc__head {
    padding-bottom: 22px;
    margin-bottom: 30px;
    border-bottom: 1px solid var(--tg-border-color);
}
[tg-theme=dark] .legal-doc__head { border-color: var(--tg-border-dark); }
.legal-doc__title { font-size: 38px; line-height: 1.2; margin-bottom: 10px; }
.legal-doc__meta { font-size: 14px; color: var(--tg-paragraph-color); margin: 0; }
.legal-doc__lead {
    font-size: 18px;
    line-height: 1.75;
    color: var(--tg-heading-font-color);
    margin-bottom: 34px;
}
.legal-doc h2 {
    font-size: 22px;
    line-height: 1.35;
    margin: 40px 0 14px;
}
.legal-doc h3 {
    font-size: 18px;
    line-height: 1.4;
    margin: 28px 0 12px;
}
.legal-doc p { margin-bottom: 16px; }
.legal-doc ul { padding-left: 22px; margin-bottom: 18px; }
.legal-doc li { margin-bottom: 8px; list-style: disc; }
.legal-doc a { color: var(--tg-heading-font-color); text-decoration: underline; text-underline-offset: 2px; }
.legal-doc code {
    font-size: 14px;
    background: var(--tg-teal);
    padding: 2px 7px;
    border-radius: 4px;
    overflow-wrap: anywhere;
}
.legal-doc__btn { margin: 6px 0 10px; }

.legal-table-wrap { overflow-x: auto; margin: 0 0 26px; }
.legal-table {
    width: 100%;
    min-width: 480px;
    border-collapse: collapse;
    font-size: 15px;
}
.legal-table th,
.legal-table td {
    border: 1px solid var(--tg-border-color);
    padding: 12px 14px;
    text-align: left;
    vertical-align: top;
}
[tg-theme=dark] .legal-table th,
[tg-theme=dark] .legal-table td { border-color: var(--tg-border-dark); }
.legal-table th {
    background: var(--tg-teal);
    color: var(--tg-heading-font-color);
    font-weight: 700;
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    .legal-doc { font-size: 15.5px; }
    .legal-doc__title { font-size: 28px; }
    .legal-doc__lead { font-size: 16.5px; }
    .legal-doc h2 { font-size: 20px; margin-top: 32px; }
}

/* ============================================================
   13) ÜST ŞERİT — faydalı linkler (bilet platformu profilleri)
   ============================================================ */
.header-top-menu .list-wrap .htm-sep {
    width: 1px;
    height: 13px;
    background: currentColor;
    opacity: .28;
    align-self: center;
}
.header-top-menu .list-wrap .htm-ticket a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.header-top-menu .list-wrap .htm-ticket i {
    font-size: 12px;
    opacity: .85;
}
@media (max-width: 767.98px) {
    /* Mobilde ayraç gereksiz, satır zaten sarıyor */
    .header-top-menu .list-wrap .htm-sep { display: none; }
    .header-top-menu .list-wrap { gap: 6px 16px; }
}

/* ============================================================
   14) MÜSSED — anasayfa
   Tema Ment Event icin "yaklasan/gecmis etkinlik" kurgusundaydi.
   Dernek icin icerik ture gore gruplandi: oyunlar / projeler / kurumsal.
   ============================================================ */
.mussed-hero {
    border-bottom: 1px solid var(--tg-border-color);
}
[tg-theme=dark] .mussed-hero { border-color: var(--tg-border-dark); }

.mussed-hero__title {
    font-size: 40px;
    line-height: 1.18;
    margin-bottom: 18px;
}
.mussed-hero__lead {
    font-size: 17.5px;
    line-height: 1.75;
    max-width: 720px;
    margin: 0 auto 30px;
}
.mussed-hero__actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 26px;
}
.mussed-hero__actions .btn { padding: 17px 36px; }
.btn.btn-hollow {
    background: transparent;
    color: var(--tg-heading-font-color);
    box-shadow: inset 0 0 0 1px var(--tg-border-color);
}
.btn.btn-hollow:hover {
    background: var(--tg-heading-font-color);
    color: var(--tg-white);
}

.mussed-hero__stats {
    display: flex;
    gap: 28px;
    justify-content: center;
    flex-wrap: wrap;
    margin: 0;
    font-size: 14px;
    color: var(--tg-paragraph-color);
}
.mussed-hero__stats strong {
    color: var(--tg-heading-font-color);
    font-size: 17px;
    margin-right: 4px;
}

/* Bolum arasi ton farki */
.mussed-alt { background: var(--tg-teal); }

/* Kurumsal sayfa kartlari */
.mussed-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-bottom: 24px;
    padding: 26px 24px;
    border: 1px solid var(--tg-border-color);
    border-radius: 12px;
    background: var(--tg-white);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
[tg-theme=dark] .mussed-card {
    background: var(--tg-teal);
    border-color: var(--tg-border-dark);
}
.mussed-card:hover {
    transform: translateY(-4px);
    border-color: var(--tg-heading-font-color);
    box-shadow: 0 14px 32px rgba(12, 22, 34, .10);
}
.mussed-card__title {
    font-family: var(--tg-heading-font-family);
    font-size: 19px;
    font-weight: 800;
    color: var(--tg-heading-font-color);
    line-height: 1.35;
    margin-bottom: 10px;
}
.mussed-card__desc {
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--tg-paragraph-color);
    flex: 1 1 auto;
    margin-bottom: 14px;
}
.mussed-card__more {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--tg-heading-font-color);
}
.mussed-card__more::after { content: " →"; }

/* Oyun kartlarinda afis oranini sabit tut */
.weekly-post-three .weekly-post-thumb img { height: 260px; }

@media (max-width: 767.98px) {
    .mussed-hero__title { font-size: 28px; }
    .mussed-hero__lead  { font-size: 15.5px; }
    .mussed-hero__actions .btn { width: 100%; justify-content: center; }
    .mussed-hero__stats { gap: 16px; font-size: 13px; }
    .weekly-post-three .weekly-post-thumb img { height: 220px; }
}

/* Oyun/proje detay govdesi (arsivden gelen HTML) */
.mussed-body { font-size: 16.5px; line-height: 1.85; }
.mussed-body p { margin-bottom: 16px; }
.mussed-body img { max-width: 100%; height: auto; border-radius: 8px; margin: 10px 0 18px; }
.mussed-body a { text-decoration: underline; text-underline-offset: 2px; }
.blog-details-cat {
    font-size: 13px; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; margin-bottom: 20px;
}
.blog-details-cat a { color: var(--tg-paragraph-color); }