@extends('layouts.app')

@section('content')
<div class="row">
    <div class="col-md-12 grid-margin">
        <div class="row">
            <div class="col-12 col-xl-8 mb-4 mb-xl-0">
                <h3 class="font-weight-bold">Add New Result</h3>
                <h6 class="font-weight-normal mb-0">Enter student academic performance data</h6>
            </div>
            <div class="col-12 col-xl-4">
                <div class="justify-content-end d-flex">
                    <a href="{{ route('results.index') }}" class="btn btn-secondary btn-sm">
                        <i class="ti-arrow-left"></i> Back to Results
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12 grid-margin stretch-card">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title">Student Result Form</h4>
                <p class="card-description">
                    Fill in all required fields. GPA and CGPA will be calculated automatically.
                </p>
                
                <form action="{{ route('results.store') }}" method="POST" class="forms-sample">
                    @csrf
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="rollno">Roll Number <span class="text-danger">*</span></label>
                                <input type="text" name="rollno" value="{{ old('rollno') }}" class="form-control" placeholder="Enter roll number" required>
                                @error('rollno')
                                    <small class="text-danger">{{ $message }}</small>
                                @enderror
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="name">Student Name <span class="text-danger">*</span></label>
                                <input type="text" name="name" value="{{ old('name') }}" class="form-control" placeholder="Enter student name" required>
                                @error('name')
                                    <small class="text-danger">{{ $message }}</small>
                                @enderror
                            </div>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="course">Course <span class="text-danger">*</span></label>
                                <input type="text" name="course" value="{{ old('course') }}" class="form-control" placeholder="e.g., Computer Science, Mathematics" required>
                                <small class="form-text text-muted">Enter the course/program name</small>
                                @error('course')
                                    <small class="text-danger">{{ $message }}</small>
                                @enderror
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="subject">Subject <span class="text-danger">*</span></label>
                                <input type="text" name="subject" value="{{ old('subject') }}" class="form-control" placeholder="Enter subject name" required>
                                @error('subject')
                                    <small class="text-danger">{{ $message }}</small>
                                @enderror
                            </div>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="credit_hours">Credit Hours (CH) <span class="text-danger">*</span></label>
                                <input type="number" name="credit_hours" value="{{ old('credit_hours') }}" class="form-control" min="1" max="10" placeholder="1-10" required>
                                <small class="form-text text-muted">Usually between 1-6 credit hours</small>
                                @error('credit_hours')
                                    <small class="text-danger">{{ $message }}</small>
                                @enderror
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="mark">Mark (0-100) <span class="text-danger">*</span></label>
                                <input type="number" name="mark" value="{{ old('mark') }}" class="form-control" min="0" max="100" placeholder="Enter marks" required>
                                <small class="form-text text-muted">GPA will be calculated automatically</small>
                                @error('mark')
                                    <small class="text-danger">{{ $message }}</small>
                                @enderror
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label for="grade">Grade (Optional)</label>
                                <input type="text" name="grade" value="{{ old('grade') }}" class="form-control" placeholder="Auto-calculated if empty">
                                <small class="form-text text-muted">Leave empty for auto-calculation</small>
                                @error('grade')
                                    <small class="text-danger">{{ $message }}</small>
                                @enderror
                            </div>
                        </div>
                    </div>
                    
                    <div class="alert alert-info mt-4">
                        <h5 class="alert-heading"><i class="ti-info"></i> Auto-Calculation Info</h5>
                        <p class="mb-2"><strong>GPA Scale (4.0):</strong></p>
                        <div class="row">
                            <div class="col-md-6">
                                <ul class="list-unstyled">
                                    <li><span class="badge badge-success">90-100: A+ (4.0)</span></li>
                                    <li><span class="badge badge-success">80-89: A (3.7)</span></li>
                                    <li><span class="badge badge-warning">70-79: B+ (3.3)</span></li>
                                </ul>
                            </div>
                            <div class="col-md-6">
                                <ul class="list-unstyled">
                                    <li><span class="badge badge-warning">60-69: B (3.0)</span></li>
                                    <li><span class="badge badge-secondary">50-59: C+ (2.7)</span></li>
                                    <li><span class="badge badge-danger">Below 40: F (0.0)</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    
                    <div class="form-group mt-4">
                        <button type="submit" class="btn btn-primary mr-2">
                            <i class="ti-save"></i> Save Result
                        </button>
                        <a href="{{ route('results.index') }}" class="btn btn-light">
                            <i class="ti-arrow-left"></i> Cancel
                        </a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection