import { motion } from 'framer-motion'
import { useLang } from '@/context/LangContext'

const SIGNALS = {
  fa: [
    { tag: 'تحریم',      title: 'بسته تحریمی جدید آمریکا — محدودیت صادرات محصولات فولادی از طریق واسطه‌های ثالث',           date: 'فروردین ۱۴۰۴', level: 'critical' },
    { tag: 'چین',        title: 'صادرات ۱۱۲ میلیون تنی فولاد چین در ۱۴۰۳ — رکورد جدید و فشار قیمتی جهانی',                 date: 'اسفند ۱۴۰۳',  level: 'critical' },
    { tag: 'روسیه',      title: 'تغییر مسیر فولاد روسیه به آسیا — فشار بر قیمت فولاد ایران در بازار هند و چین',              date: 'بهمن ۱۴۰۳',  level: 'high'     },
    { tag: 'OPEC+',      title: 'کاهش تولید نفت OPEC+ و تأثیر آن بر سرمایه‌گذاری زیرساختی در خاورمیانه',                     date: 'دی ۱۴۰۳',    level: 'high'     },
    { tag: 'هند',        title: 'هند واردات فولاد از ایران را مشروط به تأیید کیفیت BIS کرد — موانع جدید صادراتی',             date: 'آذر ۱۴۰۳',   level: 'high'     },
    { tag: 'دلار',       title: 'افزایش ۱۸٪ نرخ دلار — فشار بر هزینه‌های واردات و کاهش حاشیه سود صادراتی',                  date: 'آبان ۱۴۰۳',  level: 'critical' },
    { tag: 'عراق',       title: 'عراق تعرفه واردات فولاد را به ۱۵٪ افزایش داد — کاهش جذابیت بازار هدف اصلی',                date: 'مهر ۱۴۰۳',   level: 'high'     },
    { tag: 'اروپا',      title: 'اروپا تعرفه ضددامپینگ ۲۵٪ بر واردات فولاد از آسیا — اثر غیرمستقیم بر ایران',               date: 'شهریور ۱۴۰۳', level: 'medium'   },
    { tag: 'قطر',        title: 'قطر مناقصه ۴۰۰ هزار تن میل‌گرد برای پروژه‌های جام‌جهانی ۲۰۳۴ را منتشر کرد',               date: 'مرداد ۱۴۰۳',  level: 'medium'   },
    { tag: 'پاکستان',    title: 'بحران ارزی پاکستان — توقف اعتبارات اسنادی و اختلال در پرداخت‌های صادراتی ایران',            date: 'تیر ۱۴۰۳',   level: 'high'     },
    { tag: 'ترکیه',      title: 'ترکیه ۳.۲ میلیون تن فولاد از روسیه وارد کرد — رقیب جدی ایران در بازارهای مشترک',           date: 'خرداد ۱۴۰۳',  level: 'medium'   },
    { tag: 'SCO',        title: 'الحاق رسمی ایران به SCO — فرصت برای تجارت غیردلاری فولاد با اعضا',                          date: 'اردیبهشت ۱۴۰۳', level: 'medium' },
    { tag: 'افغانستان',  title: 'آمارهای صادرات: افغانستان سومین بازار هدف فولاد ایران با رشد ۳۸٪',                          date: 'فروردین ۱۴۰۳', level: 'medium'  },
    { tag: 'سنگ‌آهن',   title: 'رقابت چین و هند بر منابع سنگ‌آهن استرالیا — افزایش هزینه تأمین مواد خام ایران',              date: 'اسفند ۱۴۰۲',  level: 'high'    },
  ],
  en: [
    { tag: 'Sanctions',    title: 'New US sanctions package — restrictions on steel exports via third-party intermediaries',   date: 'Apr 2025',  level: 'critical' },
    { tag: 'China',        title: "China's 112Mt steel exports in 1403 — new record and global price pressure",                date: 'Mar 2025',  level: 'critical' },
    { tag: 'Russia',       title: 'Russian steel rerouted to Asia — price pressure on Iranian steel in India and China',       date: 'Feb 2025',  level: 'high'     },
    { tag: 'OPEC+',        title: 'OPEC+ output cuts and impact on infrastructure investment in the Middle East',              date: 'Jan 2025',  level: 'high'     },
    { tag: 'India',        title: 'India conditions Iranian steel imports on BIS quality approval — new export barriers',      date: 'Dec 2024',  level: 'high'     },
    { tag: 'USD/IRR',      title: '18% USD rate increase — import cost pressure and shrinking export margins',                 date: 'Nov 2024',  level: 'critical' },
    { tag: 'Iraq',         title: 'Iraq raises steel import tariff to 15% — key target market becomes less attractive',        date: 'Oct 2024',  level: 'high'     },
    { tag: 'Europe',       title: 'EU 25% anti-dumping tariff on Asian steel — indirect impact on Iran',                      date: 'Sep 2024',  level: 'medium'   },
    { tag: 'Qatar',        title: 'Qatar issues tender for 400k tonnes of rebar for 2034 World Cup projects',                  date: 'Aug 2024',  level: 'medium'   },
    { tag: 'Pakistan',     title: 'Pakistan currency crisis — halt to LCs disrupts Iranian export payments',                   date: 'Jul 2024',  level: 'high'     },
    { tag: 'Turkey',       title: 'Turkey imports 3.2Mt of steel from Russia — serious rival in shared markets',               date: 'Jun 2024',  level: 'medium'   },
    { tag: 'SCO',          title: "Iran's formal SCO accession — opportunity for non-dollar steel trade with members",         date: 'May 2024',  level: 'medium'   },
    { tag: 'Afghanistan',  title: 'Export data: Afghanistan is Iran\'s 3rd largest steel market, growing 38%',                date: 'Apr 2024',  level: 'medium'   },
    { tag: 'Iron Ore',     title: 'China–India competition for Australian iron ore — rising raw material costs for Iran',      date: 'Mar 2024',  level: 'high'     },
  ],
}

const SCENARIOS = {
  fa: [
    { num: '۰۱', tag: 'سناریو پایه',    title: 'تداوم وضعیت موجود — رشد ۳٪ صادرات در بازارهای منطقه‌ای',        summary: 'در صورت ادامه سیاست‌های فعلی و بدون تغییر جدی در تحریم‌ها، صادرات فولاد ایران سالانه ۳٪ رشد می‌کند — بازارهای هدف: عراق، افغانستان، پاکستان' },
    { num: '۰۲', tag: 'سناریو صعودی',   title: 'توافق دیپلماتیک — گشایش بازارهای اروپایی و کره جنوبی',          summary: 'در صورت کاهش تحریم‌ها، امکان صادرات ۳ میلیون تن به بازارهای پریمیوم اروپایی با حاشیه سود ۴۰٪ بالاتر وجود دارد — نیاز به گواهینامه‌های بین‌المللی' },
    { num: '۰۳', tag: 'سناریو نزولی',   title: 'تشدید تحریم‌ها — انزوای کامل از شبکه‌های مالی بین‌المللی',      summary: 'بسته شدن کانال‌های پرداخت غیررسمی، کاهش ۳۰٪ صادرات و فشار شدید بر حاشیه سود — نیاز به تنوع‌بخشی بازار داخلی و افزایش مصرف در پروژه‌های ملی' },
    { num: '۰۴', tag: 'ریسک چین',       title: 'افزایش صادرات چین به بازارهای هدف ایران — رقابت قیمتی شدید',    summary: 'اگر چین صادرات به عراق و پاکستان را ۲۰٪ افزایش دهد، حاشیه رقابتی ایران در این بازارها به شدت فشرده می‌شود — نیاز به کاهش هزینه تولید ۸٪ یا تمایزبخشی کیفی' },
    { num: '۰۵', tag: 'فرصت SCO',       title: 'تجارت فولاد در چارچوب SCO با ارزهای ملی — دور زدن دلار',        summary: 'معامله مستقیم ریال–روپیه–یوان در صادرات فولاد، کاهش ریسک نرخ ارز و دسترسی به بازار ۳ میلیارد نفری بدون محدودیت‌های SWIFT' },
    { num: '۰۶', tag: 'زیرساخت منطقه',  title: 'رونق پروژه‌های زیرساختی خلیج فارس — فرصت ۸ میلیون تن',          summary: 'برنامه‌های Vision 2030 عربستان، Neom، جام‌جهانی قطر ۲۰۳۴ و پروژه‌های کویت — ظرفیت جذب ۸ میلیون تن فولاد تا ۲۰۳۵ از منطقه' },
  ],
  en: [
    { num: '01', tag: 'Base Scenario',   title: 'Status quo — 3% annual export growth in regional markets',        summary: 'If current policies continue with no major shift in sanctions, Iranian steel exports grow 3% annually — target markets: Iraq, Afghanistan, Pakistan' },
    { num: '02', tag: 'Bull Scenario',   title: 'Diplomatic deal — access to European and South Korean markets',   summary: 'With sanctions relief, potential to export 3Mt to premium European markets at 40% higher margins — requires international certifications' },
    { num: '03', tag: 'Bear Scenario',   title: 'Sanctions escalation — full isolation from global financial networks', summary: 'Closure of informal payment channels, 30% export decline and severe margin pressure — requires domestic market diversification and national project absorption' },
    { num: '04', tag: 'China Risk',      title: "China increasing exports to Iran's target markets — intense price competition", summary: 'If China grows exports to Iraq and Pakistan by 20%, Iran\'s competitive margin in these markets is severely squeezed — requires 8% production cost reduction or quality differentiation' },
    { num: '05', tag: 'SCO Opportunity', title: 'Steel trade within SCO in local currencies — bypassing the dollar', summary: 'Direct Rial–Rupee–Yuan trade in steel exports, reduced FX risk, and access to 3 billion-person market without SWIFT restrictions' },
    { num: '06', tag: 'Regional Infra',  title: 'Gulf infrastructure boom — 8 million tonne opportunity',           summary: 'Saudi Vision 2030, NEOM, Qatar 2034 World Cup, Kuwait projects — capacity to absorb 8Mt of steel from the region by 2035' },
  ],
}

const KPIS = {
  fa: [
    { value: '۸.۷',  unit: 'میلیون تن', label: 'صادرات فولاد ایران ۱۴۰۳',         delta: '+۱.۸٪ رشد سالانه' },
    { value: '۱۴',   unit: 'کشور',      label: 'بازارهای هدف صادراتی',             delta: 'عراق، افغانستان، پاکستان اول' },
    { value: '۳۸٪',  unit: '',          label: 'سهم بازار عراق از صادرات',          delta: 'بزرگ‌ترین مقصد' },
    { value: '۱۱۲',  unit: 'میلیون تن', label: 'صادرات فولاد چین ۱۴۰۳',           delta: 'رکورد ۸ ساله' },
    { value: '۴.۲',  unit: 'میلیارد $', label: 'ارزش صادرات فولادی ایران',         delta: '+۱۲٪ نسبت به ۱۴۰۲' },
  ],
  en: [
    { value: '8.7',  unit: 'Mt',         label: 'Iran steel exports 1403',           delta: '+1.8% annual growth' },
    { value: '14',   unit: 'countries',  label: 'Export target markets',             delta: 'Iraq, Afghanistan, Pakistan lead' },
    { value: '38%',  unit: '',           label: 'Iraq share of exports',             delta: 'Largest destination' },
    { value: '112',  unit: 'Mt',         label: 'China steel exports 1403',          delta: '8-year record' },
    { value: '$4.2', unit: 'B',          label: 'Value of Iranian steel exports',    delta: '+12% vs 1402' },
  ],
}

const LEVEL_COLOR: Record<string, string> = {
  critical: '#7f1d1d',
  high:     'var(--red)',
  medium:   '#b45309',
}

const LEVEL_LABEL = {
  fa: { critical: 'بحرانی', high: 'بالا', medium: 'متوسط' },
  en: { critical: 'Critical', high: 'High', medium: 'Medium' },
}

const T = {
  fa: {
    overline:      'GEOPOLITICS & GLOBAL ECONOMY',
    heading:       'ژئوپلیتیک و اقتصاد جهانی',
    sub:           'تحلیل ریسک‌های کلان، پویایی‌های تجاری و سناریوهای ژئوپلیتیک با اثر مستقیم بر صنعت فولاد ایران',
    kpiHeading:    'شاخص‌های کلیدی تجارت بین‌المللی فولاد ایران',
    sigHeading:    'رویدادها و ریسک‌های ژئوپلیتیک',
    scenHeading:   'سناریوهای استراتژیک — افق ۱۴۰۶',
  },
  en: {
    overline:      'GEOPOLITICS & GLOBAL ECONOMY',
    heading:       'Geopolitics & Global Economy',
    sub:           'Macro risk analysis, trade dynamics, and geopolitical scenarios with direct impact on Iran\'s steel industry',
    kpiHeading:    'Key International Trade KPIs — Iranian Steel',
    sigHeading:    'Geopolitical Events & Risks',
    scenHeading:   'Strategic Scenarios — Horizon 2027',
  },
}

export default function Geopolitics() {
  const { lang } = useLang()
  const t = T[lang]
  const signals = SIGNALS[lang]
  const scenarios = SCENARIOS[lang]
  const kpis = KPIS[lang]
  const levelLabel = LEVEL_LABEL[lang]

  return (
    <div dir={lang === 'fa' ? 'rtl' : 'ltr'} style={{ background: 'var(--paper)', minHeight: '80vh' }}>

      {/* ── Hero ── */}
      <div style={{ borderBottom: '3px solid var(--ink)' }}>
        <div className="max-w-7xl mx-auto px-12 max-md:px-5" style={{ paddingTop: 48, paddingBottom: 40 }}>
          <div style={{ display: 'flex', alignItems: 'center', gap: 12, marginBottom: 16 }}>
            <div style={{ width: 36, height: 2, background: 'var(--red)' }} />
            <span style={{ fontSize: 10, fontWeight: 700, letterSpacing: '3px', textTransform: 'uppercase', color: 'var(--ink-4)' }}>{t.overline}</span>
          </div>
          <h1 style={{ fontSize: 'clamp(28px,4vw,52px)', fontWeight: 900, letterSpacing: '-1.5px', color: 'var(--ink)', marginBottom: 12 }}>{t.heading}</h1>
          <p style={{ fontSize: 15, color: 'var(--ink-3)', lineHeight: 1.7, maxWidth: 560 }}>{t.sub}</p>
        </div>
      </div>

      {/* ── KPI Strip ── */}
      <div style={{ borderBottom: '1px solid var(--rule-thin)', background: 'var(--paper-2)' }}>
        <div className="max-w-7xl mx-auto px-12 max-md:px-5" style={{ paddingTop: 36, paddingBottom: 36 }}>
          <div style={{ fontSize: 10, fontWeight: 700, letterSpacing: '2px', color: 'var(--ink-4)', marginBottom: 20, textTransform: 'uppercase' }}>{t.kpiHeading}</div>
          <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(180px, 1fr))', gap: 24 }}>
            {kpis.map((k, i) => (
              <motion.div key={i} initial={{ opacity: 0, y: 8 }} whileInView={{ opacity: 1, y: 0 }} viewport={{ once: true }} transition={{ delay: i * 0.07 }}>
                <div style={{ fontSize: 'clamp(26px,3vw,38px)', fontWeight: 900, letterSpacing: '-1px', color: 'var(--ink)', lineHeight: 1 }}>
                  {k.value}<span style={{ fontSize: 13, fontWeight: 600, color: 'var(--ink-3)', marginRight: 4, marginLeft: 4 }}>{k.unit}</span>
                </div>
                <div style={{ fontSize: 12, color: 'var(--ink-3)', marginTop: 6, lineHeight: 1.5 }}>{k.label}</div>
                <div style={{ fontSize: 10, color: 'var(--red)', fontWeight: 700, marginTop: 4 }}>{k.delta}</div>
              </motion.div>
            ))}
          </div>
        </div>
      </div>

      {/* ── Risk Signals ── */}
      <div className="max-w-7xl mx-auto px-12 max-md:px-5" style={{ paddingTop: 48, paddingBottom: 16 }}>
        <div style={{ display: 'flex', alignItems: 'center', gap: 12, marginBottom: 28 }}>
          <div style={{ width: 36, height: 2, background: 'var(--red)' }} />
          <span style={{ fontSize: 10, fontWeight: 700, letterSpacing: '2px', textTransform: 'uppercase', color: 'var(--ink-4)' }}>{t.sigHeading}</span>
        </div>
        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(300px, 1fr))', gap: 1, background: 'var(--rule-thin)' }}>
          {signals.map((s, i) => (
            <motion.div
              key={i}
              initial={{ opacity: 0, y: 12 }}
              whileInView={{ opacity: 1, y: 0 }}
              viewport={{ once: true }}
              transition={{ duration: 0.4, delay: i * 0.04 }}
              style={{ background: 'var(--paper)', padding: '28px 24px', position: 'relative' }}
            >
              <div style={{ position: 'absolute', top: 0, right: 0, left: 0, height: 3, background: LEVEL_COLOR[s.level] }} />
              <div style={{ display: 'flex', alignItems: 'center', gap: 8, marginBottom: 14 }}>
                <span style={{ fontSize: 9, fontWeight: 700, letterSpacing: '1.5px', background: 'var(--ink)', color: 'var(--paper)', padding: '3px 8px' }}>{s.tag}</span>
                <span style={{ fontSize: 9, fontWeight: 700, color: LEVEL_COLOR[s.level], letterSpacing: '1px' }}>{levelLabel[s.level as keyof typeof levelLabel]}</span>
              </div>
              <h3 style={{ fontSize: 14, fontWeight: 700, color: 'var(--ink)', lineHeight: 1.55, marginBottom: 16 }}>{s.title}</h3>
              <div style={{ fontSize: 10, color: 'var(--ink-5)', fontWeight: 600 }}>{s.date}</div>
            </motion.div>
          ))}
        </div>
      </div>

      {/* ── Strategic Scenarios ── */}
      <div className="max-w-7xl mx-auto px-12 max-md:px-5" style={{ paddingTop: 48, paddingBottom: 64 }}>
        <div style={{ display: 'flex', alignItems: 'center', gap: 12, marginBottom: 28 }}>
          <div style={{ width: 36, height: 2, background: 'var(--red)' }} />
          <span style={{ fontSize: 10, fontWeight: 700, letterSpacing: '2px', textTransform: 'uppercase', color: 'var(--ink-4)' }}>{t.scenHeading}</span>
        </div>
        <div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(300px, 1fr))', gap: 1, background: 'var(--rule-thin)' }}>
          {scenarios.map((s, i) => (
            <motion.div
              key={i}
              initial={{ opacity: 0, y: 12 }}
              whileInView={{ opacity: 1, y: 0 }}
              viewport={{ once: true }}
              transition={{ duration: 0.4, delay: i * 0.06 }}
              style={{ background: 'var(--paper)', padding: '28px 24px', position: 'relative' }}
            >
              <div style={{ position: 'absolute', top: 0, right: 0, left: 0, height: 3, background: 'var(--ink)' }} />
              <div style={{ fontSize: 48, fontWeight: 900, letterSpacing: '-3px', color: 'rgba(26,23,18,0.06)', lineHeight: 1, marginBottom: 10, direction: 'ltr' }}>{s.num}</div>
              <div style={{ fontSize: 9, fontWeight: 700, letterSpacing: '1.5px', color: 'var(--red)', marginBottom: 10, textTransform: 'uppercase' }}>{s.tag}</div>
              <h3 style={{ fontSize: 15, fontWeight: 800, color: 'var(--ink)', lineHeight: 1.45, marginBottom: 12 }}>{s.title}</h3>
              <p style={{ fontSize: 12, color: 'var(--ink-3)', lineHeight: 1.7 }}>{s.summary}</p>
            </motion.div>
          ))}
        </div>
      </div>

    </div>
  )
}
