﻿/* Anasayfa butonları için özel stiller */

/* shared color variables so icons can use the same color as the button */
:root {
    --anasayfa-giris-color: #00f2fe;
    --anasayfa-giris-color-dark: #00d4e6;
    --anasayfa-uye-color: #ec407a;
    --anasayfa-uye-color-dark: #d81b60;
}

/* Giriş Yap butonu - sabit renk: #8B0000 (darkred) */
#anasayfaGirisYapButton {
    background: linear-gradient(135deg, #00f2fe 0%, #00d4e6 100%) !important;
    border-color: var(--anasayfa-giris-color) !important;
    color: #1a1a2e !important; /* Koyu metin daha okunabilir */
    padding: 0.875rem 1.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    border-radius: 0.35rem;
    transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
    box-shadow: 0 4px 15px rgba(0, 242, 254, 0.4);
}

/* Hover / focus / active durumları - biraz koyulaştır */
    #anasayfaGirisYapButton:hover,
    #anasayfaGirisYapButton:focus {
        filter: brightness(1.15);
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(0, 242, 254, 0.6);
    }

/* Üye Ol butonu - Giriş yap butonuyla uyumlu, biraz daha sıcak kırmızı / canlı ton */
#anasayfaUyeOlButton {
    background: linear-gradient(135deg, #ec407a 0%, #f06292 100%) !important;
    border-color: var(--anasayfa-uye-color) !important;
    color: #ffffff !important;
    padding: 0.875rem 1.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    border-radius: 0.35rem;
    transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
    box-shadow: 0 4px 15px rgba(236, 64, 122, 0.4);
}

/* Hover / focus / active durumları - parlaklığı artır */
    #anasayfaUyeOlButton:hover,
    #anasayfaUyeOlButton:focus {
        filter: brightness(1.15);
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(236, 64, 122, 0.6);
    }

/* ------------------------------------------------------------------
   Font Awesome stacked icons: make the outer circle use the same
   color as the #anasayfaGirisYapButton to match the button.
   The inner icon (fa-inverse) remains white.
   ------------------------------------------------------------------*/

/* Target the stacked circle (fa-circle + fa-stack-2x) and fallback for any fa-circle */
.fa-stack .fa-circle.fa-stack-2x,
.fa-stack .fa-circle {
    color: var(--anasayfa-giris-color) !important;
}

/* Make stacked circle darken on hover (mirrors button hover) */
.fa-stack:hover .fa-circle,
.portfolio-item:hover .fa-stack .fa-circle {
    color: var(--anasayfa-giris-color-dark) !important;
}

/* Navbar logo ayarı */
#mainNav {
    background: transparent;
    padding: 0.5rem 0;
}

.navbar-brand svg {
    display: block;
}


/* Mobil görünümde navbar arka plan rengi */
@media (max-width: 991.98px) {
    #mainNav {
        background-color: #212529 !important;
    }

    .navbar-brand svg {
        height: 48px !important; /* 64px'ten küçültüldü */
    }
}

/*ILETISIM FORMU*/

/* Select2'yi input'lara tam benzer yap */
.select2-container--default .select2-selection--single {
    height: calc(1.5em + 0.75rem + 2px) !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 1.07rem !important;
    line-height: 1.5 !important;
    border: 1px solid #ced4da !important;
    border-radius: 0.25rem !important;
    display: flex !important;
    align-items: center !important;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        padding: 0 !important;
        line-height: normal !important;
        display: flex !important;
        align-items: center !important;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 100% !important;
        top: 0 !important;
        right: 0.75rem !important;
    }

    .select2-container--default .select2-selection--single .select2-selection__placeholder {
        color: #6c757d !important;
    }