@extends('layout.emails._message-base')

@section('email-content')

<div style="font-family: Arial, Helvetica, sans-serif; color:#374151;">

    <!-- Greeting -->
    <div style="margin-top:20px;">

        <h2 style="
            font-size:17px;
            line-height:24px;
            font-weight:700;
            color:#dc2626;
            margin:0 0 12px 0;
        ">
            Dear {{ $user->name.' '.$user->surname }},
        </h2>

        <p style="
            margin:0;
            font-size:13px;
            line-height:22px;
            color:#4b5563;
        ">
            Please find attached the <strong>Tickets Report</strong> for the period of
            <span style="font-weight:700; color:#dc2626;">
                {{ $reportDate }}
            </span>.
        </p>

    </div>

    <!-- Information -->
    <div style="margin-top:24px;">

        <div style="
            margin-top:16px;
            background:#fffbeb;
            border:1px solid #fde68a;
            border-radius:14px;
            padding:10px 18px;
        ">

            <p style="
                margin:0;
                font-size:12px;
                line-height:20px;
                color:#92400e;
            ">
                Should you have any questions or require further information, please do not hesitate to contact us.
            </p>

        </div>

    </div>
    
    <!-- Closing -->
    <div style="margin-top:30px;">

        <p style="
            margin:0;
            font-size:12px;
            color:#4b5563;
        ">
            Kind regards,
        </p>

        <div style="margin-top:10px;">

            <h3 style="
                margin:0;
                font-size:16px;
                line-height:24px;
                font-weight:700;
                color:#dc2626;
            ">
                System Administration
            </h3>

            <div style="
                width:180px;
                height:2px;
                background:#fecaca;
                margin-top:12px;
                border-radius:999px;
            "></div>

        </div>

    </div>

</div>

@endsection