import React from 'react';

export default function Footer() {
  const currentYear = new Date().getFullYear();

  return (
    <footer style={styles.footer}>
      <div style={styles.container}>
        <span style={styles.copyright}>
          © {currentYear} To Docx. 保留所有权利。
        </span>
        <a 
          href="https://beian.miit.gov.cn/" 
          target="_blank" 
          rel="noreferrer" 
          style={styles.link}
          onMouseOver={(e) => e.target.style.color = '#3b82f6'}
          onMouseOut={(e) => e.target.style.color = '#9ca3af'}
        >
          闽ICP备2026017655号-1
        </a>
      </div>
    </footer>
  );
}

const styles = {
  footer: {
    padding: '20px 0',
    backgroundColor: '#f9fafb',
    borderTop: '1px solid #e5e7eb',
    width: '100%',
    boxSizing: 'border-box',
    marginTop: 'auto'
  },
  container: {
    maxWidth: '1200px',
    margin: '0 auto',
    padding: '0 20px',
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
    gap: '16px',
    flexWrap: 'wrap',
    fontSize: '13px',
    color: '#9ca3af'
  },
  copyright: {
    fontWeight: '400'
  },
  link: {
    color: '#9ca3af',
    textDecoration: 'none',
    transition: 'color 0.2s ease',
    fontWeight: '500'
  }
};