<?php
/**
 * Single Template: stb_encyclopedia
 * URL: /encyclopedia/{slug}/
 */
$lang = stb_lang();
$is_fa = ($lang === 'fa');
get_header();

the_post();
$post_id   = get_the_ID();
$diff      = get_post_meta($post_id,'_ency_difficulty',true) ?: 'beginner';
$related_s = get_post_meta($post_id,'_ency_related',true);
$fa_title  = get_post_meta($post_id,'_ency_fa_title',true);
$fa_short  = get_post_meta($post_id,'_ency_fa_short_def',true);
$fa_content= get_post_meta($post_id,'_ency_fa_content',true);
$short_def = get_post_meta($post_id,'_ency_short_def',true) ?: get_the_excerpt();

$display_title   = get_the_title();
$display_short   = $is_fa && $fa_short  ? $fa_short  : $short_def;
$display_content = $is_fa && $fa_content ? $fa_content : get_the_content();

$cats      = wp_get_post_terms($post_id,'ency_category');
$cat       = !empty($cats) ? $cats[0] : null;
$cat_fa    = $cat ? get_term_meta($cat->term_id,'_ency_cat_fa',true) : '';
$cat_label = $is_fa && $cat_fa ? $cat_fa : ($cat ? $cat->name : '');

$diff_labels = ['beginner'=>[$is_fa?'مبتدی':'Beginner','#14e0a3'],
                'intermediate'=>[$is_fa?'متوسط':'Intermediate','#ff9800'],
                'advanced'=>[$is_fa?'پیشرفته':'Advanced','#C8102E']];
$diff_info = $diff_labels[$diff] ?? $diff_labels['beginner'];

// Related terms
$related_terms = [];
if($related_s) {
    $slugs = array_map('trim', explode(',', $related_s));
    foreach($slugs as $s) {
        $p = get_page_by_path($s, OBJECT, 'stb_encyclopedia');
        if($p) {
            $rfa = get_post_meta($p->ID,'_ency_fa_title',true);
            $related_terms[] = ['id'=>$p->ID,'title'=>($is_fa&&$rfa?$rfa:$p->post_title),'url'=>get_permalink($p->ID).($is_fa?'?lang=fa':''),'slug'=>$p->post_name];
        }
    }
}

// Prev / Next
$all = get_posts(['post_type'=>'stb_encyclopedia','post_status'=>'publish','posts_per_page'=>-1,'orderby'=>'title','order'=>'ASC']);
$current_idx = -1;
foreach($all as $i=>$p) { if($p->ID === $post_id) { $current_idx = $i; break; } }
$prev_post = $current_idx > 0 ? $all[$current_idx-1] : null;
$next_post = $current_idx < count($all)-1 ? $all[$current_idx+1] : null;

$enc_url = home_url('/encyclopedia/') . ($is_fa ? '?lang=fa' : '');
$words = str_word_count(strip_tags($display_content));
$read_time = max(1, round($words / 200));

$T = [
  'back'       => $is_fa ? '← بازگشت به دانشنامه' : '← Back to Encyclopedia',
  'definition' => $is_fa ? 'تعریف' : 'Definition',
  'read_time'  => $is_fa ? "دقیقه مطالعه $read_time" : "$read_time min read",
  'related'    => $is_fa ? 'اصطلاحات مرتبط' : 'Related Terms',
  'prev'       => $is_fa ? 'قبلی' : 'Previous',
  'next'       => $is_fa ? 'بعدی' : 'Next',
  'cta_title'  => $is_fa ? 'این مفهوم را در عمل تجربه کنید' : 'Practice this concept live',
  'cta_desc'   => $is_fa ? 'یک حساب دمو رایگان باز کنید و بدون ریسک معامله کنید.' : 'Open a free demo and trade without risk.',
  'cta_btn'    => $is_fa ? 'شبیه‌ساز رایگان' : 'Try Free Demo',
  'cta_btn2'   => $is_fa ? 'افتتاح حساب' : 'Open Account',
];

$login_label_url = $lang==='fa' ? 'https://crm.stbbrokers.com/fa':'https://crm.stbbrokers.com/';
$register_label_url = $lang==='fa' ? 'https://crm.stbbrokers.com/fa/register':'https://crm.stbbrokers.com/register/';

?>
<style>
.ency-single{max-width:1200px;margin:0 auto;padding:40px 40px 80px;display:grid;grid-template-columns:1fr 320px;gap:48px;direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
@media(max-width:900px){.ency-single{grid-template-columns:1fr;padding:20px}}

/* Article */
.ency-article{}
.ency-breadcrumb{display:flex;align-items:center;gap:8px;font-size:12.5px;color:rgba(255,255,255,.35);margin-bottom:32px;flex-wrap:wrap;direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
.ency-breadcrumb a{color:rgba(255,255,255,.35);text-decoration:none;transition:color .15s}
.ency-breadcrumb a:hover{color:#fff}
.ency-breadcrumb-sep{color:rgba(255,255,255,.2)}
.ency-back-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:rgba(200,16,46,.8);text-decoration:none;margin-bottom:24px;transition:color .15s}
.ency-back-link:hover{color:#C8102E}

.ency-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:20px;direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
.ency-cat-tag{font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;background:rgba(200,16,46,.1);border:1px solid rgba(200,16,46,.2);color:rgba(200,16,46,.8);text-transform:uppercase;letter-spacing:.06em}
.ency-diff-tag{font-size:11px;font-weight:700;padding:4px 12px;border-radius:20px;border:1px solid;color:<?php echo $diff_info[1]; ?>;background:<?php echo $diff_info[1]; ?>22;border-color:<?php echo $diff_info[1]; ?>44}
.ency-read-time{font-size:12px;color:rgba(255,255,255,.3);margin-<?php echo $is_fa?'right':'left'; ?>:auto}

.ency-title{font-size:clamp(32px,4.5vw,52px);font-weight:700;color:#fff;line-height:1.1;margin-bottom:24px;text-align:<?php echo $is_fa?'right':'left'; ?>}
.lang-fa .ency-title{font-family:'Vazirmatn',sans-serif}

.ency-def-box{background:rgba(200,16,46,.05);border-<?php echo $is_fa?'right':'left'; ?>:3px solid #C8102E;border-radius:0 12px 12px 0;padding:16px 20px;margin-bottom:36px;direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
<?php if($is_fa): ?>.ency-def-box{border-right:3px solid #C8102E;border-left:none;border-radius:12px 0 0 12px}<?php endif; ?>
.ency-def-label{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(200,16,46,.7);margin-bottom:8px}
.ency-def-text{font-size:15.5px;color:rgba(255,255,255,.75);line-height:1.65;direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
.lang-fa .ency-def-text{font-family:'Vazirmatn',sans-serif}

/* Article body */
.ency-body{color:rgba(255,255,255,.65);line-height:1.8;font-size:15px;text-align:<?php echo $is_fa?'right':'left'; ?>;direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
.lang-fa .ency-body{font-family:'Vazirmatn',sans-serif}
.ency-body h2{font-size:22px;font-weight:700;color:#fff;margin:36px 0 14px;border-bottom:1px solid rgba(255,255,255,.07);padding-bottom:10px}
.ency-body h3{font-size:17px;font-weight:700;color:#fff;margin:24px 0 10px}
.ency-body p{margin-bottom:16px}
.ency-body strong{color:#fff}
.ency-body table{width:100%;border-collapse:collapse;margin:20px 0;border-radius:10px;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.ency-body th{background:rgba(255,255,255,.05);padding:10px 14px;font-size:12px;font-weight:700;color:rgba(255,255,255,.5);text-align:<?php echo $is_fa?'right':'left'; ?>}
.ency-body td{padding:10px 14px;font-size:13.5px;border-bottom:1px solid rgba(255,255,255,.05);color:rgba(255,255,255,.65)}
.ency-body tr:last-child td{border-bottom:none}
.ency-body em{font-style:italic;color:rgba(255,255,255,.8)}

/* Prev/Next nav */
.ency-prevnext{display:flex;gap:12px;margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.07);direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
.ency-nav-btn{flex:1;padding:16px;background:#0a0c10;border:1px solid rgba(255,255,255,.08);border-radius:12px;text-decoration:none;transition:border-color .2s;display:flex;flex-direction:column;gap:4px}
.ency-nav-btn:hover{border-color:rgba(200,16,46,.25)}
.ency-nav-label{font-size:11px;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.08em}
.ency-nav-title{font-size:14px;font-weight:600;color:#fff}
.ency-nav-btn.next{text-align:<?php echo $is_fa?'left':'right'; ?>}

/* Sidebar */
.ency-sidebar{}
.ency-sidebar-box{background:#0a0c10;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:24px;margin-bottom:20px;position:sticky;top:100px}
.ency-sidebar-title{font-size:13px;font-weight:700;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:.1em;margin-bottom:16px;text-align:<?php echo $is_fa?'right':'left'; ?>}
.ency-related-list{display:flex;flex-direction:column;gap:8px}
.ency-related-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);text-decoration:none;transition:all .15s;direction:<?php echo $is_fa?'rtl':'ltr'; ?>}
.ency-related-item:hover{background:rgba(200,16,46,.05);border-color:rgba(200,16,46,.2)}
.ency-related-letter{width:28px;height:28px;border-radius:6px;background:rgba(200,16,46,.08);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#C8102E;flex-shrink:0;font-family:'Bebas Neue',sans-serif}
.ency-related-name{font-size:13px;color:rgba(255,255,255,.65);font-weight:500}

/* CTA box */
.ency-cta-box{background:linear-gradient(135deg,rgba(200,16,46,.08),transparent);border:1px solid rgba(200,16,46,.15);border-radius:14px;padding:24px;text-align:center;position:relative;overflow:hidden}
.ency-cta-box::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#C8102E,transparent)}
.ency-cta-box h4{font-size:17px;font-weight:700;color:#fff;margin-bottom:8px}
.lang-fa .ency-cta-box h4{font-family:'Vazirmatn',sans-serif}
.ency-cta-box p{font-size:13px;color:rgba(255,255,255,.45);margin-bottom:16px;line-height:1.6}
.ency-cta-btns{display:flex;flex-direction:column;gap:8px}

@media(max-width:768px){
  .ency-single{padding:20px}
  .ency-prevnext{flex-direction:column}
}
</style>

<div class="ency-single">

  <!-- Main article -->
  <article class="ency-article">
    <!-- Back link -->
    <a href="<?php echo esc_url($enc_url); ?>" class="ency-back-link">
      <?php if($is_fa): ?>
      <svg viewBox="0 0 24 24" width="14" height="14" stroke="currentColor" fill="none"><path d="M19 12H5M12 19l-7-7 7-7" stroke-width="1.5" stroke-linecap="round"/></svg>
      <?php echo $T['back']; ?>
      <?php else: ?>
      <?php echo $T['back']; ?>
      <?php endif; ?>
    </a>

    <!-- Meta -->
    <div class="ency-meta">
      <?php if($cat_label): ?><span class="ency-cat-tag"><?php echo esc_html($cat_label); ?></span><?php endif; ?>
      <span class="ency-diff-tag"><?php echo esc_html($diff_info[0]); ?></span>
      <span class="ency-read-time"><?php echo esc_html($T['read_time']); ?></span>
    </div>

    <!-- Title -->
    <h1 class="ency-title"><?php echo esc_html($display_title); ?></h1>
    <?php if($is_fa && $fa_title): ?><div style="font-size:clamp(16px,2.2vw,24px);font-weight:600;color:rgba(255,255,255,.5);margin:-10px 0 24px;font-family:'Vazirmatn',sans-serif;text-align:right;direction:rtl"><?php echo esc_html($fa_title); ?></div><?php endif; ?>

    <!-- Definition box -->
    <?php if($display_short): ?>
    <div class="ency-def-box">
      <div class="ency-def-label"><?php echo $T['definition']; ?></div>
      <div class="ency-def-text"><?php echo esc_html($display_short); ?></div>
    </div>
    <?php endif; ?>

    <!-- Article body -->
    <div class="ency-body">
      <?php echo $display_content ?: '<p>' . esc_html($display_short) . '</p>'; ?>
    </div>

    <!-- Prev / Next -->
    <div class="ency-prevnext">
      <?php if($prev_post): ?>
      <?php $prev_fa = get_post_meta($prev_post->ID,'_ency_fa_title',true); ?>
      <a href="<?php echo esc_url(get_permalink($prev_post->ID).($is_fa?'?lang=fa':'')); ?>" class="ency-nav-btn prev">
        <span class="ency-nav-label">← <?php echo $T['prev']; ?></span>
        <span class="ency-nav-title"><?php echo esc_html($is_fa&&$prev_fa?$prev_fa:$prev_post->post_title); ?></span>
      </a>
      <?php endif; ?>
      <?php if($next_post): ?>
      <?php $next_fa = get_post_meta($next_post->ID,'_ency_fa_title',true); ?>
      <a href="<?php echo esc_url(get_permalink($next_post->ID).($is_fa?'?lang=fa':'')); ?>" class="ency-nav-btn next">
        <span class="ency-nav-label"><?php echo $T['next']; ?> →</span>
        <span class="ency-nav-title"><?php echo esc_html($is_fa&&$next_fa?$next_fa:$next_post->post_title); ?></span>
      </a>
      <?php endif; ?>
    </div>
  </article>

  <!-- Sidebar -->
  <aside class="ency-sidebar">
    <?php if(!empty($related_terms)): ?>
    <div class="ency-sidebar-box">
      <div class="ency-sidebar-title"><?php echo $T['related']; ?></div>
      <div class="ency-related-list">
        <?php foreach($related_terms as $r): ?>
        <a href="<?php echo esc_url($r['url']); ?>" class="ency-related-item">
          <div class="ency-related-letter"><?php echo strtoupper(mb_substr($r['title'],0,1)); ?></div>
          <div class="ency-related-name"><?php echo esc_html($r['title']); ?></div>
        </a>
        <?php endforeach; ?>
      </div>
    </div>
    <?php endif; ?>

    <!-- CTA box -->
    <div class="ency-cta-box">
      <h4><?php echo $T['cta_title']; ?></h4>
      <p><?php echo $T['cta_desc']; ?></p>
      <div class="ency-cta-btns">
        <a href="<?php echo esc_html($register_label_url);?>" class="ip-btn-red"><?php echo $T['cta_btn2']; ?></a>
        <a href="<?php echo esc_html($register_label_url);?>" class="ip-btn-ghost"><?php echo $T['cta_btn']; ?></a>
      </div>
    </div>
  </aside>
</div>

<?php get_footer(); ?>
