> ## Documentation Index
> Fetch the complete documentation index at: https://docs.glamwithease.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Glamwithease Help Center

> Everything you need to book beauty services, manage appointments, and grow your clientele with the Glamwithease app.

<div data-product-guide-index className="flex w-full flex-col gap-8 max-w-5xl mx-auto px-4 md:px-8 lg:px-12 py-10 lg:gap-14 lg:py-16">
  <div className="flex max-w-[540px] flex-col gap-2 self-center text-center">
    <h1 className="text-[30px] font-medium leading-9 tracking-tight text-gray-900 dark:text-gray-50">
      Book Beauty, with Ease
    </h1>

    <p className="text-balance text-base leading-relaxed tracking-tight text-gray-600 dark:text-gray-400">
      Discover verified stylists and artists near you, book in seconds, and pay securely — all in the Glamwithease app.
    </p>
  </div>

  <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
    <Card title={<span className="product-guide-feature-card-title">For Clients</span>} icon="sparkles" href="/introduction" className="product-guide-feature-card" size={64}>
      <span className="product-guide-feature-card-description">Download the app, find your stylist, and book your first appointment.</span>
    </Card>

    <a href="/professionals/joining-as-a-stylist" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
      <Icon icon="scissors" color="rgb(var(--primary))" size={18} className="shrink-0" />

      <div className="flex flex-col gap-1">
        <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">For Professionals</span>

        <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
          Join as a stylist or artist, set your schedule, and grow your clientele.
        </span>
      </div>
    </a>

    <a href="/support/faq" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
      <Icon icon="circle-help" color="rgb(var(--primary))" size={18} className="shrink-0" />

      <div className="flex flex-col gap-1">
        <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">FAQ & Support</span>

        <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
          Answers to common questions about bookings, payments, and the app.
        </span>
      </div>
    </a>
  </div>

  <hr className="border-0 border-t border-border" />

  <div className="flex flex-col gap-4">
    <h2 className="font-serif text-xl font-medium leading-normal text-gray-900 dark:text-gray-50">Common tasks</h2>

    <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
      <a href="/clients/booking-an-appointment" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="calendar-check" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Book an appointment</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Pick a service, choose a time, and confirm your booking in under 60 seconds.
          </span>
        </div>
      </a>

      <a href="/clients/deposits-and-payments" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="credit-card" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Deposits & payments</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Pay securely with Apple Pay, Google Pay, or card — deposits apply toward your service.
          </span>
        </div>
      </a>

      <a href="/professionals/payouts" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="banknote" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Get paid as a stylist</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Receive instant payouts after each completed service on your own terms.
          </span>
        </div>
      </a>

      <a href="/clients/rescheduling-and-cancellations" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="calendar-x" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Reschedule or cancel</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Manage your bookings according to each stylist's cancellation policy.
          </span>
        </div>
      </a>

      <a href="/clients/messaging-stylists" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="message-circle" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Message your stylist</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Chat directly in the app to share inspo or ask questions before your appointment.
          </span>
        </div>
      </a>

      <a href="/professionals/analytics-dashboard" className="rounded-2xl flex flex-col gap-4 border bg-gray-50 p-4 outline-none shadow-sm shadow-gray-950/5 transition hover:border-primary hover:shadow-md dark:bg-gray-950 dark:shadow-black/20 dark:hover:border-primary">
        <Icon icon="chart-bar" color="rgb(var(--primary))" size={18} className="shrink-0" />

        <div className="flex flex-col gap-1">
          <span className="font-serif text-base font-medium text-gray-900 dark:text-gray-50">Track your growth</span>

          <span className="text-sm leading-relaxed text-gray-600 dark:text-gray-400">
            Use the analytics dashboard to monitor bookings, revenue, and client retention.
          </span>
        </div>
      </a>
    </div>
  </div>
</div>