/* ======================================
   FASİKÜL ROZETİ + KART GÖRSEL ZEMİNİ
   Şeffaf (PNG) kitap kapakları için kırık beyaz zemin ve
   görselin sol üstünde duran "X FASİKÜL İÇERİR" rozeti.
   coksatanalar.css'ten SONRA yüklenmelidir.
   ====================================== */

/* Şeffaf PNG kapaklar için çok soft gri zemin */
.coksatanlar-card .card-image {
    background: #F4F4F5;
}

/* Rozet kapsayıcısı: kalkan (shield) formu */
.fasikul-rozet {
    position: absolute;
    top: 4.5%;
    left: 4.5%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    width: clamp(58px, 25%, 78px);
    padding: 5px 5px 11px;
    border-radius: 12px;
    background: #E4E4E7;
    clip-path: polygon(0 0, 100% 0, 100% 83%, 50% 100%, 0 83%);
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.12));
    font-family: Inter, sans-serif;
    line-height: 1;
    text-align: center;
    pointer-events: none;
    /* Rozetin iç ölçüleri bu değerden türetilir */
    font-size: clamp(9px, 3.3vw, 11px);
}

/* Mor iç gövde: sayı + "FASİKÜL İÇERİR" */
.fasikul-rozet-govde {
    width: 100%;
    padding: 0.55em 0.2em 0.5em;
    border-radius: 0.85em;
    background: #A21E7E;
    color: #FFF;
}

.fasikul-rozet-sayi {
    display: block;
    font-size: 2.1em;
    font-weight: 900;
    letter-spacing: -0.01em;
}

.fasikul-rozet-metin {
    display: block;
    margin-top: 0.35em;
    font-size: 0.82em;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: 0.02em;
}

/* Rozetin altındaki eğitim yılı */
.fasikul-rozet-yil {
    display: block;
    margin-top: 0.45em;
    color: #A21E7E;
    font-size: 0.72em;
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* --- Ürün detay sayfasındaki büyük kitap görseli --- */
/* Yeni kapaklar şeffaf PNG; zemin ve sığdırma kart tasarımıyla aynı. */
.kitap-gorsel {
    background: #F4F4F5;
}

.kitap-gorsel img {
    object-fit: contain;
    padding: 16px;
}

/* Büyük görselde rozet de orantılı olarak büyür */
.fasikul-rozet--buyuk {
    top: 5%;
    left: 5%;
    width: clamp(72px, 17%, 104px);
    padding: 7px 7px 15px;
    border-radius: 16px;
    font-size: clamp(11px, 1.6vw, 15px);
}

/* Küçük ekranlarda rozet biraz daha derli toplu */
@media screen and (max-width: 480px) {
    .fasikul-rozet {
        width: clamp(52px, 23%, 68px);
        font-size: 9px;
        padding: 4px 4px 9px;
    }
}