/* =====================================================================
   📁 Dosya: /assets/css/footer-legal.css
   🎨 Amaç:
      AllImageLab ana sayfa UI tasarımını oluşturur.
      Header, Mega Menü, Hero, Grid, Promo, Footer ve mobil tasarımı içerir.

   ✔ Tek satır HEADER için optimize edildi
   ✔ Mega menu gap fix + hover stabilizasyonu
   ✔ 9 noktali apps menü eklendi
   ✔ Mobil menü + hamburger tam uyumlu
   ✔ Dark/Light uyumu tamamlandı
   ===================================================================== */
html {
    overflow-y: scroll;
}


/* =====================================================================
   TEMA RENK PALETİ — Global değişkenler
   ===================================================================== */
:root {
    --dark-bg: #0C1B33;
    --primary-blue: #3577FF;
    --mint: #1DD1A1;
    --white: #FFFFFF;
    --text-dark: #0C1B33;
    --text-light: #7A869F;
	
    /* 🔧 Legal Sayfaları İçin Eklenen Değişkenler */
    --heading-color: #0C1B33; /* Açık mod başlık rengi */
    --text-color: #4a4a4a;    /* Açık mod metin rengi */
    --muted-text: #888888;    /* Açık mod silik metin rengi */
	
}

/* =====================================================================
   BODY — Tema başlangıcı
   ===================================================================== */
body {
    margin: 0;
    font-family: "Poppins", sans-serif;
    background: var(--white);
    color: var(--text-dark);

    /* ⚠️ Flicker fix */
    transition: none;
}


body.dark {
    background: var(--dark-bg);
    color: var(--white);
}








/* ============================================================
   🧾 LEGAL PAGES (privacy, terms, refund, cookie)
   Dark / Light / Mobile Uyumlu - SÜRÜM 2 (Değişken Düzenlemeli)
============================================================ */
.legal-page {
    width: 100%;
    min-height: 60vh;
    box-sizing: border-box;

    /* ⚡ İlk render kilidi */
    opacity: 1;
    transition: none;
}
.legal-page .container {
    max-width: 850px;
    margin: 12px auto;
    padding: 10px 20px 5px 20px;

    /* 🎯 Renkler sabit */
    background: var(--white);
    color: var(--text-color);

    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);

    /* ⚠️ Flicker fix */
    transition: none;
}


/* DARK MODE AYARLARI */
body.dark .legal-page .container {
    background: #0F2244;
    color: #C8D2E3;

    border: 1px solid #253f72;
    box-shadow: none;

    /* ⚠️ Geçiş yok */
    transition: none;
}


/* Değişkenleri dark mode içinde güncelleyelim */
body.dark {
    --heading-color: #FFFFFF; /* Koyu modda başlık beyaz */
    --text-color: #C8D2E3;    /* Koyu modda metin açık gri */
    --muted-text: #7A869F;    /* Koyu modda silik metin */
}

/* Başlıklar */
.legal-page h1 {
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    margin-bottom: 14px;
    font-weight: 700;
    color: var(--heading-color);
    padding-bottom: 16px;
    border-bottom: 2px solid rgba(0,0,0,0.05);
}
body.dark .legal-page h1 {
    border-bottom: 2px solid rgba(255,255,255,0.1);
}

.legal-page h2 {
    font-size: 1.35rem;
    margin-top: 16px;
    margin-bottom: 12px;
    font-weight: 600;
    color: var(--heading-color);
}

/* Metinler */
.legal-page p {
    font-size: 1rem;
    line-height: 1.75;
    color: var(--text-color);
    margin-bottom: 16px;
}

/* Alt bilgi */
.legal-page .muted {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid rgba(0,0,0,0.1);
    font-size: 0.85rem;
    color: var(--muted-text);
}
body.dark .legal-page .muted {
    border-top: 1px solid rgba(255,255,255,0.1);
}

/* =========================================
   📱 MOBİL GÖRÜNÜM (768px ve altı - Tablet Dahil)
   ========================================= */
@media (max-width: 768px) {
    .legal-page .container {
        margin: 24px 12px;
        padding: 28px 18px;

        /* ⚡ Mobil flicker fix */
        transition: none;
    }
    .legal-page h1 {
        font-size: 1.6rem;
        margin-bottom: 20px;
    }
    .legal-page h2 {
        font-size: 1.2rem;
        margin-top: 24px;
    }
    .legal-page p {
        font-size: 0.95rem;
        line-height: 1.65;
    }
}

