/*-------------------------------TEMEL TASARIM------------------------------------------EA*/

html, body {
    height: 100% !important;
    margin: 0 !important;
}

/* Body'yi esnek yapıyoruz ki footer aşağı itilsin */
body {
    display: flex !important;
    flex-direction: column !important;
}

main {
    flex: 1 0 auto !important;
}

/* Footer her zaman en altta kalacak */
footer {
    flex-shrink: 0 !important;
}

/* Footer için 767PX VE ALTI */
@media (max-width: 767px) {
    /* Satır yapısının elemanları yan yana sığdırması ve dikey boşluğu */
    footer .row {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        justify-content: space-between !important;
        row-gap: 25px !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    /* Otobüs Logosu ve VIODRIVER Yazısını Mobilde Hizalama */
    footer .col-12.mb-4.d-flex {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        flex-direction: row !important;
        justify-content: flex-start !important;
        align-items: center !important;
        margin-bottom: 15px !important;
    }

    footer img {
        height: 55px !important;
        width: auto !important;
        margin-right: 15px !important;
    }

    footer h5 {
        font-size: 1.3rem !important;
        text-align: left !important;
    }

    footer p.text-secondary.small {
        font-size: 0.78rem !important;
        text-align: left !important;
        max-width: 100% !important;
    }

    /* Bilgi Merkezi (Logonun Hizasında Sola Yapışık) */
    footer .col-6.mb-4.border-start {
        flex: 0 0 48% !important;
        max-width: 48% !important;
        border-left: none !important;
        padding-left: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

        footer .col-6.mb-4.border-start h6 {
            text-align: left !important;
            width: 100% !important;
            margin-bottom: 12px !important;
            font-size: 0.95rem !important;
        }

    footer ul {
        text-align: left !important;
        width: 100% !important;
    }

    /* Bize Ulaşın (Sağa Hizalı) */
    footer .col-6.mb-4.text-start.text-md-end {
        flex: 0 0 48% !important;
        max-width: 48% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-end !important;
        text-align: right !important;
        padding-right: 0 !important;
    }

        footer .col-6.mb-4.text-start.text-md-end h6 {
            text-align: right !important;
            width: 100% !important;
            margin-bottom: 12px !important;
            font-size: 0.95rem !important;
        }

    footer .d-flex.gap-3.mb-3 {
        display: flex !important;
        justify-content: flex-end !important;
        width: 100% !important;
        gap: 15px !important;
    }

    footer .text-start.text-md-end p {
        text-align: right !important;
        width: 100% !important;
        font-size: 0.8rem !important;
    }

    /* --- ÜSTTEKİ ROW ETKİSİNİ SIFIRLAYAN YENİ ALT ÇİZGİ AYARI --- */
    footer hr {
        display: block !important;
        width: 100% !important;
        clear: both !important;
        margin-top: 20px !important;
        margin-bottom: 15px !important;
    }

    /* Copyright kısmı ortalaması */
    footer .text-center {
        display: flex !important;
        justify-content: center !important; /* Flex ile yatayda tam ortala */
        align-items: center !important; /* Dikeyde ortala */
        width: 100% !important; /* Footer'ın tüm genişliğini kapla */
        clear: both !important; /* Üstteki sağa/sola yaslamaları tamamen iptal et */
        float: none !important;
        margin: 15px 0 0 0 !important;
        padding: 0 !important;
    }

        footer .text-center p {
            width: auto !important; /* Genişliği serbest bırak ki tam ortalansın */
            text-align: center !important; /* Metni ortala */
            margin: 0 auto !important; /* Sağ ve soldan otomatik eşitle */
            display: block !important;
        }
}

/* Header her boyutta düzgün durması için */
@media (max-width: 1200px) {
    .navbar-brand {
        display: flex !important;
        align-items: center !important;
        font-size: 32px !important;
        padding-top: 20px !important; /* Yukarıdan boşluk verdik */
        padding-bottom: 20px !important; /* Aşağıdan boşluk verdik */
    }

        .navbar-brand img {
            height: 75px !important;
            margin-top: 10px !important; /* Yukarıdan pay bırakmıyoruz */
            margin-bottom: 0 !important;
            margin-right: 15px !important;
        }
}

@media (max-width: 576px) {
    .navbar-brand {
        font-size: 26px !important;
    }

        .navbar-brand img {
            height: 60px !important; 
        }
}

/*--------------------------------ÜYE/GİRİŞ KISMI TASARIMI-------------------------------------EA*/

/* Dropdown kutusunun genel tasarımı */
.dropdown-menu {
    border: none;
    border-radius: 12px;
    overflow: hidden; /* Hover renginin kenarlardan taşmasını engeller */
    margin-top: 15px !important;
    padding: 0 !important; /* Alt ve üstteki beyaz boşlukları sıfırlar, hover tam kaplar */
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    min-width: 210px;
}

/* Yanındaki mavi oku beyaz yapıyoruz */
.dropdown-toggle::after {
    color: white !important;
}

/* Menü içindeki tüm satırların genel ortak flex yapısı */
.dropdown-menu li,
.dropdown-item,
.dropdown-item-text-custom {
    display: flex !important;
    align-items: center !important;
}

/* Tıklanabilir butonların (Hesabım, Çıkış Yap) rengini orijinal canlı pembe yapıyoruz */
.dropdown-item {
    color: #e91e63 !important;
    padding: 12px 20px !important;
    font-weight: 600;
    transition: all 0.2s ease;
}

/* En üstteki Ad Soyad başlığının rengi (Siyah/Koyu kalır) */
.dropdown-user-title {
    color: #212529 !important;
    padding: 12px 20px !important;
    font-weight: 600;
    user-select: none;
}

/* İkonların yerleşimi için sabit alan ayırarak simetriyi koruyoruz */
.dropdown-menu i {
    font-size: 1.2rem;
    width: 28px; /* Yazıların alt alta milimetrik hizalanmasını sağlar */
    display: inline-flex;
    align-items: center;
}

/* Genel ikon rengini pembe yapıyoruz */
.dropdown-menu i {
    color: #e91e63 !important;
}

    /* Admin hesabındaki anahtar ikonunu SARI yapıyoruz */
    .dropdown-menu i.text-warning,
    .dropdown-menu i.bi-key-fill {
        color: #ffc107 !important;
    }

/* Üstüne gelindiğinde (Hover) açık pembe arka plan ve canlı pembe yazı */
.dropdown-item:hover {
    background-color: #FFF0F5 !important;
    color: #e91e63 !important;
    cursor: pointer;
}

/* Çıkış yap butonunun hover rengi de stabil pembe kalır */
.dropdown-item.text-danger-custom {
    color: #e91e63 !important;
}

    .dropdown-item.text-danger-custom:hover {
        background-color: #FFF0F5 !important;
        color: #c2185b !important;
    }

/* Çizgilerin (Divider) boşluklarını sıfırlıyoruz ki hover alanı tam kaplasın */
.dropdown-divider {
    margin: 0 !important;
    opacity: 0.12;
}

/*---------------------------------AVATAR BUTON-TASARIMI-----------------------------------------EA*/

/* Giriş yapılmış (img) yapılmamış (div) hallerini kapsayan genel geçiş */
#userMenu img, #userMenu div.rounded-circle {
    transition: all 0.3s ease-in-out;
    transform: scale(1);
}
/* Mouse üzerine geldiğinde hem resmi hem de ikonu büyüt */
#userMenu:hover img, #userMenu:hover div.rounded-circle {
    transform: scale(1.15);
    box-shadow: 0 0 15px rgba(248, 187, 208, 0.6);
    border-color: #e91e63 !important;
}
