{{--
=====================================================
Etebarit - by Gisoo Web Solutions
------------------------------------------------------
Gisoo.net
------------------------------------------------------
Copyright (c) 2026 Gisoo Web Solutions
=====================================================
This code is protected by copyright
=====================================================
File: row.blade.php
------------------------------------------------------
Use: One notification line -- icon chip, title (with an
     unread dot), body and relative time. Shared by the
     user page, the admin feed and the header dropdown.
=====================================================
--}}

@props(['notification', 'compact' => false])

@php
    $tones = [
        'green' => 'bg-[#e7f7ee] text-green-600',
        'amber' => 'bg-[#fff5e6] text-amber-600',
        'red' => 'bg-secondary-50 text-secondary-500',
        'purple' => 'bg-[#efeafb] text-primary-600',
        'blue' => 'bg-[#eaf3fe] text-[#2563eb]',
    ];
    $chip = $tones[$notification->tone()] ?? $tones['purple'];
    $unread = ! $notification->isRead();
    $size = $compact ? 'size-9 rounded-[11px]' : 'size-11 rounded-xl';
    $iconSize = $compact ? 'size-[18px]' : 'size-[21px]';
@endphp

<div @class([
        'flex gap-3.5',
        'px-4.5 py-3.5' => $compact,
        'gap-3.5 px-5 py-4' => ! $compact,
        'bg-[#faf9ff]' => $unread,
    ])>
    <span @class(['flex shrink-0 items-center justify-center', $size, $chip])>
        <x-notif.icon :name="$notification->icon()" :class="$iconSize" />
    </span>
    <div class="min-w-0 flex-1">
        <div class="flex items-center gap-2">
            <span @class(['font-bold', 'text-[13px]' => $compact, 'text-[14.5px]' => ! $compact])>{{ $notification->title() }}</span>
            @if ($unread)
                <span class="size-[7px] shrink-0 rounded-full bg-secondary-500"></span>
            @endif
        </div>
        <div @class(['mt-0.5 leading-7 text-ink-soft', 'text-[12px]' => $compact, 'text-[13px]' => ! $compact])>{{ $notification->body() }}</div>
        <div class="mt-1 text-[11.5px] text-ink-faint">{{ \App\Support\Format::persianDigits($notification->created_at->diffForHumans()) }}</div>
    </div>
</div>