@extends('dashboard.layout.layout')

@section('content')
  <div class="app-content content">
    <div class="content-overlay"></div>
    <div class="header-navbar-shadow"></div>
    <div class="content-wrapper container-xxl p-0">
      <div class="content-body">
        <div class="modal fade" id="agreementModal" tabindex="-1" aria-labelledby="agreementModalLabel" aria-hidden="true"
          data-bs-backdrop="static" data-bs-keyboard="false">
          <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
              <div class="modal-header bg-primary">
                <h5 class="modal-title text-white" id="agreementModalLabel">ხელშეკრულებაზე თანხმობა</h5>
              </div>
              <div class="modal-body">
                <div class="border rounded p-2 bg-light" style="white-space: pre-wrap; min-height: 160px;">
                  {{ $agreementText }}
                </div>
              </div>
              <div class="modal-footer">
                <form method="POST" action="{{ route('agreement.decline') }}" class="me-1">
                  @csrf
                  <button type="submit" class="btn btn-outline-danger">უარყოფა</button>
                </form>
                <form method="POST" action="{{ route('agreement.accept') }}">
                  @csrf
                  <button type="submit" class="btn btn-success">თანხმობა</button>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
@endsection

@push('styles')
  <style>
    body.agreement-modal-visible .modal-backdrop.show {
      opacity: 1;
      background-color: rgba(34, 41, 47, 0.55);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
    }
  </style>
@endpush

@push('scripts')
  <script>
    document.addEventListener('DOMContentLoaded', function() {
      var modalElement = document.getElementById('agreementModal');

      if (modalElement) {
        document.body.classList.add('agreement-modal-visible');
        new bootstrap.Modal(modalElement).show();
      }
    });
  </script>
@endpush