<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

@php
    /* Control Variables */
        $title = __('entities')['settings']['shift']." #".$audit->id;
        $copyrightYear = date('Y');

    /* Dynamic Variables */
        $has_rejection_reason = !in_array($audit->rejection_reason, [null, ""]);
        $has_rejection_auditor = !in_array($audit->auditor, [null, ""]);

        if ($audit->is_concluded && $audit->is_approved && !$has_rejection_reason && $has_rejection_auditor) {
            $audit_status = __('neutral_words')['approved'];
        } elseif ($audit->is_concluded && !$audit->is_approved && $has_rejection_reason && $has_rejection_auditor) {
            $audit_status = __('neutral_words')['rejected'];
        }

@endphp

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Harsi Hoteleria | {{ $title }} </title>

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Barlow:wght@500&display=swap" rel="stylesheet">

    <style>
        /* General Styles */
        body {
            font-family: 'Barlow', sans-serif;
            background-color: #f4f4f4;
            padding: 0;
            margin: 0;
        }

        a {
            font-weight: 700;
            color: #006B8E !important;
        }

        .container {
            width: 100%;
            max-width: 600px;
            margin: 2rem auto;
            background-color: #edeee84f;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
        }

        li{
            font-size: .9em;
            text-align: justify;
        }

        li::marker {
            color: #0d6889;
        }

        /* Header Styles */
        .header {
            text-align: center;
            background-color: #0d6889;
            padding-bottom: 0.8rem;
        }

        .header img {
            width: 45%;
            padding-top: 0.5rem;
            filter: grayscale(50%) invert(50%) brightness(185%);
        }

        /* Content Styles */
        .content {
            font-size: 18px;
            line-height: 1.5;
            color: #333;
            padding: 0.5rem;
        }

        .content h1 {
            font-size: 1.25rem;
            font-weight: 500;
        }

        .content hr {
            opacity: 0.5;
        }

        .content .box-colored {
            background-color: #e4e6dc;
            border-radius: 12px;

            min-width: 40%;
            width: fit-content;

            margin: 1.5rem auto;
        }

        .box-colored h2 {
            padding: 0.4rem 0.6rem;
            font-size: 1.25rem;
        }

        /* Footer Styles */
        .footer {
            background-color: #e2e4daa2;
            line-height: 1.5;
            padding: 0.5rem;
        }

        .footer img {
            width: 35%;
            padding-top: 1rem;
        }

        .footer .col-3 {
            border-right: #006B8E 2px solid;
            text-align: center;
        }

        .footer .copyright {
            text-decoration: none;
            font-weight: normal;
            font-size: 0.8rem;
            color: #585858 !important;
        }

        .footer p {
            color: #585858;
        }

        .footer a {
            font-weight: bold;
            color: #006B8E;
            text-decoration: none !important;

            padding: 0.3em 0em;
        }

        /* Shared Styles */

            /* Text */
            .font-size-sm {
                font-size: 14px;
            }

            .font-size-md {
                font-size: 16px;
            }

            .font-size-mlg {
                font-size: 1.2rem;
            }

            .font-size-lg {
                font-size: 1.4rem;
            }

            .text-center {
                text-align: center;
            }

            .harsi-color {
                color: #006B8E;
            }

            .success-color {
                color: #139732;
            }

            .danger-color {
                color: #901925c5;
            }

            /* Spacers */
            .mb-1 {
                margin-bottom: 1rem;
            }

            .my-1 {
                margin-bottom: 1rem;
                margin-top: 1rem;
            }

            .mt-1 {
                margin-top: 1rem;
            }

            .mt-2 {
                margin-top: 2rem;
            }

            .mt-3 {
                margin-top: 3rem;
            }

            .padding-sm {
                padding-left: 1rem;
                padding-right: 1rem;
            }

            .padding-md {
                padding-left: 2.5rem;
                padding-right: 2.5rem;
            }

            .padding-lg {
                padding-left: 4.5rem;
                padding-right: 4.5rem;
            }

            /* Lists */
            .list-titles {
                font-weight: 600;
            }
    </style>
</head>

<body>

    {{-- Main Body --}}
    <div class="container">
        <section class="header">
            <img src="https://test.harsi.app/images/harsi_logo_white.png" alt="Harsi Logo">
        </section>

        <section class="content">
            {{-- Saludo --}}
            <h1 class="mt-2 padding-sm">{{ __('emails')['completed_audit']['greetings'] }} <b>{{ $business }}</b></h1>

            {{-- Introducción --}}
            <div class="mb-1 padding-sm">

                @php
                    $introduction_subject = str_replace(
                        [':type', ':id', ':receptionist', ':auditor'],
                        [
                            __('emails')['completed_audit']['cash_reconciliation'],
                            $audit->id,
                            $audit->receptionist->name . ' ' . $audit->receptionist->last_name,
                            $audit->auditor,
                        ],
                        __('emails')['completed_audit']['introduction_subject']
                    );
                @endphp
                <p>
                    {!! $introduction_subject !!}
                </p>

                {{-- Audit Status --}}
                <div class="box-colored">
                    <h2
                        class="text-center
                            @if($audit_status === __('neutral_words')['approved'])
                                success-color
                            @else
                                danger-color
                            @endif
                        "
                    >
                        {{ $audit_status }}
                    </h2>
                </div>

                <p class="mt-2">
                    {{ __('emails')['completed_audit']['introduction_link'] }} (
                    <a href="{{ $APP_URL }}/audits/{{ $audit->id }}" target="_blank">{{ __('emails')['common']['click_here'] }}</a>)
                </p>

                {{-- Notas Adicionales --}}
                <div class="mb-1 font-size-sm">
                    <small>
                        {{ __('emails')['completed_audit']['introduction_notes'] }}
                    </small>
                </div>
            </div>

            {{-- Divisor --}}
            <hr>

            {{-- Sección de Resumen --}}
            <div class="mt-2 padding-md">

                <p class="font-size-md">
                    {!! __('emails')['completed_audit']['summary_subject'] !!}
                </p>

                {{-- Detalles de la Auditoria --}}
                <ul class="font-size-md">
                    <li>
                        <span class="list-titles">{{ __('entity_fields')['audit']['timestamp'] }}:</span> {{ $audit->audit_date }}, {{ \Carbon\Carbon::createFromFormat('H:i:s', $audit->audit_time)->format('g:i A') }}
                    </li>
                    <li>
                        <span class="list-titles">{{ __('entity_fields')['common']['shift'] }}:</span> {{ $audit->shift->name }}
                    </li>

                    <li class="mt-1">
                        <span class="list-titles">{{ __('entity_fields')['common']['receptionist'] }}:</span> {{ $audit->receptionist->name }} {{ $audit->receptionist->last_name }}
                    </li>
                    <li>
                        <span class="list-titles">Auditor:</span> {{ $audit->auditor }}
                    </li>

                    <li class="mt-1">
                        <span class="list-titles">{{ __('entity_fields')['common']['status'] }}:</span> {{ $audit_status }}
                    </li>
                    @if ($audit_status === __('neutral_words')['rejected'] && $has_rejection_reason)
                        <li>
                            <span class="list-titles">{{ __('entity_fields')['audit']['rejected_reason'] }}:</span> {{ $audit->rejection_reason }}
                        </li>
                    @endif
                </ul>

                {{-- Notas Adicionales --}}
                <p class="mt-2 font-size-sm">
                    {{ __('emails')['completed_audit']['summary_notes'] }}
                </p>
            </div>

            {{-- Divisor --}}
            <hr>

            {{-- Despedida --}}
            <div class="mt-1 padding-sm">
                <p class="font-size-sm">
                    {!! __('emails')['completed_audit']['farewell'] !!}
                </p>
            </div>
        </section>

        <section class="mt-2 footer">
            <table cellpadding="0" cellspacing="0" role="presentation">
                <tr>
                    <td align="center" width="30%">
                        <img src="https://test.harsi.app/images/only_harsi.png" alt="Harsi Logo" width="100" style="display: block;">
                    </td>
                    <td align="center">
                        <a href="https://harsi.mx/" target="_blank">HARSI | TECNOLOGÍA EMPRESARIAL</a>
                        <br>
                        <small>{{ __('emails')['common']['appreciations'] }}</small>

                        <br>
                        <a class="copyright" href="https://harsi.mx/" target="_blank">
                            © Harsi Hotelería ®
                            | {{ __('emails')['common']['copyright'] }} ({{ $copyrightYear }})
                        </a>
                    </td>
                </tr>
            </table>
        </section>
    </div>

    <br><br>
</body>

</html>
