@extends('layouts.app')
@section('title', __('home.home'))

@section('content')

<section class="content-header">
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5">
            <li class="breadcrumb-item text-sm">
              <a class="text-white opacity-7" href="javascript:;">
                <i class="fa far fas fa-building text-sm-i opacity-10"></i> Hostel
              </a>
            </li>
             <li class="breadcrumb-item text-sm text-white">
                Manage Hostel
            </li>
        </ol>
    </nav>
</section>
<!-- Main content -->
<section class="content no-print">
	<div class="row">
        <div class="col-md-4 col-xs-12">
           
        </div>
		<div class="col-md-8 col-xs-12">
            <div class="form-group pull-right">
                  <div class="input-group">
                  </div>
            </div>
		</div>
	</div>
    <div class="pad-15">
	   <div class="row mt-20 mb-20">
            @foreach($hostels as $row)             
                <div class="col-md-3 col-sm-6 col-xs-12 col-custom">
                  
                   <!-- <div class="info-box info-box-new-style">
                        <span class="info-box-icon bg-aqua"></span>
                        <div class="info-box-content">
                            <a href="/hostel-rooms/{{$row->id}}" >
                          <span class="info-box-number total_sell">{{$row->name }}</span> </a>
                          <span class="info-box-text">{{$row->room_capacity }} rooms</span>
                          <span class="info-box-text">{{$row->bed_count }} beds</span>
                          <span class="info-box-text">{{$row->vecant_count }} vacant</span>
                        </div>
                   </div>
 -->



                <div class="card card-b-shadow border-radius-lg mb-20">
                  <div class="card-body p-3">
                    <div class="row pad-15 mt-20">
                      <div class="col-md-9 col-xs-9">
                        <div class="numbers mb-20">
                            <a href="/hostel-rooms/{{$row->id}}" >
                          <p class="text-sm mb-0 text-uppercase font-weight-bold total_sell">{{$row->name }}</p> </a>
                          <h4 class="font-weight-bolder total_sell">
                          {{$row->room_capacity }} rooms                   
                          </h4>
                          <p class="mb-0">
                            <span class="text-success text-sm font-weight-bolder">{{$row->bed_count }} beds</span>
                           {{$row->vecant_count }} vacant
                          </p>
                        </div>
                      </div>
                      <div class="col-md-3 col-xs-3 text-end">
                        @if($row->vecant_count  == 0)
                        <div class="icon icon-shape bg-gradient-x-danger shadow-danger text-center rounded-circle">
                          <i class="fa fa-users-slash text-lg opacity-10" aria-hidden="true"></i>
                        </div>
                        @else
                        <div class="icon icon-shape bg-gradient-success shadow-success text-center rounded-circle">
                          <i class="fa fa-user-check text-lg opacity-10" aria-hidden="true"></i>
                        </div>
                        @endif
                      </div>
                    </div>
                  </div>
                </div>


                  <!-- /.info-box -->
                </div>
            @endforeach
        </div>
    </div>
   <!-- can('dashboard.data') end -->
</section>
@stop