@extends('layouts.auth')

@section('content')
<div class="container mx-auto mt-10 max-w-lg p-6 bg-white rounded-lg shadow-md">
    <div class="text-center">
        <h2 class="text-2xl font-bold text-gray-800">Connect Your Google Account</h2>
        <p class="mt-2 text-gray-600">Link your Google account to enable seamless integration.</p>

        <div class="mt-6">
            <a href="{{ route('connections.redirect', ['provider' => $provider]) }}"
               class="flex items-center justify-center gap-3 px-4 py-2 border border-gray-300 rounded-md bg-white hover:bg-gray-100">
                <img src="https://developers.google.com/identity/images/g-logo.png" alt="Google logo" class="h-5 w-5">
                <span class="text-sm text-gray-700 font-medium">Continue with Google</span>
            </a>
        </div>
    </div>
</div>
@endsection