@extends('layout.desktop.main')
@section('content')
    <main>
        <div class="container">
            @include('layout.desktop.running_text')
            <div class="app-header__extra">
                <nav class="app-breadcrumbs">
                    <ul>
                        <li data-pos="start" class="nav-observer"></li>
                        <li class="nav-item nav-item--home"><a href="/" class="app-link--active" name="Beranda">
                                Beranda
                            </a></li>
                        <li class="nav-item nav-item--fill"><i class="fas fa-chevron-right fa-xs"></i>
                        </li>
                        <li class="nav-item"><a href="/promotion" aria-current="page"
                                class="app-link--exact-active app-link--active" name="Promotion" data-ref="promotion">
                                Promotion
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
            <section class="promotions">
                <nav class="promotions-nav">
                    <ul>
                        <li><a href="#" class="btn btn--flex btn--light app-link--active">
                                Semua
                            </a></li>
                        <li><a href="#" class="btn btn--flex btn--light">
                                Sports
                            </a></li>
                        <li><a href="#" class="btn btn--flex btn--light">
                                Casino
                            </a></li>
                        <li><a href="#" class="btn btn--flex btn--light">
                                Slots
                            </a></li>
                        <li><a href="#" class="btn btn--flex btn--light">
                                Lainnya
                            </a></li>
                    </ul>
                </nav>
                <article class="promotion promotion--d"><img src="{{ asset('storage/' . $promotion->img) }}"
                        alt="BONUS NEW MEMBER 20%" style="width: 100%"> <!---->
                    <section class="promotions"
                        style="background-color: rgb(32, 32, 36); border-radius: 10px; padding: 40px 40px;">
                        <h2 style="text-align: center; margin: 40px 0;">{{ $promotion->title }}</h2>
                        <div class="promotion__content">
                            {!! $promotion->body !!}
                        </div>
                </article>
            </section>
        </div>
    </main>
@endsection