@extends('layouts.app')
@section('title', '駐輪場マスタ 編集')

@section('content')
<div class="container-fluid page-park py-3">

    {{-- 画面上部のツールバー（左：登録/その他、右：削除） --}}
    <div class="screen-toolbar mb-2">
        <div class="left">
            <button type="submit" form="park-edit-form" class="btn btn-success btn-sm">登録</button>
            <a href="javascript:void(0)" class="btn btn-light btn-sm">減免確認編集</a>
            <a href="javascript:void(0)" class="btn btn-light btn-sm">駐輪状況編集</a>
        </div>
        <div class="right">
            <form method="POST" action="{{ route('parks.delete', $park->park_id) }}" onsubmit="return confirm('削除しますか？')">
                @csrf
                <button class="btn btn-danger btn-sm">削除</button>
            </form>
        </div>
    </div>

    {{-- 本体フォーム（白背景のカード） --}}
    <form id="park-edit-form" method="POST" action="{{ route('parks.update', $park->park_id) }}" enctype="multipart/form-data" class="card card-body form-card">
        @csrf
        @method('PUT')
        @include('admin.parks._form')

        <div class="form-footer mt-3 pt-2">
            <button class="btn btn-success">登録</button>
            <a href="{{ route('parks') }}" class="btn btn-outline-secondary">戻る</a>
        </div>
    </form>
</div>

<style>

.page-park{background:#f4f6f9;}
.form-card{
  border:1px solid #e5e7eb;
  box-shadow:0 1px 1px rgba(0,0,0,.04);
}


.screen-toolbar{display:flex;justify-content:space-between;align-items:center;}
.screen-toolbar .btn{border-radius:3px;padding:.35rem .7rem}
.screen-toolbar .btn-light{background:#fff;border:1px solid #dcdfe3;color:#333}


.form-group{margin-bottom:.6rem}
.col-form-label{padding-top:.55rem;font-weight:600}
.req:after{content:" *";color:#dc3545}
input.form-control,select.form-control{height:34px;padding:.25rem .5rem}
textarea.form-control{min-height:72px}


.img-thumbnail{
  border:1px dashed #d0d7de;
  background:repeating-linear-gradient(45deg,#fafafa,#fafafa 8px,#f3f4f6 8px,#f3f4f6 16px);
}


.form-footer{border-top:1px dashed #e9ecef}
</style>
@endsection