/* =========================================================
   Sojo Times — Ek özellikler stilleri
   Mevcut CSS değişkenlerini kullanır; karanlık modla uyumludur.
   ========================================================= */

/* ---------------------------------------------------------
   1. OKUMA KONTROLLERİ — yazı boyutu ölçeği
   --------------------------------------------------------- */
html[data-reading-scale="sm"] .st-article-body { font-size: 1.10rem; }
html[data-reading-scale="lg"] .st-article-body { font-size: 1.40rem; }
html[data-reading-scale="xl"] .st-article-body { font-size: 1.58rem; }

@media (max-width: 768px) {
    html[data-reading-scale="sm"] .st-article-body { font-size: 0.96rem; }
    html[data-reading-scale="lg"] .st-article-body { font-size: 1.18rem; }
    html[data-reading-scale="xl"] .st-article-body { font-size: 1.32rem; }
}

/* Kayan kontrol çubuğu — rafine gazete pill'i */
.sojo-reading-dock {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 940;
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 5px 7px;
    background: color-mix(in srgb, var(--st-paper, #fff) 88%, transparent);
    -webkit-backdrop-filter: saturate(1.1) blur(10px);
    backdrop-filter: saturate(1.1) blur(10px);
    border: 1px solid color-mix(in srgb, var(--st-ink, #121212) 12%, transparent);
    border-radius: 999px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 10px 30px rgba(0, 0, 0, .14);
    animation: sojoDockIn .35s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes sojoDockIn {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

.sojo-reading-fontsize {
    display: flex;
    align-items: center;
    gap: 1px;
    margin-right: 5px;
    padding-right: 7px;
    position: relative;
}
.sojo-reading-fontsize::after {
    content: "";
    position: absolute;
    right: 0;
    top: 18%;
    bottom: 18%;
    width: 1px;
    background: color-mix(in srgb, var(--st-ink, #121212) 16%, transparent);
}

.sojo-rc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 38px;
    height: 38px;
    padding: 0 12px;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--st-ink, #121212);
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: background .16s ease, color .16s ease, transform .12s ease, opacity .16s ease;
}
.sojo-rc-btn:hover { background: color-mix(in srgb, var(--st-ink, #121212) 8%, transparent); }
.sojo-rc-btn:active { transform: scale(.94); }
.sojo-rc-btn:focus-visible { outline: 2px solid var(--st-ink, #121212); outline-offset: 2px; }

/* Yazı boyutu butonları: A glyph'leri tutarlı, +/- üst simge gibi */
.sojo-rc-btn[data-font-step] { min-width: 34px; padding: 0 9px; }
.sojo-rc-btn[data-font-step="down"] { font-size: 0.82rem; }
.sojo-rc-btn[data-font-step="reset"] { font-size: 1rem; }
.sojo-rc-btn[data-font-step] span { font-size: .72em; vertical-align: .12em; margin-left: 1px; opacity: .7; }
.sojo-rc-btn--lg { font-size: 1.2rem; }

/* Aktif / sınır durumları */
.sojo-rc-btn[data-font-step="reset"].is-active {
    background: var(--st-ink, #121212);
    color: var(--st-paper, #fff);
}
.sojo-rc-btn.is-disabled {
    opacity: .32;
    pointer-events: none;
}

.sojo-rc-ico { display: block; transition: transform .16s ease; }
.sojo-rc-save { padding-left: 11px; padding-right: 13px; }
.sojo-rc-save:hover .sojo-rc-ico { transform: translateY(-1px); }
.sojo-rc-save.is-saved { color: var(--st-name, #c81e1e); }
.sojo-rc-save.is-saved .sojo-rc-ico path { fill: var(--st-name, #c81e1e); }
.sojo-rc-save.is-saved { animation: sojoSavePop .32s ease; }
@keyframes sojoSavePop {
    0% { transform: scale(1); }
    45% { transform: scale(1.12); }
    100% { transform: scale(1); }
}
.sojo-rc-save-label { font-size: 0.86rem; letter-spacing: .01em; }

.sojo-rc-list-open { position: relative; min-width: 40px; }
.sojo-rc-count {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--st-name, #c81e1e);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
    font-family: var(--st-font-body, sans-serif);
    box-shadow: 0 0 0 2px var(--st-paper, #fff);
}

@media (prefers-reduced-motion: reduce) {
    .sojo-reading-dock { animation: none; }
    .sojo-rc-save.is-saved { animation: none; }
}

@media (max-width: 600px) {
    .sojo-rc-save-label { display: none; }
    .sojo-rc-save { padding-left: 11px; padding-right: 11px; }
    .sojo-reading-dock { right: 12px; bottom: 12px; }
}

/* Okuma listesi paneli */
.sojo-rl-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .4);
    z-index: 950;
}
.sojo-reading-list-panel {
    position: fixed;
    top: 0;
    right: 0;
    width: min(380px, 92vw);
    height: 100%;
    z-index: 960;
    background: var(--st-paper, #fff);
    border-left: 1px solid var(--st-rule, #dcdcdc);
    box-shadow: -10px 0 30px rgba(0, 0, 0, .15);
    transform: translateX(100%);
    transition: transform .25s ease;
    display: flex;
    flex-direction: column;
    padding: 20px;
}
.sojo-reading-list-panel.is-open { transform: translateX(0); }
.sojo-rl-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid var(--st-rule-strong, #121212);
    padding-bottom: 12px;
    margin-bottom: 12px;
}
.sojo-rl-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.3rem;
    margin: 0;
    color: var(--st-ink, #121212);
}
.sojo-rl-close {
    border: none;
    background: transparent;
    font-size: 1.6rem;
    line-height: 1;
    cursor: pointer;
    color: var(--st-ink, #121212);
}
.sojo-rl-items { list-style: none; margin: 0; padding: 0; overflow-y: auto; }
.sojo-rl-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--st-rule, #dcdcdc);
}
.sojo-rl-link {
    flex: 1;
    color: var(--st-link, #121212);
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.02rem;
    line-height: 1.35;
    text-decoration: none;
}
.sojo-rl-link:hover { color: var(--st-link-hover, #5a5a5a); }
.sojo-rl-remove {
    border: none;
    background: transparent;
    color: var(--st-muted, #5a5a5a);
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
}
.sojo-rl-remove:hover { color: var(--st-name, #c81e1e); }
.sojo-rl-empty { color: var(--st-muted, #5a5a5a); font-style: italic; }
body.sojo-rl-lock { overflow: hidden; }

/* ---------------------------------------------------------
   2. ŞEFFAFLIK / METODOLOJİ KUTUSU
   --------------------------------------------------------- */
.sojo-transparency {
    margin: 2.4em 0;
    padding: 24px 26px;
    background: var(--st-bg-soft, #f7f7f5);
    border: 1px solid var(--st-rule, #dcdcdc);
    border-left: 4px solid var(--st-rule-strong, #121212);
    border-radius: 2px;
}
.sojo-transparency-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 0;
}
.sojo-transparency-grid { margin: 0; }
.sojo-transparency-row {
    padding: 12px 0;
    border-top: 1px solid var(--st-rule, #dcdcdc);
}
.sojo-transparency-row:first-child { border-top: none; }
.sojo-transparency-row dt {
    font-family: var(--st-font-display, Georgia, serif);
    font-weight: 700;
    font-size: 0.78rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--st-muted, #5a5a5a);
    margin-bottom: 4px;
}
.sojo-transparency-row dd {
    margin: 0;
    color: var(--st-soft-text, #333);
    font-size: 1.0rem;
    line-height: 1.55;
}
.sojo-transparency-row dd p { margin: 0 0 .5em; }
.sojo-transparency-row dd p:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------
   3. DOSYA / SERİ KUTUSU
   --------------------------------------------------------- */
.sojo-series-box {
    margin: 2.4em 0 1em;
    padding: 22px 24px;
    border-top: 3px solid var(--st-rule-strong, #121212);
    border-bottom: 1px solid var(--st-rule, #dcdcdc);
    background: var(--st-bg-quote, #faf7f1);
}
.sojo-series-kicker {
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.72rem;
    letter-spacing: .14em;
    color: var(--st-name, #c81e1e);
    margin: 0 0 4px;
    font-weight: 700;
}
.sojo-series-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.5rem;
    line-height: 1.2;
    margin: 0 0 6px;
}
.sojo-series-title a { color: var(--st-ink, #121212); text-decoration: none; }
.sojo-series-title a:hover { color: var(--st-link-hover, #5a5a5a); }
.sojo-series-desc { color: var(--st-soft-text, #333); margin: 0 0 14px; font-size: 0.98rem; }
.sojo-series-list { list-style: none; margin: 0 0 14px; padding: 0; counter-reset: sojoseries; }
.sojo-series-item { border-top: 1px solid var(--st-rule, #dcdcdc); }
.sojo-series-item a {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    padding: 10px 0;
    text-decoration: none;
    color: var(--st-link, #121212);
}
.sojo-series-item a:hover .sojo-series-item-title { color: var(--st-link-hover, #5a5a5a); }
.sojo-series-item-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.05rem;
    line-height: 1.3;
}
.sojo-series-item-title::before {
    counter-increment: sojoseries;
    content: counter(sojoseries) ". ";
    color: var(--st-muted, #5a5a5a);
}
.sojo-series-item-date {
    flex: 0 0 auto;
    font-size: 0.78rem;
    color: var(--st-muted, #5a5a5a);
    white-space: nowrap;
}
.sojo-series-all {
    display: inline-block;
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.82rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--st-name, #c81e1e);
    text-decoration: none;
    font-weight: 700;
}
.sojo-series-all:hover { text-decoration: underline; }

/* ---------------------------------------------------------
   4. CHART.JS BLOĞU
   --------------------------------------------------------- */
.sojo-chart-figure {
    margin: 2em 0;
    padding: 18px 20px;
    border: 1px solid var(--st-rule, #dcdcdc);
    border-radius: 2px;
    background: var(--st-paper, #fff);
}
.sojo-chart-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-weight: 700;
    font-size: 1.15rem;
    margin: 0 0 12px;
    color: var(--st-ink, #121212);
}
.sojo-chart-canvas-wrap {
    position: relative;
    width: 100%;
    height: 340px;
}
.sojo-chart-canvas-wrap canvas { max-width: 100%; }
.sojo-chart-source {
    margin: 12px 0 0;
    font-size: 0.78rem;
    color: var(--st-muted, #5a5a5a);
    font-style: italic;
}
@media (max-width: 600px) {
    .sojo-chart-canvas-wrap { height: 260px; }
}

/* ---------------------------------------------------------
   6. GOOGLE TERCİH EDİLEN KAYNAK ÇAĞRISI
   --------------------------------------------------------- */
.sojo-prefsource {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 2.4em 0;
    padding: 20px 24px;
    background: var(--st-bg-soft, #f7f7f5);
    border: 1px solid var(--st-rule, #dcdcdc);
    border-radius: 4px;
}
.sojo-prefsource-badge {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--st-paper, #fff);
    border: 1px solid var(--st-rule, #dcdcdc);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}
.sojo-prefsource-body { flex: 1 1 auto; min-width: 0; }
.sojo-prefsource-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.18rem;
    line-height: 1.25;
    margin: 0 0 4px;
    color: var(--st-ink, #121212);
}
.sojo-prefsource-text {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: var(--st-soft-text, #333);
}
.sojo-prefsource-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 18px;
    border-radius: 999px;
    background: var(--st-ink, #121212);
    color: var(--st-paper, #fff);
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: .01em;
    text-decoration: none;
    white-space: nowrap;
    transition: transform .14s ease, background .16s ease, box-shadow .16s ease;
}
.sojo-prefsource-btn:hover {
    background: var(--st-link-hover, #5a5a5a);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .16);
    color: var(--st-paper, #fff);
}
.sojo-prefsource-btn:focus-visible { outline: 2px solid var(--st-name, #c81e1e); outline-offset: 2px; }
.sojo-prefsource-star { color: #f5c518; }

@media (max-width: 640px) {
    .sojo-prefsource { flex-wrap: wrap; gap: 14px; }
    .sojo-prefsource-btn { width: 100%; justify-content: center; }
}

/* ---------------------------------------------------------
   7. CANLI BLOG — NYT "Live Updates" düzeni
   --------------------------------------------------------- */

/* Başlık alanı: CANLI rozeti + "Güncellendi X önce" */
.sojo-lb-status-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0 0 10px;
}
.sojo-liveblog-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.74rem;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--st-name, #c81e1e);
    margin: 0;
}
.sojo-liveblog-status::before {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--st-name, #c81e1e);
    animation: sojoPulse 1.6s infinite;
}
.sojo-lb-updated {
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.78rem;
    color: var(--st-muted, #5a5a5a);
}
.sojo-lb-updated time { font-weight: 600; color: var(--st-soft-text, #333); }
@keyframes sojoPulse {
    0%   { box-shadow: 0 0 0 0 rgba(200, 30, 30, .5); }
    70%  { box-shadow: 0 0 0 8px rgba(200, 30, 30, 0); }
    100% { box-shadow: 0 0 0 0 rgba(200, 30, 30, 0); }
}
.sojo-liveblog-status.is-flash { animation: sojoFlash 2.4s ease; }
@keyframes sojoFlash {
    0%, 100% { opacity: 1; }
    25% { opacity: .35; }
    50% { opacity: 1; }
    75% { opacity: .35; }
}

.sojo-lb-intro { margin-bottom: 1.6em; }

/* Akış başlığı — kalın üst kural, gazete bölüm başlığı gibi */
.sojo-lb-feed-head {
    border-top: 2px solid var(--st-rule-strong, #121212);
    padding-top: 10px;
    margin-top: 1.2em;
}
.sojo-lb-feed-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: .02em;
    margin: 0;
    color: var(--st-ink, #121212);
}

/* Girişler — ince ayraçlarla ayrılmış yığın (nokta/timeline yok) */
.sojo-liveblog-feed { list-style: none; margin: 0; padding: 0; }
.sojo-lb-entry {
    position: relative;
    padding: 24px 0;
    border-top: 1px solid var(--st-rule, #dcdcdc);
}
.sojo-lb-entry:first-child { border-top: none; }
.sojo-lb-entry.is-pinned {
    background: var(--st-bg-soft, #f7f7f5);
    margin: 0 -20px;
    padding: 20px;
    border-top: none;
    border-left: 3px solid var(--st-name, #c81e1e);
}
.sojo-lb-entry.is-pinned + .sojo-lb-entry { border-top: none; }

.sojo-lb-pinned-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--st-name, #c81e1e);
    margin: 0 0 8px;
}

.sojo-lb-entry-time {
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.74rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--st-muted, #5a5a5a);
    margin: 0 0 6px;
}
.sojo-lb-entry-author {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--st-ink, #121212);
    margin: 0 0 6px;
}
.sojo-lb-entry-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.5rem;
    line-height: 1.22;
    margin: 0 0 8px;
    color: var(--st-ink, #121212);
}
.sojo-lb-entry-body {
    color: var(--st-soft-text, #333);
    font-size: 1.12rem;
    line-height: 1.62;
    font-family: var(--st-font-body, Georgia, serif);
}
.sojo-lb-entry-body p { margin: 0 0 .7em; }
.sojo-lb-entry-body p:last-child { margin-bottom: 0; }

@media (max-width: 600px) {
    .sojo-lb-entry-title { font-size: 1.28rem; }
    .sojo-lb-entry-body { font-size: 1.02rem; }
    .sojo-lb-entry.is-pinned { margin: 0 -14px; padding: 16px 14px; }
}

/* ---------------------------------------------------------
   8. RSS BESLEME BLOĞU (proje/sayfa altı)
   --------------------------------------------------------- */
.sojo-feed { margin: 2.4em 0; }
.sojo-feed-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 26px;
}
.sojo-feed-card { display: flex; flex-direction: column; }
.sojo-feed-thumb {
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--st-bg-soft, #f7f7f5);
    border: 1px solid var(--st-rule, #dcdcdc);
    margin-bottom: 12px;
}
.sojo-feed-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .3s ease;
}
.sojo-feed-card:hover .sojo-feed-thumb img { transform: scale(1.04); }
.sojo-feed-thumb.is-empty {
    background: repeating-linear-gradient(45deg, var(--st-bg-soft, #f7f7f5), var(--st-bg-soft, #f7f7f5) 10px, var(--st-paper, #fff) 10px, var(--st-paper, #fff) 20px);
}
.sojo-feed-card-title {
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 1.18rem;
    line-height: 1.28;
    margin: 0 0 10px;
}
.sojo-feed-card-title a { color: var(--st-ink, #121212); text-decoration: none; }
.sojo-feed-card-title a:hover { color: var(--st-link-hover, #5a5a5a); }
.sojo-feed-byline { display: flex; align-items: center; gap: 9px; }
.sojo-feed-avatar {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--st-ink, #121212);
    color: var(--st-paper, #fff);
    font-family: var(--st-font-display, Georgia, serif);
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.sojo-feed-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sojo-feed-meta { display: flex; flex-direction: column; line-height: 1.2; min-width: 0; }
.sojo-feed-author {
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--st-name, #c81e1e);
}
.sojo-feed-date {
    font-family: var(--st-font-body, sans-serif);
    font-size: 0.74rem;
    color: var(--st-muted, #5a5a5a);
}