@extends('site.master')
@section('main-content')
    <section class="af-hdr">
        <div class="container">
            <div class="row">
                <div class="col-sm-12">
                </div>
            </div>
        </div>
    </section>

    <article>
        <div class="container p-4 mb-4">
            <div class="row gap-0  mb-4">
                <div class="d-main">
                    <div class="dtail-content mt-5">
                        <h3 class="heading-4 font-weight-bold mb-3 fnt-fm text-primary">{{ $program[0]->title ?? '' }}</h3>
                    </div>
                    <div class="text-justify">

                            {!! $program[0]->description ?? '' !!}

                    </div>
                </div>
                <div class="row">
                    <div class="col-12 col-md-7 d-flex flex-column  mb-3">
                        <div class="mb-3">
                            <h2 class="text-blue fw-bold fnt-fam-ser mb-2 fs-5 w-100">
                                @lang('language.file')
                            </h2>
                        </div>
                        <div class="d-flex align-item-center mb-3 p-2 shadow">
                            <div class="container-iframe">
                                @if (isset($program[0]->file))
                                    <iframe src="{{ asset($program[0]->file) }}" class="responsive-iframe"
                                        frameborder="0"></iframe>
                                @endif

                            </div>
                        </div>
                    </div>
                    <div class="col-12 col-md-5">
                        <div class="d-flex align-item-cover justify-content-center mb-3 p-4 shadow">
                            <div class=" " style="">
                                <div class=" mb-3">
                                    <h2 class="text-blue fw-bold fnt-fam-ser mb-2 fs-5 w-100">
                                        @lang('language.sendm')
                                    </h2>
                                </div>
                                @if (Session::has('success_message'))
                                    <h4 class="text-success text-center" id="statuspage-msg">
                                        {{ Session::get('success_message') }}
                                    </h4>
                                @endif
                                @if (Session::has('error_message'))
                                    <h4 class="text-danger text-center" id="statuspage-msg">
                                        {{ Session::get('error_message') }}
                                    </h4>
                                @endif
                                <form action="{{ route('programfeedback.feedback') }}" class="d-flex flex-column"
                                    method="POST">
                                    @honeypot
                                    {{ csrf_field() }}

                                    <div class="form-group mb-2">
                                        <label for="" class="mb-1 fw-bold fs-7 ">@lang('language.name')</label>
                                        <input type="text" name="name" id="name" placeholder="@lang('language.name')"
                                            autocomplete="off" class="form-control" value="{{ old('name') }}">
                                        @if ($errors->has('name'))
                                            <span class="text-danger mb-2">
                                                <strong>{{ $errors->first('name') }}</strong>
                                            </span>
                                        @endif
                                    </div>
                                    <div class="form-group mb-2">
                                        <label for="" class="mb-1 fw-bold fs-7 ">@lang('language.email')</label>
                                        <input type="email" name="email" id="email" placeholder="@lang('language.email')"
                                            autocomplete="off" class="form-control" value="{{ old('email') }}">
                                        @if ($errors->has('email'))
                                            <span class="text-danger">
                                                <strong>{{ $errors->first('email') }}</strong>
                                            </span>
                                        @endif
                                    </div>
                                    <div class="form-group mb-2">
                                        <label for="" class="mb-1 fw-bold fs-7 ">@lang('language.lblselectfeedbackType')</label>
                                        <select class="form-control" name="suggestion_type" id="suggestion_type">
                                            <option selected="selected" value="">--@lang('language.lblselect')--</option>
                                            @foreach ($suggestiontype as $key => $item)
                                                <option value="{{ $item->title }}">{{ $item->title }}</option>
                                            @endforeach
                                        </select>
                                        @if ($errors->has('suggestion_type'))
                                            <span class="text-danger">
                                                <strong>{{ $errors->first('suggestion_type') }}</strong>
                                            </span>
                                        @endif
                                    </div>
                                    <div class="form-group mb-2">
                                        <label for="" class="mb-1 fw-bold fs-7 ">@lang('language.message')</label>
                                        <textarea name="suggestion" rows="8" id="suggestion" cols="30" placeholder="@lang('language.message').."
                                            class="form-control">{{ old('suggestion') }}</textarea>
                                        @if ($errors->has('suggestion'))
                                            <span class="text-danger">
                                                <strong>{{ $errors->first('suggestion') }}</strong>
                                            </span>
                                        @endif
                                    </div>

                                    <button type="submit" class="btn btn-blue text-light">@lang('language.send')</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </article>
    <style>
        .container-iframe {
            position: relative;
    width: 100%;
    overflow: hidden;
    padding-top: 56.25%;
    height: 530px;
            /* padding-top: 56.25%; */
            /* 16:9 Aspect Ratio */
        }

        .responsive-iframe {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            width: 100%;
            height: 100%;
            border: none;
        }
    </style>
@endsection

{{-- <!DOCTYPE html>
<html>
<head>
	<title>My Page</title>
</head>
<body>
	<!-- First row - paragraph -->
	<div>
		<p>This is a paragraph of text.</p>
	</div>

	<!-- Second row - iframe and feedback form -->
	<div style="display: flex; flex-direction: row;">
		<!-- Iframe -->
		<div style="flex: 1;">
			{{-- <iframe src="https://www.example.com" width="100%" height="400px"></iframe> --}}
{{-- </div>

		<!-- Feedback form -->
		<div style="flex: 1;">
			<form>
				<label for="name">Name:</label>
				<input type="text" id="name" name="name"><br>

				<label for="email">Email:</label>
				<input type="email" id="email" name="email"><br>

				<label for="feedback">Feedback:</label><br>
				<textarea id="feedback" name="feedback" rows="4" cols="50"></textarea><br>

				<input type="submit" value="Submit">
			</form>
		</div>
	</div>
</body>
</html> --}}