@extends('layouts.master')

@section('content')
  <style>
    body {
      font-family: "Cairo", sans-serif;
      background-color: #f8f9fa;
      margin: 0;
    }

    .report-container {
      max-width: 800px;
      margin: auto;
      background: #fff;
      border-radius: 16px;
      box-shadow: 0 0 15px rgba(0,0,0,0.1);
      padding: 20px 30px;
    }

    h2 {
      text-align: center;
      color: #007b5e;
      margin-bottom: 25px;
    }

    table {
      width: 100%;
      border-collapse: collapse;
      text-align: center;
      direction: rtl;
    }

    th, td {
      padding: 12px 10px;
      border-bottom: 1px solid #ddd;
    }

    th {
      background-color: #009970;
      color: white;
      font-weight: bold;
    }

    tr:nth-child(even) {
      background-color: #f2f2f2;
    }

    .footer {
      text-align: left;
      font-size: 14px;
      color: #777;
      margin-top: 20px;
    }
      header .title{display:flex; flex-direction:column; gap:2px}
  .title h1{margin:0; font-size:20px}
  .title small{margin:0; font-size=12px; color:#555}
  </style>
<body lang="ar"  >
  <div class="report-container"  dir="rtl">
     
    <div class="title" dir="rtl">
        <h1  >  تقرير المخلفات  لفرع  &nbsp;&nbsp; &nbsp;   "{{$branch_name}}" </h1>
        <h5 >فترة: {{$dateFrom}} حتى {{$dateTo}}</h5>
      </div>

    <table  class="table table-bordered table-striped">
      <thead>
        <tr>
          <th style="text-align: center;">الصنف</th>
          <th style="text-align: center;">الكمية</th>
        </tr>
      </thead>
      <tbody>
       @foreach( $wastes as  $key=>$waste )
      <tr>
          <td> {{ $waste->waste->name }}  </td>
          <td>{{ $waste->total_quantity }} </td>
        </tr>
         @endforeach
      </tbody>
    </table>

    
  </div>

</body>
@endsection







                 


