

<?php $__env->startSection('meta_title', $topic->title . ' - Forum'); ?>
<?php $__env->startSection('meta_description', Str::limit(strip_tags($topic->content ?? ''), 150)); ?>
<?php $__env->startSection('og_type', 'article'); ?>

<?php
    // SEO Article Data for forum topic (DiscussionForumPosting schema)
    $articleData = [
        'published_at' => $topic->created_at?->toAtomString(),
        'modified_at' => $topic->updated_at?->toAtomString(),
        'author' => $topic->user?->name ?? 'Forum Kullanıcısı',
        'category' => $topic->category?->name ?? 'Forum',
        'word_count' => str_word_count(strip_tags($topic->content ?? '')),
    ];

    // SEO Breadcrumb Data
    $breadcrumbData = [
        ['name' => 'Ana Sayfa', 'url' => '/'],
        ['name' => 'Forum', 'url' => '/forum'],
        ['name' => $topic->category?->name ?? 'Forum', 'url' => $topic->category ? route('forum.category', $topic->category) : '/forum'],
        ['name' => $topic->title, 'url' => route('forum.topic', [$topic->category, $topic])],
    ];
?>

<?php $__env->startSection('styles'); ?>
<link rel="stylesheet" href="https://cdn.quilljs.com/1.3.7/quill.snow.css">
<?php $__env->stopSection(); ?>

<?php $__env->startSection('content'); ?>
<style>
/* ========================================
   XenForo-Style Topic View - Modern Design
   ======================================== */

/* Breadcrumb */
.breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    font-size: 13px;
    color: #64748b;
}
.breadcrumb a { color: #3b82f6; text-decoration: none; font-weight: 500; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb-sep { color: #cbd5e1; }

/* Topic Header */
.topic-header {
    background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 50%, #1d4ed8 100%);
    color: white;
    padding: 28px 32px;
    border-radius: 14px;
    margin-bottom: 24px;
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.25);
    position: relative;
    overflow: hidden;
}
.topic-header::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -10%;
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.12) 0%, transparent 70%);
    pointer-events: none;
}
.topic-header-content { position: relative; z-index: 1; }
.topic-badges {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.topic-badge {
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.badge-sticky { background: #fbbf24; color: #78350f; }
.badge-locked { background: #f87171; color: #7f1d1d; }
.topic-header h1 {
    font-size: 22px;
    font-weight: 800;
    margin-bottom: 12px;
    line-height: 1.3;
}
.topic-meta {
    display: flex;
    gap: 20px;
    font-size: 13px;
    opacity: 0.85;
    flex-wrap: wrap;
}
.topic-meta span { display: flex; align-items: center; gap: 6px; }

/* Posts Container */
.posts-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Post Card - XenForo Style */
.post-card {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s;
}
.post-card:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.post-card.op {
    border-color: #bfdbfe;
    box-shadow: 0 0 0 1px #bfdbfe, 0 2px 8px rgba(59, 130, 246, 0.08);
}

/* Post Header */
.post-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border-bottom: 1px solid #e2e8f0;
}
.post-card.op .post-header {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border-bottom-color: #bfdbfe;
}
.post-author {
    display: flex;
    align-items: center;
    gap: 12px;
}
.post-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
    overflow: hidden;
    object-fit: cover;
}
.post-avatar img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}
.post-avatar-initials {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 700;
    font-size: 16px;
    flex-shrink: 0;
}
.post-author-info {
    display: flex;
    flex-direction: column;
}
.post-author-name {
    font-size: 14px;
    font-weight: 700;
    color: #0f172a;
}
.author-link {
    color: #0f172a;
    text-decoration: none;
    transition: color 0.2s;
}
.author-link:hover {
    color: #3b82f6;
    text-decoration: underline;
}
.post-author-role {
    font-size: 11px;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 4px;
}
.role-badge {
    background: #f1f5f9;
    padding: 1px 7px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    color: #475569;
}
.role-badge.admin { background: #fef3c7; color: #92400e; }
.role-badge.op { background: #dbeafe; color: #1d4ed8; }
.post-author-stats {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 10px;
    color: #94a3b8;
    margin-top: 4px;
}
.post-author-stats span {
    display: flex;
    align-items: center;
    gap: 3px;
}
.post-date {
    font-size: 12px;
    color: #94a3b8;
}
.post-number {
    background: #f1f5f9;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    color: #64748b;
}
.post-card.op .post-number {
    background: #bfdbfe;
    color: #1d4ed8;
}

/* Reply indicator */
.reply-indicator {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #fef3c7;
    border-bottom: 1px solid #fde68a;
    font-size: 12px;
    color: #92400e;
}
.reply-indicator a {
    color: #1d4ed8;
    text-decoration: none;
    font-weight: 600;
}
.reply-indicator a:hover { text-decoration: underline; }

/* Reply to indicator card */
.post-reply-indicator {
    padding: 10px 20px 0 20px;
}
.post-reply-link {
    text-decoration: none;
    display: block;
}
.post-reply-card {
    background: #f0f7ff;
    border-left: 3px solid #3b82f6;
    border-radius: 0 8px 8px 0;
    padding: 10px 14px;
    font-size: 12.5px;
    color: #334155;
    transition: background 0.15s;
}
.post-reply-card:hover {
    background: #e0f0ff;
}
.post-reply-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 5px;
}
.post-reply-icon {
    width: 13px;
    height: 13px;
    color: #3b82f6;
    flex-shrink: 0;
}
.post-reply-username {
    font-weight: 700;
    color: #1d4ed8;
    font-size: 12px;
}
.post-reply-label {
    color: #94a3b8;
    font-size: 11px;
}
.post-reply-content {
    color: #64748b;
    line-height: 1.5;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Post Content */
.post-content {
    padding: 20px;
    font-size: 14px;
    line-height: 1.7;
    color: #334155;
}
.post-content p { margin-bottom: 12px; }
.post-content p:last-child { margin-bottom: 0; }
.post-content code {
    background: #f1f5f9;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 13px;
    font-family: 'Consolas', monospace;
    color: #dc2626;
}
.post-content pre {
    background: #1e293b;
    color: #f1f5f9;
    padding: 16px;
    border-radius: 8px;
    overflow-x: auto;
    margin: 12px 0;
}
.post-content pre code {
    background: none;
    color: inherit;
    padding: 0;
}
.post-content blockquote {
    border-left: 4px solid #3b82f6;
    padding-left: 16px;
    margin: 12px 0;
    color: #64748b;
    font-style: italic;
    background: #f8fafc;
    padding: 12px 16px;
    border-radius: 0 8px 8px 0;
}
.post-content ul, .post-content ol {
    margin: 12px 0;
    padding-left: 24px;
}
.post-content li { margin-bottom: 6px; }

/* Post Footer */
.post-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    border-top: 1px solid #f1f5f9;
    background: #fafbfc;
}
.post-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.btn-action {
    padding: 6px 12px;
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.15s;
    text-decoration: none;
}
.btn-action:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #1e293b;
}
.btn-action.liked {
    background: #dbeafe;
    border-color: #93c5fd;
    color: #1d4ed8;
}
.btn-action.disliked {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
}
.btn-action.reply-btn {
    color: #1d4ed8;
    border-color: #bfdbfe;
}
.btn-action.reply-btn:hover {
    background: #eff6ff;
    border-color: #93c5fd;
}
.btn-action.quote-btn {
    color: #059669;
    border-color: #a7f3d0;
}
.btn-action.quote-btn:hover {
    background: #ecfdf5;
    border-color: #6ee7b7;
}
.btn-action.delete {
    color: #dc2626;
}
.btn-action.delete:hover {
    background: #fef2f2;
    border-color: #fca5a5;
}
.btn-action.edit-btn {
    color: #d97706;
    border-color: #fde68a;
}
.btn-action.edit-btn:hover {
    background: #fffbeb;
    border-color: #fcd34d;
}

/* Post edited indicator */
.post-edited-tag {
    font-size: 11px;
    color: #94a3b8;
    font-style: italic;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Link restriction: hide links from guests */
.link-restricted {
    background: #f1f5f9;
    border: 1px dashed #cbd5e1;
    border-radius: 5px;
    padding: 2px 8px;
    font-size: 12px;
    color: #94a3b8;
    cursor: not-allowed;
    text-decoration: none;
    display: inline-block;
}

/* Reply Form */
.reply-form {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    margin-top: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.reply-form h3 {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.form-group { margin-bottom: 16px; }
.form-label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: #334155;
    margin-bottom: 8px;
}
.form-textarea {
    width: 100%;
    min-height: 140px;
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-size: 14px;
    font-family: inherit;
    color: #1e293b;
    outline: none;
    resize: vertical;
    line-height: 1.6;
    transition: all 0.2s;
    background: #fafbfc;
}
.form-textarea:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    background: white;
}
.btn-submit {
    padding: 12px 28px;
    background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    color: white;
    border: none;
    border-radius: 10px;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 4px 12px rgba(29, 78, 216, 0.25);
}
.btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(29, 78, 216, 0.35);
}
.btn-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}
.btn-cancel {
    padding: 12px 20px;
    background: white;
    color: #64748b;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
}
.btn-cancel:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
}

/* Locked Notice */
.locked-notice {
    background: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 10px;
    padding: 16px 20px;
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.locked-notice-icon { font-size: 24px; }
.locked-notice-text {
    font-size: 14px;
    color: #92400e;
    font-weight: 500;
}

/* Editor Toolbar */
.editor-toolbar {
    display: flex;
    gap: 0;
    padding: 0;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-bottom: none;
    border-radius: 10px 10px 0 0;
    flex-wrap: wrap;
    align-items: center;
}
.editor-toolbar-group {
    display: flex;
    gap: 0;
    border-right: 1px solid #e2e8f0;
    padding: 8px 4px;
}
.editor-toolbar-group:last-child {
    border-right: none;
}
.editor-toolbar button {
    padding: 6px 10px;
    background: transparent;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    color: #475569;
    transition: all 0.15s;
    min-width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.editor-toolbar button:hover {
    background: white;
    border: 1px solid #cbd5e1;
}
.editor-toolbar select {
    padding: 6px 10px;
    border: none;
    background: white;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
    height: 32px;
    margin: 8px 4px;
    border: 1px solid #e2e8f0;
}
.editor-footer {
    padding: 8px 14px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    border-radius: 0 0 10px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: #9ca3af;
    flex-wrap: wrap;
    gap: 12px;
}
.with-toolbar {
    border-radius: 0 0 10px 10px !important;
}

/* Login Prompt */
.login-prompt {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid #bfdbfe;
    border-radius: 12px;
    padding: 24px;
    text-align: center;
    margin-top: 20px;
}
.login-prompt p {
    font-size: 14px;
    color: #1d4ed8;
    margin-bottom: 16px;
    font-weight: 500;
}
.login-prompt a {
    display: inline-block;
    padding: 10px 24px;
    background: #1d4ed8;
    color: white;
    border-radius: 10px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.2s;
}
.login-prompt a:hover {
    background: #1e40af;
    transform: translateY(-1px);
}

/* Reply to indicator in form */
.replying-to {
    background: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
    color: #92400e;
}
.replying-to-content {
    display: flex;
    align-items: center;
    gap: 8px;
}
.cancel-reply {
    background: none;
    border: none;
    color: #92400e;
    cursor: pointer;
    font-size: 18px;
    padding: 0;
    line-height: 1;
}
.cancel-reply:hover { color: #78350f; }

/* Quote preview */
.quote-preview {
    background: #f8fafc;
    border-left: 3px solid #3b82f6;
    padding: 10px 14px;
    margin-bottom: 12px;
    border-radius: 0 8px 8px 0;
    font-size: 12px;
    color: #64748b;
}
.quote-preview strong {
    color: #334155;
    display: block;
    margin-bottom: 4px;
}

@media (max-width: 640px) {
    .topic-header { padding: 20px; }
    .topic-header h1 { font-size: 18px; }
    .post-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .post-footer { flex-direction: column; align-items: flex-start; gap: 12px; }
    .post-actions { width: 100%; }
    .btn-action { flex: 1; justify-content: center; }
}
</style>


<div class="breadcrumb">
    <a href="<?php echo e(route('forum.index')); ?>">Forum</a>
    <span class="breadcrumb-sep">/</span>
    <a href="<?php echo e(route('forum.category', $category->slug)); ?>"><?php echo e($category->name); ?></a>
    <span class="breadcrumb-sep">/</span>
    <span><?php echo e(Str::limit($topic->title, 45)); ?></span>
</div>


<div class="topic-header">
    <div class="topic-header-content">
        <div class="topic-badges">
            <?php if($topic->is_sticky): ?>
                <span class="topic-badge badge-sticky">📌 Sabitli</span>
            <?php endif; ?>
            <?php if($topic->is_locked): ?>
                <span class="topic-badge badge-locked">🔒 Kilitli</span>
            <?php endif; ?>
        </div>
        <h1><?php echo e($topic->title); ?></h1>
        <div class="topic-meta">
            <span>
                <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/>
                </svg>
                <?php echo e($topic->user->name); ?>

            </span>
            <span>
                <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
                </svg>
                <?php echo e($topic->created_at->translatedFormat('d F Y, H:i')); ?>

            </span>
            <span>
                <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/>
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"/>
                </svg>
                <?php echo e($topic->views ?? 0); ?> görüntüleme
            </span>
            <span>
                <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"/>
                </svg>
                <?php echo e($topic->reply_count ?? 0); ?> yanıt
            </span>
        </div>
    </div>
</div>


<div class="posts-container">
    <?php $__currentLoopData = $posts; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $post): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
        <?php
            $isFirstPost = $index === 0;
            $avatarHue   = crc32($post->user?->name ?? 'A') % 360;
            $hasAvatar   = !empty($post->user?->avatar);
        ?>
        <div class="post-card <?php echo e($isFirstPost ? 'op' : ''); ?>" data-post-id="<?php echo e($post->id); ?>" id="post-<?php echo e($post->id); ?>">
            <div class="post-header">
                <div class="post-author">
                    
                    <?php if($hasAvatar): ?>
                        <div class="post-avatar">
                            <img src="<?php echo e($post->user->avatar_url); ?>" alt="<?php echo e($post->user->name); ?>" loading="lazy">
                        </div>
                    <?php else: ?>
                        <div class="post-avatar post-avatar-initials" style="background: linear-gradient(135deg, hsl(<?php echo e($avatarHue); ?>, 65%, 45%) 0%, hsl(<?php echo e($avatarHue + 30); ?>, 65%, 55%) 100%);">
                            <?php echo e(substr($post->user?->name ?? 'A', 0, 1)); ?>

                        </div>
                    <?php endif; ?>
                    <div class="post-author-info">
                        <span class="post-author-name">
                            <?php if($post->user): ?>
                                <a href="<?php echo e(route('profile.show', $post->user->id)); ?>" class="author-link"><?php echo e($post->user->name); ?></a>
                            <?php else: ?>
                                Silinen Kullanıcı
                            <?php endif; ?>
                        </span>
                        <span class="post-author-role">
                            <?php if(($post->user?->role ?? '') === 'admin'): ?>
                                <span class="role-badge admin">👑 Yönetici</span>
                            <?php elseif(($post->user?->role ?? '') === 'moderator'): ?>
                                <span class="role-badge" style="background:#dcfce7;color:#166534;">🛡️ Moderatör</span>
                            <?php else: ?>
                                <span class="role-badge">Üye</span>
                            <?php endif; ?>
                            <?php if($isFirstPost): ?>
                                <span class="role-badge op">📌 Konu Sahibi</span>
                            <?php endif; ?>
                        </span>
                        <?php if($post->user): ?>
                        <span class="post-author-stats">
                            <span title="Forum Mesaj Sayısı">💬 <?php echo e(number_format($post->user->forum_posts_count ?? 0)); ?> mesaj</span>
                            <span title="Üyelik Tarihi">📅 <?php echo e($post->user->created_at->format('M Y')); ?></span>
                        </span>
                        <?php endif; ?>
                    </div>
                </div>
                <div style="display:flex;align-items:center;gap:12px;">
                    <span class="post-date"><?php echo e($post->created_at->diffForHumans()); ?></span>
                    <span class="post-number">#<?php echo e($index + 1); ?></span>
                </div>
            </div>

            
            <?php if($post->reply_to_id && $post->replyTo): ?>
            <div class="post-reply-indicator">
                <a href="#post-<?php echo e($post->replyTo->id); ?>" class="post-reply-link">
                    <div class="post-reply-card">
                        <div class="post-reply-header">
                            <svg class="post-reply-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6"/>
                            </svg>
                            <span class="post-reply-username"><?php echo e($post->replyTo->user->name ?? 'Anonim'); ?></span>
                            <span class="post-reply-label">yazdı:</span>
                        </div>
                        <div class="post-reply-content">
                            <?php echo e(Str::limit(strip_tags($post->replyTo->content), 180)); ?>

                        </div>
                    </div>
                </a>
            </div>
            <?php endif; ?>

            
            <div class="post-content">
                <?php if(auth()->check()): ?>
                    <?php echo nl2br(e($post->content)); ?>

                <?php else: ?>
                    
                    <?php echo nl2br(e(preg_replace('/https?:\/\/[^\s]+/', '[Bağlantıyı görmek için üye olun]', $post->content))); ?>

                <?php endif; ?>
            </div>

            
            <?php if(!empty($post->edited_at)): ?>
            <div style="padding: 0 20px 10px 20px;">
                <span class="post-edited-tag">
                    <svg style="width:12px;height:12px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/>
                    </svg>
                    <?php echo e($post->edited_at->diffForHumans()); ?> düzenlendi
                    <?php if($post->editedBy): ?>
                        (<?php echo e($post->editedBy->name); ?>)
                    <?php endif; ?>
                </span>
            </div>
            <?php endif; ?>

            <div class="post-footer">
                <div class="post-actions">
                    <?php if(auth()->guard()->check()): ?>
                        <button class="btn-action <?php echo e($post->user_like_type === 'like' ? 'liked' : ''); ?>"
                                onclick="likePost(<?php echo e($post->id); ?>, 'like')"
                                id="like-btn-<?php echo e($post->id); ?>">
                            <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 10h4.764a2 2 0 011.789 2.894l-3.5 7A2 2 0 0115.263 21h-4.017c-.163 0-.326-.02-.485-.06L7 20m7-10V5a2 2 0 00-2-2h-.095c-.5 0-.905.405-.905.905 0 .714-.211 1.412-.608 2.006L7 11v9m7-10h-2M7 20H5a2 2 0 01-2-2v-6a2 2 0 012-2h2.5"/>
                            </svg>
                            <span id="like-count-<?php echo e($post->id); ?>"><?php echo e($post->likes ?? 0); ?></span>
                        </button>
                        <button class="btn-action <?php echo e($post->user_like_type === 'dislike' ? 'disliked' : ''); ?>"
                                onclick="likePost(<?php echo e($post->id); ?>, 'dislike')"
                                id="dislike-btn-<?php echo e($post->id); ?>">
                            <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14H5.236a2 2 0 01-1.789-2.894l3.5-7A2 2 0 018.736 3h4.018a2 2 0 01.485.06l3.76.94m-7 10v5a2 2 0 002 2h.096c.5 0 .905-.405.905-.904 0-.715.211-1.413.608-2.008L17 13V4m-7 10h2m5-10h2a2 2 0 012 2v6a2 2 0 01-2 2h-2.5"/>
                            </svg>
                            <span id="dislike-count-<?php echo e($post->id); ?>"><?php echo e($post->dislikes ?? 0); ?></span>
                        </button>
                        <button class="btn-action reply-btn" onclick="replyToPost(<?php echo e($post->id); ?>, '<?php echo e(str_replace("'", "\'", $post->user?->name ?? 'Anonim')); ?>')">
                            <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6"/>
                            </svg>
                            Yanıtla
                        </button>
                        <button class="btn-action quote-btn" onclick="quotePost(<?php echo e($post->id); ?>, '<?php echo e(str_replace("'", "\'", $post->user?->name ?? 'Anonim')); ?>', '<?php echo e(str_replace(["'", "\n", "\r"], ["\\'", ' ', ''], strip_tags(Str::limit($post->content, 200)))); ?>')">
                            <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 10h.01M12 10h.01M16 10h.01M9 16H5a2 2 0 01-2-2V6a2 2 0 012-2h14a2 2 0 012 2v8a2 2 0 01-2 2h-5l-5 5v-5z"/>
                            </svg>
                            Alıntı
                        </button>
                        
                        <?php if(auth()->user()->id === $post->user_id || in_array(auth()->user()->role, ['admin', 'moderator'])): ?>
                            <a href="<?php echo e(route('forum.posts.edit', [$category->slug, $topic->slug, $post->id])); ?>"
                               class="btn-action edit-btn">
                                <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/>
                                </svg>
                                Düzenle
                            </a>
                        <?php endif; ?>
                        
                        <?php if(auth()->user()->id === $post->user_id || auth()->user()->role === 'admin'): ?>
                            <?php if(!$isFirstPost || auth()->user()->role === 'admin'): ?>
                                <button class="btn-action delete" onclick="deletePost(<?php echo e($post->id); ?>)">
                                    <svg style="width:15px;height:15px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
                                    </svg>
                                    Sil
                                </button>
                            <?php endif; ?>
                        <?php endif; ?>
                    <?php else: ?>
                        
                        <span style="font-size:12px;color:#64748b;">
                            👍 <?php echo e($post->likes ?? 0); ?> • 👎 <?php echo e($post->dislikes ?? 0); ?>

                        </span>
                    <?php endif; ?>
                </div>
                
                <?php if(auth()->guard()->guest()): ?>
                    <?php if(preg_match('/https?:\/\//', $post->content)): ?>
                        <span style="font-size:11px;color:#94a3b8;">
                            🔒 <a href="<?php echo e(route('login')); ?>" style="color:#3b82f6;text-decoration:none;">Üye olun</a> - linkleri görün
                        </span>
                    <?php endif; ?>
                <?php endif; ?>
            </div>
        </div>
    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
</div>


<?php if($topic->is_locked): ?>
    <div class="locked-notice">
        <div class="locked-notice-icon">🔒</div>
        <div class="locked-notice-text">Bu konu kilitlenmiştir. Yanıt gönderilemez.</div>
    </div>
<?php elseif(auth()->check()): ?>
    <div class="reply-form">
        <h3>💬 Yanıt Gönder</h3>
        <form action="<?php echo e(route('forum.posts.store', [$category->slug, $topic->slug])); ?>" method="POST" id="reply-form">
            <?php echo csrf_field(); ?>
            <input type="hidden" name="reply_to_id" id="reply_to_id" value="">

            
            <div id="replying-to" style="display:none;">
                <div class="replying-to">
                    <div class="replying-to-content">
                        <svg style="width:14px;height:14px" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6"/>
                        </svg>
                        <span id="replying-to-text">Yanıtlanıyor...</span>
                    </div>
                    <button type="button" class="cancel-reply" onclick="cancelReply()">×</button>
                </div>
            </div>

            <div class="form-group">
                
                <div id="editor-container"></div>
                
                <textarea name="content" id="reply-content" style="display:none;" required minlength="5"></textarea>
                <?php $__errorArgs = ['content'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                    <div style="color:#dc2626;font-size:12px;margin-top:12px;"><?php echo e($message); ?></div>
                <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
            </div>
            <div style="display:flex;gap:10px;">
                <button type="submit" class="btn-submit" id="submit-btn">
                    🚀 Yanıt Gönder
                </button>
                <button type="button" class="btn-cancel" onclick="cancelReply()" id="cancel-btn" style="display:none;">
                    İptal
                </button>
            </div>
        </form>
    </div>
<?php else: ?>
    <div class="login-prompt">
        <p>Yanıt göndermek için giriş yapmalısınız.</p>
        <a href="<?php echo e(route('login')); ?>">Giriş Yap</a>
    </div>
<?php endif; ?>

<?php $__env->stopSection(); ?>

<?php $__env->startSection('scripts'); ?>
<script src="https://cdn.quilljs.com/1.3.7/quill.min.js"></script>
<style>
/* Quill Editor overrides */
#editor-container {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
    background: #fafbfc;
}
#editor-container .ql-toolbar {
    border: none;
    background: #f8fafc;
    padding: 10px 14px;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
#editor-container .ql-toolbar .ql-formats {
    display: flex;
    align-items: center;
    gap: 4px;
}
#editor-container .ql-toolbar button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#editor-container .ql-container {
    border: none;
    font-size: 14px;
    font-family: inherit;
}
#editor-container .ql-editor {
    min-height: 140px;
    background: #fafbfc;
}
#editor-container .ql-editor:focus {
    background: white;
}
#editor-container .ql-editor.ql-blank::before {
    color: #94a3b8;
    font-style: normal;
}
/* Post reply indicator scroll animation */
.post-card.highlight-pulse {
    animation: highlightPulse 2s ease-out;
}
@keyframes highlightPulse {
    0%   { box-shadow: 0 0 0 3px rgba(59,130,246,0.6); }
    100% { box-shadow: none; }
}
</style>

<script>
const CSRF_TOKEN = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
let currentReplyToId = null;
let replyEditor = null;

/* ── Shared image upload helper ──────────────────────── */
function setupImageUpload(editor) {
    var toolbar = editor.getModule('toolbar');
    toolbar.addHandler('image', function() {
        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('accept', 'image/jpeg,image/jpg,image/png,image/gif,image/webp');
        input.click();
        input.onchange = function() {
            var file = input.files[0];
            if (!file) return;
            if (file.size > 5 * 1024 * 1024) {
                alert('Görsel en fazla 5MB olabilir.');
                return;
            }
            var formData = new FormData();
            formData.append('image', file);
            formData.append('_token', document.querySelector('meta[name="csrf-token"]').getAttribute('content'));
            var range = editor.getSelection(true);
            editor.insertText(range.index, '⏳ Yükleniyor...', 'user');
            fetch('<?php echo e(url('forum/upload-image')); ?>', { method: 'POST', body: formData })
                .then(function(r) { return r.json(); })
                .then(function(data) {
                    editor.deleteText(range.index, '⏳ Yükleniyor...'.length);
                    if (data && data.url) {
                        editor.insertEmbed(range.index, 'image', data.url, 'user');
                        editor.setSelection(range.index + 1);
                    } else {
                        alert('Görsel yüklenemedi.');
                    }
                })
                .catch(function() { editor.deleteText(range.index, '⏳ Yükleniyor...'.length); alert('Görsel yüklenirken hata oluştu.'); });
        };
    });
}

/* ── Quill Editor Init ───────────────────────────────── */
document.addEventListener('DOMContentLoaded', function () {
    replyEditor = new Quill('#editor-container', {
        theme: 'snow',
        placeholder: 'Yanıtınızı yazın...',
        modules: {
            toolbar: [
                [{ 'header': [2, 3] }],
                ['bold', 'italic', 'underline', 'strike'],
                ['blockquote', 'code-block'],
                [{ 'list': 'ordered'}, { 'list': 'bullet' }],
                ['link', 'image', 'video'],
                ['clean']
            ]
        }
    });
    setupImageUpload(replyEditor);
});

/* ── Like / Dislike ───────────────────────────────────── */
function likePost(postId, type) {
    // Get CSRF token - use CSRF_TOKEN variable defined at top of script
    var csrfToken = typeof CSRF_TOKEN !== 'undefined' ? CSRF_TOKEN : document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
    
    if (!csrfToken) {
        console.error('❌ CSRF token not found!');
        alert('Oturum başlamadı. Lütfen sayfayı yenileyin.');
        return;
    }
    
    var url = '<?php echo e(url('/forum/posts')); ?>/' + postId + '/like';
    
    console.log('Like request:', { postId: postId, type: type, url: url, token_length: csrfToken.length });
    
    fetch(url, {
        method: 'POST',
        credentials: 'same-origin',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': csrfToken,
            'Accept': 'application/json',
            'X-Requested-With': 'XMLHttpRequest'
        },
        body: JSON.stringify({ type: type })
    })
    .then(function(response) {
        console.log('Like response status:', response.status);
        if (response.status === 419) {
            console.error('❌ CSRF mismatch (419)! CSRF_TOKEN value:', csrfToken);
            console.error('Meta tag content:', document.querySelector('meta[name="csrf-token"]')?.getAttribute('content'));
            // Try to re-fetch with fresh token by cloning request with header from meta tag
            var freshToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
            if (freshToken && freshToken !== csrfToken) {
                console.log('Retrying with fresh token...');
                return fetch(url, {
                    method: 'POST',
                    credentials: 'same-origin',
                    headers: {
                        'Content-Type': 'application/json',
                        'X-CSRF-TOKEN': freshToken,
                        'Accept': 'application/json',
                        'X-Requested-With': 'XMLHttpRequest'
                    },
                    body: JSON.stringify({ type: type })
                });
            }
            return null;
        }
        if (response.status === 401) {
            window.location.href = '<?php echo e(url('/login')); ?>';
            return null;
        }
        if (!response.ok) {
            console.error('HTTP error', response.status);
            return response.text().then(function(text) {
                console.error('Response body:', text);
                return null;
            });
        }
        return response.json();
    })
    .then(function(data) {
        console.log('Like response data:', data);
        if (!data || !data.action) return;
        var likeCountEl    = document.getElementById('like-count-' + postId);
        var dislikeCountEl = document.getElementById('dislike-count-' + postId);
        var likeBtn        = document.getElementById('like-btn-' + postId);
        var dislikeBtn     = document.getElementById('dislike-btn-' + postId);
        if (likeCountEl)    likeCountEl.textContent    = data.likes;
        if (dislikeCountEl) dislikeCountEl.textContent = data.dislikes;
        if (likeBtn)    likeBtn.classList.remove('liked');
        if (dislikeBtn) dislikeBtn.classList.remove('disliked');
        if (data.user_action === 'like'    && likeBtn)    likeBtn.classList.add('liked');
        if (data.user_action === 'dislike' && dislikeBtn) dislikeBtn.classList.add('disliked');
    })
    .catch(function(err) { console.error('Like error:', err); });
}

/* ── Delete ───────────────────────────────────────────── */
function deletePost(postId) {
    if (!confirm('Bu mesajı silmek istediğinizden emin misiniz?')) return;
    fetch('<?php echo e(url('/forum/posts')); ?>/' + postId, {
        method: 'DELETE',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': CSRF_TOKEN
        }
    })
    .then(function(r) { return r.json(); })
    .then(function(data) {
        if (data.success) {
            var el = document.querySelector('[data-post-id="' + postId + '"]');
            if (el) el.remove(); else location.reload();
        }
    })
    .catch(function(err) { console.error('Delete error:', err); });
}

/* ── Reply / Quote ────────────────────────────────────── */
function replyToPost(postId, username) {
    currentReplyToId = postId;
    document.getElementById('reply_to_id').value = postId;
    document.getElementById('replying-to-text').textContent = username + ' kullanıcısının mesajına yanıtlanıyor';
    document.getElementById('replying-to').style.display = 'block';
    document.getElementById('cancel-btn').style.display  = 'block';

    // Clear editor content for plain reply (not quote)
    if (replyEditor) {
        replyEditor.setText('');
        replyEditor.root.innerHTML = '';
    }

    // Briefly highlight the target post
    var target = document.getElementById('post-' + postId);
    if (target) {
        target.classList.add('highlight-pulse');
        setTimeout(function() { target.classList.remove('highlight-pulse'); }, 2000);
    }

    // Scroll to reply form
    var form = document.getElementById('reply-form');
    if (form) {
        form.scrollIntoView({ behavior: 'smooth', block: 'center' });
        setTimeout(function() {
            focusReplyEditor();
        }, 500);
    }
}

function quotePost(postId, username, content) {
    currentReplyToId = postId;
    document.getElementById('reply_to_id').value = postId;
    document.getElementById('replying-to-text').textContent = username + ' kullanıcısının mesajına alıntı yapılıyor';
    document.getElementById('replying-to').style.display = 'block';
    document.getElementById('cancel-btn').style.display  = 'block';

    // Insert quote as blockquote into Quill editor
    if (replyEditor) {
        // Clear editor first
        replyEditor.setText('');
        // Build HTML blockquote
        var quoteHtml = '<blockquote style="border-left:3px solid #3b82f6;padding:8px 12px;margin:0 0 12px 0;background:#f0f7ff;color:#334155;font-size:13px;border-radius:0 6px 6px 0;">'
            + '<strong>' + username + '</strong> yazdı:<br>'
            + content
            + '</blockquote><p><br></p>';
        replyEditor.clipboard.dangerouslyPasteHTML(0, quoteHtml);
        // Move cursor to end after blockquote
        var length = replyEditor.getLength();
        replyEditor.setSelection(length, 0);
        replyEditor.focus();
    }

    // Briefly highlight the target post
    var target = document.getElementById('post-' + postId);
    if (target) {
        target.classList.add('highlight-pulse');
        setTimeout(function() { target.classList.remove('highlight-pulse'); }, 2000);
    }

    var form = document.getElementById('reply-form');
    if (form) {
        form.scrollIntoView({ behavior: 'smooth', block: 'center' });
        setTimeout(function() { if (replyEditor) replyEditor.focus(); }, 500);
    }
}

function cancelReply() {
    currentReplyToId = null;
    document.getElementById('reply_to_id').value = '';
    document.getElementById('replying-to').style.display = 'none';
    document.getElementById('cancel-btn').style.display  = 'none';
}

/* ── Navigate to quoted post on click ────────────────── */
document.addEventListener('DOMContentLoaded', function() {
    document.querySelectorAll('.post-reply-link').forEach(function(link) {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            var href = this.getAttribute('href'); // e.g. #post-5
            var target = document.querySelector(href);
            if (target) {
                target.scrollIntoView({ behavior: 'smooth', block: 'center' });
                target.classList.add('highlight-pulse');
                setTimeout(function() { target.classList.remove('highlight-pulse'); }, 2000);
            }
        });
    });
});

/* ── Submit guard ─────────────────────────────────────── */
document.getElementById('reply-form')?.addEventListener('submit', function() {
    // Sync Quill editor HTML to hidden textarea before submit
    if (replyEditor) {
        var ta = document.getElementById('reply-content');
        if (ta) ta.value = replyEditor.root.innerHTML;
    }
    var btn = document.getElementById('submit-btn');
    if (btn) { btn.disabled = true; btn.textContent = 'Gönderiliyor...'; }
});

/* ── replyToPost focus fix for Quill ──────────────────── */
function focusReplyEditor() {
    if (replyEditor) {
        replyEditor.focus();
    } else {
        var ta = document.getElementById('reply-content');
        if (ta) ta.focus();
    }
}
</script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.public', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\xampp\htdocs\askeribilgiler\resources\views\forum\topic.blade.php ENDPATH**/ ?>