p,span,b,a,strong,h1,h2,input,button,select {

  font-family: "Nunito", sans-serif!important;

}



















            



.product-item img {



max-height: 350px;


}







.back-to-top i {
    padding-top: 12px;
    color: #ffffff;
}




.image-with-text {
    display: flex;
    align-items: center; /* Resim ve yazıyı ortalar */
    justify-content: flex-start; /* Resim ve yazıyı yatayda hizalar */
    flex-wrap: nowrap; /* Alt alta gelmesini engeller */
    margin-bottom: 15px; /* Her bir öğe arasında boşluk bırak */
}

.image-with-text img {
    width: 60px; /* Resmin genişliğini biraz daha küçült */
    height: auto; /* Orantıyı koruyarak yüksekliği ayarla */
    margin-right: 15px; /* Resmin sağına daha fazla boşluk bırak */
    border-radius: 5px; /* Resimlere hafif yuvarlak kenar ekle */
    object-fit: cover; /* Resmin kesilmesini önler, uygun boyutta görüntü sağlar */
}

.image-with-text div {
    flex-grow: 1; /* Metnin kalan alanı kaplamasına izin verir */
    overflow-wrap: break-word; /* Uzun kelimeleri alt satıra taşır */
    max-width: calc(100% - 75px); /* Resim alanını hesaba katarak yazı genişliğini sınırla */
}

.image-with-text p {
    margin: 0; /* Paragraf dış boşluğunu sıfırla */
    font-size: 14px; /* Yazı boyutunu biraz büyüt */
    line-height: 1.4; /* Satır yüksekliği ekleyerek metni okunabilir yap */
    color: #333; /* Yazı rengini biraz koyu yap */
}

.image-with-text p.price {
    font-weight: bold; /* Fiyatı kalın göster */
    color: #28a745; /* Fiyat rengini yeşil yap */
}
/* Mobil için düzenlemeler */
@media (max-width: 600px) {
    .image-with-text {
        display: flex;
        align-items: center; /* Resim ve yazıyı ortalar */
        justify-content: flex-start; /* Resim ve yazıyı yatayda hizalar */
        flex-wrap: nowrap; /* Alt alta gelmesini engeller */
    }

    .image-with-text img {
        margin-right: 10px; /* Resmin sağına boşluk bırak */
        width: 90px; /* Resmin genişliği sabit */
    }

    .image-with-text div {
        display: flex;
        flex-direction: column; /* Yazıları alt alta hizalar */
        justify-content: center; /* Yazıları ortalar */
        max-width: 200px; /* Yazılar için sabit genişlik belirler */
    }

    .image-with-text p {
        margin: 0;
     
        overflow: hidden; /* Taşan yazıları gizler */
        text-overflow: clip; /* Üç nokta yerine metni keser */
        max-width: 200px; /* Yazı genişliğini sınırlamak için */
    }
}






.product-item img {



max-height: 350px;


}





         






.form-control:focus,
.custom-select:focus {
    box-shadow: none;
    border-color: #FF6F61;
}

.custom-radio,
.custom-checkbox {
    margin-bottom: 15px;
}

.custom-radio .custom-control-label::before,
.custom-checkbox .custom-control-label::before {
    background: #dddddd;
    border-color: #dddddd;
}

.custom-radio .custom-control-input:checked~.custom-control-label::before,
.custom-checkbox .custom-control-input:checked~.custom-control-label::before {
    color: #ffffff;
    background: #FF6F61;
    border-color: #FF6F61;
    box-shadow: none;
}

.btn {
    color: #FF6F61;
    background: #ffffff;
    border: 1px solid #FF6F61;
}

.btn:hover,
.btn:active,
.btn:focus {
    color: #ffffff;
    background: #FF6F61;
    box-shadow: none;
}



/**********************************/
/********** Sidebar CSS ***********/
/**********************************/
.sidebar-widget {
    padding: 30px;
    background: #ffffff;
}

.sidebar-widget:not(:first-child) {
    padding-top: 0;
}

.sidebar-widget .title {
    position: relative;
    font-size: 22px;
    text-transform: capitalize;
    margin-bottom: 15px;
}

.sidebar-widget.category {
      
  
    margin-left: -10px;
}

.sidebar-widget.category .navbar {
    padding: 0;
    overflow: hidden;
    background: #ffffff !important;
}

.sidebar-widget.category .navbar-nav {
    width: 100%;
}

.sidebar-widget.category .navbar li {
    border-bottom: 1px solid #f3f6ff;
}

.sidebar-widget.category .navbar li:last-child {
    border-bottom: none;
}

.sidebar-widget.category .navbar a {
    color: #353535;
}

.sidebar-widget.category .navbar a:hover {
    color: #FF6F61;
}

.sidebar-widget.category .navbar i {
    color: #FF6F61;
    width: 20px;
    text-align: center;
    margin-right: 8px;
}

.sidebar-widget.category .navbar a:hover i {
    color: #353535;
}

.sidebar-widget.brands ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-widget.brands ul li {
    margin-bottom: 12px; 
}

.sidebar-widget.brands ul li:last-child {
    margin-bottom: 0; 
}

.sidebar-widget.brands ul li a {
    color: #353535;
    white-space: nowrap;
    display: inline-block;
    line-height: 23px;
    transition: all .3s;
}

.sidebar-widget.brands ul li a::before {
    content: '\f105';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    padding-right: 5px;
}

.sidebar-widget.brands ul li a:hover {
    color: #FF6F61;
}

.sidebar-widget.brands ul li a:hover::before {
    content: '\f101';
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
}

.sidebar-widget.brands ul li a:hover {
    padding-left: 10px; 
}

.sidebar-widget.brands ul li span {
    display: inline-block;
    float: right;
    color: #666666;
    font-size: 14px;
    font-weight: 400;
}

.sidebar-widget.widget-slider {
    position: relative;
}

.sidebar-widget.image a {
    display: block;
    width: 100%;
    overflow: hidden;
}

.sidebar-widget.image img {
    max-width: 100%;
    transition: .3s;
}

.sidebar-widget.image img:hover {
    transform: scale(1.1);
    filter: blur(3px);
    -webkit-filter: blur(3px);
}

.sidebar-widget.tag a {
    display: inline-block;
    margin: 0 0 4px 0;
   
    font-size: 14px;
    color: #353535;
    background: #ffffff;
 
    border-radius: 4px;
    transition: .3s;
}

.sidebar-widget.tag a:hover {
    color: #393286
   
   
}

.genislikleriayarla{
   width: clamp(300px, 85vw, 1920px);
    margin: 0 auto;
}

#listeler { border:2px solid #ccc; min-width:200px;width:auto; height: 100px; overflow-y: scroll;float:left;margin-bottom:30px;

   
}
.product-card {
    background-color: #ffffff;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    padding: 15px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height:500px;
}

.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.product-card__image {
    margin-bottom: 15px;
    padding: 5px; /* Padding added to create some space around the image */
}

.product-card__image img {
    width: 100%;
    height: 230px; /* Maximum height to maintain aspect ratio */
    object-fit: contain;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.product-card__image img:hover {
    transform: scale(1.02); /* Slight zoom on hover */
}

.product-card__details {
    text-align: center;
}

.product-card__title {
    font-size: 18px;
    margin: 10px 0;
    color: #333;
}

.product-card__price {
    font-size: 20px;
    color: #e67e22;
    margin: 5px 0;
}

.product-card__old-price {
    text-decoration: line-through;
    color: #999;
    font-size: 14px;
    margin: 5px 0;
}

.product-card__description {
    font-size: 14px;
    color: #666;
    margin: 10px 0;
}

.product-card__brand,
.product-card__store {
    font-size: 14px;
    color: #444;
}

.product-card__actions {
    margin-top: 15px;
}

.product-card__actions a {
    color: #666;
    margin: 0 10px;
    transition: color 0.3s ease;
}

.product-card__actions a:hover {
    color: #e67e22;
}


@media screen and (min-width: 768px) {
    .product-card {
        flex: 1 1 calc(33.333% - 20px); /* Ürün kartlarını 3 sütuna bölecek şekilde ayarladık */
        margin: 10px; /* Kartlar arası boşlukları artırdık */
    }
}






.pagination {
    display: flex;
    justify-content: center;
    margin: 20px 0;
    list-style: none;
    padding: 0;
}

.page-item {
    margin: 0 5px;
}

.page-item a {
 display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    text-decoration: none;
    color: #393286;
    background-color: #f8f9fa;
    border-radius: 50% !important;
    transition: background-color 0.3s, color 0.3s;
    font-size: 16px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid #ddd;

}

.page-item a:hover {
    background-color: #e67e22;
    color: #ffffff;
}

.page-item.active a {
    background-color: #e67e22;
    color: #ffffff;
}

.page-item a i {
    font-size: 18px;
}

/* Responsive Ayarlar */
@media (max-width: 600px) {
    .pagination {
        flex-wrap: wrap;
    }

    .page-item a {
        width: 35px;
        height: 35px;
        font-size: 14px;
    }

    .page-item a i {
        font-size: 14px;
    }
}


.checkbox label:after, 
.radio label:after {
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr,
.radio .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;
    border-radius: .25em;
    width: 1.3em;
    height: 1.3em;
    margin-right: .5em;
    float: left;
}

.radio .cr {
    border-radius: 50%;
}

.checkbox .cr .cr-icon,
.radio .cr .cr-icon {
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
}

.radio .cr .cr-icon {
    margin-left: 0.04em;
}

.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

.checkbox label input[type="checkbox"] + .cr > .cr-icon,
.radio label input[type="radio"] + .cr > .cr-icon {
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
.radio label input[type="radio"]:checked + .cr > .cr-icon {
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
}

.checkbox label input[type="checkbox"]:disabled + .cr,
.radio label input[type="radio"]:disabled + .cr {
    opacity: .5;
}

  





@media only screen and (max-width: 767px) {
    .kategorilerbolumu {
        background-color: #fff !important;

    }
}



.kategorilerbolumu {
       
       margin:40px 0;

    }








.list-group {
    margin-bottom: 20px;
    padding: 16px 3px;
}


.urun img {
    object-fit: cover;
    width: 100%;
    height: auto;
}

.urun img {
    image-rendering: -webkit-optimize-contrast;
}