/* categories.css - Bootstrap 3.3.5 uyumlu */

/* Ana container */
.categories-page {
    font-family: "Roboto Condensed", sans-serif;
    background-color: #f8f9fa;
}
.c-video-icon{
    font-size:32px !important; 
    font-family: web-fontreqular!important;
    color:#e7505a!important;
    padding-left:7px;
}
/* Sidebar kategoriler - Sticky yapıldı */
.category-sidebar {
    background: #ffffff;
    min-height: 600px;
    padding: 25px 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
    position: -webkit-sticky; /* Safari için */
    position: sticky;
    top: 20px;
    z-index: 10;
}

.category-title {
    font-size: 20px;
    font-weight: 700;
    color: #4d4d4d;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 3px solid #F80058;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.category-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.category-item {
    margin-bottom: 5px;
}

.category-link {
    display: block;
    padding: 15px 20px;
    color: #666666;
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.3s ease;
    font-size: 15px;
    font-weight: 500;
    border-left: 4px solid transparent;
    position: relative;
    overflow: hidden;
}

.category-link:before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(248, 0, 88, 0.1), transparent);
    transition: left 0.5s ease;
}

.category-link:hover {
    background-color: #f8f9fa;
    color: #4d4d4d;
    text-decoration: none;
    border-left-color: #F80058;
    transform: translateX(5px);
}

.category-link:hover:before {
    left: 100%;
}

.category-link.active {
    background-color: #4d4d4d;
    color: white;
    border-left-color: #F80058;
    box-shadow: 0 4px 12px rgba(77, 77, 77, 0.2);
}

.category-link.active:hover {
    background-color: #5a5a5a;
    transform: translateX(0);
}

.category-link i {
    margin-right: 10px;
    font-size: 16px;
}

/* Ürünler container */
.products-container {
   /* background: #ffffff;
    border-radius: 8px;
    padding: 30px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    position: relative;*/
}
.c-padding-remove{
    padding-left:8px !important;
    padding-right:6px !important;
}

.c-padding-r-r{
    padding-left:2px !important;
}
.products-grid {
    position: relative;
    min-height: 400px;
}

/* Loading overlay */
.loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 100;
    border-radius: 8px;
}

.loading-overlay .fa-spinner {
    color: #F80058;
    margin-bottom: 10px;
}

/* Ürün kutuları - mevcut stillerle uyumlu */
.c-content-product-2 {
  /*  transition: all 0.3s ease;
    border-radius: 8px;*/
    overflow: hidden;
}

.catalog-title{
    
    white-space: nowrap !important;
    width: 280px!important;
    overflow: hidden;
    text-overflow: ellipsis;
}

/*.c-content-product-2:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}*/

/* Pagination */
.pagination {
    margin: 30px 0 10px 0;
}

.pagination > li > a {
    color: #4d4d4d;
    border-color: #ddd;
    transition: all 0.3s ease;
}

.pagination > li > a:hover {
    background-color: #F80058;
    color: white;
    border-color: #F80058;
}

.pagination > .active > a {
    background-color: #4d4d4d;
    border-color: #4d4d4d;
    color: white;
}

.pagination > .active > a:hover {
    background-color: #F80058;
    border-color: #F80058;
}

/* Alert styles */
.alert-info {
    background-color: #f4f8ff;
    border-color: #b8daff;
    color: #0c5460;
}

.alert-danger {
    background-color: #fff5f5;
    border-color: #feb2b2;
    color: #742a2a;
}

@media (max-width: 768px) {
     .category-sidebar {
        padding: 15px 1px;
        border-radius: 6px;
        position: static; /* Mobile'da sticky kaldır */
        margin-bottom: 20px;
    }
    
    .category-title {
        font-size: 18px;
        margin-bottom: 20px;
        text-align: center; /* Sol hizalama */
    }
    
    .category-list {
        display: block; /* Normal liste görünümü */
        overflow-x: visible;
        white-space: normal;
        padding-bottom: 0;
        margin: 0;
        padding-left: 0;
        padding-right: 0;
    }
    
    .category-item {
        margin-right: 0;
        margin-bottom: 5px;
        flex-shrink: none;
    }
    
    .category-link {
        white-space: normal;
        min-width: auto;
        text-align: left; /* Sol hizalama */
        padding: 12px 16px;
        font-size: 14px;
        display: block;
        width: 100%;
    }
    
    .category-list::-webkit-scrollbar {
        height: 4px;
    }
    
    .category-list::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 2px;
    }
    
    .category-list::-webkit-scrollbar-thumb {
        background: #F80058;
        border-radius: 2px;
    }
    
    .category-link:hover {
        transform: translateX(0);
    }
    
    .products-container {
     /*   padding: 20px 10px;*/
    }
}

@media (max-width: 480px) {
    .category-link {
        min-width: 130px;
        padding: 5px 10px;
        font-size: 13px;
    }
    
    .c-video-icon{
    font-size:28px !important; 
    font-family: web-fontreqular!important;
    padding-left:7px;
}
    .c-content-product-2 .c-label{
            padding: 5px 5px !important;
    }
    .category-link i {
        margin-right: 6px;
        font-size: 14px;
    }
    
    .products-container {
      /*  padding: 15px 8px;*/
    }
    
    .pagination > li > a {
        padding: 8px 12px;
        font-size: 14px;
    }
}

/* Smooth animations */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* Responsive Design */
@media (max-width: 991px) {
    .category-sidebar {
        margin-bottom: 30px;
        min-height: auto;
        /*padding: 20px 15px;*/
        position: static; /* Tablet'te sticky kaldır */
    }
    .c-padding-remove{
    padding-left:8px !important;
    padding-right:6px !important;
    }
    
    .c-padding-r-r{
        padding-left:4px !important;
        padding-right:0px !important;
    }
    .products-container {
      /*  padding: 20px 15px;*/
    }
}
/* ---- MOBILE TAP FIX for product cards ---- */
.c-content-product-2 { position: relative; }

/* Görsel link her şeyin üstünde ve tam tıklanabilir olsun */
.c-content-product-2 > a {
  position: relative;
  z-index: 5;
  display: block;          /* dokunma alanını büyütür */
}

/* Resim blok davransın (boş tıklama alanı kalmasın) */
.c-content-product-2 > a > img {
  display: block;
  width: 100%;
  height: auto;
}

/* Dekoratif katmanlar dokunuşu YAKALAMASIN */
.c-content-product-2 .c-label,
.c-content-product-2 .c-video-icon,
.c-content-product-2::before,
.c-content-product-2::after {
  pointer-events: none !important;
}

/* Bilgi alanı linkin önüne geçmesin */
.c-content-product-2 .c-info {
  position: relative;
  z-index: 3;
}