/*
 * HaberPro teması — resources/views/Frontend/HaberProTemplate/ ile birlikte çalışır.
 * İzolasyon: her kural .theme-haber-pro altında tanımlanır, sınıf öneki hp-, değişken öneki --hp-.
 * Eski temaların (News / NewsV2 / Blog) hiçbir class veya CSS değişkeniyle çakışmaz.
 */

.theme-haber-pro {
    --hp-primary: #c8102e;
    --hp-primary-dark: #970c22;
    --hp-ink: #14171a;
    --hp-body: #33383d;
    --hp-muted: #6b7280;
    --hp-bg: #f2f3f5;
    --hp-surface: #ffffff;
    --hp-border: #e2e4e8;
    --hp-radius: 6px;
    --hp-maxw: 1280px;
    --hp-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    --hp-sp-1: 4px;
    --hp-sp-2: 8px;
    --hp-sp-3: 12px;
    --hp-sp-4: 16px;
    --hp-sp-5: 24px;
    --hp-sp-6: 32px;
    --hp-sp-7: 48px;

    margin: 0;
    font-family: var(--hp-font);
    color: var(--hp-body);
    background: var(--hp-bg);
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
}
.theme-haber-pro *, .theme-haber-pro *::before, .theme-haber-pro *::after { box-sizing: border-box; }
.theme-haber-pro img { max-width: 100%; display: block; }
.theme-haber-pro a { color: inherit; text-decoration: none; }
.theme-haber-pro a:hover { color: var(--hp-primary); }
.theme-haber-pro ul { list-style: none; margin: 0; padding: 0; }
.theme-haber-pro button { font: inherit; cursor: pointer; }
.theme-haber-pro h1, .theme-haber-pro h2, .theme-haber-pro h3, .theme-haber-pro h4 {
    color: var(--hp-ink); line-height: 1.25; margin: 0 0 .5em; font-weight: 800;
}
.theme-haber-pro :focus-visible { outline: 2px solid var(--hp-primary); outline-offset: 2px; }
.theme-haber-pro .hp-sr-only {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0);
}

.hp-container { max-width: var(--hp-maxw); margin: 0 auto; padding: 0 var(--hp-sp-4); }

/* ---------- Reklam alanı: yalnızca mevcut pozisyonlar için nötr saramaç ---------- */
.hp-adslot { display: block; text-align: center; overflow: hidden; }
.hp-adslot:empty { display: none; }

/* ---------- Döviz şeridi (mevcut Doviz::Get() verisi, sadece dolar_kuru==1111 sitelerinde) ---------- */
.hp-topbar { background: var(--hp-ink); color: #fff; font-size: .78rem; }
.hp-topbar__inner { display: flex; align-items: center; gap: var(--hp-sp-4); padding: 6px var(--hp-sp-4); overflow-x: auto; scrollbar-width: none; }
.hp-topbar__inner::-webkit-scrollbar { display: none; }
.hp-topbar__list { display: flex; gap: 18px; white-space: nowrap; }
.hp-topbar__list li { display: flex; gap: 6px; align-items: center; }
.hp-topbar__name { color: #9aa0a6; }
.hp-topbar__value { font-weight: 700; }
.hp-topbar__list li.is-up .hp-topbar__value { color: #4ade80; }
.hp-topbar__list li.is-down .hp-topbar__value { color: #f87171; }
.hp-topbar__date { margin-left: auto; color: #9aa0a6; white-space: nowrap; }

/* ---------- Header ---------- */
.hp-header { background: var(--hp-surface); border-bottom: 1px solid var(--hp-border); }
.hp-header__inner {
    display: flex; align-items: center; gap: var(--hp-sp-5); padding: var(--hp-sp-4);
    max-width: var(--hp-maxw); margin: 0 auto;
}
.hp-logo__text { font-size: 1.6rem; font-weight: 800; color: var(--hp-primary); letter-spacing: -.02em; white-space: nowrap; }
.hp-logo img { height: 44px; width: auto; }
.hp-burger {
    display: none; flex-direction: column; gap: 5px; background: none; border: 0; padding: 8px;
    margin-left: auto;
}
.hp-burger span { width: 22px; height: 2px; background: var(--hp-ink); display: block; }

.hp-nav { background: var(--hp-ink); }
.hp-nav__inner { max-width: var(--hp-maxw); margin: 0 auto; padding: 0 var(--hp-sp-4); }
.hp-nav__list { display: flex; flex-wrap: wrap; }
.hp-nav__link {
    display: flex; align-items: center; min-height: 44px; padding: 0 var(--hp-sp-4);
    font-weight: 600; font-size: .88rem; color: #e5e7eb; letter-spacing: .01em;
}
.hp-nav__link:hover { background: rgba(255,255,255,.08); color: #fff; }
.hp-nav__link.is-active { background: var(--hp-primary); color: #fff; }

/* Keşfet (Google Discover) yönlendirmeli görünüm: sade tutulur */
.hp-body--kesfet .hp-nav, .hp-body--kesfet .hp-topbar { display: none; }

@media (max-width: 900px) {
    .hp-burger { display: flex; }
    .hp-nav__inner { padding: 0; }
    .hp-nav { max-height: 0; overflow: hidden; transition: max-height .25s ease; }
    .hp-nav.is-open { max-height: 600px; overflow-y: auto; }
    .hp-nav__list { flex-direction: column; }
    .hp-nav__link { width: 100%; padding: 0 var(--hp-sp-4); border-bottom: 1px solid rgba(255,255,255,.08); }
}

/* ---------- Son dakika bandı (mevcut $Manset verisinin sunum katmanı, sadece Anasayfa) ---------- */
.hp-breaking { background: linear-gradient(90deg, var(--hp-primary-dark), var(--hp-primary)); color: #fff; }
.hp-breaking__inner { display: flex; align-items: center; gap: var(--hp-sp-4); padding: 0 var(--hp-sp-4); height: 40px; max-width: var(--hp-maxw); margin: 0 auto; }
.hp-breaking__badge {
    flex: 0 0 auto; display: flex; align-items: center; gap: 6px; background: #fff; color: var(--hp-primary-dark);
    font-weight: 800; font-size: .7rem; letter-spacing: .03em; padding: 4px 10px; border-radius: 3px; text-transform: uppercase;
}
.hp-breaking__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--hp-primary); animation: hp-pulse 1.4s ease-in-out infinite; }
.hp-breaking__track { flex: 1; overflow: hidden; }
.hp-breaking__marquee { display: flex; width: max-content; animation: hp-marquee 32s linear infinite; }
.hp-breaking:hover .hp-breaking__marquee, .hp-breaking:focus-within .hp-breaking__marquee { animation-play-state: paused; }
.hp-breaking__list { display: flex; gap: 40px; white-space: nowrap; padding-right: 40px; }
.hp-breaking__list a { color: #fff; font-size: .85rem; font-weight: 600; }
.hp-breaking__list a:hover { color: #ffd9a0; }
@keyframes hp-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes hp-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }

/* ---------- Hero / ana manşet ---------- */
.hp-hero { padding: var(--hp-sp-5) 0 0; display: grid; grid-template-columns: 1fr; gap: var(--hp-sp-4); }
@media (min-width: 900px) { .hp-hero { grid-template-columns: 2fr 1fr; } }

.hp-slider { position: relative; border-radius: var(--hp-radius); overflow: hidden; background: var(--hp-border); }
.hp-slider__track {
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
}
.hp-slider__track::-webkit-scrollbar { display: none; }
.hp-slider__slide { flex: 0 0 100%; scroll-snap-align: start; position: relative; aspect-ratio: 16/9; }
.hp-slider__slide img { width: 100%; height: 100%; object-fit: cover; }
.hp-slider__overlay {
    position: absolute; inset: auto 0 0 0; padding: 48px var(--hp-sp-5) var(--hp-sp-4);
    background: linear-gradient(to top, rgba(0,0,0,.88), rgba(0,0,0,.35) 60%, rgba(0,0,0,0));
}
.hp-slider__tag {
    display: inline-block; background: var(--hp-primary); color: #fff; font-size: .72rem; font-weight: 700;
    text-transform: uppercase; padding: 3px 9px; border-radius: 3px; margin-bottom: var(--hp-sp-2);
}
.hp-slider__overlay h1, .hp-slider__overlay a.hp-slider__title {
    color: #fff; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.3rem); font-weight: 800; line-height: 1.2;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.hp-slider__nav {
    position: absolute; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border-radius: 50%;
    background: rgba(0,0,0,.45); color: #fff; border: 0; display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem; z-index: 2;
}
.hp-slider__nav:hover { background: rgba(0,0,0,.7); }
.hp-slider__nav--prev { left: var(--hp-sp-3); }
.hp-slider__nav--next { right: var(--hp-sp-3); }
.hp-slider[data-hp-single] .hp-slider__nav { display: none; }

/* Sağ sütun flex ile dağıtılır ki sol slider'ın yüksekliğini boş alan bırakmadan doldursun
   (16:9 ile sabitlenen sol sütun satırın yüksekliğini belirler, sağdaki öğeler flex:1 ile
   o yüksekliği eşit paylaşır — bkz. CSS Grid align-items:stretch + flex column tekniği). */
.hp-hero__side { display: flex; flex-direction: column; gap: var(--hp-sp-3); }
/* img mutlak konumlandırılır: normal akışa yükseklik katkısı sıfır olur, böylece satırın
   yüksekliğini soldaki (aspect-ratio ile sabit) slider belirler; sağdaki öğeler flex:1 ile
   o yüksekliği eşit paylaşır. img'i akışta bırakmak, kendi doğal en-boy oranıyla satırı
   gereğinden uzatıp altında boş alan kalmasına yol açıyordu. */
.hp-hero__side-item { position: relative; border-radius: var(--hp-radius); overflow: hidden; flex: 1; min-height: 110px; }
.hp-hero__side-item img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hp-hero__side-item .hp-slider__overlay { padding: 28px var(--hp-sp-3) var(--hp-sp-2); }
.hp-hero__side-item .hp-slider__overlay a.hp-slider__title { font-size: 1rem; -webkit-line-clamp: 2; }

/* ---------- Öne çıkanlar şeridi (yatay, kaydırılabilir) ---------- */
.hp-strip { display: flex; gap: var(--hp-sp-3); overflow-x: auto; padding: var(--hp-sp-4) 0 0; scroll-snap-type: x proximity; }
.hp-strip__item {
    scroll-snap-align: start; flex: 0 0 auto; display: flex; align-items: center; gap: var(--hp-sp-2);
    background: var(--hp-surface); border: 1px solid var(--hp-border); border-radius: var(--hp-radius);
    padding: 6px; width: 260px;
}
.hp-strip__item img { width: 56px; height: 56px; border-radius: 4px; object-fit: cover; flex-shrink: 0; }
.hp-strip__item span { font-size: .82rem; font-weight: 600; line-height: 1.3; color: var(--hp-ink); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- Hızlı haberler (manşet altı) ---------- */
.hp-quick { padding: var(--hp-sp-5) 0 0; }
.hp-quick__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--hp-sp-4); }
@media (min-width: 640px) { .hp-quick__grid { grid-template-columns: repeat(4, 1fr); } }

/* ---------- Bölüm başlığı ---------- */
.hp-section { padding: var(--hp-sp-6) 0 0; }
.hp-section__head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: var(--hp-sp-4); }
.hp-section__title { display: flex; align-items: center; gap: var(--hp-sp-2); font-size: 1.2rem; text-transform: uppercase; letter-spacing: .01em; }
.hp-section__title::before { content: ""; width: 4px; height: 1.1em; background: var(--hp-primary); border-radius: 2px; display: inline-block; }
.hp-section__more { font-size: .82rem; font-weight: 700; color: var(--hp-primary); white-space: nowrap; }
.hp-section__divider { height: 2px; background: var(--hp-ink); margin: var(--hp-sp-3) 0 0; }

/* ---------- Kart grid ---------- */
.hp-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--hp-sp-4); }
@media (min-width: 640px) { .hp-grid--3, .hp-grid--4 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 960px) { .hp-grid--4 { grid-template-columns: repeat(4, 1fr); } }

.hp-card { background: var(--hp-surface); border: 1px solid var(--hp-border); border-radius: var(--hp-radius); overflow: hidden; display: flex; flex-direction: column; }
.hp-card__media { display: block; aspect-ratio: 16/9; background: var(--hp-border); overflow: hidden; }
.hp-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.hp-card:hover .hp-card__media img { transform: scale(1.04); }
.hp-card__body { padding: var(--hp-sp-3); display: flex; flex-direction: column; gap: var(--hp-sp-1); flex: 1; }
.hp-card__cat { font-size: .7rem; font-weight: 700; color: var(--hp-primary); text-transform: uppercase; }
.hp-card__title { font-size: 1rem; margin: 0; }
.hp-card__title a { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.hp-card__time { margin-top: auto; padding-top: var(--hp-sp-1); font-size: .74rem; color: var(--hp-muted); }

/* Kategori ana haberi (büyük kart) */
.hp-card--featured { flex-direction: column; }
.hp-card--featured .hp-card__media { aspect-ratio: 16/9; }
.hp-card--featured .hp-card__title { font-size: 1.35rem; }
.hp-card--featured .hp-card__title a { -webkit-line-clamp: 3; }
@media (min-width: 640px) {
    .hp-card--featured { flex-direction: row; }
    .hp-card--featured .hp-card__media { width: 55%; aspect-ratio: auto; }
    .hp-card--featured .hp-card__body { width: 45%; justify-content: center; }
    /* Görsel satırı metinden uzun olduğunda tarih "margin-top:auto" ile alta yapışıp
       başlıkla arasında büyük boş alan bırakıyordu; burada blok birlikte ortalanır. */
    .hp-card--featured .hp-card__time { margin-top: var(--hp-sp-2); }
}

/* ---------- Yatay küçük kart (satır) ---------- */
.hp-row { display: flex; align-items: center; gap: var(--hp-sp-3); padding: var(--hp-sp-3) 0; border-bottom: 1px solid var(--hp-border); }
.hp-row:last-child { border-bottom: 0; }
.hp-row__thumb { flex-shrink: 0; width: 72px; height: 72px; border-radius: 4px; overflow: hidden; background: var(--hp-border); }
.hp-row__thumb img { width: 100%; height: 100%; object-fit: cover; }
.hp-row__body { min-width: 0; }
.hp-row__cat { font-size: .68rem; font-weight: 700; color: var(--hp-primary); text-transform: uppercase; }
.hp-row__title { font-size: .92rem; margin: 2px 0 0; font-weight: 600; }
.hp-row__title a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hp-row__time { font-size: .72rem; color: var(--hp-muted); margin-top: 2px; display: block; }

/* ---------- Numaralı kompakt liste (sidebar / son haberler) ---------- */
.hp-list__item { display: flex; align-items: center; gap: var(--hp-sp-3); padding: var(--hp-sp-2) 0; border-bottom: 1px solid var(--hp-border); }
.hp-list__item:last-child { border-bottom: 0; }
.hp-list__num { font-size: 1.15rem; font-weight: 800; color: var(--hp-border); width: 24px; flex-shrink: 0; text-align: center; }
.hp-list__thumb { flex-shrink: 0; width: 56px; height: 56px; border-radius: 4px; overflow: hidden; background: var(--hp-border); }
.hp-list__thumb img { width: 100%; height: 100%; object-fit: cover; }
.hp-list__title { font-size: .85rem; margin: 0; font-weight: 600; }
.hp-list__title a { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- Görselsiz kompakt başlık listesi ---------- */
.hp-compact-list__item { padding: var(--hp-sp-2) 0; border-bottom: 1px solid var(--hp-border); display: flex; gap: var(--hp-sp-2); align-items: baseline; }
.hp-compact-list__item:last-child { border-bottom: 0; }
.hp-compact-list__item::before { content: "›"; color: var(--hp-primary); font-weight: 800; }
.hp-compact-list__title { font-size: .88rem; font-weight: 600; }

/* ---------- Ana içerik + sidebar ---------- */
.hp-layout { display: grid; grid-template-columns: 1fr; gap: var(--hp-sp-6); align-items: start; }
@media (min-width: 1024px) { .hp-layout { grid-template-columns: 2fr 1fr; } }
.hp-sidebar { display: flex; flex-direction: column; gap: var(--hp-sp-6); }
@media (min-width: 1024px) { .hp-sidebar { position: sticky; top: var(--hp-sp-4); } }
.hp-sidebar__block { background: var(--hp-surface); border: 1px solid var(--hp-border); border-radius: var(--hp-radius); padding: var(--hp-sp-4); }
.hp-sidebar__title { display: flex; align-items: center; gap: var(--hp-sp-2); font-size: 1rem; text-transform: uppercase; padding-bottom: var(--hp-sp-2); margin-bottom: var(--hp-sp-3); border-bottom: 2px solid var(--hp-ink); }
.hp-sidebar__title::before { content: ""; width: 3px; height: 1em; background: var(--hp-primary); display: inline-block; border-radius: 2px; }

/* ---------- Kategori düzen çeşitleri ---------- */
.hp-catmod--split { display: grid; grid-template-columns: 1fr; gap: var(--hp-sp-4); }
@media (min-width: 900px) { .hp-catmod--split { grid-template-columns: 3fr 2fr; } }
.hp-catmod--split .hp-grid { grid-template-columns: repeat(2, 1fr); }

.hp-catmod--stack .hp-grid { grid-template-columns: repeat(3, 1fr); margin-bottom: var(--hp-sp-4); }
@media (max-width: 639px) {
    /* 3 öğe 2 kolona sığmayınca 3. kart yalnız kalıp yanında boşluk bırakıyordu — mobilde tek kolon. */
    .hp-catmod--stack .hp-grid { grid-template-columns: 1fr; }
}

.hp-catmod--pair { display: grid; grid-template-columns: 1fr; gap: var(--hp-sp-4); }
@media (min-width: 900px) { .hp-catmod--pair { grid-template-columns: 3fr 2fr; } }
.hp-catmod--pair .hp-grid { grid-template-columns: 1fr; }

/* ---------- Kırıntı / Breadcrumb ---------- */
.hp-breadcrumb { padding: var(--hp-sp-3) 0; font-size: .8rem; color: var(--hp-muted); }
.hp-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 6px; }
.hp-breadcrumb li:not(:last-child)::after { content: "/"; margin-left: 6px; color: var(--hp-border); }
.hp-breadcrumb a:hover { color: var(--hp-primary); }

/* ---------- Kategori sayfası başlığı ---------- */
.hp-page-head { padding: var(--hp-sp-2) 0 var(--hp-sp-4); }
.hp-page-head h1 { font-size: 1.7rem; }
.hp-page-head p { color: var(--hp-muted); margin: var(--hp-sp-1) 0 0; }

/* ---------- Haber detay ---------- */
.hp-article { background: var(--hp-surface); border: 1px solid var(--hp-border); border-radius: var(--hp-radius); padding: var(--hp-sp-5); }
.hp-article__head h1 { font-size: 1.7rem; margin-bottom: var(--hp-sp-3); }
.hp-article__desc { font-size: 1.05rem; color: var(--hp-muted); margin-bottom: var(--hp-sp-3); }
.hp-article__meta { display: flex; gap: var(--hp-sp-3); flex-wrap: wrap; font-size: .82rem; color: var(--hp-muted); align-items: center; margin-bottom: var(--hp-sp-4); }
.hp-article__meta a { font-weight: 700; color: var(--hp-primary); }
.hp-article__figure { margin: 0 0 var(--hp-sp-4); aspect-ratio: 16/9; border-radius: var(--hp-radius); overflow: hidden; background: var(--hp-border); }
.hp-article__figure img { width: 100%; height: 100%; object-fit: cover; }
.hp-article__body { font-size: 1.08rem; line-height: 1.75; color: var(--hp-body); word-wrap: break-word; }
.hp-article__body img { border-radius: 4px; margin: var(--hp-sp-4) auto; height: auto; }
.hp-article__body p { margin: 0 0 var(--hp-sp-4); }
.hp-article__body h2, .hp-article__body h3 { margin-top: var(--hp-sp-5); }

/* ---------- Statik sayfa içeriği ---------- */
.hp-prose { background: var(--hp-surface); border: 1px solid var(--hp-border); border-radius: var(--hp-radius); padding: var(--hp-sp-5); font-size: 1.05rem; line-height: 1.75; }
.hp-prose img { border-radius: 4px; }

/* ---------- Footer ---------- */
.hp-footer { background: var(--hp-ink); color: #cbd0d6; margin-top: var(--hp-sp-7); }
.hp-footer__inner { display: grid; grid-template-columns: 1fr; gap: var(--hp-sp-5); padding: var(--hp-sp-6) var(--hp-sp-4); max-width: var(--hp-maxw); margin: 0 auto; }
@media (min-width: 720px) { .hp-footer__inner { grid-template-columns: 2fr 1fr 1fr; } }
.hp-footer .hp-logo__text { color: #fff; }
.hp-footer__title { font-size: .82rem; text-transform: uppercase; color: #fff; margin-bottom: var(--hp-sp-3); }
.hp-footer__links li { margin-bottom: var(--hp-sp-2); }
.hp-footer__links a { font-size: .86rem; color: #9aa3ad; }
.hp-footer__links a:hover { color: #fff; }
.hp-footer__copy { color: #7c838d; font-size: .8rem; margin-top: var(--hp-sp-3); }

/* ---------- Yukarı çık ---------- */
.hp-top {
    position: fixed; right: 16px; bottom: 16px; width: 42px; height: 42px; border-radius: 50%;
    background: var(--hp-ink); color: #fff; border: 0; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0,0,0,.25); z-index: 50;
}
.hp-top[hidden] { display: none; }

@media (prefers-reduced-motion: reduce) {
    .theme-haber-pro .hp-breaking__marquee { animation: none; }
    .theme-haber-pro .hp-breaking__track { overflow-x: auto; }
    .theme-haber-pro .hp-breaking__dot { animation: none; }
    .theme-haber-pro .hp-slider__track { scroll-behavior: auto; }
}

@media (max-width: 640px) {
    .hp-article__head h1, .hp-page-head h1 { font-size: 1.35rem; }
    .hp-slider__overlay h1, .hp-slider__overlay a.hp-slider__title { font-size: 1.3rem; -webkit-line-clamp: 3; }
}