// Footer.jsx — logo + thông tin từ window.SITE (footer + contact).
function Footer() {
  const S = window.SITE || SITE_DEFAULTS;
  const C = S.footer, CT = S.contact;
  const logo = S.logoDarkUrl || S.logoUrl || '/site/assets/logo-swo-horizontal-dark.svg';
  const cols = [
    { h: 'Liên kết', items: [['Trang chủ', '#top'], ['Giới thiệu', '#about'], ['Giải pháp', '#services'], ['Dự án', '#projects'], ['Khách hàng', '#clients'], ['Liên hệ', '#contact']] },
  ];
  return (
    <footer className="swk-footer">
      <div className="swk-container">
        <div className="swk-footer-grid">
          <div className="brandcol">
            <img src={logo} alt={C.company} style={{ height: 44, maxWidth: 220, objectFit: 'contain' }} />
            <p>{C.desc}</p>
          </div>
          {cols.map(c => (
            <div key={c.h}>
              <h4>{c.h}</h4>
              <ul>{c.items.map(([t, h]) => <li key={t}><a href={h}>{t}</a></li>)}</ul>
            </div>
          ))}
          <div>
            <h4>Liên hệ</h4>
            <div className="addr">
              <strong style={{ color: '#fff' }}>{C.company}</strong><br />
              {CT.address}<br />
              {CT.phone} · {CT.email}
            </div>
          </div>
        </div>
        <div className="swk-footer-bottom">
          <span>{C.copyright}</span>
          <span>MST: {C.mst}</span>
        </div>
      </div>
    </footer>
  );
}
Object.assign(window, { Footer });