@php
    $branding = app(\App\Domain\Shared\Services\SettingsService::class);
    $brandPrimary = $branding->get('branding.primary_color', '#2563eb');
    $brandSecondary = $branding->get('branding.secondary_color', '#7c3aed');
    $brandFontAr = $branding->get('branding.font_family_ar', 'Cairo');
    $brandFontEn = $branding->get('branding.font_family_en', 'Inter');
    $brandLogo = $branding->get('branding.logo');
@endphp
<!DOCTYPE html>
<html dir="rtl" lang="ar" class="h-full">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>{{ $title ?? 'تسجيل الدخول' }} - الكابتن</title>
    @if($favicon = $branding->get('branding.favicon'))
        <link rel="icon" href="{{ Storage::disk('public')->url($favicon) }}" type="image/png">
    @endif
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link href="https://fonts.googleapis.com/css2?family={{ urlencode($brandFontAr) }}:wght@300;400;500;600;700;800&family={{ urlencode($brandFontEn) }}:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    @vite(['resources/css/app.css', 'resources/js/app.js'])
    @livewireStyles
    <style>
        :root {
            --brand-primary: {{ $brandPrimary }};
            --brand-secondary: {{ $brandSecondary }};
        }
        body {
            font-family: '{{ $brandFontAr }}', '{{ $brandFontEn }}', sans-serif;
        }
    </style>
</head>
<body class="h-full bg-gray-100">
    <div class="min-h-full flex items-center justify-center py-6 sm:py-12 px-4 sm:px-6 lg:px-8 safe-top safe-bottom">
        <div class="w-full max-w-md">
            {{ $slot }}
        </div>
    </div>
    @livewireScripts
</body>
</html>
