/* ============================================================
   Amortisman Sınırı Widget — Özelleştirilebilir Stiller
   Tüm değerleri kendi temanıza göre düzenleyebilirsiniz.
   ============================================================ */

/* --- Renk & Tipografi Değişkenleri -------------------------
   Sadece bu bölümü düzenleyerek tüm widgetı değiştirebilirsiniz.
   ----------------------------------------------------------- */
.amo-widget {
    --amo-renk-ana:        #185FA5;   /* Vurgu / başlık rengi     */
    --amo-renk-ana-acik:   #E6F1FB;   /* Açık mavi arka plan      */
    --amo-renk-ana-sinir:  #85B7EB;   /* Açık mavi kenarlık       */
    --amo-renk-rozet:      #185FA5;   /* "güncel" rozet arka planı */
    --amo-renk-metin:      #1a1a1a;   /* Ana metin                */
    --amo-renk-ikincil:    #555555;   /* İkincil / açıklama metin */
    --amo-renk-sinir:      #e0e0e0;   /* Tablo çizgileri          */
    --amo-renk-arkaplan:   #f7f8fa;   /* Tablo thead arka planı   */
    --amo-renk-hover:      #f0f5fb;   /* Satır hover              */
    --amo-yari-cerceve:    8px;       /* Köşe yuvarlaklığı        */
    --amo-font:            inherit;   /* Sitenizin fontu devralır  */

    font-family: var(--amo-font);
    color: var(--amo-renk-metin);
    max-width: 640px;
    margin: 0 auto;
    padding: 1.5rem 0;
}

/* --- Başlık ------------------------------------------------ */
.amo-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 1.25rem;
}

.amo-header-icon {
    width: 40px;
    height: 40px;
    border-radius: var(--amo-yari-cerceve);
    background: var(--amo-renk-ana-acik);
    color: var(--amo-renk-ana);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.amo-baslik {
    font-size: 1.15rem;
    font-weight: 600;
    margin: 0 0 2px;
    color: var(--amo-renk-metin);
}

.amo-albaslik {
    font-size: 0.8rem;
    color: var(--amo-renk-ikincil);
    margin: 0;
}

/* --- Tablo Kapsayıcı --------------------------------------- */
.amo-tablo-kap {
    border: 1px solid var(--amo-renk-sinir);
    border-radius: var(--amo-yari-cerceve);
    overflow: hidden;
}

/* --- Tablo ------------------------------------------------- */
.amo-tablo {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.amo-tablo thead tr {
    background: var(--amo-renk-arkaplan);
}

.amo-tablo thead th {
    padding: 10px 16px;
    text-align: left;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--amo-renk-ikincil);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-bottom: 1px solid var(--amo-renk-sinir);
}

.amo-tablo thead th:last-child {
    text-align: right;
}

.amo-tablo tbody tr {
    border-bottom: 1px solid var(--amo-renk-sinir);
    transition: background 0.15s ease;
}

.amo-tablo tbody tr:last-child {
    border-bottom: none;
}

.amo-tablo tbody tr:hover {
    background: var(--amo-renk-hover);
}

.amo-tablo tbody td {
    padding: 9px 16px;
    color: var(--amo-renk-metin);
}

.amo-tablo tbody td:last-child {
    text-align: right;
    font-weight: 500;
}

/* --- Güncel Yıl Satırı ------------------------------------- */
.amo-tablo .amo-satir-guncel {
    background: var(--amo-renk-ana-acik);
}

.amo-tablo .amo-satir-guncel td {
    color: var(--amo-renk-ana);
    font-weight: 600;
}

/* --- "güncel" Rozeti --------------------------------------- */
.amo-rozet {
    display: inline-block;
    background: var(--amo-renk-rozet);
    color: #ffffff;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 20px;
    margin-left: 6px;
    letter-spacing: 0.04em;
    vertical-align: middle;
    text-transform: lowercase;
}

/* --- Hata Mesajı ------------------------------------------- */
.amo-hata {
    color: #c0392b;
    font-size: 0.875rem;
    padding: 0.75rem 1rem;
    border: 1px solid #f5c6cb;
    border-radius: var(--amo-yari-cerceve);
    background: #fff5f5;
}

/* --- Mobil Uyumluluk --------------------------------------- */
@media (max-width: 480px) {
    .amo-guncel-kutu {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .amo-guncel-yil {
        font-size: 1.6rem;
    }

    .amo-tablo thead th,
    .amo-tablo tbody td {
        padding: 8px 10px;
    }
}
