Embed

<style>
  :root {
    --bg-body: #f3f4f6;
    --bg-card: #ffffff;
    --border-subtle: #e5e7eb;
    --border-input: #d1d5db;
    --text-main: #111827;
    --text-muted: #6b7280;
    --text-label: #374151;
    --accent: #0f766e;
    --accent-soft: #14b8a6;
    --error: #dc2626;
    --shadow-soft: 0 18px 45px rgba(15, 23, 42, 0.10);
  }

  body {
    margin: 0;
    padding: 0;
    background-color: var(--bg-body);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text",
      "Helvetica Neue", Arial, sans-serif;
    color: var(--text-main);
  }

  .dp-shell {
    min-height: calc(100vh - 120px); /* lets Durable header sit on top */
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 48px 16px 64px;
    box-sizing: border-box;
  }

  .dp-layout {
    width: 100%;
    max-width: 1040px;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: 32px;
    align-items: center;
  }

  /* Left side: intro */
  .dp-left {
    padding-right: 16px;
  }

  .dp-kicker {
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 8px;
  }

  .dp-title-main {
    font-size: 2.1rem;
    line-height: 1.2;
    font-weight: 650;
    margin: 0 0 10px;
  }

  .dp-sub-main {
    margin: 0 0 16px;
    font-size: 0.95rem;
    color: var(--text-muted);
  }

  .dp-pills-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
  }

  .dp-pill {
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(20, 184, 166, 0.08);
    border: 1px solid rgba(20, 184, 166, 0.24);
    font-size: 0.75rem;
    color: var(--accent);
  }

  .dp-list {
    margin: 0;
    padding-left: 18px;
    font-size: 0.85rem;
    color: var(--text-muted);
  }

  .dp-list li {
    margin-bottom: 4px;
  }

  .dp-meta-text {
    margin-top: 10px;
    font-size: 0.8rem;
    color: var(--text-muted);
  }

  /* Right side: card */
  .dp-right {
    max-width: 420px;
    margin-left: auto;
  }

  .dp-card {
    background-color: var(--bg-card);
    border-radius: 16px;
    border: 1px solid var(--border-subtle);
    padding: 22px 22px 20px;
    box-shadow: var(--shadow-soft);
  }

  .dp-card-title {
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0 0 4px;
  }

  .dp-card-subtitle {
    font-size: 0.8rem;
    color: var(--text-muted);
    margin: 0 0 16px;
  }

  .dp-field {
    margin-bottom: 14px;
  }

  .dp-label {
    display: block;
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--text-label);
    margin-bottom: 4px;
  }

  .dp-input {
    width: 100%;
    padding: 8px 11px;
    font-size: 0.85rem;
    border-radius: 10px;
    border: 1px solid var(--border-input);
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
    box-sizing: border-box;
    background: #f9fafb;
  }

  .dp-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.25);
    background: #ffffff;
  }

  .dp-error {
    font-size: 0.8rem;
    color: var(--error);
    margin-top: 4px;
    display: none;
  }

  .dp-info {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: 4px;
    display: none;
  }

  .dp-button-primary {
    width: 100%;
    margin-top: 8px;
    padding: 9px 11px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #ffffff;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    background: linear-gradient(135deg, var(--accent), var(--accent-soft));
    box-shadow: 0 12px 30px rgba(20, 184, 166, 0.35);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
  }

  .dp-button-primary:disabled {
    opacity: 0.6;
    cursor: default;
    box-shadow: none;
  }

  .dp-button-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
  }

  .dp-button-text {
    font-size: 0.75rem;
    color: var(--accent);
    text-decoration: underline;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
  }

  .dp-helper-text {
    margin-top: 10px;
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  .dp-demo-block {
    margin-top: 16px;
    padding-top: 10px;
    border-top: 1px dashed var(--border-subtle);
    font-size: 0.75rem;
    color: var(--text-muted);
  }

  .dp-demo-item {
    margin-top: 2px;
  }

  .dp-spinner {
    border-radius: 999px;
    border: 2px solid rgba(255, 255, 255, 0.6);
    border-top-color: #ffffff;
    width: 14px;
    height: 14px;
    animation: dp-spin 0.7s linear infinite;
  }

  @keyframes dp-spin {
    to {
      transform: rotate(360deg);
    }
  }

  @media (max-width: 900px) {
    .dp-shell {
      padding-top: 32px;
    }
    .dp-layout {
      grid-template-columns: minmax(0, 1fr);
      max-width: 540px;
    }
    .dp-left {
      order: -1;
      padding-right: 0;
    }
    .dp-right {
      max-width: 100%;
    }
    .dp-title-main {
      font-size: 1.6rem;
    }
  }
</style>


<div class="dp-shell">
  <div class="dp-layout">
    
    <div class="dp-left">
      <div class="dp-kicker">Doctor Portal</div>
      <h1 class="dp-title-main">Patient Record Management System</h1>
      <p class="dp-sub-main">
        Secure, invite‑only access for doctors to manage patient profiles and consultation history,
        powered by GoBaby Travel OS.
      </p>

      <div class="dp-pills-row">
        <span class="dp-pill">View and update patient records</span>
        <span class="dp-pill">Log consultations &amp; past history</span>
        <span class="dp-pill">Track upcoming follow‑ups</span>
      </div>

      <ul class="dp-list">
        <li>Single login for all your GoBaby Travel medical cases.</li>
        <li>Built on Supabase with Row‑Level Security for every doctor.</li>
        <li>Works seamlessly with the Doctor Dashboard you already use.</li>
      </ul>

      <p class="dp-meta-text">
        Need access or want to onboard a new doctor? Reach out to the GoBaby Travel team and we will
        set up an account for you.
      </p>
    </div>

    
    <div class="dp-right">
      <section class="dp-card">
        <h2 class="dp-card-title">Sign in to continue</h2>
        <p class="dp-card-subtitle">Use your registered doctor email and password.</p>

        <form id="doctor-login-form">
          <div class="dp-field">
            <label class="dp-label" for="email">Email</label>
            <input
              id="email"
              type="email"
              autocomplete="email"
              required
              class="dp-input"
              placeholder="doctor1@gobabytravel.com"
            />
          </div>

          <div class="dp-field">
            <label class="dp-label" for="password">Password</label>
            <input
              id="password"
              type="password"
              autocomplete="current-password"
              required
              class="dp-input"
              placeholder="••••••••"
            />
          </div>

          <p id="error-message" class="dp-error"></p>
          <p id="info-message" class="dp-info"></p>

          <button id="login-button" type="submit" class="dp-button-primary">
            <span id="login-button-text">Sign in</span>
            <span id="login-spinner" class="dp-spinner" style="display:none;"></span>
          </button>

          <div class="dp-button-row">
            <span style="font-size:0.75rem; color:var(--text-muted);">
              This portal is invite‑only.
            </span>
            <button id="forgot-password" type="button" class="dp-button-text">
              Forgot password?
            </button>
          </div>

          <p class="dp-helper-text">
            If you need access, please contact the GoBaby Travel team via your usual channel.
          </p>
        </form>

        <div class="dp-demo-block">
          <p>Demo accounts (for internal testing):</p>
          <p class="dp-demo-item">doctor1@gobabytravel.com / Doctor1Demo!</p>
          <p class="dp-demo-item">doctor2@gobabytravel.com / Doctor2Demo!</p>
        </div>
      </section>
    </div>
  </div>
</div>


<script type="module">
  import { createClient } from 'https://esm.sh/@supabase/supabase-js@2'

  // ---- Supabase config (your project) ----
  const SUPABASE_URL = 'https://eqgoctdgipwdgkencsae.supabase.co'
  const SUPABASE_ANON_KEY =
    'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImVxZ29jdGRnaXB3ZGdrZW5jc2FlIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NjE3OTA4OTUsImV4cCI6MjA3NzM2Njg5NX0.NeakyxE4ueFK6J3XqlQF_u3TeX9EXdsBw-nFMhBiL_Y'

  const DASHBOARD_PATH = '/doctor-portal-dashboard'

  const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY, {
    auth: { persistSession: true },
    db: { schema: 'medical_system' }
  })

  // ---- DOM references ----
  const form = document.getElementById('doctor-login-form')
  const emailInput = document.getElementById('email')
  const passwordInput = document.getElementById('password')
  const errorEl = document.getElementById('error-message')
  const infoEl = document.getElementById('info-message')
  const loginButton = document.getElementById('login-button')
  const loginButtonText = document.getElementById('login-button-text')
  const loginSpinner = document.getElementById('login-spinner')
  const forgotButton = document.getElementById('forgot-password')

  function showError(message) {
    if (!errorEl) return
    errorEl.textContent = message
    errorEl.style.display = 'block'
  }

  function clearError() {
    if (!errorEl) return
    errorEl.textContent = ''
    errorEl.style.display = 'none'
  }

  function showInfo(message) {
    if (!infoEl) return
    infoEl.textContent = message
    infoEl.style.display = 'block'
  }

  function clearInfo() {
    if (!infoEl) return
    infoEl.textContent = ''
    infoEl.style.display = 'none'
  }

  function setLoading(isLoading) {
    if (!loginButton || !loginButtonText || !loginSpinner) return
    loginButton.disabled = isLoading
    loginSpinner.style.display = isLoading ? 'inline-block' : 'none'
    loginButtonText.textContent = isLoading ? 'Signing in…' : 'Sign in'
  }

  // ---- Login submit handler ----
  if (form) {
    form.addEventListener('submit', async (event) => {
      event.preventDefault()
      clearError()
      clearInfo()
      setLoading(true)

      try {
        const email = (emailInput?.value || '').trim()
        const password = passwordInput?.value || ''

        if (!email || !password) {
          showError('Please enter both email and password.')
          setLoading(false)
          return
        }

        const { data, error } = await supabase.auth.signInWithPassword({
          email,
          password
        })

        if (error || !data.user) {
          console.error('Sign-in error:', error)
          showError(error ? error.message : 'Invalid credentials or unregistered doctor.')
          setLoading(false)
          return
        }

        const { data: doctor, error: docError } = await supabase
          .from('doctors')
          .select('id')
          .eq('auth_user_id', data.user.id)
          .maybeSingle()

        if (docError || !doctor) {
          console.error('Doctor lookup error:', docError)
          showError(
            docError
              ? docError.message
              : 'Doctor record not found for this login (auth_user_id mismatch or RLS).'
          )
          await supabase.auth.signOut()
          setLoading(false)
          return
        }

        // Successfully verified - now redirect
        window.location.href = DASHBOARD_PATH
      } catch (err) {
        console.error('Unexpected login error:', err)
        showError('Something went wrong. Please try again.')
      } finally {
        setLoading(false)
      }
    })
  }

  // ---- Forgot password handler ----
  if (forgotButton) {
    forgotButton.addEventListener('click', async () => {
      clearError()
      clearInfo()
      const email = (emailInput?.value || '').trim()

      if (!email) {
        showError('Enter your email to receive a reset link.')
        return
      }

      try {
        const { error } = await supabase.auth.resetPasswordForEmail(email, {
          redirectTo: window.location.origin + '/doctor-portal/reset-password'
        })

        if (error) {
          console.error('Reset error:', error)
          showError('Unable to send reset email right now.')
        } else {
          showInfo('If this email is registered, a reset link has been sent.')
        }
      } catch (err) {
        console.error('Reset error:', err)
        showError('Unable to send reset email right now.')
      }
    })
  }
</script>

GoBaby Travel

GoBabyTravel is a next-generation global travel platform that transforms how people discover, plan, and experience journeys worldwide. We offer comprehensive travel solutions including international and domestic flight bookings, luxury and budget hotel accommodations, customized honeymoon packages, property stays and homestays, intercity bus and train bookings, complete visa processing services, and exclusive travel deals.

Our Unique Selling Propositions:
- One-stop travel ecosystem covering every aspect of a journey from visa to arrival
- AI-powered personalized itinerary planning that adapts to traveler preferences
- Direct integration with 200+ global suppliers for best pricing and availability
- Loyalty rewards program with cashback on every booking
- 24/7 multilingual customer support across all time zones
- Exclusive partnerships with local guides and authentic experiences unavailable elsewhere
- Carbon offset tracking and sustainable travel options
- Travel buddy matching for solo travelers
- Real-time trip modifications and dynamic rebooking
- Immersive pre-trip virtual destination previews

Our Core Values:
Trust & Transparency - No hidden fees, clear pricing, honest recommendations, and price-match guarantees
Customer Obsession - Every decision is made with traveler happiness and convenience as priority
Cultural Respect - We celebrate diversity and promote responsible, respectful tourism
Innovation - Continuously adopting cutting-edge technology to simplify travel
Accessibility - Making dream destinations reachable for every budget and travel style
Sustainability - Committed to reducing travel's environmental impact through conscious choices
Community - Building a global family of travelers who share experiences and support each other

Our Ethics:
We operate with complete integrity, protecting customer data with bank-level security. We partner only with verified, licensed service providers. We believe travel should enrich both travelers and local communities, so we ensure fair wages and ethical practices throughout our supply chain. We never engage in deceptive marketing or pressure tactics. We empower travelers with complete information to make informed decisions. We stand behind every booking with full support and accountability.

Brand Personality: Adventurous yet reliable, sophisticated yet approachable, globally-minded yet personally attentive, innovative yet trustworthy. We speak to travelers who seek authentic experiences, value seamless service, and want a partner who cares about their journey as much as they do.
