/* ==========================================================
   kender-duzeltmeler.css  (v5)
   Mevcut stillerin ÜZERİNE biner; eski CSS dosyalarına dokunmaz.
   Master sayfada kender-widgets.css'ten SONRA eklenmelidir:
   <link rel="stylesheet" href="css/kender-duzeltmeler.css?v=5" type="text/css" />
   Geri almak için: bu dosyanın <link> satırını silmeniz yeterli.

   İçerik:
   1) Güncel Duyurular (soluk meta, teal hover, modern alt linkler)
   2) Blog yazıları (kenar çubuğu listesi + ortak yazı düzeni)
   3) Bugün Doğan Üyelerimiz
   4) Popüler Blog Yazıları (tek çerçeveli liste, büyütülmüş)
   ========================================================== */


/* ==========================================================
   1) GÜNCEL DUYURULAR
   ========================================================== */

/* "Tarih" ve "Ekleyen": daha soluk, daha ince */
.kn-body .kn-notice__meta,
.kn-body .kn-notice__meta.date {
    color: #8a9ea3;
    font-size: .85rem;
    font-weight: 400;
}

    .kn-body .kn-notice__meta span {
        color: inherit;
        font-weight: inherit;
    }

/* Hover: açık sarı yerine teal tonu */
.kn-body .kn-section .kn-notice {
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

    .kn-body .kn-section .kn-notice:hover,
    .kn-body .kn-section .kn-notice:focus-within {
        background-color: #f0f7f8;
        border-color: #9fc8d0;
        box-shadow: 0 6px 18px rgba(15, 61, 74, .10);
    }

/* Alt linkler: Duyuru Resim / Ayrı Pencere / Tüm Duyurular */
.kn-body .kn-notice__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #dde9eb;
}

    .kn-body .kn-notice__actions .kn-act {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-height: 38px;
        padding: 0 15px;
        border: 1px solid #c5dadd;
        border-radius: 999px;
        background: #fff;
        color: #0f3d4a;
        font-size: .9rem;
        font-weight: 600;
        line-height: 1;
        text-decoration: none;
        transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
    }

        .kn-body .kn-notice__actions .kn-act svg {
            flex: none;
            width: 16px;
            height: 16px;
            fill: none;
            stroke: currentColor;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .kn-body .kn-notice__actions .kn-act:hover,
        .kn-body .kn-notice__actions .kn-act:focus-visible {
            background: #e8f3f5;
            border-color: #007083;
            color: #007083;
            text-decoration: none;
        }

        .kn-body .kn-notice__actions .kn-act:focus-visible {
            outline: 3px solid rgba(0, 112, 131, .3);
            outline-offset: 2px;
        }

    /* "Tüm Duyurular": ana eylem, sağda dolu düğme */
    .kn-body .kn-notice__actions .kn-act--primary {
        margin-left: auto;
        background: #0f3d4a;
        border-color: #0f3d4a;
        color: #fff;
    }

        .kn-body .kn-notice__actions .kn-act--primary:hover,
        .kn-body .kn-notice__actions .kn-act--primary:focus-visible {
            background: #007083;
            border-color: #007083;
            color: #fff;
        }

        .kn-body .kn-notice__actions .kn-act--primary svg {
            transition: transform .15s ease;
        }

        .kn-body .kn-notice__actions .kn-act--primary:hover svg {
            transform: translateX(3px);
        }

@media (max-width: 480px) {
    .kn-body .kn-notice__actions .kn-act {
        flex: 1 1 auto;
        justify-content: center;
    }

    .kn-body .kn-notice__actions .kn-act--primary {
        margin-left: 0;
        flex-basis: 100%;
    }
}


/* ==========================================================
   2) BLOG YAZILARI
   Ortak düzen: avatar solda, metin sağda.
   (Popüler Blog Yazıları için bu kurallar 4. bölümde ezilir.)
   ========================================================== */

.kn-aside .kn-post,
.kn-postgrid .kn-post {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    column-gap: 12px;
    align-items: start;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.kn-aside .kn-post__avatar,
.kn-postgrid .kn-post__avatar {
    grid-column: 1;
    grid-row: 1 / span 3;
    float: none;
    display: block;
    margin: 0;
    width: 56px;
    height: 56px;
}

    .kn-aside .kn-post__avatar img,
    .kn-postgrid .kn-post__avatar img {
        display: block;
        width: 56px;
        height: 56px;
        object-fit: cover;
        border-radius: 50%;
        border: 1px solid #cfe0e3;
        box-shadow: none;
    }

.kn-aside .kn-post__name,
.kn-aside .kn-post__title,
.kn-aside .kn-post__date,
.kn-postgrid .kn-post__name,
.kn-postgrid .kn-post__title,
.kn-postgrid .kn-post__date {
    grid-column: 2;
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

.kn-aside .kn-post__name,
.kn-postgrid .kn-post__name {
    color: #0f3d4a;
    font-size: .95em;
    font-weight: 700;
    line-height: 1.3;
}

.kn-aside .kn-post__title,
.kn-postgrid .kn-post__title {
    margin-top: 2px;
    line-height: 1.35;
}

    .kn-aside .kn-post__title a,
    .kn-postgrid .kn-post__title a {
        color: #006274;
        text-decoration: none;
    }

        .kn-aside .kn-post__title a:hover,
        .kn-postgrid .kn-post__title a:hover {
            color: #0f3d4a;
            text-decoration: underline;
        }

.kn-aside .kn-post__date,
.kn-postgrid .kn-post__date {
    margin-top: 2px;
    color: #8aa0a5;
    font-size: .82em;
    font-weight: 400;
}

/* --- Kenar çubuğu: ince çizgiyle ayrılan liste --- */
.kn-aside .kn-post {
    margin: 0;
    padding: 11px 6px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #dbe6e8;
    border-radius: 6px;
    box-shadow: none;
}

    .kn-aside .kn-post:last-of-type {
        border-bottom-color: transparent;
    }

    .kn-aside .kn-post:hover,
    .kn-aside .kn-post:focus-within {
        background: #f1f7f8;
    }


/* ==========================================================
   3) BUGÜN DOĞAN ÜYELERİMİZ
   ========================================================== */

.kn-bday__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 10px;
}

.kn-bday__item {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    column-gap: 14px;
    align-items: center;
    padding: 10px 12px;
    background: linear-gradient(135deg, #f1f8f9 0%, #ffffff 70%);
    border: 1px solid #d3e3e6;
    border-radius: 12px;
    transition: border-color .15s ease, box-shadow .15s ease;
}

    .kn-bday__item:hover {
        border-color: #7fb3bd;
        box-shadow: 0 4px 12px rgba(15, 61, 74, .10);
    }

/* Üye fotoğrafı: teal halka + küçük pasta rozeti */
.kn-bday__avatar {
    position: relative;
    display: block;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #dbe8ea url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237f9ea5' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c0-3.9 3.1-7 7-7s7 3.1 7 7'/%3E%3C/svg%3E") center / 58% no-repeat;
}

    .kn-bday__avatar img {
        display: block;
        width: 56px;
        height: 56px;
        object-fit: cover;
        border-radius: 50%;
        border: 2px solid #fff;
        box-shadow: 0 0 0 2px #007083;
    }

.kn-bday__badge {
    position: absolute;
    right: -4px;
    bottom: -4px;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--kn-amber, #e08a1e);
    color: #fff;
    border: 2px solid #fff;
}

    .kn-bday__badge svg {
        width: 12px;
        height: 12px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.kn-bday__info {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.kn-bday__name {
    margin: 0;
    font-weight: 700;
    line-height: 1.3;
    color: #0f3d4a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .kn-bday__name a {
        color: inherit;
        text-decoration: none;
    }

        .kn-bday__name a:hover {
            color: #007083;
            text-decoration: underline;
        }

.kn-bday__user {
    margin: 0;
    font-size: .85rem;
    color: #6f878d;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.kn-bday__date {
    margin: 0;
    font-size: .85rem;
    font-weight: 600;
    color: #007083;
}

/* Kayıt yoksa gösterilen mesaj (Literal'e yazılan metin de aynı görünümü alır) */
.kn-bday__empty,
.kn-bday__lit:not(:empty) {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: #f3f9fa;
    border: 1px dashed #b7d4d9;
    border-radius: 12px;
    color: #4d6b72;
    font-size: .95rem;
    line-height: 1.4;
}

    .kn-bday__empty svg {
        flex: none;
        width: 30px;
        height: 30px;
        fill: none;
        stroke: #7fb3bd;
        stroke-width: 1.6;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .kn-bday__empty p {
        margin: 0;
    }

    .kn-bday__empty small {
        display: block;
        margin-top: 2px;
        color: #8aa0a5;
        font-size: .85em;
    }

/* Kod arkası Literal'e mesaj yazdıysa aynı mesajı iki kez göstermeyelim */
.kn-bday:has(.kn-bday__lit:not(:empty)) .kn-bday__empty {
    display: none;
}


/* ==========================================================
   4) POPÜLER BLOG YAZILARI – v5 (tek çerçeveli liste, büyütülmüş)
   Düzen: tek çerçeve, içinde ince çizgiyle ayrılan satırlar.
   Her satır: solda avatar | üstte başlık | altta yazar · tarih
   Bu bölüm, 2. bölümdeki .kn-postgrid kurallarını geçersiz kılar.
   ========================================================== */
.kn-postgrid {
    display: block;
    gap: 0;
    background: #fff;
    border: 1px solid #d3e3e6;
    border-radius: 12px;
    overflow: hidden; /* satır hover'ı köşeleri taşırmasın */
    box-shadow: 0 1px 3px rgba(15, 61, 74, .06);
}

    .kn-postgrid .kn-post {
        display: grid;
        grid-template-columns: 54px auto minmax(0, 1fr);
        grid-template-areas:
            "avatar title title"
            "avatar name  date";
        grid-template-rows: auto auto;
        column-gap: 14px;
        row-gap: 3px;
        align-items: center;
        margin: 0;
        padding: 15px 20px;
        background: transparent;
        border: 0;
        border-bottom: 1px solid #e1ecee;
        border-radius: 0;
        box-shadow: none;
        transition: background-color .15s ease, box-shadow .15s ease;
    }

        .kn-postgrid .kn-post:last-child {
            border-bottom: 0;
        }

        /* Hover: açık teal zemin + soldan ince vurgu çizgisi */
        .kn-postgrid .kn-post:hover,
        .kn-postgrid .kn-post:focus-within {
            background: #f1f7f8;
            border-color: #e1ecee;
            box-shadow: inset 3px 0 0 #007083;
        }

    /* Avatar: iki satırın ortasında */
    .kn-postgrid .kn-post__avatar {
        grid-area: avatar;
        align-self: center;
        width: 54px;
        height: 54px;
    }

        .kn-postgrid .kn-post__avatar img {
            width: 54px;
            height: 54px;
        }

    /* Başlık: sabit min-height yok, boş alan kalmaz */
    .kn-postgrid .kn-post__title {
        grid-area: title;
        box-sizing: border-box;
        min-height: 0;
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 1.15rem;
        font-weight: 700;
        line-height: 1.35;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

        .kn-postgrid .kn-post__title a {
            color: #0f3d4a;
            text-decoration: none;
        }

            .kn-postgrid .kn-post__title a:hover {
                color: #007083;
                text-decoration: none;
            }

    /* Alt satır: Yazar · Tarih */
    .kn-postgrid .kn-post__name {
        grid-area: name;
        align-self: center;
        margin: 0;
        font-size: .95rem;
        font-weight: 600;
        line-height: 1.3;
        color: #27474f;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }

    .kn-postgrid .kn-post__date {
        grid-area: date;
        align-self: center;
        margin: 0;
        font-size: .88rem;
        line-height: 1.3;
        color: #8aa0a5;
        white-space: nowrap;
    }

        .kn-postgrid .kn-post__date::before {
            content: "·";
            margin-right: 8px;
            color: #b7ccd0;
        }

@media (max-width: 480px) {
    .kn-postgrid .kn-post {
        grid-template-columns: 46px auto minmax(0, 1fr);
        column-gap: 11px;
        padding: 12px 14px;
    }

    .kn-postgrid .kn-post__avatar,
    .kn-postgrid .kn-post__avatar img {
        width: 46px;
        height: 46px;
    }

    .kn-postgrid .kn-post__title {
        font-size: 1.05rem;
    }
}