<div class="sub-header sub-header-trainer">
    <div class="sub-header-inner">
        <div class="uk-container">
            <div class="uk-grid uk-flex-middle" uk-grid>

                <!-- Main Content -->
                <div class="uk-width-expand@s">

                    <div class="trainer-header-content uk-margin-mediun-bottom uk-flex uk-flex-middle gap-24">

                        <div class="trainer-avatar">
                            <img class="uk-border-circle" src="assets/svg/avatar.svg" width="120" height="120" alt="Sara Mohammed">
                        </div>

                        <div class="trainer-meta">
                            <h1 class="sub-header-title">Sara Mohammed</h1>
                            <p class="sub-header-desc">Software Engineer</p>

                            <div class="user-statics uk-flex gap-32">
                                <div>
                                    <div class="static-num">8</div>
                                    <div class="static-text">Sessions</div>
                                </div>
                                <div>
                                    <div class="static-num">4.8</div>
                                    <div class="static-text">Avg Rating</div>
                                </div>
                                <div>
                                    <div class="static-num">3</div>
                                    <div class="static-text">Favorites</div>
                                </div>
                            </div>
                        </div>

                    </div>

                </div>

                <div class="uk-width-auto@s uk-visible@m">
                    <div class="user-wallet uk-flex gap-16">
                        <div>
                            <span uk-icon="icon: wallet; ratio: 2" class="uk-icon uk-text-primary"></span>
                        </div>
                        <div>
                            <div class="uk-text-secondary uk-text-default f600">My Wallet</div>
                            <div class="user-balance uk-text-large f700 uk-text-primary">450 SAR</div>
                            <div class="balance-info uk-text-small">Available Balance</div>
                        </div>

                    </div>
                </div>

            </div><!-- .uk-grid -->
        </div><!-- .uk-container -->
    </div><!-- .sub-header-inner -->

    <!-- Breadcrumb -->
    <div class="breadcrumb-container">
        <div class="uk-container">
            <nav aria-label="Breadcrumb">
                <ul class="uk-breadcrumb">
                    <li><a href="#">Home</a></li>
                    <li><span aria-current="page"><?php echo ucwords(str_replace(['-', '.'], ' ', basename($_SERVER['PHP_SELF'], '.php'))); ?></span></li>
                </ul>
            </nav>
        </div>
    </div>

</div><!-- .sub-header -->