/* ==========================================================================
   Ürün listeleme kartı (Urunler.aspx)
   --------------------------------------------------------------------------
   Bu dosyadaki sınıf adlarının tamamı "idsk-" ön ekiyle başlar ve projedeki
   hiçbir CSS/JS dosyasında geçmez; kart bu yüzden style.css / lisa.css /
   responsive.css içindeki kurallarla eşleşmez.

   İki ek önlem var:
   1) Kart içindeki her elemanda tipografi ve kutu özellikleri açıkça
      yazılıyor. Böylece style.css'teki genel etiket kuralları (h2{...},
      a{...}, img{...}, ul{...}) kartın içine sızamıyor.
   2) Kartın içinde ikinci bir <a> yok. Eski kartta ana bağlantının içine
      "sepete ekle / favori" bağlantıları yerleştirilmişti; iç içe <a>
      HTML'de geçersiz olduğu için tarayıcı DOM'u yeniden kuruyor ve
      görsel, ana bağlantının dışına taşındığı için ölçü kuralları
      uygulanmıyordu. Yeni kartta bağlantı tek ve en dışta.

   Dosya Urunler.aspx'in head bölümünde, diğer üç stil dosyasından SONRA
   yükleniyor.
   ========================================================================== */

.idsk-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-gap: 24px;
    gap: 24px;
    margin: 0 0 40px;
    padding: 0;
    list-style: none;
}

.idsk-item {
    display: flex;
    min-width: 0;
    margin: 0;
    padding: 0;
}

/* Kartın tamamı tek bağlantı. */
.idsk-link {
    display: flex;
    flex-direction: column;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    background: #fff;
    border: 1px solid #ececec;
    color: inherit;
    text-decoration: none;
    transition: box-shadow .25s ease;
}

.idsk-link:hover,
.idsk-link:focus,
.idsk-link:active {
    color: inherit;
    text-decoration: none;
    outline: 0;
    box-shadow: 0 6px 20px rgba(0, 0, 0, .08);
}

/* --- Görsel alanı ------------------------------------------------------- */
.idsk-gorsel {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 100%;
    /*height: 298px;*/
    margin: 0;
    padding: 0;
    background: #fff;
    overflow: hidden;
    line-height: 0;
}

.idsk-img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    object-fit: contain;
}

/* Lansman etiketi - görselin sağ üst köşesinde. */
.idsk-lansman {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    width: 70px;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
}

/* Kampanya şeridi - görselin alt kenarına oturur, kartın gövdesini
   aşağı itmez; böylece rozetli ve rozetsiz kartlarda ürün adı aynı
   hizada kalır. */
.idsk-rozet {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    box-sizing: border-box;
    margin: 0;
    padding: 5px 12px;
    background: #cf2f28;
    color: #fff;
    font-family: Averta, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: normal;
    text-align: center;
    text-transform: none;
}

/* "Online" kampanyalar mavi şeritle ayrılıyor (eski kartın davranışı). */
.idsk-rozet-mavi {
    background: #4f7f9e;
}

/* --- Gövde -------------------------------------------------------------- */
.idsk-govde {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    box-sizing: border-box;
    margin: 0;
    padding: 22px 24px 24px;
}

.idsk-ad {
    display: block;
    margin: 0;
    padding: 0;
    font-family: Averta, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: normal;
    text-align: left;
    text-transform: none;
    color: #1c3a52;
    min-height: 45px;
}

/* Fiyat satırı kartın en altına yapışır; ürün adı kısa olsa da kartlar
   aynı hizada biter. */
.idsk-alt {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    box-sizing: border-box;
    margin: 40px 0 0;
    padding: 18px 0 0;
    border-top: 1px solid #e6e6e6;
}

.idsk-fiyat {
    margin: 0;
    padding: 0;
    font-family: Averta, sans-serif;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
    color: #1c1c1c;
}

.idsk-fiyat-eski {
    margin: 0 0 0 12px;
    padding: 0;
    font-family: Averta, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
    color: #a7a7a7;
    text-decoration: line-through;
}

/* Kartın kendi gizleme sınıfı - bootstrap/lisa'daki d-none'a bağlı değil. */
.idsk-gizli {
    display: none;
}

/* --- Kırılımlar --------------------------------------------------------- */
@media screen and (max-width: 1199px) {
    /*.idsk-gorsel {
        height: 250px;
    }*/
}

@media screen and (max-width: 991px) {
    .idsk-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media screen and (max-width: 767px) {
    .idsk-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-gap: 16px;
        gap: 16px;
    }
    /*.idsk-gorsel {
        height: 200px;
    }*/
    .idsk-govde {
        padding: 16px 16px 18px;
    }
    .idsk-ad {
        font-size: 14px;
        min-height: 40px;
    }
    .idsk-alt {
        margin-top: 24px;
        padding-top: 14px;
    }
    .idsk-fiyat {
        font-size: 15px;
    }
    .idsk-fiyat-eski {
        font-size: 13px;
        margin-left: 8px;
    }
}

@media screen and (max-width: 479px) {
    .idsk-grid {
        grid-template-columns: minmax(0, 1fr);
    }
  /*  .idsk-gorsel {
        height: 240px;
    }*/
}