@extends('layouts.trading')

@section('title', 'Fiche trade — ICT Performance Lab')

@section('styles')
    .page {
        max-width: 1050px;
        margin: 0 auto;
        padding: 2rem 1.5rem 3rem;
    }

    .header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1.5rem;
        margin-bottom: 2rem;
        flex-wrap: wrap;
    }

    .header__brand {
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
    }

    .header__eyebrow {
        font-size: 0.7rem;
        font-weight: 600;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--accent);
    }

    .header__title {
        margin: 0;
        font-size: clamp(1.6rem, 4vw, 2.1rem);
        font-weight: 700;
        letter-spacing: -0.02em;
    }

    .header__subtitle {
        margin: 0.15rem 0 0;
        font-size: 0.95rem;
        color: var(--text-secondary);
    }

    .header__actions {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        flex-wrap: wrap;
    }

    .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;

        min-height: 42px;
        padding: 0.7rem 1.2rem;

        font-size: 0.875rem;
        font-weight: 650;

        text-decoration: none;

        border-radius: var(--radius-sm);
        border: 1px solid transparent;

        cursor: pointer;

        transition:
            background 0.15s ease,
            box-shadow 0.15s ease,
            transform 0.1s ease,
            border-color 0.15s ease,
            color 0.15s ease;

        white-space: nowrap;
    }

    .btn:active {
        transform: scale(0.98);
    }

    .btn--ghost {
        background: var(--bg-elevated);
        color: var(--text-secondary);
        border-color: var(--border-strong);
    }

    .btn--ghost:hover {
        background: var(--bg-hover);
        color: var(--text-primary);
    }

    .btn--edit {
        background: linear-gradient(
            135deg,
            var(--accent-light),
            var(--accent)
        );

        color: #ffffff;

        border-color: rgba(96, 165, 250, 0.55);

        box-shadow:
            0 0 0 1px rgba(59, 130, 246, 0.15),
            0 10px 30px rgba(37, 99, 235, 0.32);

        font-weight: 750;
    }

    .btn--edit:hover {
        background: linear-gradient(
            135deg,
            #75b6ff,
            var(--accent-hover)
        );

        box-shadow:
            0 0 0 1px rgba(96, 165, 250, 0.25),
            0 12px 36px rgba(59, 130, 246, 0.42);

        transform: translateY(-1px);
    }

    .btn--addin {
        background: rgba(34, 197, 94, 0.10);
        color: #16a34a;
        border-color: rgba(34, 197, 94, 0.35);
        font-weight: 750;
    }

    .btn--addin:hover {
        background: rgba(34, 197, 94, 0.16);
        border-color: rgba(34, 197, 94, 0.55);
        transform: translateY(-1px);
    }

    .btn--disabled {
        opacity: 0.55;
        cursor: not-allowed;
        pointer-events: none;
        background: var(--bg-elevated);
        color: var(--text-muted);
        border-color: var(--border-strong);
        box-shadow: none;
    }

    .btn__icon {
        font-size: 1rem;
        line-height: 1;
    }

    .summary {
        background: var(--bg-surface);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        padding: 1.5rem;
        margin-bottom: 1.5rem;
    }

    .summary__top {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 1rem;
        flex-wrap: wrap;
        margin-bottom: 1.25rem;
    }

    .summary__asset {
        font-family: var(--font-mono);
        font-size: 1.75rem;
        font-weight: 700;
        letter-spacing: -0.02em;
    }

    .summary__meta {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        flex-wrap: wrap;
        margin-top: 0.5rem;
    }

    .summary__date {
        font-size: 0.875rem;
        color: var(--text-secondary);
    }

    .summary__kpis {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem;
    }

    .kpi {
        background: var(--bg-elevated);
        border: 1px solid var(--border);
        border-radius: var(--radius-sm);
        padding: 0.85rem 1rem;
    }

    .kpi__label {
        font-size: 0.68rem;
        font-weight: 600;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: var(--text-muted);
        margin-bottom: 0.35rem;
    }

    .kpi__value {
        font-family: var(--font-mono);
        font-size: 1.05rem;
        font-weight: 600;
    }

    .kpi__value--positive {
        color: var(--positive);
    }

    .kpi__value--negative {
        color: var(--negative);
    }

    .kpi__value--muted {
        color: var(--text-muted);
        font-weight: 400;
    }

    .detail-card {
        background: var(--bg-surface);
        border: 1px solid var(--border);
        border-radius: var(--radius);
        overflow: hidden;
    }

    .detail-section + .detail-section {
        border-top: 1px solid var(--border);
    }

    .detail-section__header {
        padding: 1rem 1.5rem;
        background: var(--bg-elevated);
        border-bottom: 1px solid var(--border);
    }

    .detail-section__title {
        margin: 0;
        font-size: 0.75rem;
        font-weight: 600;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--text-muted);
    }

    .detail-section__body {
        padding: 1.5rem;
    }

    .detail-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
    }

    .detail-grid--3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .detail-grid--1 {
        grid-template-columns: 1fr;
    }

    .detail-field {
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
    }

    .detail-field__label {
        font-size: 0.8rem;
        font-weight: 600;
        color: var(--text-secondary);
    }

    .detail-field__value {
        font-size: 0.9rem;
        color: var(--text-primary);
        line-height: 1.55;
    }

    .detail-field__value--mono {
        font-family: var(--font-mono);
    }

    .detail-field__value--text {
        background: var(--bg-base);
        border: 1px solid var(--border-strong);
        border-radius: var(--radius-sm);
        padding: 0.75rem 0.85rem;
        white-space: pre-wrap;
        min-height: 2.5rem;
    }

    .detail-field__value--text.is-empty::before {
        content: "—";
        color: var(--text-muted);
    }

    .badge {
        display: inline-block;
        padding: 0.2rem 0.55rem;
        border-radius: 4px;
        font-size: 0.75rem;
        font-weight: 600;
        white-space: nowrap;
    }

    .badge--long {
        background: var(--long-bg);
        color: var(--long);
    }

    .badge--short {
        background: var(--short-bg);
        color: var(--short);
    }

    .badge--neutral {
        background: rgba(100, 116, 139, 0.15);
        color: var(--text-secondary);
    }

    .badge--success {
        background: rgba(34, 197, 94, 0.12);
        color: #4ade80;
    }

    .badge--danger {
        background: rgba(239, 68, 68, 0.12);
        color: #f87171;
    }

    .badge--accent {
        background: rgba(59, 130, 246, 0.12);
        color: #60a5fa;
    }

    .badge--warning {
        background: rgba(234, 179, 8, 0.12);
        color: #facc15;
    }

    .badge--grade-a {
        background: rgba(34, 197, 94, 0.12);
        color: #4ade80;
    }

    .badge--grade-b {
        background: rgba(59, 130, 246, 0.12);
        color: #60a5fa;
    }

    .badge--grade-c {
        background: rgba(234, 179, 8, 0.12);
        color: #facc15;
    }

    .badge--grade-d {
        background: rgba(239, 68, 68, 0.12);
        color: #f87171;
    }

    .confirm-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        gap: 0.75rem;
    }

    .confirm-item {
        display: flex;
        align-items: center;
        gap: 0.6rem;
        padding: 0.65rem 0.85rem;
        background: var(--bg-base);
        border: 1px solid var(--border-strong);
        border-radius: var(--radius-sm);
    }

    .confirm-item--active {
        border-color: rgba(34, 197, 94, 0.3);
        background: rgba(34, 197, 94, 0.06);
    }

    .confirm-item--inactive {
        opacity: 0.55;
    }

    .confirm-item__icon {
        width: 18px;
        height: 18px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.7rem;
        font-weight: 700;
        flex-shrink: 0;
    }

    .confirm-item--active .confirm-item__icon {
        background: rgba(34, 197, 94, 0.2);
        color: var(--long);
    }

    .confirm-item--inactive .confirm-item__icon {
        background: rgba(255, 255, 255, 0.06);
        color: var(--text-muted);
    }

    html[data-theme="light"] .confirm-item--inactive .confirm-item__icon {
        background: rgba(15, 23, 42, 0.06);
    }

    .confirm-item__label {
        font-size: 0.85rem;
        color: var(--text-primary);
    }

    .discipline-bar {
        display: flex;
        align-items: center;
        gap: 0.75rem;
    }

    .discipline-bar__track {
        flex: 1;
        max-width: 140px;
        height: 7px;
        background: rgba(255, 255, 255, 0.08);
        border-radius: 4px;
        overflow: hidden;
    }

    html[data-theme="light"] .discipline-bar__track {
        background: rgba(15, 23, 42, 0.08);
    }

    .discipline-bar__fill {
        height: 100%;
        border-radius: 4px;
        background: linear-gradient(
            90deg,
            var(--accent),
            var(--accent-light)
        );
    }

    .discipline-bar__value {
        font-family: var(--font-mono);
        font-size: 0.9rem;
        font-weight: 600;
    }

    .meta-footer {
        margin-top: 1.5rem;
        padding-top: 1rem;
        border-top: 1px solid var(--border);
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem;
        font-size: 0.78rem;
        color: var(--text-muted);
    }

    .footer {
        margin-top: 2rem;
        text-align: center;
        font-size: 0.75rem;
        color: var(--text-muted);
        letter-spacing: 0.04em;
    }

    @media (max-width: 768px) {
        .detail-grid,
        .detail-grid--3,
        .summary__kpis {
            grid-template-columns: 1fr 1fr;
        }

        .header {
            flex-direction: column;
            align-items: stretch;
        }

        .header__actions {
            width: 100%;
        }

        .header__actions .btn {
            flex: 1;
        }
    }

    @media (max-width: 640px) {
        .page {
            padding: 1.25rem 1rem 2rem;
        }

        .detail-grid,
        .detail-grid--3,
        .summary__kpis {
            grid-template-columns: 1fr;
        }

        .header__actions {
            flex-direction: column;
        }

        .header__actions .btn {
            width: 100%;
        }
    }
@endsection

@section('content')

@php
    $direction = strtolower(trim($trade->direction ?? ''));

    $isLong = in_array($direction, ['long', 'buy', 'achat']);
    $isShort = in_array($direction, ['short', 'sell', 'vente']);

    $grade = strtoupper(trim($trade->setup_grade ?? ''));

    $gradeClass = match (true) {
        str_starts_with($grade, 'A') => 'badge--grade-a',
        str_starts_with($grade, 'B') => 'badge--grade-b',
        str_starts_with($grade, 'C') => 'badge--grade-c',
        str_starts_with($grade, 'D'),
        str_starts_with($grade, 'F') => 'badge--grade-d',
        default => 'badge--neutral',
    };

    $rr = $trade->rr_realized;

    $rrClass = $rr === null
        ? 'kpi__value--muted'
        : (
            $rr > 0
                ? 'kpi__value--positive'
                : (
                    $rr < 0
                        ? 'kpi__value--negative'
                        : 'kpi__value--muted'
                )
        );

    $discipline = $trade->discipline_score;

    $disciplinePct = $discipline !== null
        ? min(100, max(0, ($discipline / 10) * 100))
        : 0;

    $riskRecommended = $trade->risk_level ?? $trade->risk_percent;
    $riskUsed = $trade->risk_used_percent;
    $cyclePerformance = $trade->cycle_performance;
    $riskRuleRespected = $trade->risk_rule_respected;
    $riskTargetUnlocked = (bool) $trade->risk_target_unlocked;

    $riskLevelLabel = match (true) {
        $riskRecommended === null => '—',
        (float) $riskRecommended <= 0.25 => 'Protection maximale',
        (float) $riskRecommended <= 0.50 => 'Risque réduit',
        default => 'Risque standard',
    };

    $riskLevelBadge = match (true) {
        $riskRecommended === null => 'badge--neutral',
        (float) $riskRecommended <= 0.25 => 'badge--warning',
        (float) $riskRecommended <= 0.50 => 'badge--accent',
        default => 'badge--success',
    };

    /*
    |--------------------------------------------------------------------------
    | Add-in
    |--------------------------------------------------------------------------
    |
    | Un add-in ne peut être ajouté que sur une idée réelle principale
    | encore ouverte.
    |
    */
    $isRealMainTrade =
        ($trade->trade_mode ?? 'real') === 'real'
        && ($trade->position_type ?? 'main') === 'main';

    $isIdeaOpen =
        $trade->result === null
        && $trade->rr_realized === null;

    $canAddin =
        $isRealMainTrade
        && $isIdeaOpen;

    $confirmations = [
        ['field' => 'htf_bias', 'label' => 'HTF Bias'],
        ['field' => 'liquidity_taken', 'label' => 'Liquidité prise'],
        ['field' => 'displacement', 'label' => 'Displacement'],
        ['field' => 'mss', 'label' => 'MSS'],
        ['field' => 'fvg15', 'label' => 'FVG 15m'],
        ['field' => 'breaker', 'label' => 'Breaker'],
        ['field' => 'bisi30', 'label' => 'BISI 30m'],
        ['field' => 'news', 'label' => 'News'],
    ];
@endphp

<div class="page">

    <header class="header">

        <div class="header__brand">
            <span class="header__eyebrow">
                ICT Performance Lab by Jul
            </span>

            <h1 class="header__title">
                Fiche trade
            </h1>

            <p class="header__subtitle">
                Analyse complète du setup ICT
            </p>
        </div>

        <div class="header__actions">

            <a
                href="{{ route('trades.index') }}"
                class="btn btn--ghost"
            >
                ← Retour au journal
            </a>

            @if ($isRealMainTrade)
                @if ($canAddin)
                    <a
                        href="{{ route('trades.create', [
                            'position_type' => 'addin',
                            'parent_trade_id' => $trade->id,
                        ]) }}"
                        class="btn btn--addin"
                    >
                        <span class="btn__icon">＋</span>
                        Ajouter un Add-in
                    </a>
                @else
                    <span
                        class="btn btn--disabled"
                        title="Impossible d'ajouter un add-in : cette idée est déjà clôturée."
                    >
                        <span class="btn__icon">＋</span>
                        Add-in indisponible · idée clôturée
                    </span>
                @endif
            @endif

            <a
                href="{{ route('trades.edit', $trade) }}"
                class="btn btn--edit"
            >
                <span class="btn__icon">✎</span>
                Modifier le trade
            </a>

        </div>

    </header>

    <div class="summary">

        <div class="summary__top">

            <div>

                <div class="summary__asset">
                    {{ $trade->asset }}
                </div>

                <div class="summary__meta">

                    @if ($isLong)

                        <span class="badge badge--long">
                            Long
                        </span>

                    @elseif ($isShort)

                        <span class="badge badge--short">
                            Short
                        </span>

                    @else

                        <span class="badge badge--neutral">
                            {{ $trade->direction ?? '—' }}
                        </span>

                    @endif

                    @if ($trade->setup_grade)

                        <span class="badge {{ $gradeClass }}">
                            {{ $trade->setup_grade }}
                        </span>

                    @endif

                    @if ($trade->result)

                        <span class="badge badge--neutral">
                            {{ $trade->result }}
                        </span>

                    @endif

                </div>

            </div>

            <div class="summary__date">
                {{ $trade->trade_date?->format('d/m/Y') ?? '—' }}

                @if ($trade->entry_time)
                    — {{ \Illuminate\Support\Str::of($trade->entry_time)->substr(0, 5) }}
                @endif
            </div>

        </div>

        <div class="summary__kpis">

            <div class="kpi">
                <div class="kpi__label">Risque recommandé</div>

                <div class="kpi__value">
                    {{ $riskRecommended !== null
                        ? number_format((float) $riskRecommended, 2, ',', ' ') . '%'
                        : '—'
                    }}
                </div>
            </div>

            <div class="kpi">
                <div class="kpi__label">RR réalisé</div>

                <div class="kpi__value {{ $rrClass }}">
                    @if ($rr !== null)
                        {{ $rr > 0 ? '+' : '' }}{{ number_format($rr, 2) }}R
                    @else
                        —
                    @endif
                </div>
            </div>

            <div class="kpi">
                <div class="kpi__label">RR planifié</div>

                <div class="kpi__value">
                    {{ $trade->rr_planned !== null
                        ? number_format($trade->rr_planned, 2) . 'R'
                        : '—'
                    }}
                </div>
            </div>

            <div class="kpi">
                <div class="kpi__label">Discipline</div>

                <div class="kpi__value">
                    {{ $discipline !== null
                        ? $discipline . '/10'
                        : '—'
                    }}
                </div>
            </div>

        </div>

    </div>

    <div class="detail-card">

        <section class="detail-section">
            <div class="detail-section__header">
                <h2 class="detail-section__title">Identification</h2>
            </div>

            <div class="detail-section__body">
                <div class="detail-grid">

                    <div class="detail-field">
                        <span class="detail-field__label">Date</span>
                        <span class="detail-field__value">
                            {{ $trade->trade_date?->format('d/m/Y') ?? '—' }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Heure d'entrée</span>
                        <span class="detail-field__value detail-field__value--mono">
                            @if ($trade->entry_time)
                                {{ \Illuminate\Support\Str::of($trade->entry_time)->substr(0, 5) }}
                            @else
                                —
                            @endif
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Actif</span>
                        <span class="detail-field__value detail-field__value--mono">
                            {{ $trade->asset }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Direction</span>
                        <span class="detail-field__value">
                            @if ($isLong)
                                <span class="badge badge--long">Long</span>
                            @elseif ($isShort)
                                <span class="badge badge--short">Short</span>
                            @else
                                {{ $trade->direction ?? '—' }}
                            @endif
                        </span>
                    </div>

                </div>
            </div>
        </section>

        <section class="detail-section">
            <div class="detail-section__header">
                <h2 class="detail-section__title">Contexte ICT</h2>
            </div>

            <div class="detail-section__body">
                <div class="detail-grid detail-grid--3">

                    <div class="detail-field">
                        <span class="detail-field__label">Session</span>
                        <span class="detail-field__value">
                            {{ $trade->session ?? '—' }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Jour</span>
                        <span class="detail-field__value">
                            {{ $trade->day ?? '—' }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Zone HTF</span>
                        <span class="detail-field__value">
                            {{ $trade->htf_zone ?? '—' }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Type de liquidité</span>
                        <span class="detail-field__value">
                            {{ $trade->liquidity_type ?? '—' }}
                        </span>
                    </div>

                </div>
            </div>
        </section>

        <section class="detail-section">
            <div class="detail-section__header">
                <h2 class="detail-section__title">Confirmations</h2>
            </div>

            <div class="detail-section__body">

                <div class="confirm-grid">

                    @foreach ($confirmations as $confirmation)

                        @php
                            $active = (bool) $trade->{$confirmation['field']};
                        @endphp

                        <div
                            class="
                                confirm-item
                                {{ $active
                                    ? 'confirm-item--active'
                                    : 'confirm-item--inactive'
                                }}
                            "
                        >

                            <span class="confirm-item__icon">
                                {{ $active ? '✓' : '—' }}
                            </span>

                            <span class="confirm-item__label">
                                {{ $confirmation['label'] }}
                            </span>

                        </div>

                    @endforeach

                </div>

                <div class="detail-grid" style="margin-top: 1.25rem;">
                    <div class="detail-field">
                        <span class="detail-field__label">Type de news</span>
                        <span class="detail-field__value">
                            {{ $trade->news_type ?? '—' }}
                        </span>
                    </div>
                </div>

            </div>
        </section>

        <section class="detail-section">
            <div class="detail-section__header">
                <h2 class="detail-section__title">Risk Manager & résultat</h2>
            </div>

            <div class="detail-section__body">

                <div class="detail-grid detail-grid--3">

                    <div class="detail-field">
                        <span class="detail-field__label">Risque recommandé</span>
                        <span class="detail-field__value detail-field__value--mono">
                            {{ $riskRecommended !== null
                                ? number_format((float) $riskRecommended, 2, ',', ' ') . '%'
                                : '—'
                            }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Risque utilisé</span>
                        <span class="detail-field__value detail-field__value--mono">
                            {{ $riskUsed !== null
                                ? number_format((float) $riskUsed, 2, ',', ' ') . '%'
                                : '—'
                            }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Niveau Risk Manager</span>
                        <span class="detail-field__value">
                            <span class="badge {{ $riskLevelBadge }}">
                                {{ $riskLevelLabel }}
                            </span>
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Performance du cycle à l'entrée</span>
                        <span class="detail-field__value detail-field__value--mono">
                            @if ($cyclePerformance !== null)
                                {{ (float) $cyclePerformance > 0 ? '+' : '' }}{{ number_format((float) $cyclePerformance, 2, ',', ' ') }}%
                            @else
                                —
                            @endif
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Règle de risque</span>
                        <span class="detail-field__value">
                            @if ($riskRuleRespected === null)
                                <span class="badge badge--neutral">Non évaluée</span>
                            @elseif ($riskRuleRespected)
                                <span class="badge badge--success">Respectée</span>
                            @else
                                <span class="badge badge--danger">Dépassement</span>
                            @endif
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Objectif du cycle</span>
                        <span class="detail-field__value">
                            @if ($riskTargetUnlocked)
                                <span class="badge badge--success">
                                    Atteint — risque standard maintenu
                                </span>
                            @else
                                <span class="badge badge--neutral">
                                    Non atteint
                                </span>
                            @endif
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Résultat</span>
                        <span class="detail-field__value">
                            {{ $trade->result ?? '—' }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">RR planifié</span>
                        <span class="detail-field__value detail-field__value--mono">
                            {{ $trade->rr_planned !== null
                                ? number_format($trade->rr_planned, 2, ',', ' ') . 'R'
                                : '—'
                            }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">RR réalisé</span>

                        <span class="detail-field__value detail-field__value--mono {{ $rrClass }}">
                            @if ($rr !== null)
                                {{ $rr > 0 ? '+' : '' }}{{ number_format($rr, 2, ',', ' ') }}R
                            @else
                                —
                            @endif
                        </span>
                    </div>

                </div>

            </div>
        </section>

        </section>

        <section class="detail-section">
            <div class="detail-section__header">
                <h2 class="detail-section__title">Discipline</h2>
            </div>

            <div class="detail-section__body">

                <div class="confirm-grid" style="margin-bottom: 1.25rem;">

                    <div
                        class="
                            confirm-item
                            {{ $trade->anticipated
                                ? 'confirm-item--inactive'
                                : 'confirm-item--active'
                            }}
                        "
                    >
                        <span class="confirm-item__icon">
                            {{ $trade->anticipated ? '!' : '✓' }}
                        </span>

                        <span class="confirm-item__label">
                            Pas d'anticipation
                        </span>
                    </div>

                    <div
                        class="
                            confirm-item
                            {{ $trade->one_trade_rule_respected
                                ? 'confirm-item--active'
                                : 'confirm-item--inactive'
                            }}
                        "
                    >
                        <span class="confirm-item__icon">
                            {{ $trade->one_trade_rule_respected ? '✓' : '—' }}
                        </span>

                        <span class="confirm-item__label">
                            1 trade / jour
                        </span>
                    </div>

                </div>

                <div class="detail-grid">

                    <div class="detail-field">
                        <span class="detail-field__label">Score discipline</span>

                        @if ($discipline !== null)

                            <div class="discipline-bar">

                                <div class="discipline-bar__track">
                                    <div
                                        class="discipline-bar__fill"
                                        style="width: {{ $disciplinePct }}%"
                                    ></div>
                                </div>

                                <span class="discipline-bar__value">
                                    {{ $discipline }}/10
                                </span>

                            </div>

                        @else
                            <span class="detail-field__value">—</span>
                        @endif
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Setup Grade</span>

                        <span class="detail-field__value">
                            @if ($trade->setup_grade)
                                <span class="badge {{ $gradeClass }}">
                                    {{ $trade->setup_grade }}
                                </span>
                            @else
                                —
                            @endif
                        </span>
                    </div>

                </div>

            </div>
        </section>

        <section class="detail-section">
            <div class="detail-section__header">
                <h2 class="detail-section__title">Psychologie / analyse</h2>
            </div>

            <div class="detail-section__body">

                <div class="detail-grid detail-grid--1">

                    <div class="detail-field">
                        <span class="detail-field__label">Émotion avant le trade</span>
                        <span class="detail-field__value">
                            {{ $trade->emotion_before ?? '—' }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Notes</span>

                        <div class="detail-field__value detail-field__value--text {{ blank($trade->notes) ? 'is-empty' : '' }}">
                            {{ $trade->notes }}
                        </div>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Ce qui a bien fonctionné</span>

                        <div class="detail-field__value detail-field__value--text {{ blank($trade->what_went_well) ? 'is-empty' : '' }}">
                            {{ $trade->what_went_well }}
                        </div>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">À améliorer</span>

                        <div class="detail-field__value detail-field__value--text {{ blank($trade->to_improve) ? 'is-empty' : '' }}">
                            {{ $trade->to_improve }}
                        </div>
                    </div>

                </div>

            </div>
        </section>

        <section class="detail-section">
            <div class="detail-section__header">
                <h2 class="detail-section__title">MT5 / FTMO</h2>
            </div>

            <div class="detail-section__body">

                <div class="detail-grid">

                    <div class="detail-field">
                        <span class="detail-field__label">Ticket MT5</span>
                        <span class="detail-field__value detail-field__value--mono">
                            {{ $trade->mt5_ticket ?? '—' }}
                        </span>
                    </div>

                    <div class="detail-field">
                        <span class="detail-field__label">Compte MT5</span>
                        <span class="detail-field__value detail-field__value--mono">
                            {{ $trade->mt5_account ?? '—' }}
                        </span>
                    </div>

                </div>

                <div class="meta-footer">
                    <span>
                        Créé le
                        {{ $trade->created_at?->format('d/m/Y à H:i') ?? '—' }}
                    </span>

                    <span>
                        Modifié le
                        {{ $trade->updated_at?->format('d/m/Y à H:i') ?? '—' }}
                    </span>

                    <span>
                        Trade #{{ $trade->id }}
                    </span>
                </div>

            </div>
        </section>

    </div>

    <footer class="footer">
        ICT Performance Lab by Jul —
        {{ now()->format('Y') }}
    </footer>

</div>

@endsection