import React, { useEffect } from 'react';
//= Layout
import MainLayout from 'layouts/Main';
//= Components
import NavbarRTL from 'components/Navbars/StartupNav/RTLNav';
import Features from 'components/Saas/Features';
import Services from 'components/Saas/Services';
import About from 'components/Saas/About';
import Testimonials from 'components/Saas/Testimonials';
import Pricing from 'components/Saas/Pricing';
import Footer from 'components/Startup/Footer';
//= Scripts
import { fixRtlStylesheetsOrder } from 'common/fixStylesheetsOrder';

const RTLPageServices = () => {
  useEffect(() => {
    fixRtlStylesheetsOrder();
  }, []);

  return (
    <MainLayout>
      <NavbarRTL whiteNotRounded />
      <main className="services-page style-5">
        <Features rtl isServices />
        <Services rtl />
        <About rtl noPaddingTop />
        <Testimonials rtl />
        <Pricing rtl />
      </main>
      <Footer rtl />
    </MainLayout>
  )
}

export const Head = () => {
  return (
    <>
 <title>Rootxwire - الخدمات</title>
      <link rel="stylesheet" href="/assets/css/lib/bootstrap.rtl.min.css" />
      <link rel="stylesheet" href="/assets/css/style.css" />
      <link rel="stylesheet" href="/assets/css/rtl_style.css" />
    </>
  )
}

export default RTLPageServices;