@extends('admin.layouts.main')
@section('title', 'Notification System Documentation')
@section('menu', 'Documentation')

@section('content')
<div class="portlet light">
    <div class="portlet-title">
        <div class="caption"><span class="caption-subject theme-font bold uppercase">Notification System</span></div>
        <div class="actions">
            <a href="{{ route('admin.docs.notifications.pdf') }}" class="btn btn-sm btn-danger"><i class="fa fa-file-pdf-o"></i> Download PDF</a>
            <a href="{{ route('admin.docs.index') }}" class="btn btn-sm btn-default"><i class="fa fa-arrow-left"></i> Back</a>
        </div>
    </div>
    <div class="portlet-body">
        @include('admin.documentation.partials.notifications')
    </div>
</div>
@endsection

@push('styles')
<style>
    .section { margin-bottom: 25px; }
    .section h2 { font-size: 18px; color: #3598dc; border-bottom: 1px solid #eee; padding-bottom: 8px; margin-bottom: 12px; }
    .section h3 { font-size: 15px; color: #555; margin: 12px 0 8px; }
    .note { background: #f0f7ff; border-left: 3px solid #3598dc; padding: 10px 15px; margin: 10px 0; }
    .header, .footer { display: none; }
    code { background: #f4f4f4; padding: 2px 6px; border-radius: 3px; font-size: 12px; }
</style>
@endpush