@extends('layouts.app')

@section('title', 'Messages - ' . config('app.name'))

@section('content')
    <div class="mb-8">
        <h2 class="text-2xl font-semibold mb-2">Messages</h2>
        <p class="text-[#706f6c] dark:text-[#A1A09A]
            Your conversations and messages
        </p>
    </div>

    <div class="bg-white dark:bg-[#161615] border border-[#e3e3e0] dark:border-[#3E3E3A] rounded-lg p-8">
        <div class="text-center py-16">
            <svg class="w-16 h-16 mx-auto mb-4 text-[#706f6c] dark:text-[#A1A09A] fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
            </svg>
            <h3 class="text-lg font-medium mb-2">No Messages</h3>
            <p class="text-[#706f6c] dark:text-[#A1A09A] inbox is empty</p>
        </div>
    </div>
@endsection