@extends('frontend.layout.main')
@section('title', 'Doctors - PYPA'){{-- Site Main Section --}}
@section('seo_sectiona')
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="robots" content="index, follow">
    <meta name="description"
        content="{{ \App\Models\InfoSection::pluck('site_title')->first() }} offers a comprehensive range of customer care support services, including operator and dispatcher services tailored for cab firms across the United Kingdom. Our solutions ensure efficient operations and outstanding customer satisfaction.">
    <meta name="keywords"
        content="Customer Care Services, Dispatcher Services, Operator Services, UK Cab Firms, Cab Operations, Professional Support, Customer Satisfaction, {{ \App\Models\InfoSection::pluck('site_title')->first() }} Services">
    <meta name="robots" content="follow, index, max-snippet:-1, max-video-preview:-1, max-image-preview:large">
    <link rel="canonical" href="{{ route('services') }}">
    <meta property="og:locale" content="en_US">
    <meta property="og:type" content="website">
    <meta property="og:title"
        content="Services | {{ \App\Models\InfoSection::pluck('site_title')->first() }} - Comprehensive Customer Care Solutions">
    <meta property="og:description"
        content="{{ \App\Models\InfoSection::pluck('site_title')->first() }} offers a comprehensive range of customer care support services, including operator and dispatcher services tailored for cab firms across the United Kingdom. Our solutions ensure efficient operations and outstanding customer satisfaction.">
    <meta property="og:url" content="{{ route('services') }}">
    <meta property="og:site_name" content="{{ \App\Models\InfoSection::pluck('site_title')->first() }}">
    <meta property="og:updated_time" content="{{ now() }}">
    <meta property="og:image" content="{{ Storage::disk('public')->url('frontend/logo/' . $infoSection->logo) }}">
    <meta property="og:image:secure_url"
        content="{{ Storage::disk('public')->url('frontend/logo/' . $infoSection->logo) }}">
    <meta property="og:image:width" content="1379">
    <meta property="og:image:height" content="1379">
    <meta property="og:image:alt" content="{{ \App\Models\InfoSection::pluck('site_title')->first() }} Logo">
    <meta property="og:image:type" content="image/jpeg">
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title"
        content="Services | {{ \App\Models\InfoSection::pluck('site_title')->first() }} - Comprehensive Customer Care Solutions">
    <meta name="twitter:description"
        content="{{ \App\Models\InfoSection::pluck('site_title')->first() }} offers a comprehensive range of customer care support services, including operator and dispatcher services tailored for cab firms across the United Kingdom. Our solutions ensure efficient operations and outstanding customer satisfaction.">
    <meta name="twitter:image" content="{{ Storage::disk('public')->url('frontend/logo/' . $infoSection->logo) }}">
    <meta name="twitter:label1" content="Expertise">
    <meta name="twitter:data1" content="Customer Care Support">
    <meta name="twitter:label2" content="Focus Area">
    <meta name="twitter:data2" content="Cab Operations">
    <script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "Organization",
    "name": "{{\App\Models\InfoSection::pluck('site_title')->first()}}",
    "url": "https://kreashionsoftwarehouse.com",
    "logo": "{{Storage::disk('public')->url('frontend/logo/'.$infoSection->logo)}}",
    "description": "{{\App\Models\InfoSection::pluck('site_title')->first()}} offers a comprehensive range of customer care support services, including operator and dispatcher services tailored for cab firms across the United Kingdom. Our solutions ensure efficient operations and outstanding customer satisfaction.",
    "contactPoint": {
      "@type": "ContactPoint",
      "telephone": "{{\App\Models\InfoSection::pluck('phone')->first()}}",
      "contactType": "Customer Service",
      "areaServed": "United Kingdom",
      "availableLanguage": ["English"]
    },
    "aggregateRating": {
      "@type": "AggregateRating",
      "ratingValue": "5",
      "bestRating": "5",
      "ratingCount": "150"
    }
}
</script>
@endsection


<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">

<style>
    .team-link { 
        text-decoration: none !important; 
        color: inherit; 
        display: flex; /* Makes the anchor a flex container */
        flex-direction: column;
    }

    .teams-section-plan-box {
        display: flex; /* New: Make the box a flex container */
        flex-direction: column;
        flex-grow: 1; /* New: Forces the box to fill the available height of the anchor */
        transition: all 0.3s ease-in-out;
        border: 1px solid transparent;
        height: 100%; /* Ensures it spans the full wrapper */
        background: #fff;
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    }

    /* Keep your existing hover and image styles */
    .team-link:hover .teams-section-plan-box {
        transform: translateY(-10px);
        box-shadow: 0 15px 30px rgba(0,0,0,0.1);
        border-color: #1a2b56;
    }

    .teams-section-plan-box figure {
        margin-bottom: 15px;
        overflow: hidden;
        border-radius: 8px;
        background-color: #f9f9f9;
    }

    .teams-section-plan-box figure img {
        width: 100%;
        height: 300px;
        object-fit: contain;
        display: block;
        transition: transform 0.5s ease;
    }

    .team-link:hover figure img {
        transform: scale(1.05);
    }
    
    /* Pushes the "View Profile" link to the very bottom of the card */
    .view-profile-btn {
        margin-top: auto; 
        padding-top: 15px;
    }
</style>
@section('main-section')
    <div class="sub-banner-section-outer">

        {{-- Preloader --}}
        <x-frontend.preloader></x-frontend.preloader>
        <!--  Preloader End -->

        <!-- Theme Switcher Start -->
        <div class="switch-theme-mode">
            <label id="switch" class="switch">
                <input type="checkbox" onchange="toggleTheme()" id="slider">
                <span class="slider round"></span>
            </label>
        </div>
        <!-- Theme Switcher End -->

        <!-- Custom Cursor -->
        <div class="cursor style-one"></div>
        <div class="cursor-inner style-one"></div>
        <!-- MAIN HEADER -->
        <x-frontend.navbar></x-frontend.navbar>
        <!-- BANNER -->
        {{-- BreadCrumb --}}
        <x-frontend.bread-crumb>
            <x-slot name="image">images/br-image-team-3.png</x-slot>
            <x-slot name="title">Doctors</x-slot>
            <li class="position-relative fs-xx-14 d-inline-block">Doctors</li>
        </x-frontend.bread-crumb>
    </div>

    <div class="container mt-5 mb-5">
    <div class="row teams-row d-flex flex-wrap"> {{-- Added flex-wrap and d-flex to row --}}
        @foreach ($teams as $team)
            <div class="col-lg-4 col-md-6 col-sm-6 mb-4 d-flex" {{-- Added d-flex to column --}}
                 data-aos="fade-up" 
                 data-aos-delay="{{ $loop->iteration * 100 }}">
                
                <a href="{{ route('team.detail', ['slug' =>$team->slug]) }}" class="team-link w-100">
                    <div class="teams-section-plan-box text-center">
                        <figure>
                            <img src="{{ Storage::disk('public')->url('team/' . $team->image) }}" alt="{{ $team->name }}">
                        </figure>
                        <h3 class="font-weight-bold mb-1">{{ $team->name }}</h3>
                        <h6 class="text-uppercase small text-muted">{{ $team->job_title }}</h6>
                        
                        <div class="view-profile-btn">
                            <span class="small d-inline-block font-weight-bold">View Profile →</span>
                        </div>
                    </div>
                </a>
            </div>
        @endforeach
    </div>
</div>
    <!-- Hospital Section End -->

    <!-- Brand Section Start -->

    <!-- Brand Section End -->


    <x-frontend.footer></x-frontend.footer>

    <!-- Back to Top -->
    <div id="progress-wrap" class="progress-wrap style-one">
        <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
            <path id="progress-path" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
        </svg>
    </div>

<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>
  AOS.init({ duration: 1000, once: true });
</script>    
@endsection