/* Sea La Vie — legal pages (privacy, terms, cookies, accessibility) */

function LegalLayout({ current, eyebrow, title, titleEm, blurb, children }) {
  return (
    <PageLayout current={current} withMarquee={false}>
      <PageHead
        eyebrow={eyebrow}
        title={title}
        titleEm={titleEm}
        blurb={blurb}
        img={PHOTO.palmsDusk}
        crumb={eyebrow}
      />
      <section className="section legal-body">
        <div style={{maxWidth: 820, margin: "0 auto"}}>
          {children}
          <div style={{marginTop: 60, padding: "30px 0", borderTop: "1px solid var(--line-soft)", color: "var(--ink-mute)", fontSize: 13, letterSpacing: "0.06em"}}>
            Last updated · May 2026 · <a href={`mailto:${CONTACT.email}`} style={{color: "var(--sky-deep)"}}>{CONTACT.email}</a>
          </div>
        </div>
      </section>
    </PageLayout>
  );
}

function LegalSection({ heading, headingEm, children }) {
  return (
    <div style={{marginBottom: 44}}>
      <h2 style={{
        fontFamily: "var(--serif)", fontWeight: 400, fontSize: 26,
        margin: "0 0 18px", paddingBottom: 10,
        borderBottom: "1px solid var(--line-soft)", color: "var(--ink)"
      }}>{heading} {headingEm && <em style={{fontStyle: "italic", color: "var(--sky-deep)"}}>{headingEm}</em>}</h2>
      <div style={{color: "var(--ink-soft)", fontSize: 15.5, lineHeight: 1.8}}>{children}</div>
    </div>
  );
}

/* ====================================================================
   PRIVACY
   ==================================================================== */
function PrivacyPage() {
  return (
    <LegalLayout
      current="Privacy"
      eyebrow="Privacy Policy"
      title="Your data,"
      titleEm="treated as a guest."
      blurb="A plain-English summary of what we collect, why, and what we will never do with it. Compliant with Kenya's Data Protection Act 2019 and the GDPR."
    >
      <p style={{fontSize: 17, lineHeight: 1.85, fontStyle: "italic", color: "var(--ink-soft)", marginBottom: 30}}>
        We are Sea La Vie Residences ("Sea La Vie", "we", "us"), a private hospitality estate operating on Galu Beach, Diani. This policy explains how we handle personal information collected through our website, reservations, and on-property.
      </p>

      <LegalSection heading="What we" headingEm="collect">
        <p>When you contact us, make a reservation, or stay with us, we may collect:</p>
        <ul style={{paddingLeft: 22, marginTop: 12}}>
          <li><strong>Identity</strong> — name, passport / ID number (on arrival only, for Kenyan immigration), date of birth.</li>
          <li><strong>Contact</strong> — email address, phone number, WhatsApp, postal address.</li>
          <li><strong>Reservation</strong> — arrival and departure dates, party size, special requests, dietary needs.</li>
          <li><strong>Payment</strong> — handled by our PCI-compliant processor; we do not store full card numbers.</li>
          <li><strong>Website</strong> — basic analytics (page views, country, device type) and any messages you send through forms.</li>
        </ul>
      </LegalSection>

      <LegalSection heading="Why we" headingEm="collect it">
        <ul style={{paddingLeft: 22, marginTop: 0}}>
          <li>To confirm and run your reservation, including airport transfers and any experiences booked through us.</li>
          <li>To comply with Kenyan tax, immigration and tourism regulations.</li>
          <li>To communicate with you about your stay before, during and after.</li>
          <li>If you opt in, to send The Letter — our quarterly newsletter.</li>
        </ul>
        <p style={{marginTop: 14}}>We do <strong>not</strong> sell your data, share it with third-party advertisers, or use it to retarget you. Ever.</p>
      </LegalSection>

      <LegalSection heading="Who sees" headingEm="it">
        <p>Your information is accessed only by:</p>
        <ul style={{paddingLeft: 22, marginTop: 12}}>
          <li>The Sea La Vie reservations and operations team.</li>
          <li>Service providers we use to run the business — our hosting provider (Hostinger), our payment processor, and email infrastructure — bound by data-processing agreements.</li>
          <li>Kenyan authorities only where legally required (immigration, tax authorities).</li>
        </ul>
      </LegalSection>

      <LegalSection heading="How long we" headingEm="keep it">
        <p>Reservation and financial records are kept for <strong>seven years</strong>, as required by Kenyan tax law. Marketing-list subscribers can unsubscribe at any time, after which the record is deleted within thirty days. Form messages are kept for two years from the last interaction.</p>
      </LegalSection>

      <LegalSection heading="Your" headingEm="rights">
        <p>Under the Kenya Data Protection Act 2019 (and the GDPR for European residents), you have the right to:</p>
        <ul style={{paddingLeft: 22, marginTop: 12}}>
          <li>Ask what data we hold on you (a "subject access request").</li>
          <li>Correct anything that is wrong.</li>
          <li>Ask us to delete your data (subject to legal-retention requirements above).</li>
          <li>Withdraw consent for marketing at any time.</li>
          <li>Object to or restrict processing.</li>
          <li>Lodge a complaint with the Office of the Data Protection Commissioner (ODPC), Kenya.</li>
        </ul>
        <p style={{marginTop: 14}}>To exercise any of these rights, write to <a href={`mailto:${CONTACT.email}`}>{CONTACT.email}</a>. We will respond within thirty days.</p>
      </LegalSection>

      <LegalSection heading="Security">
        <p>Our website is served over HTTPS. Reservation data is stored on Hostinger's encrypted hosting in Europe. Payment information is never stored on our servers. We review our security practices annually.</p>
      </LegalSection>

      <LegalSection heading="Children">
        <p>Sea La Vie is a family-friendly property, but our website is not directed at children. We do not knowingly collect personal information from anyone under thirteen.</p>
      </LegalSection>

      <LegalSection heading="Changes to this policy">
        <p>If we materially change how we handle personal data, we will update this page and post the new date below. The current version applies to all data collected from that date forward.</p>
      </LegalSection>
    </LegalLayout>
  );
}

/* ====================================================================
   TERMS
   ==================================================================== */
function TermsPage() {
  return (
    <LegalLayout
      current="Terms"
      eyebrow="Terms & Conditions"
      title="The"
      titleEm="house rules."
      blurb="The terms that govern reservations at Sea La Vie. Written plainly so you know exactly what you're agreeing to."
    >
      <LegalSection heading="The" headingEm="agreement">
        <p>When you confirm a reservation, you enter a contract with <strong>Sea La Vie Residences Ltd.</strong>, a company incorporated in Kenya, with its registered address at Galu Beach Road, Ukunda 80400, Kwale County. These terms govern the booking, your stay, and any experiences arranged through us.</p>
      </LegalSection>

      <LegalSection heading="Reservations &" headingEm="payment">
        <ul style={{paddingLeft: 22}}>
          <li>A reservation is confirmed only when the deposit has cleared and you have received written confirmation from {CONTACT.email}.</li>
          <li><strong>Deposit:</strong> 30% of the total at the time of booking. <strong>Balance:</strong> due 60 days before arrival.</li>
          <li>For reservations made within 60 days of arrival, payment is due in full at the time of booking.</li>
          <li>Rates are quoted in USD. Payment in GBP, EUR or KES is accepted at the rate published on our website at the time of payment.</li>
          <li>A refundable security deposit of <strong>USD 500</strong> is collected on arrival to cover incidentals and any damage.</li>
        </ul>
      </LegalSection>

      <LegalSection heading="Cancellation &" headingEm="changes">
        <ul style={{paddingLeft: 22}}>
          <li>More than 60 days before arrival: full refund less 5% administrative fee.</li>
          <li>30 – 60 days before arrival: 50% refund.</li>
          <li>14 – 30 days before arrival: 25% refund.</li>
          <li>Within 14 days: no refund.</li>
          <li>Festive period (20 December – 5 January): non-refundable from confirmation.</li>
        </ul>
        <p style={{marginTop: 14}}>Date changes are accommodated where possible and at no charge if requested more than 60 days before arrival, subject to availability. Travel insurance covering trip cancellation, medical evacuation and personal effects is <strong>strongly recommended</strong>.</p>
      </LegalSection>

      <LegalSection heading="Your" headingEm="stay">
        <ul style={{paddingLeft: 22}}>
          <li>Check-in from 15:00, check-out by 11:00.</li>
          <li>Maximum occupancy is four guests per residence; infants under four do not count toward this limit.</li>
          <li>Smoking is permitted on outdoor terraces only.</li>
          <li>Quiet hours are 22:00 – 07:00.</li>
          <li>Pets are not permitted (excluding registered service animals notified in advance).</li>
          <li>Children are welcome; parental supervision is required around the pool and ocean at all times.</li>
          <li>Visitors not registered at check-in require the prior consent of the property manager.</li>
          <li>The lead guest is liable for damage caused to the property or its contents by the booking party.</li>
        </ul>
      </LegalSection>

      <LegalSection heading="Experiences &" headingEm="excursions">
        <p>Experiences listed on our website (skydiving, kitesurfing, dhow trips, restaurants and so on) are operated by independent third parties. Sea La Vie arranges these as a concierge service and is not liable for the conduct, safety practices or performance of those operators. All such experiences are taken at the guest's own risk.</p>
      </LegalSection>

      <LegalSection heading="Liability">
        <p>To the maximum extent permitted by Kenyan law, Sea La Vie's liability for any loss arising from your stay is limited to the amount paid for the reservation. We are not liable for indirect or consequential losses, or for events beyond our reasonable control (force majeure — including weather, civil unrest, government action, or pandemic).</p>
        <p style={{marginTop: 14}}>Nothing in these terms excludes liability for death or personal injury caused by our negligence, or for fraud.</p>
      </LegalSection>

      <LegalSection heading="Force" headingEm="majeure">
        <p>If your stay cannot proceed because of force majeure, we will offer a credit valid for twenty-four months or, where required by law, a refund proportional to the unused portion of the stay.</p>
      </LegalSection>

      <LegalSection heading="Governing" headingEm="law">
        <p>These terms are governed by Kenyan law. Any dispute will be subject to the exclusive jurisdiction of the courts of Kenya. We will always try to resolve concerns amicably first — please write to <a href={`mailto:${CONTACT.email}`}>{CONTACT.email}</a>.</p>
      </LegalSection>
    </LegalLayout>
  );
}

/* ====================================================================
   COOKIES
   ==================================================================== */
function CookiesPage() {
  return (
    <LegalLayout
      current="Cookies"
      eyebrow="Cookie Policy"
      title="A short note on"
      titleEm="cookies."
      blurb="Sea La Vie uses a minimal set of cookies — only what is genuinely needed to make the site work and to understand, in aggregate, how people use it."
    >
      <LegalSection heading="What is a" headingEm="cookie?">
        <p>A cookie is a small text file that a website places on your device to remember things between visits. Cookies can also be used to track behaviour across the web; ours are not.</p>
      </LegalSection>

      <LegalSection heading="Cookies we" headingEm="use">
        <div style={{display: "grid", gap: 16, marginTop: 12}}>
          <CookieRow name="slv_currency" purpose="Remembers your preferred currency (USD / GBP / KES)." lifetime="Persistent · browser-stored" type="Strictly necessary" />
          <CookieRow name="slv_availability_v3" purpose="Caches the current availability calendar so the site renders quickly between pageloads." lifetime="Persistent · browser-stored" type="Strictly necessary" />
          <CookieRow name="slv_admin_pw (admin only)" purpose="Keeps the property administrator signed in to the admin dashboard for the session." lifetime="Session" type="Strictly necessary" />
          <CookieRow name="Google Maps (third-party)" purpose="Loaded when the location map is shown; subject to Google's cookie policy." lifetime="Per Google's policy" type="Functional · third-party" />
          <CookieRow name="Google Fonts (third-party)" purpose="Loaded to fetch our typefaces (Cormorant, Jost); does not set persistent cookies." lifetime="None" type="Strictly necessary" />
        </div>
      </LegalSection>

      <LegalSection heading="What we" headingEm="don't do">
        <ul style={{paddingLeft: 22}}>
          <li>We do not run third-party advertising cookies.</li>
          <li>We do not run retargeting or remarketing pixels.</li>
          <li>We do not sell behavioural data to any third party.</li>
        </ul>
      </LegalSection>

      <LegalSection heading="Managing" headingEm="cookies">
        <p>Most browsers let you block or clear cookies in their settings. Blocking the cookies we use will not break the site, but you may lose the currency preference and the calendar will reload from the network every time. To opt out of Google Maps and Google Fonts cookies specifically, see <a href="https://policies.google.com/technologies/cookies" target="_blank" rel="noopener" style={{color: "var(--sky-deep)"}}>policies.google.com</a>.</p>
      </LegalSection>
    </LegalLayout>
  );
}

function CookieRow({ name, purpose, lifetime, type }) {
  return (
    <div style={{display: "grid", gridTemplateColumns: "1fr 2fr 1fr 1fr", gap: 16, padding: "14px 0", borderBottom: "1px dotted var(--line-soft)", fontSize: 13.5, lineHeight: 1.55}}>
      <div style={{fontFamily: "JetBrains Mono, monospace", fontSize: 12, color: "var(--ink)"}}>{name}</div>
      <div style={{color: "var(--ink-soft)"}}>{purpose}</div>
      <div style={{color: "var(--ink-mute)", fontSize: 12}}>{lifetime}</div>
      <div style={{color: "var(--sky-deep)", fontSize: 11, letterSpacing: "0.12em", textTransform: "uppercase"}}>{type}</div>
    </div>
  );
}

/* ====================================================================
   ACCESSIBILITY
   ==================================================================== */
function AccessibilityPage() {
  return (
    <LegalLayout
      current="Accessibility"
      eyebrow="Accessibility"
      title="A site, and a place,"
      titleEm="open to everyone."
      blurb="We want every guest to be able to use sealaviedianivillas.com and to feel welcome at the estate. This page is a live statement of where we are, and what we are still working on."
    >
      <LegalSection heading="Online" headingEm="standards">
        <p>This website is built to target compliance with the <strong>Web Content Accessibility Guidelines (WCAG) 2.1 Level AA</strong>. We test against these guidelines on each release. Specifically:</p>
        <ul style={{paddingLeft: 22, marginTop: 12}}>
          <li>All interactive elements are reachable by keyboard.</li>
          <li>Text and background colour combinations meet the 4.5:1 contrast ratio for body text.</li>
          <li>Images carry meaningful alt text where they convey content; decorative imagery is hidden from assistive technology.</li>
          <li>Form fields are correctly labelled and announce errors to screen readers.</li>
          <li>The site scales to 200% without loss of content or function.</li>
          <li>Animations are limited and respect the operating-system "reduce motion" preference.</li>
        </ul>
      </LegalSection>

      <LegalSection heading="Known" headingEm="limitations">
        <p>Honest list, updated as we improve:</p>
        <ul style={{paddingLeft: 22, marginTop: 12}}>
          <li>The embedded Google Map on the Contact page is a third-party iframe and follows Google's own accessibility standards rather than ours.</li>
          <li>Some PDF resources (such as the property factsheet) are tagged for screen readers but have not been audited at AA.</li>
          <li>If you find an accessibility barrier we have not listed, please write to us — fixing it goes to the top of the list.</li>
        </ul>
      </LegalSection>

      <LegalSection heading="On the" headingEm="estate">
        <p>Sea La Vie is built on coastal sand and the property has both level and stepped paths between residences. Specifically:</p>
        <ul style={{paddingLeft: 22, marginTop: 12}}>
          <li>One residence — <strong>Bahari Villa</strong> — is on a single level with step-free access from the driveway through to the pool deck and beach path. Bathrooms are sized for wheelchair use with grab rails.</li>
          <li>The other three residences have one or more shallow steps.</li>
          <li>The path from the estate to the beach involves soft sand for the final twenty metres; a beach wheelchair is available on request.</li>
          <li>All bedrooms are en-suite. Dietary accommodations — gluten-free, vegan, halal, allergies — are part of our standard service; just tell us in advance.</li>
        </ul>
        <p style={{marginTop: 14}}>If you have specific access needs, please write to <a href={`mailto:${CONTACT.email}`}>{CONTACT.email}</a> before booking. We will be honest about whether we can accommodate them and what to expect.</p>
      </LegalSection>

      <LegalSection heading="Feedback">
        <p>If anything on this site — or at the property — is not as accessible as it should be, we want to hear about it. Write to <a href={`mailto:${CONTACT.email}`}>{CONTACT.email}</a> with the subject "Accessibility" and we will acknowledge within five working days.</p>
      </LegalSection>
    </LegalLayout>
  );
}

Object.assign(window, { PrivacyPage, TermsPage, CookiesPage, AccessibilityPage });
