@extends('layouts.app-super-user')

@section('content')
    <div class="content d-flex flex-column flex-column-fluid pt-0" id="kt_content">
        <div class="d-flex flex-column-fluid">
            <div class="container">
                <div class="card shadow mb-4" style="background-color: #EAEAF4; border: none;">
                    <div class="card-header p-4" style="background-color: #3D3D5C; border-radius: 10px 10px 0 0;">
                        <div class="d-flex justify-content-between align-items-center">
                            <div class="d-flex align-items-center">
                                <a href="{{ route('admin-s-associations') }}" 
                                   class="btn btn-light mr-3">
                                    <i class="fas fa-arrow-left"></i> {{ __('all.back_to_teams') }}
                                </a>

                                <h5 class="text-white font-weight-bold mt-2 mb-2">
                                    {{ __('all.groups') }} - {{ $clubName }}
                                </h5>
                            </div>
                        </div>
                    </div>
                    <div class="card-body card-body-table" style="padding: 40px;">
                        <div class="table-responsive">
                            <table class="table" id="dataTableGroups" width="100%" cellspacing="0" style="border-collapse: separate; border-spacing: 0 10px;">
                                <thead>
                                    <tr align="center" style="background-color: #4B4B73; color: #FFFFFF;">
                                        <th style="padding: 15px; border: none;">{{ __('all.group') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @if(isset($groups) && $groups->count())
                                        @foreach($groups as $group)
                                            <tr class="tr-custom" style="background-color: #FFFFFF; border-radius: 10px; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);">
                                                <td class="text-center" style="padding: 20px; border: none;">
                                                    <a href="{{ route('admin-s-getSubgroupsByGroupSuperUser', ['club' => $clubName, 'group' => $group->group]) }}" class="text-dark font-weight-bold text-hover-primary font-size-lg" style="text-decoration: none;">
                                                        {{ $group->group }}
                                                    </a>
                                                </td>

                                            </tr>
                                        @endforeach
                                    @endif
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection