@extends('admin.admin_dashboard')

@section('customcss')
    <style>
        /* ===============================
           Screen View Base
        =================================*/
        body,
        .content-body {
            background: #fff !important;
            color: #000 !important;
            font-family: "Times New Roman", serif;
        }

        /* ===============================
           Marksheet Container
        =================================*/
        .marksheet-container {
            padding: 20px 25px;
            background: #fff;
            border: 2px solid #000;
            margin: 0 auto;
            width: 100%;
            max-width: 1000px;
            box-sizing: border-box;
        }

        /* ===============================
           Header Section
        =================================*/
        .header-flex {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 15px;
        }

        .school-header {
            flex: 1;
            text-align: center;
        }

        .school-header img {
            height: 70px;
            margin-bottom: 8px;
        }

        .school-header h3 {
            font-weight: 700;
            margin-bottom: 2px;
            text-transform: uppercase;
        }

        .school-header p {
            margin: 0;
            font-size: 13px;
        }

        .exam-title {
            font-size: 18px;
            font-weight: 600;
            margin: 10px 0;
            text-decoration: underline;
        }

        /* ===============================
           Grading Table
        =================================*/
        .grading-box {
            flex-shrink: 0;
            border: 1px solid #000;
            font-size: 12px;
            border-collapse: collapse;
            margin-top: 5px;
        }

        .grading-box th,
        .grading-box td {
            border: 1px solid #000;
            padding: 4px 6px;
        }

        /* ===============================
           Marks Table
        =================================*/
        .marks-table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 18px;
            font-size: 13px;
        }

        .marks-table th,
        .marks-table td {
            border: 1px solid #000;
            padding: 5px;
            text-align: center;
        }

        .marks-table th {
            background: #f2f2f2;
        }

        /* ===============================
           ✅ Professional Footer
        =================================*/
        .result-footer {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            gap: 18px;
            margin-top: 40px;
            padding-top: 10px;
            font-size: 13px;
        }

        .footer-left {
            width: 55%;
        }

        .footer-right {
            width: 45%;
            text-align: right;
        }

        /* each row */
        .footer-row {
            display: flex;
            align-items: center;
            gap: 8px;
            margin: 8px 0;
        }

        /* label fixed width so lines align perfectly */
        .footer-label {
            min-width: 95px;
            font-weight: 700;
        }

        /* dotted writing line */
        .footer-line {
            flex: 1;
            border-bottom: 1px dotted #000;
            height: 14px;
        }

        /* signature block */
        .signature-wrap {
            display: inline-block;
            text-align: center;
        }

        .signature-line {
            width: 220px;
            border-bottom: 1px solid #000;
            height: 42px;
            /* ✅ handwritten space */
            margin-left: auto;
            /* ✅ keep on right */
        }

        .signature-text {
            margin-top: 6px;
            font-weight: 700;
        }

        /* ===============================
           PRINT SETTINGS (Fix Top Gap)
        =================================*/
        @media print {

            @page {
                size: A4 portrait;
                margin: 5px;
                margin: 5mm;
                /* fallback */
            }

            html,
            body {
                margin: 0 !important;
                padding: 0 !important;
                height: auto !important;
            }

            /* Hide Admin Dashboard layout items */
            .nav-header,
            .header,
            .footer,
            .sidebar,
            .deznav,
            .dlabnav,
            .sidebar-right,
            .page-titles,
            .navbar,
            .no-print {
                display: none !important;
            }

            /* Remove Theme/Bootstrap wrapper spacing */
            #main-wrapper,
            .content-body,
            .container-fluid,
            .default-height {
                margin: 0 !important;
                padding: 0 !important;
                min-height: auto !important;
                height: auto !important;
            }

            .marksheet-container {
                display: block !important;
                width: 100% !important;
                max-width: none !important;

                margin: 0 !important;
                padding: 12px !important;

                border: 2px solid #000 !important;
                background: #fff !important;
                box-shadow: none !important;

                position: relative !important;
                top: 0 !important;
                left: 0 !important;
            }

            .marks-table {
                width: 100% !important;
                border-collapse: collapse !important;
                page-break-inside: auto;
            }

            .marks-table thead {
                display: table-header-group;
            }

            .marks-table tr {
                page-break-inside: avoid;
            }

            .school-header,
            .grading-box,
            img,
            .result-footer {
                page-break-inside: avoid;
            }
        }
    </style>
@endsection

@section('admin')
    <div class="content-body default-height">
        <div class="container-fluid">
            <div class="marksheet-container">

                {{-- Header --}}
                <div class="header-flex">

                    {{-- Left: School Header --}}
                    <div class="school-header">
                        @if($school && $school->school_logo)
                            <img src="{{ asset('core/storage/app/public/' . $school->school_logo) }}" alt="School Logo">
                        @endif

                        <h3>{{ strtoupper($school->school_name ?? '') }}</h3>
                        <p>{{ $school->address ?? '' }}</p>
                        <p>
                            <strong>Phone:</strong> {{ $school->phone ?? '' }} |
                            <strong>Email:</strong> {{ $school->email ?? '' }}
                        </p>

                        <h4 class="exam-title">{{ $exam->exam_name }}</h4>

                        <p>
                            <strong>Class:</strong> {{ $class->name }}
                            || <strong>Section:</strong> {{ $section->name }}
                            @if(request()->get('group'))
                                @php
                                    $groupName = \App\Models\Group::find(request()->get('group'))->name ?? '';
                                @endphp
                                || <strong>Group:</strong> {{ $groupName }}
                            @endif
                            || <strong>Subject:</strong> {{ $subject->name }}
                        </p>
                    </div>

                    {{-- Right: Grade Scale Table --}}
                    <table class="grading-box" style="width:180px;">
                        <thead>
                            <tr>
                                <th>Interval</th>
                                <th>Grade</th>
                                <th>Point</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($gradeScales as $scale)
                                @php
                                    $minMark = ($subjectFullMark * (float) $scale->min_mark) / 100;
                                    $maxMark = ($subjectFullMark * (float) $scale->max_mark) / 100;

                                    if ((float) $scale->max_mark >= 100) {
                                        $displayMax = $subjectFullMark;
                                    } else {
                                        // epsilon fixes 79.989999 -> 79.99
                                        $displayMax = floor(($maxMark + 0.00001) * 100) / 100;
                                    }

                                    $displayMin = round($minMark, 2);
                                @endphp

                                <tr>
                                    <td>
                                        {{ number_format($displayMin, 2) }}
                                        -
                                        {{ number_format($displayMax, 2) }}
                                    </td>
                                    <td>{{ $scale->grade }}</td>
                                    <td>{{ number_format($scale->grade_point, 2) }}</td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>

                </div>

                {{-- Marks Table --}}
                <table class="marks-table">
                    <thead>
                        <tr>
                            <th>SL</th>
                            <th>Student Name</th>
                            <th>Roll</th>
                            <th>Full Mark</th>
                            @foreach($components as $c)
                                <th>{{ $c->component_name }}</th>
                            @endforeach
                            <th>Obtained</th>
                            <th>GPA Point</th>
                            <th>Grade</th>
                            <th>Position</th>
                            <th>Created By</th>
                            <th>Updated By</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($students as $key => $s)
                            <tr>
                                <td>{{ $key + 1 }}</td>
                                <td style="text-align:left;">{{ $s->student_name }}</td>
                                <td>{{ $s->class_roll }}</td>
                                <td>{{ number_format($components->sum('full_mark')) }}</td>

                                {{-- Components --}}
                                @foreach($components as $c)
                                    @php
                                        $mark = $s->marks[$c->id] ?? '';
                                        $style = $mark === 'AB' ? 'color:red;font-weight:bold;' : '';
                                    @endphp
                                    <td style="{{ $style }}">{{ $mark }}</td>
                                @endforeach

                                <td>{{ $s->total ?? '-' }}</td>
                                <td>{{ $s->grade_point }}</td>
                                <td>{{ $s->grade_letter }}</td>
                                <td>{{ $s->position ?? '-' }}</td>
                                <td>{{ $s->marks['created_by'] ?? '-' }}</td>
                                <td>{{ $s->marks['updated_by'] ?? '-' }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>

                {{-- ✅ Professional Footer --}}
                <div class="result-footer">
                    <div class="footer-left">
                        <div class="footer-row">
                            <div class="footer-label">Teacher Name:</div>
                            <div class="footer-line"></div>
                        </div>
                        <div class="footer-row">
                            <div class="footer-label">Phone:</div>
                            <div class="footer-line"></div>
                        </div>
                    </div>

                    <div class="footer-right">
                        <div class="signature-wrap">
                            <div class="signature-line"></div>
                            <div class="signature-text">Signature</div>
                        </div>
                    </div>
                </div>

                {{-- Print Button --}}
                <div class="text-center mt-4 no-print">
                    <button onclick="window.print()" class="btn btn-primary">
                        <i class="fa fa-print me-1"></i> Print
                    </button>
                </div>

            </div>
        </div>
    </div>
@endsection