@extends('layouts.app')

@section('title', 'School Settings')

@section('page-title', 'School Settings')

@section('content')

Manage your school's general information, branding, timezone and attendance notification preferences.


<form
    action="{{ route('school-settings.update') }}"
    method="POST"
    enctype="multipart/form-data"
    id="school-settings-form"
>
    @csrf
    @method('PUT')

    {{-- General Information --}}
    <div class="card overflow-hidden">

        {{-- Header --}}
        <div class="border-b border-border px-5 py-4">
            <h2 class="text-base font-semibold text-text">
                School Information
            </h2>

            <p class="mt-1 text-xs text-muted">
                Manage the basic information and contact details of your school.
            </p>
        </div>

        {{-- Form --}}
        <div class="p-5 lg:p-6">

            <div class="grid grid-cols-1 gap-5 md:grid-cols-2">

                {{-- School Name --}}
                <div>

                    <label
                        for="school_name"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        School Name
                        <span class="text-danger">*</span>
                    </label>

                    <input
                        type="text"
                        id="school_name"
                        name="school_name"
                        value="{{ old('school_name', $schoolSetting?->school_name) }}"
                        placeholder="Enter school name"
                        autocomplete="off"
                        class="form-input w-full @error('school_name') border-danger @enderror"
                        required
                        autofocus
                    >

                    @error('school_name')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- School Code --}}
                <div>

                    <label
                        for="school_code"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        School Code
                        <span class="text-danger">*</span>
                    </label>

                    <input
                        type="text"
                        id="school_code"
                        name="school_code"
                        value="{{ old('school_code', $schoolSetting?->school_code) }}"
                        placeholder="e.g. SAMS001"
                        autocomplete="off"
                        class="form-input w-full @error('school_code') border-danger @enderror"
                        required
                    >

                    @error('school_code')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- Email --}}
                <div>

                    <label
                        for="email"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        Email Address
                    </label>

                    <input
                        type="email"
                        id="email"
                        name="email"
                        value="{{ old('email', $schoolSetting?->email) }}"
                        placeholder="school@example.com"
                        autocomplete="email"
                        class="form-input w-full @error('email') border-danger @enderror"
                    >

                    @error('email')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- Phone --}}
                <div>

                    <label
                        for="phone"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        Phone Number
                        <span class="text-danger">*</span>
                    </label>

                    <input
                        type="text"
                        id="phone"
                        name="phone"
                        value="{{ old('phone', $schoolSetting?->phone) }}"
                        placeholder="Enter school phone number"
                        autocomplete="tel"
                        class="form-input w-full @error('phone') border-danger @enderror"
                        required
                    >

                    @error('phone')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- Website --}}
                <div class="md:col-span-2">

                    <label
                        for="website"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        Website
                    </label>

                    <input
                        type="url"
                        id="website"
                        name="website"
                        value="{{ old('website', $schoolSetting?->website) }}"
                        placeholder="https://www.example.com"
                        autocomplete="url"
                        class="form-input w-full @error('website') border-danger @enderror"
                    >

                    @error('website')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- Address --}}
                <div class="md:col-span-2">

                    <label
                        for="address"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        School Address
                        <span class="text-danger">*</span>
                    </label>

                    <textarea
                        id="address"
                        name="address"
                        rows="4"
                        placeholder="Enter complete school address"
                        class="form-input w-full resize-none @error('address') border-danger @enderror"
                        required
                    >{{ old('address', $schoolSetting?->address) }}</textarea>

                    @error('address')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>

            </div>

        </div>

    </div>


    {{-- Branding --}}
    <div class="card mt-5 overflow-hidden">

        <div class="border-b border-border px-5 py-4">
            <h2 class="text-base font-semibold text-text">
                Branding
            </h2>

            <p class="mt-1 text-xs text-muted">
                Configure the school logo and browser favicon.
            </p>
        </div>

        <div class="p-5 lg:p-6">

            <div class="grid grid-cols-1 gap-5 md:grid-cols-2">

                {{-- Logo --}}
                <div>

                    <label
                        for="logo"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        School Logo
                    </label>

                    @if($schoolSetting?->logo)
                        <div class="mb-3 flex h-20 w-20 items-center justify-center overflow-hidden rounded-lg border border-border bg-background">

                            <img
                                src="{{ asset('storage/' . $schoolSetting->logo) }}"
                                alt="{{ $schoolSetting->school_name }} Logo"
                                class="h-full w-full object-contain p-2"
                            >

                        </div>
                    @endif

                    <input
                        type="file"
                        id="logo"
                        name="logo"
                        accept=".jpg,.jpeg,.png,.svg,.webp"
                        class="form-input w-full @error('logo') border-danger @enderror"
                    >

                    <p class="mt-1.5 text-xs text-muted">
                        JPG, JPEG, PNG, SVG or WEBP. Maximum size 2 MB.
                    </p>

                    @error('logo')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- Favicon --}}
                <div>

                    <label
                        for="favicon"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        Favicon
                    </label>

                    @if($schoolSetting?->favicon)
                        <div class="mb-3 flex h-20 w-20 items-center justify-center overflow-hidden rounded-lg border border-border bg-background">

                            <img
                                src="{{ asset('storage/' . $schoolSetting->favicon) }}"
                                alt="School Favicon"
                                class="h-full w-full object-contain p-3"
                            >

                        </div>
                    @endif

                    <input
                        type="file"
                        id="favicon"
                        name="favicon"
                        accept=".png,.ico,.svg"
                        class="form-input w-full @error('favicon') border-danger @enderror"
                    >

                    <p class="mt-1.5 text-xs text-muted">
                        PNG, ICO or SVG. Maximum size 1 MB.
                    </p>

                    @error('favicon')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>

            </div>

        </div>

    </div>


    {{-- System Configuration --}}
    <div class="card mt-5 overflow-hidden">

        <div class="border-b border-border px-5 py-4">
            <h2 class="text-base font-semibold text-text">
                System Configuration
            </h2>

            <p class="mt-1 text-xs text-muted">
                Configure timezone and attendance notification settings.
            </p>
        </div>

        <div class="p-5 lg:p-6">

            <div class="grid grid-cols-1 gap-5 md:grid-cols-2">

                {{-- Timezone --}}
                <div class="md:col-span-2">

                    <label
                        for="timezone"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        Timezone
                        <span class="text-danger">*</span>
                    </label>

                    <select
                        id="timezone"
                        name="timezone"
                        class="form-select w-full @error('timezone') border-danger @enderror"
                        required
                    >
                        <option
                            value="Asia/Kathmandu"
                            @selected(
                                old(
                                    'timezone',
                                    $schoolSetting?->timezone ?? 'Asia/Kathmandu'
                                ) === 'Asia/Kathmandu'
                            )
                        >
                            Asia/Kathmandu
                        </option>
                    </select>

                    <p class="mt-1.5 text-xs text-muted">
                        Used when processing attendance punches and notification timestamps.
                    </p>

                    @error('timezone')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- Attendance Notifications --}}
                <div>

                    <label
                        for="attendance_notifications"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        Attendance Notifications
                        <span class="text-danger">*</span>
                    </label>

                    <select
                        id="attendance_notifications"
                        name="attendance_notifications"
                        class="form-select w-full @error('attendance_notifications') border-danger @enderror"
                        required
                    >
                        <option
                            value="1"
                            @selected(
                                (string) old(
                                    'attendance_notifications',
                                    (int) ($schoolSetting?->attendance_notifications ?? true)
                                ) === '1'
                            )
                        >
                            Enabled
                        </option>

                        <option
                            value="0"
                            @selected(
                                (string) old(
                                    'attendance_notifications',
                                    (int) ($schoolSetting?->attendance_notifications ?? true)
                                ) === '0'
                            )
                        >
                            Disabled
                        </option>
                    </select>

                    <p class="mt-1.5 text-xs text-muted">
                        Master switch for attendance-related parent notifications.
                    </p>

                    @error('attendance_notifications')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- SMS --}}
                <div>

                    <label
                        for="sms_enabled"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        SMS Notifications
                        <span class="text-danger">*</span>
                    </label>

                    <select
                        id="sms_enabled"
                        name="sms_enabled"
                        class="form-select w-full @error('sms_enabled') border-danger @enderror"
                        required
                    >
                        <option
                            value="1"
                            @selected(
                                (string) old(
                                    'sms_enabled',
                                    (int) ($schoolSetting?->sms_enabled ?? true)
                                ) === '1'
                            )
                        >
                            Enabled
                        </option>

                        <option
                            value="0"
                            @selected(
                                (string) old(
                                    'sms_enabled',
                                    (int) ($schoolSetting?->sms_enabled ?? true)
                                ) === '0'
                            )
                        >
                            Disabled
                        </option>
                    </select>

                    <p class="mt-1.5 text-xs text-muted">
                        Allow attendance notifications to be delivered through SMS.
                    </p>

                    @error('sms_enabled')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>


                {{-- Email --}}
                <div>

                    <label
                        for="email_enabled"
                        class="mb-1.5 block text-sm font-medium text-text"
                    >
                        Email Notifications
                        <span class="text-danger">*</span>
                    </label>

                    <select
                        id="email_enabled"
                        name="email_enabled"
                        class="form-select w-full @error('email_enabled') border-danger @enderror"
                        required
                    >
                        <option
                            value="1"
                            @selected(
                                (string) old(
                                    'email_enabled',
                                    (int) ($schoolSetting?->email_enabled ?? true)
                                ) === '1'
                            )
                        >
                            Enabled
                        </option>

                        <option
                            value="0"
                            @selected(
                                (string) old(
                                    'email_enabled',
                                    (int) ($schoolSetting?->email_enabled ?? true)
                                ) === '0'
                            )
                        >
                            Disabled
                        </option>
                    </select>

                    <p class="mt-1.5 text-xs text-muted">
                        Allow attendance notifications to be delivered through email.
                    </p>

                    @error('email_enabled')
                        <p class="mt-1.5 text-xs text-danger">
                            {{ $message }}
                        </p>
                    @enderror

                </div>

            </div>

        </div>


        {{-- Actions --}}
        <div class="flex flex-col-reverse gap-3 border-t border-border bg-background/50 px-5 py-4 sm:flex-row sm:items-center sm:justify-end">

            <a
                href="{{ route('dashboard') }}"
                class="btn btn-secondary"
            >
                Cancel
            </a>

            <button
                type="submit"
                class="btn btn-primary"
                id="submit-button"
            >
                <i class="fa-solid fa-floppy-disk"></i>

                <span>Save Settings</span>
            </button>

        </div>

    </div>

</form>

@endsection