@extends('layout.app', ['title' => 'Hướng dẫn giải đáp'])

@push('style')
  @vite(['resources/css/landing.css'])
@endpush
@php
@endphp
@section('content')
  <section class="page-wrap col-8 col-md-9 col-xl-10 flex-grow-1 px-0">
    @include('layout.landing_banner', [
        'title' => 'hướng dẫn giải đáp',
        'description' => 'Bạn đang gặp khó khăn gì, đừng lo lắng hãy nói với Siêu Học nhé!',
    ])
    <!-- Testimonial start -->
    <section class="testimonial container-fluid mb-5">
      @include('custom_errors.session-errors')
      <div class="testimonial-wrap row m-2 m-md-3 m-xl-5 p-3">
        <div class="col-6 testimonial-suggest">
          <div class="testimonial-text-label">
            <span class="content-label text-primary-color">
              góc học tập
            </span>
          </div>
          <div class="testimonial-heading">
            <div class="content-header fs-30 d-flex">
              <span class="font-sigmar-one">
                Câu hỏi &nbsp;
              </span>
              <span class="font-sigmar-one textNewBlue">
                Lý thuyết
              </span>
              {{-- <span class="font-sigmar-one">
                giải bài tập <span class="text-new-green font-sigmar-one">real time</span>
              </span> --}}
            </div>
          </div>
          <div class="testimonial-content mt-3">
            <div class="fs-17 text-paragraph d-flex flex-column">
              <span class="fw-700 mb-2">
                Giải đáp câu hỏi lý thuyết:
              </span>
              <span class="mb-2">
                Bạn có câu hỏi lý thuyết khó giải? Hay bạn quên công thức đã học trên lớp?
              </span>
              <span class="mb-2">
                Hãy nhập ở phần bên, chúng tôi sẽ giúp giải đáp cho bạn tất cả các câu hỏi.
              </span>
            </div>
          </div>
        </div>
        <div class="col-6 testimonial-form">
          <div class="testimonial-form-container border-0 p-2">
            <div class="testimonial-question mb-2">
              <form action="{{ route('answer_guides.storeTheory') }}" method="post">
                @csrf()
                <textarea class="d-block input-form-question w-100 ps-3" type="text" name="theoryQuestion" rows="8"
                  placeholder="Nhập câu hỏi của bạn  ...."></textarea>
                @error('theoryQuestion')
                  <span class="text-danger">{{ $message }}</span>
                @enderror
                <div class="d-flex justify-content-end btn-wrap">
                  <button class="custom-btn btn-custom-fill btn-send-question d-flex align-items-center" type="submit">
                    <span class="fs-6 fw-bold me-2">
                      gửi
                    </span>
                    <span>
                      <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
                        fill="none">
                        <path d="M22 2L11 13" stroke="white" stroke-width="2" stroke-linecap="round"
                          stroke-linejoin="round" />
                        <path d="M22 2L15 22L11 13L2 9L22 2Z" stroke="white" stroke-width="2" stroke-linecap="round"
                          stroke-linejoin="round" />
                      </svg>
                    </span>
                  </button>
                </div>
              </form>
            </div>

          </div>
        </div>
      </div>

      @include('modals.show_loading')
    </section>
    <!-- Testimonial end -->
  </section>
@endsection
@push('script')
  <script></script>
  @vite(['resources/js/exercise-guide.js'])
@endpush