const { Brand } = window.CoolZoneSolutionDesignSystem_12e696;

// Same reasoning as Header.jsx: #uslugi-style anchors only resolve on the
// homepage, so from any other page they need "index.html" in front.
const FOOT_PATH = window.location.pathname;
const FOOT_ON_HOME = FOOT_PATH === '/' || FOOT_PATH.endsWith('/index.html') || FOOT_PATH.endsWith('/');
const FOOT_HOME_HREF = FOOT_ON_HOME ? '' : 'index.html';

function SiteFooter({ t }) {
  const S = window.CZ_SETTINGS;
  return (
    <footer className="site-footer">
      <div className="container footer-grid">
        <div className="f-brand">
          <Brand logo="assets/logo.svg" href={FOOT_HOME_HREF || '#hero'} />
          <p style={{ marginTop: '18px' }}><EditableText fieldKey="footDesc" multiline>{t.footDesc}</EditableText></p>
        </div>
        <div className="f-col">
          <h4>{t.footServices}</h4>
          {t.svc.map((s, i) => <a key={i} href={`${FOOT_HOME_HREF}#uslugi`}>{s[0]}</a>)}
        </div>
        <div className="f-col">
          <h4>{t.footCompany}</h4>
          {[1, 2, 3, 4].map((i) => <a key={i} href={`${FOOT_HOME_HREF}#${['dla-kogo', 'proces', 'realizacje', 'opinie'][i - 1]}`}>{t.nav[i]}</a>)}
        </div>
        <div className="f-col">
          <h4>{t.footContact}</h4>
          <a href={'tel:' + S.phoneHref}>{S.phoneDisplay}</a>
          <a href={'mailto:' + S.email}>{S.email}</a>
          <span>{t.cAreaVal}</span>
          {S.addressLine && <span>{S.addressLine}</span>}
          <span>{window.CZ_FORMAT_HOURS(S.hoursRaw, t) || t.cHoursVal}</span>
        </div>
      </div>
      <div className="container"><div className="f-bottom">
        <span>© {new Date().getFullYear()} CoolZone Solution. {t.footRights}</span>
        <span className="f-legal" style={{ display: 'flex', gap: '18px' }}><a href="legal.html?slug=dsgvo">{t.footPrivacy}</a><a href="legal.html?slug=agb">{t.footTerms}</a></span>
      </div></div>
    </footer>
  );
}
Object.assign(window, { SiteFooter });