/* global React, KeyDivider, Laurel */
const { useState: useStateF } = React;

function Footer() {
  const [showPrivacy, setShowPrivacy] = useStateF(false);
  return (
    <>
    <footer id="visit" className="dh-footer">
      <div className="dh-footer-inner">
        <div className="dh-footer-brand">
          <img src="assets/crest-white.png" alt="Dimi's Greek House" />
          <p className="dh-footer-tag">Modern Greek cooking in<br/>Palm Beach County.</p>
        </div>
        <div className="dh-footer-col">
          <h5>Visit</h5>
          <p>157 US-1<br/>Tequesta, FL 33469</p>
          <p>
            <a href="https://maps.google.com/?q=Dimi%27s+Greek+House+Tequesta" target="_blank" rel="noopener">Open in Google Maps</a>
          </p>
          <p className="dh-footer-meta">
            <a href="https://www.opentable.com/restref/client/?rid=1530433&domain=com&lang=en-US" target="_blank" rel="noopener">Dine-in</a>
          </p>
        </div>
        <div className="dh-footer-col">
          <h5>Hours</h5>
          <p>Open Tue&ndash;Sun &middot; 12 &ndash; 10 pm<br/>Closed Mondays</p>
          <p className="dh-footer-meta">Happy Hour, Daily &middot; 3&ndash;6 pm</p>
        </div>
        <div className="dh-footer-col">
          <h5>Connect</h5>
          <p>
            <a href="https://instagram.com/dimisgreekhouse.fl" target="_blank" rel="noopener" aria-label="Instagram" style={{ display: "inline-flex", alignItems: "center", gap: 8 }}>
              <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                <rect x="3" y="3" width="18" height="18" rx="5" ry="5"></rect>
                <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"></path>
                <line x1="17.5" y1="6.5" x2="17.5" y2="6.5"></line>
              </svg>
              @dimisgreekhouse.fl
            </a><br/>
            <a href="https://www.facebook.com/dimisgreekhouse.fl" target="_blank" rel="noopener" aria-label="Facebook" style={{ display: "inline-flex", alignItems: "center", gap: 8 }}>
              <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
                <path d="M14 9h3V5.5h-3c-2.2 0-4 1.8-4 4V12H7v3.5h3V22h3.5v-6.5H16l1-3.5h-3.5v-2.5c0-.55.45-1 1-1z"></path>
              </svg>
              Dimi's Greek House
            </a><br/>
            <a
              href="#"
              onClick={(e) => {
                e.preventDefault();
                try { localStorage.removeItem("dh-newsletter-dismissed"); } catch (err) {}
                window.dispatchEvent(new Event("dh-open-newsletter"));
              }}
            >
              Stay in the know
            </a>
          </p>

          <h5 style={{ marginTop: 22 }}>Contact us</h5>
          <p>
            <a href="tel:+15615103381">(561) 510-3381</a><br/>
            <span style={{ fontStyle: "italic", fontSize: 13, color: "rgba(244,236,221,.7)" }}>Call or text</span>
          </p>
          <p>
            <a href="mailto:info@dimisgreekhouse.com">info@dimisgreekhouse.com</a>
          </p>
          <p style={{ marginTop: 18 }}>
            <a href="https://g.page/r/CUnRlbeVAJj7EBM/review" target="_blank" rel="noopener">
              Leave us a Google Review!
            </a>
          </p>
        </div>
      </div>
      <div className="dh-footer-key" aria-hidden="true"><KeyDivider /></div>
      <div className="dh-footer-fine">
        <span>© 2026 Dimi's Greek House &middot; Dimi's Hospitality LLC</span>
        <span className="dh-footer-laurel"><Laurel size={24} /> <em>filoxenia</em> &middot; the love of strangers</span>
        <a href="#" onClick={(e) => { e.preventDefault(); setShowPrivacy(true); }}>Privacy Policy</a>

      </div>
    </footer>
    {showPrivacy && (
      <div className="dh-modal" role="dialog" aria-modal="true" aria-labelledby="dh-privacy-title">
        <div className="dh-modal-scrim" onClick={() => setShowPrivacy(false)} />
        <div className="dh-modal-panel" style={{ width: "min(720px, 100%)", padding: "28px 0 0" }}>
          <button className="dh-modal-close" aria-label="Close" onClick={() => setShowPrivacy(false)}>×</button>
          {window.PrivacyPolicy ? <window.PrivacyPolicy /> : <p style={{ padding: 40 }}>Loading…</p>}
        </div>
      </div>
    )}
    </>
  );
}

window.Footer = Footer;