import Script from "next/script";

export default function DeFooter() {
  return (
    <footer className="global-footer ">
      <div className="global-footer__content">
        <ul className="l-footer-sections">
          <li className="global-footer-section">
            <div className="link-list-top-header">Über Scandic Hotels</div>
          </li>
          <li className="global-footer-section">
            <div className="link-list-top-header">Service</div>
          </li>
          <li className="global-footer-section">
            <div className="link-list-top-header">Links</div>
          </li>
        </ul>
        <div data-js-collapsible="global-footer" className="collapsible-global-footer">
          <ul className="l-footer-sections global-footer__content__sections">
            <li className="global-footer-section">
              <div className="link-list">
                <h3 className="link-list-header">Über Scandic Hotels</h3>
                <ul className="list-footer-pages">
                  <li>
                    <a href="https://www.scandichotelsgroup.com/our-company/">Unser Unternehmen - scandichotelsgroup.com</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotelsgroup.com/en/category/investors/">Investoren - scandichotelsgroup.com</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotelsgroup.com/en/sustainability/">Nachhaltigkeit - scandichotelsgroup.com</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/karriere-bei-scandic-hotels">Karriere</a>
                  </li>
                  <li>
                    <a href="http://www.scandichotelsgroup.com/de/media/local-pressroom/germany/">Presse</a>
                  </li>
                </ul>
              </div>
            </li>
            <li className="global-footer-section">
              <div className="link-list">
                <h3 className="link-list-header">Service</h3>
                <ul className="list-footer-pages">
                  <li>
                    <a href="https://www.scandichotels.de/kundenbetreuung">Kontakt</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/kundenbetreuung/haufig-gestellte-fragen">FAQ</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien/cookie-richtlinie-von-scandic">Cookie Policy</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien/datenschutzrichtlinie">Datenschutz</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien/nutzungsbedingungen-fur-die-scandic-webseite">Nutzungsbedingungen</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/kundenbetreuung/preise-und-richtlinien">Preise und Richtlinien</a>
                  </li>
                </ul>
              </div>
            </li>
            <li className="global-footer-section">
              <div className="link-list">
                <h3 className="link-list-header">Links</h3>
                <ul className="list-footer-pages">
                  <li>
                    <a href="https://www.scandichotels.de/hotelsuche">Hotels & Reiseziele</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/scandic-entdecken">Scandic entdecken</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/scandic-friends">Scandic Friends</a>
                  </li>
                  <li>
                    <a href="https://www.scandichotels.de/scandic-entdecken/bestpreisgarantie">Bestpreisgarantie</a>
                  </li>
                </ul>
              </div>
            </li>
          </ul>
          <div className="global-footer__content__bottom">
            <p className="newFooterTitle"><strong>ÜBER UNS</strong></p>
            <div className="padTop15">
              <p>Scandic ist das größte nordische Hotelunternehmen mit einem Netzwerk aus mehr als 280 Hotels mit rund 58.000 Hotelzimmern in Betrieb sowie in Entwicklung in sechs Ländern. Scandic beschäftigt mehr als 15.000 Teammitglieder mit dem Ziel großartige Hotelerlebnisse zu schaffen, damit unsere Gäste gerne wiederkommen.</p>
              <p style={{ textAlign: "center" }}><strong>NUTZEN SIE DIE SCANDIC APP</strong></p>
              <table style={{ height: "62px", width: "100%", borderCollapse: "collapse" }}>
                <tbody>
                  <tr style={{ height: "62px" }}>
                    <td style={{ width: "50%", height: "62px", textAlign: "right" }}>
                      <a title="Appstore" href="https://apps.apple.com/de/app/scandic-hotels/id1267218985" target="_blank" rel="noopener">
                        <img src="/imageVault/publishedmedia/1fy3s2u7wrj1bg1lj3y9/app_store_german.png" alt="" />
                      </a>
                    </td>
                    <td style={{ width: "50%", height: "62px", textAlign: "left" }}>
                      <a title="Google Play" href="https://play.google.com/store/apps/details?id=com.scandichotels.app" target="_blank" rel="noopener">
                        <img src="/imageVault/publishedmedia/1z4omiwjctzza78u8tmi/android_german.png" alt="" />
                      </a>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
            <style
              dangerouslySetInnerHTML={{
                __html: `#map-destinations-list .hotel-teaser .hotel-teaser__body + .special-alerts.special-alerts--inline-block {
                  display: none;
                }`,
              }}
            />
            <p>
              <Script
                id="inline-script"
                dangerouslySetInnerHTML={{
                  __html: `const isNetsHotel = location.href.match(/hotel=((389)|(365)|(374)|(888)|(891)|(340))/g) != null;
                    let removeSavedCardElem = function () {
                    if (!isNetsHotel) {
                        return;
                    }
                    if (document.querySelector(".credit-card-form__saved-select")) {
                        if (!document.querySelector(".credit-card-form__new")) {
                            document.querySelector(".credit-card-form").classNameList.add("hidden");
                        }
                        document.querySelector(".credit-card-form__saved-select").remove();
                        document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
                    }
                    setTimeout( function() {
                        if (document.querySelector(".credit-card-form__select")) {
                            document.querySelector(".credit-card-form__select input[type=radio]").checked = "checked";
                            document.querySelector(".credit-card-form__select").classNameList.add("hidden");
                        }
                        if (document.querySelector(".credit-card-form__new")) {
                            document.querySelector(".credit-card-form__new").classNameList.remove("ng-hide");
                        }
                    }, 300);
                    }
                    removeSavedCardElem();
                    setTimeout(removeSavedCardElem, 500);
                    const confirmPgHotelId = document.getElementById("adm-hotelOperaId") && document.getElementById("adm-hotelOperaId").value;
                    const isNetsHotelConfnPg = ["389","365","374","888","891","340"].indexOf(confirmPgHotelId) != -1;
                    if (isNetsHotelConfnPg && document.querySelector(".save-credit-card__form")) {
                    document.querySelector(".save-credit-card__form").style.display = "none";
                    document.querySelector(".save-credit-card__form").remove();
                    }`,
                }}
              />
            </p>
          </div>
          <div className="global-footer__social-media" id="social-icons">
            <h3 className="heading-5 u-uppercase">Folgen Sie unseren Social Media Kanälen</h3>
            <a href="https://www.facebook.com/scandicgermany" rel="noopener" target="_blank" className="social-media-icon" title="on Facebook">
              <svg focusable="false" className="icon icon--facebook icon--white" viewBox="0 0 150 150" role="img" aria-labelledby="social-icons facebook-icon">
                <title id="facebook-icon">Facebook</title>
                <use xlinkHref="/Static/img/icons/sprites.svg#icon-facebook"></use>
              </svg>
            </a>
            <a href="https://www.instagram.com/scandichotels/" rel="noopener" target="_blank" className="social-media-icon" title="on Instagram">
              <svg focusable="false" className="icon icon--instagram icon--white" viewBox="0 0 150 150" role="img" aria-labelledby="social-icons instagram-icon">
                <title id="instagram-icon">Instagram</title>
                <use xlinkHref="/Static/img/icons/sprites.svg#icon-instagram"></use>
              </svg>
            </a>
          </div>
          <div className="global-footer__trip-advisor">
            <h3 className="heading-5 u-uppercase">Bewertungen auf</h3>
            <img src="/Static/img/tripadvisor_logo_white_160x24.png" alt="Trip Advisor logotype" />
          </div>
        </div>
      </div>
    </footer>
  )
}