/* Mevcut CSS'inin en altına veya ilgili kısmına bunu yapıştır Halil */

/* Mobil Responsive İnce Ayarlar */
@media (max-width: 768px) {
    /* Navbar ve Logo Ayarı */
    .navbar-brand img {
        height: 60px !important; /* 70px bazen çok büyük kalabiliyor, 60 tam idealdir */
        width: auto !important;
        max-width: 160px !important;
    }
    
    .navbar-brand {
        font-size: 1.2rem !important;
    }

    /* Ürün Kartı Genel Alanı */
    .premium-card {
        padding: 8px !important; /* Daha fazla yer kazanalım */
    }

    /* Ürün Başlığı (Model İsmi) */
    .premium-card h6 {
        font-size: 0.85rem !important;
        line-height: 1.2;
        min-height: 34px; /* 2 satır yüksekliği garantiler, hizayı bozmaz */
        display: -webkit-box;
        -webkit-line-clamp: 2; /* Çok uzunsa 2. satırda kessin */
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: 8px !important;
    }

    /* KRİTİK DÜZELTME: Hafıza ve Pil Alanı */
    .spec-text {
        display: flex !important;
        flex-direction: row !important; /* Alt alta binmeyi engeller */
        justify-content: flex-start !important;
        gap: 8px !important; /* Aradaki boşluğu netleştirelim */
        font-size: 0.75rem !important;
        margin-bottom: 12px !important;
        white-space: nowrap; /* Yazıları tek satıra zorlar */
    }

    .spec-text span {
        display: flex;
        align-items: center;
        background: #f1f5f9; /* Hafif bir arka plan çok şık durur */
        padding: 2px 6px;
        border-radius: 6px;
    }

    /* Fiyat Alanı */
    .price-text {
        font-size: 1.1rem !important;
        font-weight: 800 !important;
        margin-bottom: 10px !important;
        color: #0f172a !important;
    }

    /* Buton Ayarı */
    .btn-success {
        padding: 8px 5px !important;
        font-size: 0.8rem !important;
        border-radius: 12px !important;
    }

    /* Ürün Detay Sayfası Optimizasyonu */
    .display-5 {
        font-size: 1.6rem !important;
        text-align: center;
    }
    
    /* Detayda kutucuklar (7. kutu sorunu olan yer) */
    .spec-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* Mobilde 2'li sıra en temizi */
        gap: 10px !important;
    }
}

/* Footer'ı En Alta Sabitleyen Sihirli Dokunuş */
html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
}

main, .content, .container {
    flex: 1 0 auto; /* İçerik az olsa da footer'ı aşağı iter */
}

footer {
    flex-shrink: 0;
}