/* --- Genel Sıfırlama ve Temel Ayarlar --- */
body, html {
    margin: 0;
    padding: 0;
    font-family: 'Poppins', sans-serif;
    background-color: #f4f7f6;
    color: #333;
    line-height: 1.6;
    scroll-behavior: smooth;
    height: 100%;
}

/* --- Yapışkan Footer (Sticky Footer) Çözümü --- */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.container {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 20px;
}

/* --- Header Stilleri --- */
.site-header {
    background-color: #ffffff;
    padding: 20px 0;
    border-bottom: 1px solid #e0e0e0;
}

.site-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo-image {
    max-height: 50px;
    width: auto;
}

.logo-group {
    display: flex;
    align-items: center;
    gap: 25px;
}

.logo-image--secondary {
    max-height: 40px;
}

/* --- Navigasyon Menüsü Stilleri --- */
.main-nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
}

.main-nav a {
    display: block;
    padding: 10px 15px;
    text-decoration: none;
    color: #333;
    font-weight: 600;
    border-radius: 5px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.main-nav a:hover {
    background-color: #f0f0f0;
}

.main-nav a.active {
    background-color: #3498db;
    color: #ffffff;
}

/* --- Ana Sayfa Görsel Alanı (Swiper Slider) Stilleri --- */
.hero-slider {
    width: 100%;
    height: 60vh;
    max-height: 550px;
    position: relative;
    background-color: #333;
}
/* ... Diğer slider stilleri ... */
.swiper { width: 100%; height: 100%; }
.hero-slide { background-size: cover; background-position: center center; display: flex; align-items: center; }
.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to right, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.2) 100%); }
.hero-content { position: relative; z-index: 2; color: #ffffff; text-align: left; width: 100%; max-width: 960px; margin-right: auto; margin-left: 10%; padding: 0 20px; box-sizing: border-box; transform: translateY(50px); }
.hero-content h1 { font-size: 36px; font-weight: 700; margin-bottom: 15px; text-shadow: 1px 1px 8px rgba(0,0,0,0.7); letter-spacing: -1px; }
.hero-content p { font-size: 16px; font-weight: 300; margin-bottom: 25px; line-height: 1.6; }
.button-hero { padding: 10px 30px; font-size: 14px; background-color: transparent; color: #fff; border: 2px solid #fff; font-weight: 600; transition: all 0.3s ease; border-radius: 30px; }
.button-hero:hover { background-color: #fff; color: #2c3e50; }
.swiper-button-next, .swiper-button-prev { color: #ffffff; opacity: 0.5; transition: opacity 0.3s ease; }
.swiper-button-next:hover, .swiper-button-prev:hover { opacity: 1; }
.swiper-pagination-bullet { background-color: rgba(255, 255, 255, 0.7); }
.swiper-pagination-bullet-active { background-color: #ffffff; }

/* --- Genel İçerik Bölümü Stilleri --- */
.content-section { padding: 60px 0; background-color: #ffffff; border-top: 1px solid #e0e0e0; text-align: center; }
.content-section:nth-child(even) { background-color: #f4f7f6; }
.content-section h2 { font-size: 36px; color: #2c3e50; margin-bottom: 10px; }
.section-subtitle { font-size: 18px; color: #7f8c8d; margin-bottom: 40px; font-weight: 300; }
.content-section p { max-width: 800px; margin: 0 auto; text-align: center; line-height: 1.8; }

/* --- Buton Stili --- */
.button { display: inline-block; background-color: #3498db; color: #ffffff; padding: 15px 30px; border-radius: 5px; text-decoration: none; font-weight: 600; transition: background-color 0.3s ease; font-size: 16px; border: none; cursor: pointer; }
.button:hover { background-color: #2980b9; }

/* --- Footer Stilleri --- */
.site-footer { background-color: #2c3e50; color: #ffffff; padding: 30px 0; text-align: center; flex-shrink: 0; }
/* ... Diğer footer stilleri ... */
.site-footer p { margin: 0; font-size: 14px; }
.social-icons { margin-top: 15px; }
.social-icons a { color: #ffffff; font-size: 22px; margin: 0 10px; text-decoration: none; transition: color 0.3s ease; }
.social-icons a:hover { color: #3498db; }

/* --- İletişim Sayfası Stilleri --- */
.contact-container { display: flex; flex-wrap: wrap; gap: 40px; text-align: left; margin-top: 40px; }
/* ... Diğer iletişim stilleri ... */
.details-column, .map-column { flex: 1; min-width: 300px; }
.contact-item { display: flex; align-items: flex-start; margin-bottom: 25px; }
.contact-item i { font-size: 24px; color: #3498db; margin-right: 20px; margin-top: 5px; width: 30px; text-align: center; }
.contact-item h3 { margin: 0 0 5px 0; font-size: 20px; color: #2c3e50; }
.contact-item p, .contact-item a { margin: 0; font-size: 16px; color: #555; text-decoration: none; }
.contact-item a:hover { text-decoration: underline; }
.map-column iframe { width: 100%; height: 100%; min-height: 400px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }

/* --- Forum/Blog Sayfası Stilleri --- */
.forum-controls { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; margin-bottom: 40px; margin-top: 20px; }
/* ... Diğer blog stilleri ... */
.search-bar { display: flex; border: 1px solid #ddd; border-radius: 8px; overflow: hidden; }
.search-bar input { border: none; padding: 10px 15px; font-size: 16px; outline: none; }
.search-bar button { border: none; background-color: #3498db; color: white; padding: 0 15px; cursor: pointer; font-size: 16px; }
.search-bar button:hover { background-color: #2980b9; }
.filter-tags a { text-decoration: none; color: #555; background-color: #f0f0f0; padding: 8px 15px; border-radius: 20px; margin-left: 10px; font-size: 14px; font-weight: 500; transition: all 0.3s ease; }
.filter-tags a:hover, .filter-tags a.active { background-color: #2c3e50; color: white; }
.blog-container { display: grid; grid-template-columns: 1fr; gap: 30px; margin-top: 40px; }
.blog-post { background-color: #ffffff; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.08); overflow: hidden; text-align: left; display: flex; flex-direction: column; transition: box-shadow 0.3s ease; }
.blog-post:hover { box-shadow: 0 8px 25px rgba(0,0,0,0.12); }
.post-image { flex-shrink: 0; }
.post-image img { width: 100%; height: 200px; object-fit: cover; display: block; }
.post-content { padding: 25px; display: flex; flex-direction: column; }
.post-title a { font-size: 22px; color: #2c3e50; text-decoration: none; font-weight: 600; }
.post-title a:hover { color: #3498db; }
.post-meta { font-size: 13px; color: #95a5a6; margin: 5px 0 15px 0; }
.post-excerpt { font-size: 16px; color: #333; line-height: 1.7; flex-grow: 1; }
.button-read-more { display: inline-block; margin-top: 20px; color: #3498db; text-decoration: none; font-weight: 600; align-self: flex-start; }
.button-read-more:hover { text-decoration: underline; }

/* --- Yazı Detay Sayfası Stilleri --- */
.single-post-layout { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: start; text-align: left; }
.single-post-image img { width: 100%; height: auto; border-radius: 8px; box-shadow: 0 8px 25px rgba(0,0,0,0.1); }
.article-title { font-size: 42px; color: #2c3e50; margin-top: 0; margin-bottom: 10px; line-height: 1.2; }
.article-meta { font-size: 14px; color: #95a5a6; margin-bottom: 30px; }
.article-content { font-size: 18px; line-height: 1.8; color: #333; }
.article-content h3 { font-size: 24px; color: #2c3e50; margin-top: 40px; }

/* --- Paketler Sayfası Stilleri --- */
.page-header { text-align: center; margin-bottom: 40px; border-bottom: 1px solid #e0e0e0; padding-bottom: 20px; }
.back-link { display: inline-block; margin-top: 10px; text-decoration: none; color: #3498db; font-weight: 600; }
.back-link:hover { text-decoration: underline; }
.text-category-container { display: grid; grid-template-columns: 1fr; gap: 20px; margin-top: 40px; max-width: 800px; margin-left: auto; margin-right: auto; }
.text-category-card { display: flex; justify-content: space-between; align-items: center; background-color: #ffffff; padding: 20px 25px; border: 1px solid #e0e0e0; border-radius: 8px; text-decoration: none; transition: all 0.3s ease; box-shadow: 0 4px 15px rgba(0,0,0,0.05); }
.text-category-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); border-color: #3498db; }
.text-category-card h4 { margin: 0; font-size: 18px; font-weight: 600; color: #2c3e50; }
.text-category-card i { font-size: 18px; color: #3498db; transition: transform 0.3s ease; }
.text-category-card:hover i { transform: translateX(5px); }
.package-search-container { max-width: 500px; margin: 0 auto 40px auto; }
.listbox-container { width: 100%; max-width: 900px; margin: 40px auto 0 auto; display: flex; flex-direction: column; gap: 15px; }
.listbox-item { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; background-color: #fff; padding: 20px 25px; border: 1px solid #e0e0e0; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); transition: all 0.3s ease; }
.listbox-item:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.1); border-color: #3498db; }
.listbox-item.featured-item { border-left: 5px solid #3498db; }
.listbox-item-main { flex: 1; padding-right: 20px; text-align: left; }
.listbox-item-main h4 { margin: 0 0 5px 0; font-size: 20px; color: #2c3e50; }
.listbox-item-main p { margin: 0; font-size: 15px; color: #555; line-height: 1.5; }
.listbox-item-aside { display: flex; align-items: center; gap: 25px; flex-shrink: 0; }
.listbox-item-aside .price { font-weight: 700; font-size: 22px; color: #3498db; white-space: nowrap; }
.listbox-item-aside .button { padding: 8px 20px; font-size: 14px; white-space: nowrap; }

/* --- Admin Paneli Tablo Stilleri --- */
.posts-table { width: 100%; border-collapse: collapse; background: #fff; box-shadow: 0 4px 15px rgba(0,0,0,0.08); border-radius: 8px; overflow: hidden; }
/* ... Diğer admin stilleri ... */
.posts-table th, .posts-table td { padding: 15px; border-bottom: 1px solid #e0e0e0; text-align: left; vertical-align: middle; }
.posts-table tbody tr:last-child td { border-bottom: none; }
.posts-table th { background-color: #f9fafb; font-size: 14px; color: #555; }
.actions-container { display: flex; align-items: center; gap: 8px; }
.posts-table td .action-btn { text-decoration: none; padding: 6px 12px; border-radius: 5px; color: white; font-size: 14px; text-align: center; white-space: nowrap; transition: opacity 0.2s ease; }
.posts-table td .action-btn:hover { opacity: 0.85; }
.edit-btn { background-color: #28a745; }
.delete-btn { background-color: #dc3545; }

/* --- Sayfa Geçiş Efekti --- */
main {
  animation: fadeInUp 0.8s ease-in-out;
  flex-grow: 1;
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- Mobil Uyumlu Kodlar (Responsive) --- */
@media (max-width: 991px) {
    .single-post-layout { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .site-header .container, .contact-container { flex-direction: column; gap: 15px; }
    .hero-content { margin-left: auto; margin-right: auto; text-align: center; }
    .hero-content h1, .article-title { font-size: 32px; }
    .hero-content p, .post-excerpt, .article-content { font-size: 16px; }
    .content-section h2 { font-size: 28px; }
    .pricing-card.featured-package { transform: scale(1); }
    .text-category-container { grid-template-columns: 1fr; }
    .listbox-item { flex-direction: column; align-items: flex-start; gap: 15px; }
    .listbox-item-aside { width: 100%; flex-direction: column; align-items: stretch; text-align: center; margin-top: 15px; padding-top: 15px; border-top: 1px solid #f0f0f0; }
    .listbox-item-aside .button { width: 100%; }
}

@media (min-width: 768px) {
    .blog-post { flex-direction: row; }
    .post-image { width: 300px; }
    .post-image img { height: 100%; }
    .text-category-container { grid-template-columns: 1fr 1fr; }
}

@media (min-width: 992px) {
    .single-post-layout { grid-template-columns: 1fr 1.5fr; }
}
/* --- YENİ: Uygulamalar Sayfası Stilleri --- */
.app-container {
    display: grid;
    /* Otomatik sütun ayarı: Her kartın min 300px genişliği olacak, kalan alanı eşit paylaşacaklar. */
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px; /* Kartlar arası boşluk */
    margin-top: 40px;
    text-align: center;
}

.app-card {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.app-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

.app-icon {
    font-size: 48px;
    color: #3498db;
    margin-bottom: 20px;
}

.app-card h3 {
    font-size: 22px;
    color: #2c3e50;
    margin-top: 0;
    margin-bottom: 15px;
}

.app-card p {
    color: #555;
    line-height: 1.7;
    margin-bottom: 25px;
}

.app-links {
    display: flex;
    justify-content: center;
    gap: 15px; /* Butonlar arası boşluk */
    flex-wrap: wrap;
}

.app-store-button {
    text-decoration: none;
    color: #333;
    background-color: #f0f0f0;
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 600;
    transition: background-color 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px; /* İkon ve yazı arası boşluk */
}

.app-store-button:hover {
    background-color: #e0e0e0;
}
/* --- YENİ: Uygulamalar Sayfası Sorgulama Formu Stilleri --- */
.query-form {
    margin-top: 20px;
    display: flex;
    gap: 10px;
}

.query-input {
    flex-grow: 1; /* Mevcut alanı doldur */
    padding: 10px 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
}

.query-form .button {
    padding: 10px 20px;
    font-size: 16px;
    flex-shrink: 0; /* Küçülmesini engelle */
}

.query-results {
    margin-top: 20px;
    padding: 15px;
    border-radius: 5px;
    text-align: left;
}

.query-results.success {
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
}
.query-results.error {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
}

.query-results ul {
    list-style-type: none;
    padding-left: 0;
    margin: 10px 0 0 0;
}
.query-results li {
    padding: 5px 0;
    border-top: 1px dashed #c3e6cb;
}
.query-results li:first-child {
    border-top: none;
}
<?php
require_once "admin/config.php";

$sorgu_sonucu = "";
$aranan_model = "";

// Eğer bir arama yapıldıysa (URL'de 'sorgu' parametresi varsa)
if (isset($_GET['sorgu']) && !empty(trim($_GET['sorgu']))) {
    $aranan_model = trim($_GET['sorgu']);
    $bulunan_grup = null;

    // --- 1. Adım: Aranan modelin grup adını bul ---
    // LOWER() fonksiyonu ile büyük/küçük harf duyarsız arama yapıyoruz
    $sql_grup_bul = "SELECT grup_adi FROM kirilmaz_cam_modelleri WHERE LOWER(model_adi) LIKE LOWER(?) LIMIT 1";
    
    if ($stmt_grup = $conn->prepare($sql_grup_bul)) {
        $like_param = "%" . $aranan_model . "%";
        $stmt_grup->bind_param("s", $like_param);
        
        if ($stmt_grup->execute()) {
            $result_grup = $stmt_grup->get_result();
            if ($result_grup->num_rows > 0) {
                $bulunan_grup = $result_grup->fetch_assoc()['grup_adi'];
            }
        }
        $stmt_grup->close();
    }

    // --- 2. Adım: Eğer grup bulunduysa, o gruba ait tüm modelleri listele ---
    if ($bulunan_grup) {
        $sql_modelleri_listele = "SELECT model_adi FROM kirilmaz_cam_modelleri WHERE grup_adi = ?";
        if ($stmt_modeller = $conn->prepare($sql_modelleri_listele)) {
            $stmt_modeller->bind_param("s", $bulunan_grup);
            if ($stmt_modeller->execute()) {
                $result_modeller = $stmt_modeller->get_result();
                if ($result_modeller->num_rows > 0) {
                    $sorgu_sonucu = "<div class='query-results success'><p><strong>'" . htmlspecialchars($aranan_model) . "'</strong> ile uyumlu modellerin tam listesi:</p><ul>";
                    while($row = $result_modeller->fetch_assoc()) {
                        $sorgu_sonucu .= "<li>" . htmlspecialchars($row['model_adi']) . "</li>";
                    }
                    $sorgu_sonucu .= "</ul></div>";
                }
            }
            $stmt_modeller->close();
        }
    } else {
        // Aranan model hiçbir grupta bulunamadıysa
        $sorgu_sonucu = "<div class='query-results error'><p>Aradığınız <strong>'" . htmlspecialchars($aranan_model) . "'</strong> modeli için bir sonuç bulunamadı. Lütfen model adını kontrol edip tekrar deneyin.</p></div>";
    }

    $conn->close();
}
?>
<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Uygulamalar | Günaslan İletişim</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" />
</head>
<body>
    <header class="site-header">
        <?php // Header içeriğiniz buraya gelecek (diğer sayfalardan kopyalayın) ?>
    </header>

    <main>
        <section class="content-section">
            <div class="container">
                <h2>Uygulamalarımız</h2>
                <p class="section-subtitle">Hayatınızı Kolaylaştıran Dijital Çözümler</p>
                
                <div class="app-container">
                    
                    <div class="app-card">
                        <div class="app-icon">
                            <i class="fa-solid fa-mobile-screen"></i>
                        </div>
                        <h3>Kırılmaz Cam Sorgulama</h3>
                        <p>Telefon modelinizi yazarak uyumlu olduğu diğer tüm modelleri anında listeleyin.</p>
                        
                        <form action="uygulamalar.php" method="get" class="query-form">
                            <input type="text" name="sorgu" class="query-input" placeholder="Örn: A51" value="<?php echo htmlspecialchars($aranan_model); ?>" required>
                            <button type="submit" class="button">Sorgula</button>
                        </form>

                        <?php echo $sorgu_sonucu; ?>
                    </div>

                    <div class="app-card">
                        <div class="app-icon">
                            <i class="fa-solid fa-magnifying-glass-plus"></i>
                        </div>
                        <h3>Telefon Özellikleri Sorgulama</h3>
                        <p>İlgilendiğiniz telefon modelinin teknik özelliklerini, fiyatını ve stok durumunu anında öğrenin.</p>
                    </div>

                </div>
            </div>
        </section>
    </main>

    <footer class="site-footer">
        <?php // Footer içeriğiniz buraya gelecek (diğer sayfalardan kopyalayın) ?>
    </footer>
</body>
</html>