@extends('Admin.layout')
<style>
  .card {
    border-radius: 14px;
    background: #ffffff;
    border: none;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
  }

  .card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 5px;
    height: 100%;
    background: #33B02CB2;
  }

  .card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(51, 176, 44, 0.35),
      inset 0 0 0 1px rgba(255, 255, 255, 0.35);
  }

  .card-title p {
    color: green;
    font-weight: 500;
  }

  .card-title h4 {
    color: #212529;
    font-weight: 700;
  }

  .card-icon .badge {
    background: rgba(51, 176, 44, 0.12) !important;
    border: 1px solid rgba(51, 176, 44, 0.25);
    padding: 10px !important;
    border-radius: 12px;
  }

  .card-icon i {
    font-size: 32px;
    color: #33B02CB2;
  }

  html[data-bs-theme="dark"] .card {
    background: #2f3349;
  }

  html[data-bs-theme="dark"] .card:hover {
    box-shadow:
      0 16px 40px rgba(32, 94, 28, 0.5);
  }

  html[data-bs-theme="dark"] .card::before {
    background: #33B02CB2;
  }

  html[data-bs-theme="dark"] .card-title p,
  html[data-bs-theme="dark"] .card-title h4 {
    color: #ffffff;
  }

  html[data-bs-theme="dark"] .card-icon .badge {
    background: rgba(51, 176, 44, 0.18) !important;
    border: 1px solid rgba(51, 176, 44, 0.35);

  }

  html[data-bs-theme="dark"] .card-icon i {
    color: #ffffff;
  }
</style>
@section('content')
<h5 class="text-center">Show Room</h5>

    <div class="row">
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('Add_product') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">Add Product</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-picnic-table"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('View_table') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">View Product</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-table"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('View_sales_table') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">View Sales</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-report"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('Product_request') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">Product Request</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-bell-plus"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('Custom_product_table') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">Custom Product</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-brand-codesandbox"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('view_custom_sales') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">View Custom Sales</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-coin"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('Order_note_table') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">Order Note</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-note"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
        <div class="col-lg-3 col-sm-6 mb-3">
            <a href="{{ route('Dept_table') }}">
                <div class="card h-100">
                    <div class="card-body d-flex justify-content-between align-items-center">
                        <div class="card-title mb-0">
                            <h5 class="mb-1 me-2">Department</h5>
                        </div>
                        <div class="card-icon">
                            <span class="badge bg-label-primary rounded p-2">
                                <i class="icon-base ti tabler-building-skyscraper"></i>
                            </span>
                        </div>
                    </div>
                </div>
            </a>
        </div>
    </div>
@endsection