@extends('layout')

@section('page-title', 'Dashboard')

@section('dashboard-content')
<div class="row g-3 mb-4">
  @php
    $sections = [
      ['Hero',             'admin/hero',             'bi-images',      'Edit hero headline, sub-text, button labels, and product image.'],
      ['Brand Statement',  'admin/brand-statement',  'bi-quote',       'Edit the featured quote and attribution.'],
      ['About / Story',    'admin/about',            'bi-book',        'Edit images, headline, body text, and badges.'],
      ['Benefits',         'admin/benefits',         'bi-star',        'Manage the 4 key benefit cards with icon, title, and description.'],
      ['Shop / Products',   'admin/product',           'bi-bag',         'Edit size names, prices, product images, and trust badges.'],
      ['Philosophy',       'admin/philosophy',       'bi-lightbulb',   'Edit headline and body paragraphs for the philosophy section.'],
      ['Sensory Experience','admin/sensory',          'bi-wind',        'Edit image, badge, body text, and feature list items.'],
      ['Transparency',     'admin/transparency',     'bi-eye',         'Manage ingredient / transparency cards.'],
      ['Testimonials',     'admin/testimonials',     'bi-chat-quote',  'Add, edit, or remove customer reviews.'],
      ['Contact Info',     'admin/contact-section',  'bi-telephone',   'Update address, phone, email, and business hours.'],
    ];
  @endphp

  @foreach($sections as [$label, $route, $icon, $desc])
  <div class="col-md-6 col-lg-4">
    <a href="{{ url($route) }}" class="text-decoration-none">
      <div class="card h-100 p-3" style="transition: box-shadow .15s;" onmouseover="this.style.boxShadow='0 4px 16px rgba(28,92,46,.15)'" onmouseout="this.style.boxShadow=''">
        <div class="d-flex align-items-center gap-3 mb-2">
          <div style="width:40px;height:40px;background:#e8f5ec;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#1C5C2E;font-size:1.2rem;">
            <i class="bi {{ $icon }}"></i>
          </div>
          <h6 class="mb-0 fw-600" style="font-weight:600;color:#1a1a1a;">{{ $label }}</h6>
        </div>
        <p class="mb-0" style="font-size:.82rem;color:#6b7280;">{{ $desc }}</p>
      </div>
    </a>
  </div>
  @endforeach
</div>

<div class="card p-3">
  <p class="mb-1 fw-semibold" style="font-size:.875rem;">Quick actions</p>
  <div class="d-flex gap-2 flex-wrap">
    <a href="{{ url('/') }}" target="_blank" class="btn btn-sm btn-outline-success">
      <i class="bi bi-box-arrow-up-right me-1"></i> View Live Site
    </a>
  </div>
</div>
@endsection