@extends('layouts.app')
@section('title', "Permission: {$permission->name}")

@push('stylesheets')
<style>
    .permission-detail-section {
        background-color: #f8f9fa;
        border: 1px solid #e9ecef;
        border-radius: 4px;
        padding: 15px;
        margin-bottom: 15px;
    }
    
    .permission-module-section {
        background-color: #ffffff;
        border: 1px solid #dee2e6;
        border-radius: 4px;
        padding: 15px;
        margin-bottom: 10px;
    }
    
    .permission-form-card {
        background-color: #f8f9fa;
        border-left: 3px solid #007bff;
        padding: 10px;
        margin-bottom: 10px;
    }
    
    .permission-action-item {
        padding: 5px 10px;
        margin: 5px 0;
        background-color: #e7f3ff;
        border-radius: 3px;
        display: inline-block;
        margin-right: 10px;
    }
    
    .permission-action-item.enabled {
        background-color: #d4edda;
        color: #155724;
    }
    
    .permission-action-item.disabled {
        background-color: #f8d7da;
        color: #721c24;
    }

    .permissions-mws-group-title {
        font-size: 0.875rem;
        font-weight: 600;
        margin-bottom: 0.35rem;
        color: #495057;
    }

    .dark-mode .permissions-mws-group-title {
        color: #fff;
    }
    
    .dark-mode .permission-detail-section {
        background-color: #343a40;
        border-color: #495057;
    }
    
    .dark-mode .permission-module-section {
        background-color: #454d55;
        border-color: #495057;
    }
    
    .dark-mode .permission-form-card {
        background-color: #343a40;
        border-left-color: #007bff;
    }
</style>
@endpush

@section('content')
<x-layouts.page-wrapper
    title="Permission Details"
    :breadcrumbs="[
        'Permissions' => route('permissions.index'),
        $permission->name => null
    ]"
>
    <div class="col-md-12 mx-auto">
        <x-layouts.card-form :action="null" showfooter="0" :backRoute="route('permissions.index')">
            <!-- Basic Information -->
            <div class="row mb-4">
                <div class="col-md-12">
                    <h5 class="mb-3"><i class="fas fa-info-circle"></i> Basic Information</h5>
                    <dl class="row">
                        <dt class="col-sm-3">ID</dt>
                        <dd class="col-sm-9">{{ $permission->id }}</dd>
                        
                        <dt class="col-sm-3">Name</dt>
                        <dd class="col-sm-9"><strong>{{ $permission->name }}</strong></dd>
                        
                        <dt class="col-sm-3">Description</dt>
                        <dd class="col-sm-9">{{ $permission->description ?? 'N/A' }}</dd>
                        
                        <dt class="col-sm-3">Created At</dt>
                        <dd class="col-sm-9">{{ $permission->created_at->format('d M Y h:i A') }}</dd>
                        
                        @if($permission->updated_at)
                        <dt class="col-sm-3">Updated At</dt>
                        <dd class="col-sm-9">{{ $permission->updated_at->format('d M Y h:i A') }}</dd>
                        @endif
                    </dl>
                </div>
            </div>

            <hr>

            <!-- Permissions Details -->
            <div class="row">
                <div class="col-md-12">
                    <h5 class="mb-3"><i class="fas fa-key"></i> Permission Details</h5>
                    
                    @if(isset($permission->permission) && !empty($permission->permission))
                        @php
                            $permissionData = is_array($permission->permission) 
                                ? $permission->permission 
                                : json_decode($permission->permission, true);
                        @endphp
                        
                        @if(isset($modules) && !empty($modules))
                            @foreach($modules as $moduleName => $forms)
                                @php
                                    $moduleId = str_replace(' ', '-', strtolower($moduleName));
                                    $hasPermission = false;
                                    
                                    // Check if this module has any permissions
                                    foreach($forms as $formName => $formData) {
                                        $lowerFormName = strtolower($formName);
                                        if(isset($permissionData[$lowerFormName]) && !empty($permissionData[$lowerFormName])) {
                                            $hasPermission = true;
                                            break;
                                        }
                                    }
                                @endphp
                                
                                @if($hasPermission)
                                <div class="permission-module-section mb-3">
                                    <h6 class="mb-3">
                                        <i class="fas fa-folder"></i> {{ $moduleName }}
                                    </h6>
                                    
                                    @foreach($forms as $formName => $formData)
                                        @php
                                            $lowerFormName = strtolower($formName);
                                            $formPermissions = $permissionData[$lowerFormName] ?? [];
                                        @endphp
                                        
                                        @if(!empty($formPermissions))
                                        @php
                                            $allActions = $formData['actions'] ?? [];
                                            $isMeetingWorkspace = strcasecmp((string) ($formData['form_display_name'] ?? ''), 'Meeting Workspace') === 0
                                                || strtolower((string) $formName) === 'meeting workspace';
                                            $mwsGroups = $isMeetingWorkspace
                                                ? \App\Support\MwsSchemeMeetingTypePermission::groupPermissionActionsForUi($allActions)
                                                : ['_all' => $allActions];
                                            $mwsLabels = \App\Support\MwsSchemeMeetingTypePermission::permissionUiGroupLabels();
                                        @endphp
                                        <div class="permission-form-card mb-3">
                                            <h6 class="mb-2">{{ $formName }}</h6>
                                            @foreach($mwsGroups as $groupKey => $groupActions)
                                                @if($isMeetingWorkspace)
                                                    <div class="permissions-mws-group-title mt-2">{{ $mwsLabels[$groupKey] ?? $groupKey }}</div>
                                                @endif
                                                <div class="permission-actions">
                                                    @foreach($groupActions as $action)
                                                        @php
                                                            $actionKey = strtolower($action['action']);
                                                            $actionValue = $formPermissions[$actionKey] ?? null;
                                                            $isEnabled = ($actionValue == '1' || $actionValue == 1 || $actionValue === true);
                                                        @endphp
                                                        <span class="permission-action-item {{ $isEnabled ? 'enabled' : 'disabled' }}">
                                                            <i class="fas fa-{{ $isEnabled ? 'check-circle' : 'times-circle' }}"></i>
                                                            {{ $action['action_name'] ?? ucfirst(str_replace('_', ' ', $action['action'])) }}
                                                        </span>
                                                    @endforeach
                                                </div>
                                            @endforeach
                                        </div>
                                        @endif
                                    @endforeach
                                </div>
                                @endif
                            @endforeach
                        @else
                            <div class="alert alert-info">
                                <pre style="max-height: 400px; overflow-y: auto;">{{ json_encode($permissionData, JSON_PRETTY_PRINT) }}</pre>
                            </div>
                        @endif
                    @else
                        <div class="alert alert-warning">
                            <i class="fas fa-exclamation-triangle"></i> No permissions configured for this permission set.
                        </div>
                    @endif
                </div>
            </div>

            <!-- Action Buttons -->
            <div class="row mt-4">
                <div class="col-md-12">
                    <a href="{{ route('permissions.edit', $permission->id) }}" class="btn btn-success">
                        <i class="fas fa-edit"></i> Edit Permission
                    </a>
                    <a href="{{ route('permissions.index') }}" class="btn btn-secondary">
                        <i class="fas fa-arrow-left"></i> Back to List
                    </a>
                </div>
            </div>
        </x-layouts.card-form>
    </div>
</x-layouts.page-wrapper>
@endsection