@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css');
/* Sadece Kategori Blog sayfasındaki GİRİŞ RESİMLERİNİ (Intro Image) etkiler */
.resim-yan-yana .com-content-category-blog__item {
    display: flex !important;
    flex-direction: row !important;
    gap: 30px !important;
    align-items: flex-start !important;
    margin-bottom: 40px !important;
}

/* Kategori sayfasındaki resim kutusunu sabitle */
.resim-yan-yana .com-content-category-blog__item .item-image {
    flex: 0 0 280px !important; 
    max-width: 280px !important;
    margin: 0 !important;
}

/* Sadece giriş resmini küçültür */
.resim-yan-yana .com-content-category-blog__item .item-image img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
}

/* Makalenin KENDİ İÇİNDEKİ (Full Article) resmi bu kurallardan hariç tutar */
.com-content-article .item-image, 
.com-content-article .item-image img {
    display: block !important;
    flex: none !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto 20px auto !important; /* Makale içinde ortalar */
}

/* Mobil ayarı */
@media (max-width: 768px) {
    .resim-yan-yana .com-content-category-blog__item {
        flex-direction: column !important;
    }
    .resim-yan-yana .com-content-category-blog__item .item-image {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* Devamını Oku Butonu - Kesin Çözüm */
.resim-yan-yana .readmore a, 
.resim-yan-yana .readmore a.btn, 
.resim-yan-yana .btn-primary {
    background-color: #e67e22 !important;
    color: #ffffff !important;
    padding: 12px 28px !important;
    border-radius: 5px !important; /* Hafif oval, daha kurumsal */
    text-transform: uppercase !important;
    font-size: 14px !important;
    font-weight: bold !important;
    display: inline-block !important;
    border: none !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    margin-top: 15px !important;
}

.resim-yan-yana .readmore a:hover {
    background-color: #d35400 !important;
    transform: scale(1.05) !important;
}

/* Mobilde butonu tam genişlik yapmak isterseniz (Opsiyonel) */
@media (max-width: 768px) {
    .resim-yan-yana .readmore {
        text-align: center !important; /* Mobilde butonu ortalar */
    }
}

/* Kaynaktaki Tam Seçicilere Göre Sidebar Menü Butonlaştırma */
.container-sidebar-right .mod-menu {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.container-sidebar-right .mod-menu li {
    padding: 0 !important;
    margin: 0 0 8px 0 !important;
    list-style: none !important;
}

/* Linkleri buton gibi yapma */
.container-sidebar-right .mod-menu li a {
    display: block !important;
    background-color: #f4f4f4 !important;
    color: #333 !important;
    padding: 12px 15px !important;
    border-left: 5px solid #e67e22 !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}

/* Hover ve Aktif Sayfa */
.container-sidebar-right .mod-menu li a:hover,
.container-sidebar-right .mod-menu li.active > a {
    background-color: #e67e22 !important;
    color: #ffffff !important;
    padding-left: 20px !important;
    border-left: 5px solid #222 !important;
}

/* Sidebar Başlığı (Ana Menü yazan yer) */
.container-sidebar-right h3 {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: #222 !important;
    border-bottom: 2px solid #e67e22 !important;
    padding-bottom: 8px !important;
    margin-bottom: 15px !important;
    text-transform: uppercase !important;
}

/* Hizmet Kartları */

.hizmet-kartlari {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    padding: 20px 0;
}

.hizmet-kart {
    flex: 1 1 calc(33.33% - 20px);
    background: #f9f9f9;
    padding: 25px;
    border-radius: 8px;
    border-bottom: 4px solid #cc0000; /* AĞRA Marka Renginiz (Örnek: Kırmızı/Turuncu) */
    transition: transform 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.hizmet-kart:hover {
    transform: translateY(-5px);
}

.hizmet-kart h3 {
    margin-top: 0;
    color: #333;
    font-size: 1.1rem;
}

.hizmet-kart p {
    font-size: 0.95rem;
    color: #666;
    line-height: 1.6;
}

.devam-oku {
    display: inline-block;
    margin-top: 15px;
    font-weight: bold;
    color: #cc0000;
    text-decoration: none;
}

/* Mobilde tek sütun göster */
@media (max-width: 768px) {
    .hizmet-kart {
        flex: 1 1 100%;
    }
}

/* Modülü sağ alta sabitle */
.agra-whatsapp {
    position: fixed !important;
    bottom: 25px !important;
    left: 25px !important;
    z-index: 999999 !important;
    left: auto !important; /* Sola yaslanmayı engeller */
}

/* Modülün içindeki linki buton yap */
.agra-whatsapp a {
    background-color: #25D366 !important;
    color: #fff !important;
    padding: 12px 25px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    font-weight: bold !important;
    display: inline-flex !important;
    align-items: center !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3) !important;
    font-family: Arial, sans-serif !important;
}

/* Üstüne gelince efekt */
.agra-whatsapp a:hover {
    background-color: #128C7E !important;
    transform: scale(1.05) !important;
}

.ust-iletisim {
    display: flex;
    justify-content: flex-end;
    align-items: center;      /* Dikeyde milimetrik ortalama */
    min-height: 50px;         /* Şeridin yüksekliği */
    gap: 25px;
    padding: 0 20px;
    background-color: #001f3f; 
    border-bottom: 2px solid #ff6600;
}

.ust-iletisim a {
    color: #ffffff !important;
    text-decoration: none !important; /* ALT ÇİZGİYİ TAMAMEN SİLER */
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;      /* İkon ve yazıyı dikeyde ortalar */
    margin: 0 !important;
    transition: color 0.3s ease;
}

/* İkonların ayarı */
.ust-ikon {
    color: #ff6600 !important; 
    margin-right: 10px;
    font-size: 16px;
}

/* Üstüne gelince yazıların hafif parlaması (Alt çizgi gelmez) */
.ust-iletisim a:hover {
    color: #ff6600 !important;
    text-decoration: none !important; /* Hover durumunda da çizgi çıkmasını engeller */
}

/* Mobilde şeridi ortala */
@media (max-width: 768px) {
    .ust-iletisim {
        justify-content: center;
        flex-direction: row; /* Yan yana kalsınlar dersen row, alt alta dersen column yap */
        flex-wrap: wrap;
        gap: 15px;
    }
}

/* 1. MENÜ ŞERİDİ AYARLARI */
ul.ana-navigasyon {
    background-color: #001f3f !important;
    border-bottom: 3px solid #ff6600 !important;
    display: flex !important;
    align-items: center !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 45px !important;
}

/* 2. DİKEY AYRAÇ ÇİZGİLERİ */
ul.ana-navigasyon li.metismenu-item {
    border-right: 1px solid rgba(255, 255, 255, 0.2) !important;
}

ul.ana-navigasyon li.metismenu-item:last-child {
    border-right: none !important;
}

/* 3. LİNK VE YAZI AYARLARI */
ul.ana-navigasyon li.metismenu-item a {
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    padding: 10px 18px !important;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out !important;
    display: flex !important;
    align-items: center !important;
}

/* 4. İKONLARI CSS İLE YERLEŞTİRME (En Garanti Yöntem) */
ul.ana-navigasyon li.metismenu-item a::before {
    font-family: "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    margin-right: 10px;
    color: #ff6600;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
}

/* ANA SAYFA İÇİN EV (İlk elemanı hedefler) */
ul.ana-navigasyon li.metismenu-item:first-child a::before {
    content: "\f015" !important; /* Home ikonu */
}

/* DİĞERLERİ İÇİN SAĞ OK (İlk eleman hariç hepsini hedefler) */
ul.ana-navigasyon li.metismenu-item:not(:first-child) a::before {
    content: "\f105" !important; /* Angle Right ikonu */
}

/* 5. HOVER VE AKTİF DURUM */
ul.ana-navigasyon li.metismenu-item a:hover,
ul.ana-navigasyon li.current.active a {
    color: #ff6600 !important;
}

/* 6. MOBİL UYUMLULUK */
@media (max-width: 991px) {
    ul.ana-navigasyon {
        flex-direction: column !important;
        height: auto !important;
    }
    ul.ana-navigasyon li.metismenu-item {
        width: 100% !important;
        border-right: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
}

/* Ana Konteynır */
.ozel-iletisim-formu .form-wrapper {
    background: #ffffff;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.05);
    border: 1px solid #eee;
}

/* Yan yana alanlar için grid yapısı */
.ozel-iletisim-formu .form-row {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
}

.ozel-iletisim-formu .form-group {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
}

.ozel-iletisim-formu label {
    font-size: 0.85rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 6px;
}

.ozel-iletisim-formu input, 
.ozel-iletisim-formu textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

.ozel-iletisim-formu input:focus, 
.ozel-iletisim-formu textarea:focus {
    border-color: #007bff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(0,123,255,0.1);
}

.ozel-iletisim-formu .submit-btn {
    background-color: #007bff;
    color: #fff;
    padding: 14px 20px;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    transition: background 0.3s ease;
}

.ozel-iletisim-formu .submit-btn:hover {
    background-color: #0056b3;
}

/* Mobil için yan yana alanları alt alta getir */
@media (max-width: 768px) {
    .ozel-iletisim-formu .form-row {
        flex-direction: column;
        gap: 0;
    }
}

/* Sidebar Teklif Butonu Konteynır */
.sidebar-teklif-kutusu {
    margin-bottom: 25px;
    padding: 0;
}

/* Butonun kendisi */
.sidebar-teklif-kutusu .teklif-butonu {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ff5e00; /* Agra Turuncusu tonu */
    color: #ffffff !important;
    padding: 18px 15px;
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease-in-out;
    border-bottom: 4px solid #d44e00; /* Derinlik hissi */
    text-align: center;
}

/* Üzerine gelince efekt */
.sidebar-teklif-kutusu .teklif-butonu:hover {
    background-color: #333333; /* Siyaha dönerek kontrast sağlar */
    border-bottom: 4px solid #111111;
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    text-decoration: none;
}

/* İsteğe bağlı: Buton içine ikon eklemek isterseniz */
.sidebar-teklif-kutusu .teklif-butonu:before {
    content: "\f0e0"; /* FontAwesome Mektup ikonu */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
}

/* Modülün en dış çerçevesindeki boşlukları ve tasarımı düzenleyelim */
div.sidebar-teklif-kutusu.card {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    margin-bottom: 20px;
}

/* Joomla'nın varsayılan kart gövdesi (padding) ayarlarını sıfırlayalım */
div.sidebar-teklif-kutusu .card-body {
    padding: 0 !important;
}

/* Modül başlığını (h3) gizlemek istersen veya stil vermek istersen */
div.sidebar-teklif-kutusu .card-header {
    display: none; /* Başlığı istemiyorsan kalsın, istiyorsan bu satırı sil */
}

/* Senin oluşturduğun buton konteynırı */
.sidebar-teklif-konteynir {
    width: 100%;
    display: block;
}

/* Butonun asıl seçicisi (Resimdeki hiyerarşiye tam uyumlu) */
div.sidebar-teklif-kutusu .teklif-butonu {
    display: block !important;
    background-color: #ff5e00 !important; /* Agra Turuncusu */
    color: #ffffff !important;
    padding: 15px 10px !important;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none !important;
    border-radius: 5px;
    transition: background 0.3s ease;
    box-shadow: 0 4px 6px rgba(0,0,0,0.15);
}

/* Hover efekti */
div.sidebar-teklif-kutusu .teklif-butonu:hover {
    background-color: #333 !important;
    color: #fff !important;
    transform: translateY(-2px);
    text-decoration: none !important;
}