/**
 * Yayın detay — premium animasyonlar ve görsel efektler
 */

/* —— Makale kartı: yüzen arka plan —— */
.kku-yayin-detay-article {
    position: relative;
    overflow: hidden;
}

.kku-yayin-detay-article .duyuru-detay-body {
    position: relative;
    z-index: 1;
}

.kku-yayin-detay-article::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 50% at 50% -10%, rgba(200, 35, 51, 0.06) 0%, transparent 55%);
    pointer-events: none;
    z-index: 0;
}

/* —— Keyframes —— */
@keyframes yayinFadeUp {
    from {
        opacity: 0;
        transform: translateY(28px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes yayinFadeScale {
    from {
        opacity: 0;
        transform: scale(0.88) translateY(12px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes yayinChipPop {
    from {
        opacity: 0;
        transform: scale(0.6) translateY(8px);
    }
    70% {
        transform: scale(1.06) translateY(-2px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes yayinAtifGlow {
    0%, 100% {
        box-shadow: 0 4px 16px rgba(234, 88, 12, 0.08), 0 0 0 0 rgba(234, 88, 12, 0);
    }
    50% {
        box-shadow: 0 8px 28px rgba(234, 88, 12, 0.18), 0 0 0 8px rgba(234, 88, 12, 0.06);
    }
}

@keyframes yayinAtifRing {
    0% {
        transform: scale(1);
        opacity: 0.5;
    }
    100% {
        transform: scale(1.35);
        opacity: 0;
    }
}

@keyframes yayinPanelReveal {
    from {
        opacity: 0;
        transform: translateY(24px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes yayinBiblioTile {
    from {
        opacity: 0;
        transform: translateX(-12px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes yayinCitationShine {
    0% {
        background-position: -120% 0;
    }
    100% {
        background-position: 220% 0;
    }
}

@keyframes yayinTitleShimmer {
    0%, 100% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
}

@keyframes yayinCardEnter {
    from {
        opacity: 0;
        transform: translateY(20px) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes yayinRevealUp {
    from {
        opacity: 0;
        transform: translateY(32px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes yayinAuthorChipIn {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.92);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes yayinEyebrowLine {
    from {
        width: 0;
        opacity: 0;
    }
    to {
        width: 2.5rem;
        opacity: 1;
    }
}

/* —— Hero giriş (sayfa yüklenince) —— */
.kku-yayin-detay-hero:not(.kku-yayin-animate-in) .kku-kaynak-detay-eyebrow,
.kku-yayin-detay-hero:not(.kku-yayin-animate-in) .kku-yayin-detay-title,
.kku-yayin-detay-hero:not(.kku-yayin-animate-in) .kku-yayin-detay-meta > *,
.kku-yayin-detay-hero:not(.kku-yayin-animate-in) .kku-yayin-detay-atif-stat,
.kku-yayin-detay-hero:not(.kku-yayin-animate-in) .kku-yayin-detay-authors,
.kku-yayin-detay-hero:not(.kku-yayin-animate-in) .kku-yayin-detay-panel {
    opacity: 0;
}

.kku-yayin-animate-in .kku-kaynak-detay-eyebrow {
    animation: yayinFadeUp 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.kku-yayin-animate-in .kku-yayin-detay-title {
    animation: yayinFadeUp 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.08s both;
}

.kku-yayin-animate-in .kku-yayin-detay-meta > .duyuru-detay-meta-item:nth-child(1) { animation: yayinChipPop 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0.2s both; }
.kku-yayin-animate-in .kku-yayin-detay-meta > .duyuru-detay-meta-item:nth-child(2) { animation: yayinChipPop 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0.28s both; }
.kku-yayin-animate-in .kku-yayin-detay-meta > .duyuru-detay-meta-item:nth-child(3) { animation: yayinChipPop 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0.36s both; }
.kku-yayin-animate-in .kku-yayin-detay-meta > .duyuru-detay-meta-item:nth-child(4) { animation: yayinChipPop 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0.44s both; }
.kku-yayin-animate-in .kku-yayin-detay-meta > .duyuru-detay-meta-item:nth-child(5) { animation: yayinChipPop 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0.52s both; }
.kku-yayin-animate-in .kku-yayin-detay-meta > .duyuru-detay-meta-item:nth-child(n+6) { animation: yayinChipPop 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0.6s both; }

.kku-yayin-animate-in .kku-yayin-detay-atif-stat {
    animation: yayinFadeScale 0.75s cubic-bezier(0.22, 1, 0.36, 1) 0.35s both,
               yayinAtifGlow 3s ease-in-out 1.1s infinite;
    position: relative;
}

.kku-yayin-animate-in .kku-yayin-detay-atif-stat::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 18px;
    border: 2px solid rgba(234, 88, 12, 0.35);
    animation: yayinAtifRing 2.2s ease-out 0.9s infinite;
    pointer-events: none;
}

.kku-yayin-animate-in .kku-yayin-detay-authors {
    animation: yayinFadeUp 0.65s cubic-bezier(0.22, 1, 0.36, 1) 0.45s both;
}

.kku-yayin-animate-in .kku-yayin-detay-author-chip {
    animation: yayinAuthorChipIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.kku-yayin-animate-in .kku-yayin-detay-author-chips .kku-yayin-detay-author-chip:nth-child(1) { animation-delay: 0.55s; }
.kku-yayin-animate-in .kku-yayin-detay-author-chips .kku-yayin-detay-author-chip:nth-child(2) { animation-delay: 0.62s; }
.kku-yayin-animate-in .kku-yayin-detay-author-chips .kku-yayin-detay-author-chip:nth-child(3) { animation-delay: 0.69s; }
.kku-yayin-animate-in .kku-yayin-detay-author-chips .kku-yayin-detay-author-chip:nth-child(4) { animation-delay: 0.76s; }
.kku-yayin-animate-in .kku-yayin-detay-author-chips .kku-yayin-detay-author-chip:nth-child(5) { animation-delay: 0.83s; }
.kku-yayin-animate-in .kku-yayin-detay-author-chips .kku-yayin-detay-author-chip:nth-child(n+6) { animation-delay: 0.9s; }

.kku-yayin-animate-in .kku-yayin-detay-panels .kku-yayin-detay-panel:nth-child(1) {
    animation: yayinPanelReveal 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.55s both;
}

.kku-yayin-animate-in .kku-yayin-detay-panels .kku-yayin-detay-panel:nth-child(2) {
    animation: yayinPanelReveal 0.7s cubic-bezier(0.22, 1, 0.36, 1) 0.68s both;
}

.kku-yayin-animate-in .kku-yayin-detay-biblio-item {
    animation: yayinBiblioTile 0.45s ease both;
}

.kku-yayin-animate-in .kku-yayin-detay-biblio-item:nth-child(1) { animation-delay: 0.75s; }
.kku-yayin-animate-in .kku-yayin-detay-biblio-item:nth-child(2) { animation-delay: 0.82s; }
.kku-yayin-animate-in .kku-yayin-detay-biblio-item:nth-child(3) { animation-delay: 0.89s; }
.kku-yayin-animate-in .kku-yayin-detay-biblio-item:nth-child(4) { animation-delay: 0.96s; }
.kku-yayin-animate-in .kku-yayin-detay-biblio-item:nth-child(5) { animation-delay: 1.03s; }
.kku-yayin-animate-in .kku-yayin-detay-biblio-item:nth-child(n+6) { animation-delay: 1.1s; }

.kku-yayin-animate-in .kku-yayin-citation-preview {
    position: relative;
    overflow: hidden;
}

.kku-yayin-animate-in .kku-yayin-citation-preview::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        105deg,
        transparent 40%,
        rgba(255, 255, 255, 0.35) 50%,
        transparent 60%
    );
    background-size: 200% 100%;
    animation: yayinCitationShine 2.8s ease-in-out 1.2s 1;
    pointer-events: none;
}

/* —— Scroll reveal (alt bölümler) —— */
.kku-yayin-reveal {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.kku-yayin-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* —— İlgili yayın kartları (API sonrası) —— */
.kku-yayin-ilgili-section.kku-yayin-animate-in {
    animation: yayinRevealUp 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.kku-yayin-card-enter {
    animation: yayinCardEnter 0.55s cubic-bezier(0.22, 1, 0.36, 1) var(--yayin-card-delay, 0s) both;
}

/* —— Metrik kartları (scroll reveal sonrası) —— */
.kku-yayin-reveal.is-visible .personel-metric-tab-card {
    animation: yayinCardEnter 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.kku-yayin-reveal.is-visible .personel-metric-tab-card:nth-child(1) { animation-delay: 0.04s; }
.kku-yayin-reveal.is-visible .personel-metric-tab-card:nth-child(2) { animation-delay: 0.1s; }
.kku-yayin-reveal.is-visible .personel-metric-tab-card:nth-child(3) { animation-delay: 0.16s; }
.kku-yayin-reveal.is-visible .personel-metric-tab-card:nth-child(4) { animation-delay: 0.22s; }
.kku-yayin-reveal.is-visible .personel-metric-tab-card:nth-child(5) { animation-delay: 0.28s; }
.kku-yayin-reveal.is-visible .personel-metric-tab-card:nth-child(6) { animation-delay: 0.34s; }
.kku-yayin-reveal.is-visible .personel-metric-tab-card:nth-child(n+7) { animation-delay: 0.4s; }

/* —— Anahtar kelime chip girişi —— */
.kku-yayin-reveal.is-visible .kku-yayin-keyword-chip {
    animation: yayinChipPop 0.4s cubic-bezier(0.34, 1.4, 0.64, 1) both;
}

.kku-yayin-reveal.is-visible .kku-yayin-keywords-list li:nth-child(1) .kku-yayin-keyword-chip { animation-delay: 0.05s; }
.kku-yayin-reveal.is-visible .kku-yayin-keywords-list li:nth-child(2) .kku-yayin-keyword-chip { animation-delay: 0.1s; }
.kku-yayin-reveal.is-visible .kku-yayin-keywords-list li:nth-child(3) .kku-yayin-keyword-chip { animation-delay: 0.15s; }
.kku-yayin-reveal.is-visible .kku-yayin-keywords-list li:nth-child(4) .kku-yayin-keyword-chip { animation-delay: 0.2s; }
.kku-yayin-reveal.is-visible .kku-yayin-keywords-list li:nth-child(n+5) .kku-yayin-keyword-chip { animation-delay: 0.25s; }

/* —— İlgili kart hover —— */
.kku-yayin-ilgili-card {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.kku-yayin-ilgili-card:hover {
    transform: translateY(-4px);
}

.kku-yayin-ilgili-card-link {
    transition: border-color 0.2s ease;
}

/* —— Hover micro-interactions —— */
.kku-yayin-detay-panel {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.kku-yayin-detay-panel:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.1);
}

.kku-yayin-detay-biblio-item {
    transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.kku-yayin-detay-biblio-item:hover {
    transform: translateX(4px);
    border-color: rgba(200, 35, 51, 0.2);
}

.kku-yayin-cite-btn {
    transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.kku-yayin-cite-btn:active {
    transform: scale(0.96);
}

.kku-yayin-cite-btn--copied {
    animation: yayinChipPop 0.4s ease;
}

.kku-kaynak-detay-btn-primary {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.kku-kaynak-detay-btn-primary:hover {
    transform: translateY(-2px) scale(1.02);
}

html[data-color-mode="dark"] .kku-yayin-detay-panel:hover {
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

html[data-color-mode="dark"] .kku-yayin-animate-in .kku-yayin-citation-preview::after {
    background: linear-gradient(
        105deg,
        transparent 40%,
        rgba(255, 255, 255, 0.08) 50%,
        transparent 60%
    );
}

/* —— Ortak yazar ağı giriş animasyonları —— */
.yayin-ortak-yazar-section.is-visible .trend-header {
    animation: yayinFadeUp 0.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.yayin-ortak-yazar-section.is-visible .kku-yayin-network-toolbar {
    animation: yayinFadeUp 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.12s both;
}

.yayin-ortak-yazar-chart-wrap {
    opacity: 0.55;
    transform: scale(0.97) translateY(12px);
    transition:
        opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.4s ease;
}

.yayin-ortak-yazar-section.is-visible .yayin-ortak-yazar-chart-wrap {
    opacity: 0.75;
    transform: scale(0.98) translateY(6px);
}

.yayin-ortak-yazar-chart-wrap.kku-yayin-network-entered {
    opacity: 1 !important;
    transform: scale(1) translateY(0) !important;
    box-shadow:
        0 12px 40px rgba(200, 35, 51, 0.08),
        0 0 0 1px rgba(200, 35, 51, 0.06);
}

.yayin-ortak-yazar-section .kku-yayin-network-loading {
    animation: yayinFadeUp 0.45s ease both;
}

.yayin-ortak-yazar-section .kku-yayin-network-loading .loading-spinner {
    animation: yayinNetworkSpin 0.9s linear infinite;
}

@keyframes yayinNetworkSpin {
    to { transform: rotate(360deg); }
}

.yayin-ortak-yazar-section.is-visible .trend-title i {
    animation: yayinChipPop 0.5s cubic-bezier(0.34, 1.4, 0.64, 1) 0.2s both;
}

html[data-color-mode="dark"] .yayin-ortak-yazar-chart-wrap.kku-yayin-network-entered {
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(248, 113, 113, 0.12);
}

@media (prefers-reduced-motion: reduce) {
    .yayin-ortak-yazar-section.is-visible .trend-header,
    .yayin-ortak-yazar-section.is-visible .kku-yayin-network-toolbar,
    .yayin-ortak-yazar-section.is-visible .trend-title i,
    .yayin-ortak-yazar-section .kku-yayin-network-loading {
        animation: none !important;
    }

    .yayin-ortak-yazar-chart-wrap,
    .yayin-ortak-yazar-section.is-visible .yayin-ortak-yazar-chart-wrap,
    .yayin-ortak-yazar-chart-wrap.kku-yayin-network-entered {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* —— Breadcrumb fade —— */
.duyuru-detay-page.kku-kaynak-detay .duyuru-detay-breadcrumb {
    animation: yayinFadeUp 0.5s ease both;
}

/* —— Reduced motion —— */
@media (prefers-reduced-motion: reduce) {
    .kku-yayin-detay-hero:not(.kku-yayin-animate-in) * {
        opacity: 1 !important;
    }

    .kku-yayin-animate-in *,
    .kku-yayin-reveal,
    .kku-yayin-card-enter,
    .duyuru-detay-page.kku-kaynak-detay .duyuru-detay-breadcrumb {
        animation: none !important;
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .kku-yayin-reveal.is-visible {
        opacity: 1;
        transform: none;
    }

    .kku-yayin-detay-atif-stat::after {
        display: none;
    }
}
