/* ==================================================
   TEKNODORA NAVBAR - MEVCUT CLASSLARA GÖRE
   .navbar / .siteLogo / #navbarContent / .nav-link
================================================== */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800&display=swap');

/* ÜST MENÜ ALANI */
.menubar{
    position:relative !important;
    z-index:99999 !important;
}

/* VARSA SUB HEADER */
.sub-header{
    position:relative !important;
    z-index:99998 !important;
    background:#050506 !important;
    border-bottom:1px solid rgba(255,255,255,.08) !important;
}

/* ANA NAVBAR */
.navbar.navbar-expand-lg,
.navbar{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    width:100% !important;

    height:86px !important;
    min-height:86px !important;

    padding:0 !important;
    margin:0 !important;

    background:rgba(5,5,6,.58) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;

    border-bottom:1px solid rgba(255,255,255,.08) !important;
    box-shadow:0 14px 45px rgba(0,0,0,.18) !important;

    z-index:99999 !important;
    box-sizing:border-box !important;
}

/* NAVBAR HOVER / ACTIVE DURUMDA DEĞİŞMESİN */
.navbar.navbar-expand-lg:hover,
.navbar.navbar-expand-lg:focus,
.navbar.navbar-expand-lg:active,
.navbar:hover,
.navbar:focus,
.navbar:active{
    background:rgba(5,5,6,.58) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
    border-bottom:1px solid rgba(255,255,255,.08) !important;
    box-shadow:0 14px 45px rgba(0,0,0,.18) !important;
}

/* NAVBAR İÇ CONTAINER */
.navbar .container{
    width:100% !important;
    max-width:1400px !important;
    height:86px !important;

    margin:0 auto !important;
    padding:0 54px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:42px !important;

    box-sizing:border-box !important;
}

/* LOGO ALANI */
.navbar-brand{
    flex:0 0 auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;

    width:220px !important;
    height:86px !important;

    padding:0 !important;
    margin:0 !important;

    background-image:url("/Uploads/Images/site/TEKNODORA_LOGO_seffaf_beyaz_.png") !important;
    background-repeat:no-repeat !important;
    background-position:left center !important;
    background-size:contain !important;

    text-decoration:none !important;
}

/* Mevcut img görünmesin, logo CSS background olarak gelsin */
.siteLogo,
.navbar-brand img{
    display:none !important;
}

/* COLLAPSE ALANI */
.navbar-collapse,
#navbarContent{
    flex:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
}

/* UL MENÜ */
.navbar-nav{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:42px !important;

    margin:0 !important;
    padding:0 !important;

    list-style:none !important;
}

/* LI */
.navbar-nav .nav-item{
    position:relative !important;
    margin:0 !important;
    padding:0 !important;
}

/* MENÜ LINKLERİ */
.navbar-nav .nav-item .nav-link,
.navbar .nav-link{
    position:relative !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    padding:32px 0 30px !important;
    margin:0 !important;

    font-family:'Barlow Condensed', sans-serif !important;
    font-size:24px !important;
    line-height:1 !important;
    font-weight:700 !important;
    letter-spacing:.8px !important;
    text-transform:uppercase !important;

    color:#ffffff !important;
    opacity:1 !important;

    white-space:nowrap !important;
    text-decoration:none !important;

    background:transparent !important;
    box-shadow:none !important;

    transition:.25s ease !important;
}

/* HOVER / ACTIVE / CLICK DURUMUNDA DEĞİŞMESİN */
.navbar-nav .nav-item .nav-link:link,
.navbar-nav .nav-item .nav-link:visited,
.navbar-nav .nav-item .nav-link:hover,
.navbar-nav .nav-item .nav-link:focus,
.navbar-nav .nav-item .nav-link:active,
.navbar-nav .nav-item .nav-link.active,
.navbar-nav .nav-item.active .nav-link,
.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar .nav-link:active,
.navbar .nav-link.active{
    color:#ffffff !important;
    opacity:1 !important;
    background:transparent !important;
    box-shadow:none !important;
    border-radius:0 !important;
}

/* ALT ÇİZGİ */
.navbar-nav .nav-item .nav-link::after,
.navbar .nav-link::after{
    content:"" !important;
    position:absolute !important;

    left:0 !important;
    bottom:20px !important;

    width:0 !important;
    height:4px !important;

    background:#ff2b35 !important;
    border-radius:20px !important;

    border:0 !important;
    margin:0 !important;

    transition:.25s ease !important;
}

/* BOOTSTRAP DROPDOWN OKLARINI KAPAT */
.navbar .dropdown-toggle::after{
    display:none !important;
    content:none !important;
}

/* SADECE HOVERDA ALT ÇİZGİ GELSİN */
.navbar-nav .nav-item .nav-link:hover::after,
.navbar .nav-link:hover::after{
    width:100% !important;
}

/* ACTIVE CLASS GELİRSE BİLE ARKA PLAN YOK, SADECE ÇİZGİ İSTERSEN */
.navbar-nav .nav-item .nav-link.active::after,
.navbar-nav .nav-item.active .nav-link::after,
.navbar .nav-link.active::after{
    width:0 !important;
}

/* MOBİL TOGGLER */
.navbar-toggler{
    display:none !important;

    width:44px !important;
    height:44px !important;

    padding:0 !important;
    margin:0 !important;

    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:50% !important;

    background:rgba(255,255,255,.08) !important;
    box-shadow:none !important;
    outline:none !important;

    align-items:center !important;
    justify-content:center !important;
    flex-direction:column !important;
    gap:5px !important;
}

/* BOOTSTRAP ICONU KAPAT */
.navbar-toggler-icon{
    display:none !important;
}

/* JS İLE EKLENEN ÇİZGİLER */
.navbar-toggler span,
.navbar-toggler .td-burger-line{
    display:block !important;
    width:19px !important;
    height:2px !important;
    background:#ffffff !important;
    border-radius:3px !important;
    transition:.25s ease !important;
}

/* AKTİF BURGER */
.navbar-toggler.active span:nth-child(1),
.navbar-toggler.active .td-burger-line:nth-child(1){
    transform:translateY(7px) rotate(45deg) !important;
}

.navbar-toggler.active span:nth-child(2),
.navbar-toggler.active .td-burger-line:nth-child(2){
    opacity:0 !important;
}

.navbar-toggler.active span:nth-child(3),
.navbar-toggler.active .td-burger-line:nth-child(3){
    transform:translateY(-7px) rotate(-45deg) !important;
}

/* SAYFA NAVBAR ALTINDA KALMASIN */
body{
    padding-top:86px !important;
}

/* ==================================================
   TABLET
================================================== */

@media(max-width:1280px){
    .navbar .container{
        padding:0 36px !important;
        gap:30px !important;
    }

    .navbar-nav{
        gap:28px !important;
    }

    .navbar-nav .nav-item .nav-link,
    .navbar .nav-link{
        font-size:21px !important;
    }

    .navbar-brand{
        width:185px !important;
        height:86px !important;
        background-size:contain !important;
    }
}

/* ==================================================
   MOBİL
================================================== */

@media(max-width:991px){
    .navbar.navbar-expand-lg,
    .navbar{
        height:76px !important;
        min-height:76px !important;
    }

    .navbar .container{
        height:76px !important;
        padding:0 22px !important;
    }

    .navbar-brand{
        width:165px !important;
        height:76px !important;
        background-size:contain !important;
    }

    .navbar-toggler{
        display:flex !important;
    }

    .navbar-collapse,
    #navbarContent{
        position:fixed !important;
        top:76px !important;
        left:14px !important;
        right:14px !important;

        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        justify-content:flex-start !important;

        max-height:calc(100vh - 96px) !important;
        overflow-y:auto !important;

        padding:14px !important;

        background:rgba(5,5,6,.96) !important;
        border:1px solid rgba(255,255,255,.12) !important;
        border-radius:22px !important;
        box-shadow:0 24px 70px rgba(0,0,0,.36) !important;

        opacity:0 !important;
        visibility:hidden !important;
        transform:translateY(-12px) !important;
        pointer-events:none !important;

        transition:.28s ease !important;
    }

    .navbar-collapse.show,
    .navbar-collapse.active,
    #navbarContent.show,
    #navbarContent.active{
        opacity:1 !important;
        visibility:visible !important;
        transform:translateY(0) !important;
        pointer-events:auto !important;
    }

    .navbar-nav{
        width:100% !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        justify-content:flex-start !important;
        gap:0 !important;
    }

    .navbar-nav .nav-item{
        width:100% !important;
    }

    .navbar-nav .nav-item .nav-link,
    .navbar .nav-link{
        width:100% !important;
        display:flex !important;
        align-items:center !important;
        justify-content:flex-start !important;

        padding:17px 14px !important;

        font-size:22px !important;
        font-weight:700 !important;
        color:#ffffff !important;

        background:transparent !important;
        border-bottom:1px solid rgba(255,255,255,.10) !important;
        border-radius:0 !important;
    }

    .navbar-nav .nav-item:last-child .nav-link{
        border-bottom:0 !important;
    }

    .navbar-nav .nav-item .nav-link:hover,
    .navbar-nav .nav-item .nav-link:focus,
    .navbar-nav .nav-item .nav-link:active,
    .navbar-nav .nav-item .nav-link.active,
    .navbar-nav .nav-item.active .nav-link{
        color:#ffffff !important;
        background:transparent !important;
        border-radius:0 !important;
    }

    .navbar-nav .nav-item .nav-link::after,
    .navbar .nav-link::after{
        display:none !important;
    }

    body{
        padding-top:76px !important;
    }
}

/* ==================================================
   KÜÇÜK MOBİL
================================================== */

@media(max-width:576px){
    .navbar.navbar-expand-lg,
    .navbar{
        height:70px !important;
        min-height:70px !important;
    }

    .navbar .container{
        height:70px !important;
        padding:0 16px !important;
    }

    .navbar-brand{
        width:145px !important;
        height:70px !important;
        background-size:contain !important;
    }

    .navbar-toggler{
        width:40px !important;
        height:40px !important;
    }

    .navbar-collapse,
    #navbarContent{
        top:70px !important;
        left:10px !important;
        right:10px !important;
        max-height:calc(100vh - 86px) !important;
        border-radius:18px !important;
    }

    .navbar-nav .nav-item .nav-link,
    .navbar .nav-link{
        font-size:20px !important;
        padding:15px 12px !important;
    }

    body{
        padding-top:70px !important;
    }
}