@extends('layouts.app')
@section('title', 'System Settings')

@section('breadcrumb')
    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
    <li class="breadcrumb-item active">System Settings</li>
@endsection

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">System Settings</h1>
        <p class="page-subtitle">Session, attachment and auto-save configuration</p>
    </div>
</div>

@include('settings._tabs', ['active' => 'security'])

<form method="POST" action="{{ route('settings.security.update') }}" id="secForm">
@csrf @method('PUT')

<div class="row g-4">
    <div class="col-12 col-xl-6">
        <div class="card mb-4">
            <div class="card-header"><i class="bi bi-clock me-2 text-primary"></i>Session & Auto-Save</div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-12">
                        <label class="form-label">Session Timeout (Minutes)</label>
                        <div class="input-group">
                            <input type="number" class="form-control" value="{{ $subscription?->session_timeout_minutes ?? 120 }}"
                                   disabled style="background:#f8f9fa">
                            <span class="input-group-text">minutes</span>
                        </div>
                        <div class="form-text">Session timeout is controlled by the Super Admin. Contact support to change it.</div>
                    </div>
                    <div class="col-12">
                        <label class="form-label">Auto-Save Interval <span class="required">*</span></label>
                        <div class="input-group">
                            <input type="number" name="autosave_interval_seconds" class="form-control"
                                   value="{{ old('autosave_interval_seconds', $settings['autosave_interval_seconds']) }}"
                                   min="30" max="600">
                            <span class="input-group-text">seconds</span>
                        </div>
                        <div class="form-text">How often draft vouchers are auto-saved (30–600 seconds).</div>
                    </div>
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-header"><i class="bi bi-paperclip me-2 text-primary"></i>File Attachments</div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-12">
                        <label class="form-label">Maximum Attachment Size <span class="required">*</span></label>
                        <div class="input-group">
                            <input type="number" name="max_attachment_size_kb" class="form-control"
                                   value="{{ old('max_attachment_size_kb', $settings['max_attachment_size_kb']) }}"
                                   min="256" max="51200">
                            <span class="input-group-text">KB</span>
                        </div>
                        <div class="form-text">
                            Current: {{ number_format($settings['max_attachment_size_kb'] / 1024, 1) }} MB.
                            Max allowed: 50 MB.
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-12 col-xl-6">
        <div class="card">
            <div class="card-header"><i class="bi bi-info-circle me-2 text-primary"></i>Subscription Info</div>
            <div class="card-body">
                <table class="table table-sm table-borderless mb-0" style="font-size:13px">
                    <tr>
                        <td class="text-muted" style="width:50%">Max Concurrent Users</td>
                        <td class="fw-semibold">{{ $subscription?->max_concurrent_users ?? '—' }}</td>
                    </tr>
                    <tr>
                        <td class="text-muted">Session Timeout</td>
                        <td class="fw-semibold">{{ $subscription?->session_timeout_minutes ?? '—' }} minutes</td>
                    </tr>
                    <tr>
                        <td class="text-muted">Subscription Ends</td>
                        <td class="fw-semibold">
                            @if($subscription?->subscription_ends_at)
                                {{ $subscription->subscription_ends_at->format('d M Y') }}
                            @elseif($subscription?->trial_ends_at)
                                Trial until {{ $subscription->trial_ends_at->format('d M Y') }}
                            @else
                                —
                            @endif
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

    <div class="col-12">
        <div class="d-flex gap-3 justify-content-end">
            <a href="{{ route('dashboard') }}" class="btn btn-outline-secondary">Cancel</a>
            <button type="submit" class="btn btn-primary px-4" id="saveBtn">
                <i class="bi bi-check-circle me-1"></i>Save System Settings
            </button>
        </div>
    </div>
</div>
</form>
@endsection

@push('scripts')
<script>
document.getElementById('secForm').addEventListener('submit', function() {
    const btn = document.getElementById('saveBtn');
    btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span>Saving...';
    btn.disabled = true;
});
</script>
@endpush