@extends('layouts.master')

@section('title', 'Manage Brand: ' . $brand->brand_name_en)

@section('content')
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h3>{{ $brand->brand_name_en }} <small class="text-muted">Dashboard</small></h3>
                @if($brand->brand_logo)
                    <img src="{{ asset($brand->brand_logo) }}" alt="Logo" class="img-radius" style="height: 50px;">
                @endif
            </div>
            <div class="card-body">
                <div class="row">
                    <!-- Basic Data -->
                    <div class="col-md-3 mb-4">
                         <a href="{{ route('data-entry.basic-data', $brand->brands_data_id) }}" class="card bg-primary text-white text-decoration-none h-100 hover-scale">
                             <div class="card-body text-center d-flex flex-column justify-content-center align-items-center">
                                 <i data-feather="settings" class="f-30 d-block mb-3"></i>
                                 <h5>Basic Data</h5>
                             </div>
                         </a>
                    </div>
                    
                    <!-- Branches -->
                    <div class="col-md-3 mb-4">
                         <a href="{{ route('data-entry.branches', $brand->brands_data_id) }}" class="card bg-success text-white text-decoration-none h-100 hover-scale">
                             <div class="card-body text-center d-flex flex-column justify-content-center align-items-center">
                                 <i data-feather="map-pin" class="f-30 d-block mb-3"></i>
                                 <h5>Branches</h5>
                             </div>
                         </a>
                    </div>

                    <!-- Social Media -->
                    <div class="col-md-3 mb-4">
                         <a href="{{ route('data-entry.social-media', $brand->brands_data_id) }}" class="card bg-info text-white text-decoration-none h-100 hover-scale">
                             <div class="card-body text-center d-flex flex-column justify-content-center align-items-center">
                                 <i data-feather="share-2" class="f-30 d-block mb-3"></i>
                                 <h5>Social Media</h5>
                             </div>
                         </a>
                    </div>

                    <!-- Photos -->
                    <div class="col-md-3 mb-4">
                         <a href="{{ route('data-entry.photos', $brand->brands_data_id) }}" class="card bg-warning text-white text-decoration-none h-100 hover-scale">
                             <div class="card-body text-center d-flex flex-column justify-content-center align-items-center">
                                 <i data-feather="image" class="f-30 d-block mb-3"></i>
                                 <h5>Photos Album</h5>
                             </div>
                         </a>
                    </div>

                    <!-- Videos -->
                    <div class="col-md-3 mb-4">
                         <a href="{{ route('data-entry.videos', $brand->brands_data_id) }}" class="card bg-danger text-white text-decoration-none h-100 hover-scale">
                             <div class="card-body text-center d-flex flex-column justify-content-center align-items-center">
                                 <i data-feather="video" class="f-30 d-block mb-3"></i>
                                 <h5>Videos</h5>
                             </div>
                         </a>
                    </div>



                    <!-- Subscription -->
                    <div class="col-md-3 mb-4">
                         <a href="{{ route('data-entry.subscription', $brand->brands_data_id) }}" class="card bg-secondary text-white text-decoration-none h-100 hover-scale">
                             <div class="card-body text-center d-flex flex-column justify-content-center align-items-center">
                                 <i data-feather="credit-card" class="f-30 d-block mb-3 text-white"></i>
                                 <h5 class="text-white">Subscription</h5>
                             </div>
                         </a>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .hover-scale {
        transition: transform 0.2s;
    }
    .hover-scale:hover {
        transform: scale(1.05);
    }
</style>
@endsection