/* ------------GOOGLEFONTS CDN------------ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Poppins:wght@300;400;500;600;700&display=swap');

/* ------------RESET------------ */
*{
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
}
html{
    font-size: 10px;
    color: #0A0A36;
}
body{
    font-size: 1.6rem;
    font-family: 'Poppins', sans-serif;
}
ol, ul{
    list-style: none;
}
a{
    text-decoration: none;
    color: inherit;
}

.container{
    display: flex;
}
.fluid{
    width: 100%;
}
.dark--blue{
    color: #0A0A36;
}

/* ------------LOGIN------------ */
.login-bg{
    width: 100%;
    height: 100vh;
    background-color: #0A0A36;
    color: #fff;
    font-weight: 500;

    display: flex;
    justify-content: center;
    align-items: center;
  }
  .login-content{
    width: 50rem;
    padding: 5.8rem;
    background-color: #141440;
    border-radius: 15px;
  }
  .login-field{
    margin-bottom: 1.5rem;
    width: 100%;
    display: block;
    position: relative;
  }
  .login-field:first-child {
    margin-top: 2rem;
  }
  .login-input{
    width: 100%;
    padding: 1rem 0 1rem 4rem;
    border-radius: 10px;
    outline: none;
    font-size: 16px;
    border: 1px solid transparent;
  }
  .login-input:hover{
    border: 1px solid #4FABEA;
  }
  .login-submit{
    width: 100%;
    padding: 1.2rem 0 1.2rem 0;
    border-radius: 10px;
    outline: none;
    font-size: 16px;

    background-color: #4FABEA;
    font-weight: 500;
    color: #fff;
  }
  .login-field p{
    margin-bottom: 0.75rem;
  }
  .login-span{
    position: absolute;
    top: 50%;
    transform: translateY(25%);
    left: 2.5%;
    width: 22px;
    height: 22px;
  }
  .login-bg ::placeholder{
      color: #9DA6BA;
      font-family: 'Inter', sans-serif;
  }
  .login-logo{
    width: 12rem;
    margin: 0 auto;
  }



/* ------------SİDEBAR------------ */
.left{
    flex-basis: 16.5%;
    min-height: 100vh;
    min-width: 310px;
    background-color: #0A0A36;
    color: #9091A4;

    display: flex;
    justify-content: center;
}
.sideBar{
    position: fixed;
    min-width: 16.5%;
    padding: 5rem 0;

    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.sideBar__logo{
    padding: 0 3rem 4rem 3rem;
    color: #fff;
    font-weight: 500;
}
.sideBar__link{
    display: block;
    padding: 1.5rem 2rem;

    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all .3s;
}
.sideBar__link__left{
    display: flex;
    justify-content: center;
    align-items: center;
}
.sideBar__title{
    padding: 1rem 3rem;
    color: #484A6A;
    font-family: 'Inter', sans-serif;
}
.sideBar__subList{
    padding: 0 0 0 5rem;
}
.subList--openClose{
    display: none;
}
.fa-chevron-right{
    transition: all .3s;
}
.rotate{
    transform: rotate(90deg);
}
.sideBar__subLink{
    display: block;
    padding: .75rem 0;
    transition: all .3s;
}
.sideBar__icon, .sideBar__icon2{
    margin-right: 1.5rem;
    width: 2rem;
    height: 2rem;
}
.sideBar__icon:hover, .sideBar__icon2{
    fill: #0085FF;
    color: #0085FF;
}
.sideBar__icon2{
    display: none;
}

/* hover */
.sideBar__item:hover .sideBar__link{
    color: #fff;
}
.sideBar__item:hover .sideBar__icon{
    display: none;
}
.sideBar__item:hover .sideBar__icon2{
    display: initial;
}
.sideBar__subItem:hover .sideBar__subLink{
    color: #fff;
}
.sideBar__subLink::before{
    content: "\2022";
    margin-right: 1rem;
    font-size: 2rem;
}
.sideBar__subItem:hover .sideBar__subLink::before{
    color: #4FABEA;
}


/* ------------RİGHT-dealers------------ */
.right{
    flex-grow: 1;
}
.zindex{
    z-index: 100;
}
.blur{
    filter: blur(1px);
}
.profile{
    display: flex;
    justify-content: space-between;
    padding: 2rem 3rem;
    /* filter: blur(2px); */
}
.breadcrumb{
    display: flex;
    color: #9DA6BA;
}
.breadcrumb__item i{
    padding: 0 1.5rem;
}
.breadcrumb--dark{
    color: #697AA2;
}
.profile__right__input{
    padding: 1.3rem 6rem 1.3rem 2rem;
    border: 3px solid #F5F7FD;
    border-radius: 12px;
    outline-color: #4FABEA;
    margin-right: 3rem;
    width: 28rem;
}
.profile__right__btn, .btn--blue{
    padding: 1.7rem 5rem;
    border-radius: 12px;
    color: #fff;
    background-color: #4FABEA;
    font-size: 1.6rem;
    cursor: pointer;
}
.profile-title{
    font-size: 2rem;
}
.profile__right__input::placeholder{
    color: #697AA2;
}

.content{
    background-color: #F7F9FF;
    min-height: calc(100vh - 96px);
    padding: 3rem;
}
.content__item{
    flex-basis: 49%;
    background-color: #fff;
    padding: 2rem;
    box-shadow: 0px 0px 11px 10px rgba(243, 243, 245, 0.15);
    border-radius: 12px;
    font-weight: 500;
    /* border: 1px solid blue; */
    height: 100%;
}
.content__item__scroll{
    overflow: scroll;
}
td, th {
  text-align: left;
  padding: 7px;
}
th{
    color: rgba(157, 166, 186, 1);
    padding: 8px 5px;
    border-bottom: 1px dashed #E4E6EF;
    font-weight: 500;
    font-size: 1.4rem;
}
.row-link{
    display: block;
    width: 100%;
    font-size: 1.4rem;
    height: 3.36rem;
    line-height: 3.36rem;
}
.content__table{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 70rem;
}
.content__table-2__inner{
    margin: 20rem auto;
    text-align: center;
}
.content__table-2__inner p{
    color: #697AA2;
}
.content__table__row:hover, .content__table__row-1:hover{
    background-color: #F7F9FF;
}
.content__table__row td:last-child{
    text-align: right;
}
.content__table__row-1 td:last-child{
    text-align: center;
}
.plus-align a:nth-child(2){
    text-align: center;
}
.sub-info-p{
    /* padding-top: calc(100vh - 38%); */
    color: #697AA2;
}

/* modal-dealers */
.dealers-modal, .list-dealers-modal-ay, .list-dealers-modal-ky, .list-dealers-modal-ady, .list-dealers-modal-uy {
    width: 40%;
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -45%);
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 0 0 100vw rgba(157, 166, 186, .2);
    padding: 2rem;
    color: #9DA6BA;
    display: none;
}
.list-dealers-modal-ay{
    width: 30%;
}
.list-dealers-modal-ky, .list-dealers-modal-ady, .list-dealers-modal-uy{
    width: 40%;
}
select{
    color: #9DA6BA;
}
.dealers-modal__field, .list-dealers-modal-ay__field, .list-dealers-modal-ky__field, .list-dealers-modal-ady__field, .list-dealers-modal-uy__field{
    display: flex;
    flex-direction: column;
}
.dealers-modal__field input, .list-dealers-modal-ay__field input, .list-dealers-modal-ky__field input, .list-dealers-modal-ady__field input, .list-dealers-modal-uy__field input{
    padding: 1rem ;
    outline: 0;
    background-color: #F9F9FB;
    font-size: 1.6rem;
}
.dealers-modal__select{
    display: flex;
    justify-content: space-between;
}
.dealers-modal__select div{
    flex-basis: 48%;
    padding: 1rem 0;
    font-size: 1.6rem;
    outline: 0;
    background-color: #F9F9FB;
}
.dealers-modal__select select{
    width: 100%;
    padding: 1rem 0;
    font-size: 1.6rem;
    outline: 0;
    background-color: #F9F9FB;
}
/* .dealers-modal-item, .list-dealers-modal-ay-item, .list-dealers-modal-ky-item, .list-dealers-modal-ady-item, .list-dealers-modal-uy-item{

} */
.dealers-modal__btn-box, .list-dealers-modal-ay__btn-box, .list-dealers-modal-ky__btn-box, .list-dealers-modal-ady__btn-box, .list-dealers-modal-uy__btn-box{
    display: flex;
    justify-content: space-between;
}
.dealers-modal__btn, .list-dealers-modal-ay__btn, .list-dealers-modal-ky__btn, .list-dealers-modal-ady__btn, .list-dealers-modal-uy__btn{
    flex-basis: 48%;

    margin-top: 1.5rem;
    text-align: center;
    padding: 1.7rem;
    border-radius: 12px;
    background-color: #4FABEA;
    color: #fff;
    cursor: pointer;
    font-size: 1.6rem;
}
.dealers-modal__btn-danger, .list-dealers-modal-ay__btn-danger, .list-dealers-modal-ky__btn-danger, .list-dealers-modal-ady__btn-danger, .list-dealers-modal-uy__btn-danger{
    background-color: rgba(255, 0, 61, .10);
    color: rgba(255, 0, 61, 1);
}
.dealers-modal__field input::placeholder, .list-dealers-modal-ay__field input::placeholder, .list-dealers-modal-ky__field input::placeholder, .list-dealers-modal-ady__field input::placeholder, .list-dealers-modal-uy__field input::placeholder{
    color: #0A0A36;
    color: #9DA6BA;
    font-size: 1.6rem;
}
/* ky */
.flex{
    display: flex;
    justify-content: space-between;
}
.flex .list-dealers-modal-ky-item, .flex .list-dealers-modal-ady-item, .flex .list-dealers-modal-uy-item{
    flex-basis: 48%;
    margin: 2rem;
}
.list-dealers-modal-ady-item{
    position: relative;
}
.search{
    width: 2rem;
    position: absolute;
    top: 50%;
    transform: translate(0, 15%);
    right: 5%;
}



.sub-information{
    display: flex;
    justify-content: space-between;
    color: #697AA2;
    margin-top: 3rem;
}
.pagination__list{
    display: flex;
}
.pagination__item{
    list-style: none;
    line-height: 25px;
    text-align: center;
    cursor: pointer;
    transition: all .3s ease;
}
.numb{
    width: 25px;
    height: 25px;
    border-radius: 50%;
    margin: 0 3px;
}
.dots{
    font-size: 2rem;
    cursor: default;
}
.btn{
    padding: 0 20px;
}
.active, .numb:hover{
    background-color: #E5E8F1;
    color: #697AA2;
}





/* ------------LIST DEALERS------------ */
.ld__content{
    display: flex;
    justify-content: space-evenly;
    background-color: #F7F9FF;
}
.ld__left{
    flex-basis: 20%;
    color: #697AA2;
    margin-top: 2rem;
}
.ld__right{
    flex-basis: 76%;
    margin: 2rem 0;
}
.ld__left__top{
    background-color: #FFFFFF;
    padding: 2rem;
    box-shadow: 0px 0px 11px 10px rgba(243, 243, 245, 0.15);
    border-radius: 12px;
}
.ld__left__top__title{
    border-bottom: 1px dashed #E4E6EF;
    color: #0A0A36 ;
    font-weight: 500 !important;
    font-size: 14px !important;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;

    display: flex;
}
.ld__left__top__title__img{
    margin-right: 2rem;
    width: 4.1rem;
}
.ld__left__top__mute{
    font-size: 1.3rem;
    color: #697AA2;
}
.ld__nav__link{
    display: block;
    padding: 1rem 2rem;
    border-radius: 12px;
    transition: all .3s;

    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ld__nav__link:hover, .ld__nav__link:active, .ld__active{
    color: #4FABEA;
    background-color: rgba(79, 171, 234, .08);
}
.select{
    border: 1px solid #F5F7FD;
    padding: 1rem;
    border-radius: 12px;
    color: #697AA2;
    outline: none;
    font-size: 1.6rem;
}
.select option{
    color: #697AA2;
}
.content__item__top{
    padding-bottom: 2rem;
    display: flex;
    justify-content: space-between;

}
.content__item__top__left p{
    color: #697AA2;
}
.profile__right select{
    width: 200px;
    padding: 1rem;
    outline: 0;
    color: #697AA2;
    font-family: Poppins;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
}
.profile__right option{
    margin:  2rem;
}
.product-img-conteiner{
    width: 4.1rem;
}

.modal-p_item{
    display: flex;
}
.modal-p-img{
    width: 5rem;
    margin-right: 2rem;
}
.modal-p-list{
    margin-top: 2rem;
    max-height: 25rem;
    overflow: auto;
}
.modal-right{
    margin: auto;
    text-align: center;
}
