From c95d922ce1c13184044c44376aeabf7f184f986e Mon Sep 17 00:00:00 2001
From: alireza <alirezaameria2@gmail.com>
Date: Mon, 1 Jun 2026 10:58:58 +0330
Subject: [PATCH] Footer: proper padding and spacing throughout

---
 src/app/layout/Footer.tsx | 67 ++++++++++++++++++++++++---------------
 1 file changed, 42 insertions(+), 25 deletions(-)

diff --git a/src/app/layout/Footer.tsx b/src/app/layout/Footer.tsx
index a5c5f99..f212cdc 100644
--- a/src/app/layout/Footer.tsx
+++ b/src/app/layout/Footer.tsx
@@ -8,11 +8,11 @@ function SocialIcon({ label }: { label: string }) {
       onMouseEnter={() => setHovered(true)}
       onMouseLeave={() => setHovered(false)}
       style={{
-        width: 28, height: 28,
-        border: `1px solid ${hovered ? 'rgba(255,255,255,0.4)' : 'rgba(255,255,255,0.12)'}`,
+        width: 32, height: 32,
+        border: `1px solid ${hovered ? 'rgba(255,255,255,0.4)' : 'rgba(255,255,255,0.15)'}`,
         display: 'flex', alignItems: 'center', justifyContent: 'center',
-        fontSize: 10, fontWeight: 700,
-        color: hovered ? '#fff' : 'rgba(255,255,255,0.4)',
+        fontSize: 11, fontWeight: 700,
+        color: hovered ? '#fff' : 'rgba(255,255,255,0.45)',
         cursor: 'pointer', transition: 'border-color 150ms, color 150ms', flexShrink: 0,
       }}
     >{label}</div>
@@ -26,9 +26,13 @@ function FooterLink({ href, label }: { href: string; label: string }) {
       onMouseEnter={() => setHovered(true)}
       onMouseLeave={() => setHovered(false)}
       style={{
-        fontSize: 13, color: hovered ? '#fff' : 'rgba(255,255,255,0.55)',
-        textDecoration: 'none', cursor: 'pointer', transition: 'color 150ms',
-        display: 'inline-block', lineHeight: 1.4, whiteSpace: 'nowrap',
+        fontSize: 14,
+        color: hovered ? '#fff' : 'rgba(255,255,255,0.6)',
+        textDecoration: 'none',
+        cursor: 'pointer',
+        transition: 'color 150ms',
+        display: 'block',
+        padding: '4px 0',
       }}
     >{label}</a>
   )
@@ -44,20 +48,25 @@ function NewsletterBox() {
   const [email, setEmail] = useState('')
   const [done, setDone] = useState(false)
   return (
-    <div style={{ marginTop: 20 }}>
-      <div style={{ fontSize: 11, fontWeight: 700, color: 'rgba(255,255,255,0.45)', letterSpacing: '2px', textTransform: 'uppercase', marginBottom: 10 }}>
+    <div style={{ marginTop: 8 }}>
+      <div style={{
+        fontSize: 11, fontWeight: 700,
+        color: 'rgba(255,255,255,0.4)',
+        letterSpacing: '2px', textTransform: 'uppercase',
+        marginBottom: 12,
+      }}>
         خبرنامه فولاد
       </div>
-      <div style={{ display: 'flex', border: '1px solid rgba(255,255,255,0.18)', maxWidth: '100%' }}>
+      <div style={{ display: 'flex', border: '1px solid rgba(255,255,255,0.18)' }}>
         <input
           type="email" value={email}
           onChange={e => setEmail(e.target.value)}
           placeholder="ایمیل خود را وارد کنید..."
           disabled={done}
           style={{
-            flex: 1, border: 'none', padding: '9px 12px', fontSize: 12,
+            flex: 1, border: 'none', padding: '10px 14px', fontSize: 13,
             fontFamily: 'inherit', background: 'rgba(255,255,255,0.07)',
-            color: '#fff', outline: 'none', direction: 'rtl',
+            color: '#fff', outline: 'none', direction: 'rtl', minWidth: 0,
           }}
         />
         <button
@@ -65,8 +74,8 @@ function NewsletterBox() {
           disabled={done}
           style={{
             background: done ? 'rgba(255,255,255,0.15)' : '#00AEEF',
-            color: '#fff', border: 'none', padding: '9px 14px',
-            fontSize: 11, fontWeight: 700, fontFamily: 'inherit',
+            color: '#fff', border: 'none', padding: '10px 16px',
+            fontSize: 12, fontWeight: 700, fontFamily: 'inherit',
             cursor: done ? 'default' : 'pointer', whiteSpace: 'nowrap', flexShrink: 0,
           }}
         >
@@ -80,15 +89,23 @@ function NewsletterBox() {
 export function Footer() {
   return (
     <footer dir="rtl" style={{ backgroundColor: 'var(--ink)', color: 'rgba(255,255,255,0.6)' }}>
-      <div className="max-w-7xl mx-auto w-full px-8 max-md:px-6" style={{ paddingTop: 56, paddingBottom: 48 }}>
-        <div className="grid grid-cols-2 max-md:grid-cols-1 gap-10">
+      <div style={{ maxWidth: 1280, margin: '0 auto', padding: '60px 48px 52px' }}
+           className="max-md:!px-6 max-md:!py-10">
+
+        <div className="grid grid-cols-2 max-md:grid-cols-1 gap-12 max-md:gap-8">
 
           {/* Brand */}
           <div>
-            <div style={{ fontSize: 22, fontWeight: 900, color: '#fff', lineHeight: 1.3, marginBottom: 6 }}>
+            <div style={{ fontSize: 24, fontWeight: 900, color: '#fff', lineHeight: 1.3, marginBottom: 8 }}>
               اندیشکده فولاد آینده
             </div>
-            <div style={{ fontSize: 10, letterSpacing: 2, color: 'rgba(255,255,255,0.3)', textTransform: 'uppercase', marginBottom: 20 }}>
+            <div style={{
+              fontSize: 10, letterSpacing: 2,
+              color: 'rgba(255,255,255,0.3)',
+              textTransform: 'uppercase',
+              marginBottom: 24,
+              lineHeight: 1.6,
+            }}>
               FUTURE STEEL POLICY INSTITUTE
             </div>
             <div style={{ display: 'flex', gap: 8, flexWrap: 'wrap' }}>
@@ -100,22 +117,22 @@ export function Footer() {
           </div>
 
           {/* Links + newsletter */}
-          <nav aria-label="پیوندهای پایین" style={{ display: 'flex', flexDirection: 'column', gap: 18 }}>
+          <nav aria-label="پیوندهای پایین" style={{ display: 'flex', flexDirection: 'column', gap: 4 }}>
             {FOOTER_LINKS.map(link => (
               <FooterLink key={link.label} href={link.href} label={link.label} />
             ))}
-            <NewsletterBox />
+            <div style={{ marginTop: 16 }}>
+              <NewsletterBox />
+            </div>
           </nav>
         </div>
       </div>
 
       <div style={{ borderTop: '1px solid rgba(255,255,255,0.08)' }}>
-        <div
-          style={{ padding: '22px 0', fontSize: 13, color: 'rgba(255,255,255,0.85)', lineHeight: 1.8, textAlign: 'center', fontWeight: 500 }}
-          className="max-w-7xl mx-auto w-full px-6 max-md:px-5"
-        >
+        <div style={{ maxWidth: 1280, margin: '0 auto', padding: '20px 48px', textAlign: 'center', fontSize: 13, color: 'rgba(255,255,255,0.7)', lineHeight: 1.8 }}
+             className="max-md:!px-6">
           <div>تمامی حقوق این وب سایت محفوظ و متعلق به شرکت فولاد مبارکه است.</div>
-          <div style={{ color: 'rgba(255,255,255,0.55)', marginTop: 6, fontSize: 12 }}>
+          <div style={{ color: 'rgba(255,255,255,0.4)', marginTop: 4, fontSize: 12 }}>
             با افتخار قدرت گرفته از دیدوان؛ چشم همیشه باز مدیران
           </div>
         </div>