/* KK Haber Paneli — Tüm Stiller */
/* Font: Roboto (Google Fonts) */

/* ── Değişkenler ──────────────────────────────────────────── */
.kkp-wrap {
    --kkp-accent: #C8102E;
    --kkp-baslik-renk: #111;
    font-family: 'Roboto', sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ── Boş durum ─────────────────────────────────────────────── */
.kkp-empty {
    padding: 14px 16px;
    color: #999;
    font-size: 13px;
    font-family: 'Roboto', sans-serif;
}

/* ════════════════════════════════════════════════════════════
   ORTAK BAŞLIK
   ════════════════════════════════════════════════════════════ */
.kkp-wrap {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    overflow: hidden;
}
.kkp-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px 12px;
}
.kkp-head-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--kkp-baslik-renk);
    letter-spacing: -.01em;
}
.kkp-head-more {
    font-size: 10px;
    font-weight: 600;
    color: var(--kkp-accent);
    text-decoration: none;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.kkp-head-more:hover { opacity: .75; }

/* ════════════════════════════════════════════════════════════
   STİL A — Tam Fotoğraf Kart Listesi
   ════════════════════════════════════════════════════════════ */
.kkp-stil-a .kkp-a-grid {
    display: flex;
    flex-direction: column;
}
.kkp-stil-a .kkp-a-card {
    position: relative;
    display: block;
    height: 170px;
    overflow: hidden;
    text-decoration: none;
    border-top: 1px solid #eee;
    flex-shrink: 0;
}
.kkp-stil-a .kkp-a-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: brightness(.48);
    transition: filter .3s, transform .4s;
}
.kkp-stil-a .kkp-a-card:hover img {
    filter: brightness(.38);
    transform: scale(1.04);
}
.kkp-stil-a .kkp-a-over {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 16px 14px;
    background: linear-gradient(to top, rgba(0,0,0,.88) 0%, transparent 100%);
}
.kkp-stil-a .kkp-a-accent {
    width: 22px;
    height: 3px;
    background: var(--kkp-accent);
    margin-bottom: 7px;
}
.kkp-stil-a .kkp-a-kat {
    font-size: 9px;
    font-weight: 700;
    color: var(--kkp-accent);
    text-transform: uppercase;
    letter-spacing: .13em;
    margin-bottom: 5px;
    background: rgba(255,255,255,.93);
    display: inline-block;
    padding: 2px 7px;
}
.kkp-stil-a .kkp-a-title {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    line-height: 1.35;
}
.kkp-stil-a .kkp-a-tarih {
    font-size: 10px;
    color: rgba(255,255,255,.45);
    margin-top: 5px;
}

/* ════════════════════════════════════════════════════════════
   STİL B — 2 Kolon Fotoğraf Grid
   ════════════════════════════════════════════════════════════ */
.kkp-b-divider {
    width: 28px;
    height: 3px;
    background: var(--kkp-accent);
    margin: 0 14px 12px;
}
.kkp-stil-b .kkp-b-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.kkp-stil-b .kkp-b-card {
    position: relative;
    display: block;
    height: 140px;
    overflow: hidden;
    text-decoration: none;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
}
.kkp-stil-b .kkp-b-card:nth-child(2n)   { border-right: none; }
.kkp-stil-b .kkp-b-card:nth-last-child(-n+2) { border-bottom: none; }
.kkp-stil-b .kkp-b-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: brightness(.44);
    transition: filter .3s, transform .4s;
}
.kkp-stil-b .kkp-b-card:hover img {
    filter: brightness(.34);
    transform: scale(1.05);
}
.kkp-stil-b .kkp-b-over {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 8px 10px;
    background: linear-gradient(to top, rgba(0,0,0,.88), transparent);
}
.kkp-stil-b .kkp-b-accent {
    width: 16px;
    height: 2px;
    background: var(--kkp-accent);
    margin-bottom: 5px;
}
.kkp-stil-b .kkp-b-title {
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    line-height: 1.3;
}

/* ════════════════════════════════════════════════════════════
   STİL C — Büyük Featured + 2 Mini + Liste
   ════════════════════════════════════════════════════════════ */
.kkp-stil-c .kkp-c-feat {
    position: relative;
    display: block;
    height: 180px;
    overflow: hidden;
    text-decoration: none;
    border-top: 1px solid #eee;
}
.kkp-stil-c .kkp-c-feat img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: brightness(.45);
    transition: filter .3s, transform .4s;
}
.kkp-stil-c .kkp-c-feat:hover img {
    filter: brightness(.35);
    transform: scale(1.04);
}
.kkp-stil-c .kkp-c-feat-over {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 14px;
    background: linear-gradient(to top, rgba(0,0,0,.9) 0%, transparent 100%);
}
.kkp-stil-c .kkp-c-kat {
    font-size: 9px;
    font-weight: 700;
    background: var(--kkp-accent);
    color: #fff;
    padding: 2px 8px;
    display: inline-block;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: .1em;
}
.kkp-stil-c .kkp-c-feat-title {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    line-height: 1.35;
}
.kkp-stil-c .kkp-c-feat-tarih {
    font-size: 10px;
    color: rgba(255,255,255,.45);
    margin-top: 5px;
}
.kkp-stil-c .kkp-c-mini-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid #eee;
}
.kkp-stil-c .kkp-c-mini {
    position: relative;
    display: block;
    height: 100px;
    overflow: hidden;
    text-decoration: none;
    border-right: 1px solid #eee;
}
.kkp-stil-c .kkp-c-mini:last-child { border-right: none; }
.kkp-stil-c .kkp-c-mini img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: brightness(.42);
    transition: filter .3s;
}
.kkp-stil-c .kkp-c-mini:hover img { filter: brightness(.32); }
.kkp-stil-c .kkp-c-mini-over {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 6px 9px;
    background: linear-gradient(to top, rgba(0,0,0,.88), transparent);
}
.kkp-stil-c .kkp-c-mini-kat {
    font-size: 8px;
    font-weight: 700;
    color: var(--kkp-accent);
    text-transform: uppercase;
    letter-spacing: .1em;
    margin-bottom: 2px;
}
.kkp-stil-c .kkp-c-mini-title {
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    line-height: 1.25;
}
.kkp-stil-c .kkp-c-liste {
    border-top: 1px solid #eee;
}

/* ════════════════════════════════════════════════════════════
   STİL D + C liste ortak — Thumb Liste
   ════════════════════════════════════════════════════════════ */
.kkp-d-item {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid #f2f2f2;
    text-decoration: none;
    color: inherit;
    transition: background .15s;
}
.kkp-d-item:last-child { border-bottom: none; }
.kkp-d-item:hover { background: #fafafa; }

.kkp-d-thumb {
    width: 76px;
    height: 62px;
    object-fit: cover;
    flex-shrink: 0;
    filter: brightness(.9);
    transition: filter .25s;
}
.kkp-d-item:hover .kkp-d-thumb { filter: brightness(.78); }

.kkp-d-ic {
    flex: 1;
    padding: 8px 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}
.kkp-d-top {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 3px;
    flex-wrap: wrap;
}
.kkp-d-kat {
    font-size: 9px;
    font-weight: 700;
    color: var(--kkp-accent);
    text-transform: uppercase;
    letter-spacing: .1em;
}
.kkp-d-kaynak {
    font-size: 9px;
    font-weight: 500;
    color: #bbb;
    letter-spacing: .04em;
}
.kkp-d-kaynak::before {
    content: '·';
    margin-right: 5px;
    color: #ddd;
}
.kkp-d-title {
    font-size: 12px;
    font-weight: 500;
    color: #111;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.kkp-d-item:hover .kkp-d-title { color: var(--kkp-accent); }
.kkp-d-tarih {
    font-size: 10px;
    color: #bbb;
    margin-top: 3px;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 480px) {
    .kkp-stil-b .kkp-b-card { height: 110px; }
    .kkp-stil-a .kkp-a-card { height: 140px; }
    .kkp-stil-c .kkp-c-feat  { height: 150px; }
    .kkp-d-thumb { width: 60px; height: 52px; }
}

/* ════════════════════════════════════════════════════════════
   STİL E — Orijinal: Sol Kırmızı Şerit + Featured + Numaralı Liste
   ════════════════════════════════════════════════════════════ */
.kkp-stil-e {
    background: #f7f4f0;
    border: none;
    border-left: 3px solid var(--kkp-accent);
    border-radius: 0;
}
.kkp-e-baslik {
    background: var(--kkp-accent);
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .2em;
    text-transform: uppercase;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.kkp-e-dot {
    width: 6px;
    height: 6px;
    background: rgba(255,255,255,.5);
    border-radius: 50%;
    flex-shrink: 0;
}
.kkp-e-feat {
    position: relative;
    height: 175px;
    overflow: hidden;
    flex-shrink: 0;
    text-decoration: none;
    display: block;
    border-bottom: 1px solid #e8e2da;
}
.kkp-e-feat-bg {
    width: 100%;
    height: 100%;
    background: #1a1a1a;
}
.kkp-e-feat-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: brightness(.52);
    transition: filter .3s, transform .45s;
}
.kkp-e-feat:hover .kkp-e-feat-bg img {
    filter: brightness(.42);
    transform: scale(1.05);
}
.kkp-e-feat-ic {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 14px 14px;
    background: linear-gradient(to top, rgba(0,0,0,.92) 0%, transparent 100%);
}
.kkp-e-feat-etiketler {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 6px;
}
.kkp-e-feat-kat {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--kkp-accent);
    background: rgba(255,255,255,.92);
    padding: 3px 8px;
    display: inline-block;
}
.kkp-e-feat-kaynak {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: rgba(255,255,255,.5);
    border: 1px solid rgba(255,255,255,.2);
    padding: 3px 8px;
    display: inline-block;
}
.kkp-e-feat-title {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    line-height: 1.3;
}
.kkp-e-liste {
    display: flex;
    flex-direction: column;
}
.kkp-e-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 8px 15px;
    border-bottom: 1px solid #ece8e0;
    text-decoration: none;
    color: inherit;
    transition: background .15s;
}
.kkp-e-item:hover { background: #f0ebe3; }
.kkp-e-item:last-child { border-bottom: none; }
.kkp-e-item-aktif {
    border-left: 3px solid var(--kkp-accent);
    padding-left: 12px;
}
.kkp-e-no {
    font-size: 22px;
    font-weight: 900;
    color: #e0d8d0;
    line-height: 1;
    flex-shrink: 0;
    width: 22px;
    text-align: center;
    margin-top: 2px;
}
.kkp-e-ic { flex: 1; min-width: 0; }
.kkp-e-etiketler {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
    margin-bottom: 3px;
}
.kkp-e-kat {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--kkp-accent);
}
.kkp-e-kaynak {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .06em;
    color: #aaa;
}
.kkp-e-title {
    font-size: 13px;
    font-weight: 500;
    color: #111;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.kkp-e-item:hover .kkp-e-title { color: var(--kkp-accent); }
.kkp-e-tarih {
    font-size: 10px;
    color: #bbb;
    margin-top: 3px;
    letter-spacing: .04em;
}

/* ════════════════════════════════════════════════════════════
   SLIDER YÜKSEKLİK EŞİTLEME
   Elementor "Sütun Hizalaması: Uzat" + JS sync ile çalışır
   ════════════════════════════════════════════════════════════ */

/* Elementor widget sarmalayıcısını tam yüksekliğe uzat */
.elementor-widget-kk_haber_paneli {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.elementor-widget-kk_haber_paneli .kkp-wrap {
    flex: 1;
    overflow-y: auto;
    /* scrollbar ince ve temiz */
    scrollbar-width: thin;
    scrollbar-color: var(--kkp-accent) transparent;
}

.elementor-widget-kk_haber_paneli .kkp-wrap::-webkit-scrollbar {
    width: 3px;
}

.elementor-widget-kk_haber_paneli .kkp-wrap::-webkit-scrollbar-thumb {
    background: var(--kkp-accent);
    border-radius: 2px;
}

/* Stil E'de (klasik) scrollbar özel arka plan */
.elementor-widget-kk_haber_paneli .kkp-stil-e {
    background: #f7f4f0;
}