@extends('layouts.staff')

@section('title', '🔑 Authority Detail › Koha Staff Client')

@section('breadcrumb-trail')
    <span class="sep">›</span>
    <a href="{{ route('staff.authorities') }}">Authorities</a>
    <span class="sep">›</span>
    <span>Detail</span>
@endsection

@section('content')
<div style="width: 100%; display: flex; flex-direction: column;">
    <div style="background: #fff; border: 1px solid #d0d0d0; padding: 20px; border-radius: 3px;">
        <div style="border-bottom: 2px solid #1b4880; padding-bottom: 8px; margin-bottom: 15px; display: flex; justify-content: space-between; align-items: center;">
            <h2 style="margin:0; font-size:18px; color:#1b4880;">
                🔑 Authority Record: {{ $authority->heading }}
            </h2>
            <span style="background: #ebebeb; padding: 4px 8px; border-radius: 3px; font-size:11px; font-weight:bold; color:#666;">
                {{ $authority->authtype }}
            </span>
        </div>

        <p style="font-size:13px; color:#555; line-height: 1.5; margin-bottom: 20px;">
            <strong>Scope Note / Summary:</strong> {{ $authority->summary }}
        </p>

        <h3 style="color:#1b4880; font-size:14px; margin-bottom:10px; border-bottom:1px solid #ddd; padding-bottom:3px;">
            MARC 21 Authority Format View
        </h3>
        <table class="items-table" style="max-width: 600px;">
            <thead>
                <tr style="background:#e8eef5;">
                    <th style="width: 80px;">Tag</th>
                    <th>Subfields and Data Content</th>
                </tr>
            </thead>
            <tbody>
                @foreach($authority->marc as $field)
                    <tr>
                        <td style="font-family: monospace; font-weight: bold; font-size: 13px; text-align: center;">{{ $field['tag'] }}</td>
                        <td style="font-family: monospace; font-size: 13px;">{{ $field['subfields'] }}</td>
                    </tr>
                @endforeach
            </tbody>
        </table>

        <div style="margin-top:20px; padding-top:15px; border-top:1px solid #eee;">
            <a href="{{ route('staff.authorities') }}" class="form-btn" style="text-decoration:none;">Back to list</a>
        </div>
    </div>
</div>
@endsection