@extends('layouts.admin')
@section('title', 'Setting')
@section('admin-content')
<div class="admin-heading"><div><div class="eyebrow">MAKE IT YOURS</div><h1>Setting<span class="gold">.</span></h1><p>Manage your preferences one section at a time.</p></div></div>
@php
$settingTab = request()->query('tab', 'appearance');
if (!in_array($settingTab, ['administrator-access', 'appearance', 'site', 'seo', 'currency', 'digital-rewards', 'rejections', 'verification', 'retention', 'email', 'reset']) || (in_array($settingTab, ['administrator-access','retention', 'email', 'reset', 'verification', 'currency', 'digital-rewards', 'rejections']) && auth()->user()->admin_role !== 'owner')) $settingTab = 'appearance';
@endphp
<nav class="settings-tabs" aria-label="Setting sections"><a href="{{ route('admin.preferences') }}" @if($settingTab === 'appearance') aria-current="page" @endif>Appearance</a><a href="{{ route('admin.preferences', ['tab' => 'site']) }}" @if($settingTab === 'site') aria-current="page" @endif>Site details</a><a href="{{ route('admin.preferences',['tab'=>'seo']) }}" @if($settingTab==='seo') aria-current="page" @endif>SEO &amp; sharing</a>@if(auth()->user()->admin_role === 'owner')<a href="{{ route('admin.preferences',['tab'=>'administrator-access']) }}">Administrator access</a><a href="{{ route('admin.preferences',['tab'=>'digital-rewards']) }}" @if($settingTab==='digital-rewards') aria-current="page" @endif>Digital rewards</a><a href="{{ route('admin.preferences',['tab'=>'rejections']) }}" @if($settingTab==='rejections') aria-current="page" @endif>Rejection reasons</a><a href="{{ route('admin.preferences',['tab'=>'currency']) }}" @if($settingTab==='currency') aria-current="page" @endif>Currency</a><a href="{{ route('admin.preferences',['tab'=>'verification']) }}" @if($settingTab==='verification') aria-current="page" @endif>Email login</a><a href="{{ route('admin.preferences', ['tab' => 'email']) }}" @if($settingTab === 'email') aria-current="page" @endif>Email setup</a><a href="{{ route('admin.preferences', ['tab' => 'retention']) }}" @if($settingTab === 'retention') aria-current="page" @endif>Activity retention</a><a href="{{ route('admin.preferences',['tab'=>'reset']) }}" @if($settingTab==='reset') aria-current="page" @endif>Data reset</a>@endif</nav>
@if($settingTab==='administrator-access')
@include('admin.partials.team-settings')
@endif

<style>.settings-tabs{display:flex;flex-wrap:wrap;gap:8px;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:22px}.settings-tabs a{padding:10px 16px;border:1px solid transparent;border-radius:8px;font-size:12px;color:var(--muted)}.settings-tabs a[aria-current=page]{background:#498f8818;border-color:#498f8844;color:var(--text);font-weight:600}.settings-appearance{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}.settings-appearance .panel{max-width:none!important;margin:0}.settings-appearance .panel-heading{gap:12px}.settings-appearance .panel-heading h2{font-size:22px}.settings-appearance .odds-badge{white-space:normal}@media(max-width:1000px){.settings-appearance{grid-template-columns:1fr}}</style>
@if($settingTab === 'appearance')
<div class="settings-appearance"><article class="panel" style="max-width:680px"><div class="panel-heading"><h2>Message settings</h2><span class="odds-badge">Save required</span></div><p class="muted" style="font-size:12px">Choose your message preferences, then click Save message settings.</p><form class="stack-form" method="post" action="{{ route('admin.preferences.update') }}">@csrf @method('PUT')
<label>Backend message position<select name="message_position"><option value="top" @selected(old('message_position', $settings->message_position) === 'top')>Top of the page</option><option value="bottom-right" @selected(old('message_position', $settings->message_position) === 'bottom-right')>Bottom right of the page</option></select></label>
<label>Message duration (seconds)<input type="number" name="message_seconds" min="0" max="86400" required value="{{ old('message_seconds', $settings->message_seconds) }}"><small>0 keeps messages visible until dismissed. Timed messages fade in and out.</small></label>
<button class="button small" style="align-self:flex-start" type="submit">Save message settings</button></form></article>
<article class="panel" style="max-width:680px"><div class="panel-heading"><h2>Top menu</h2><span class="odds-badge">Saves automatically</span></div><p class="muted" style="font-size:12px">Switch changes take effect immediately. No Save button is needed.</p><label class="setting-switch"><input type="checkbox" role="switch" data-autosave-switch data-save-url="{{ route('admin.preferences.toggle') }}" value="1" @checked(old('show_theme_toggle', $settings->show_theme_toggle))><span class="setting-switch-track" aria-hidden="true"><span></span></span><span>Show the light/dark mode switch in the top menu</span><strong class="setting-switch-state" aria-hidden="true"><span class="switch-on">On</span><span class="switch-off">Off</span></strong></label><p class="muted" style="font-size:12px;margin-top:16px">Applies to player and admin pages.</p><p id="switch-save-status" role="status" aria-live="polite" style="font-size:12px;margin:0">Switch changes save automatically.</p></article>
<article class="panel" id="wheel-appearance" style="scroll-margin-top:24px"><div class="panel-heading"><h2>Wheel appearance</h2></div><p class="muted" style="font-size:12px">Choose the outer rim colour. The recessed inner edge adds depth around the prize segments.</p>
<form class="stack-form" method="post" action="{{ route('admin.preferences.wheel-appearance') }}">
@csrf
@method('PUT')
<label>Outer rim colour<input type="color" name="wheel_rim_color" value="{{ old('wheel_rim_color', $settings->wheel_rim_color ?? '#b6dce1') }}" required></label>
<label>Prize image size (%)<input id="wheel-image-number" type="number" name="wheel_image_percent" min="10" max="100" step="1" value="{{ old('wheel_image_percent', $settings->wheel_image_percent ?? 70) }}" required></label>
<label for="wheel-image-range">Adjust image size<input id="wheel-image-range" type="range" min="10" max="100" step="1" value="{{ old('wheel_image_percent', $settings->wheel_image_percent ?? 70) }}"></label>
<small>10–100% of each slot’s outer edge. Changes the prize image and its stitched border.</small>
<figure style="margin:12px 0;text-align:center"><div aria-hidden="true" data-wheel-appearance-preview style="position:relative;margin:35px auto 12px;width:min(100%,220px);aspect-ratio:1;border-radius:50%;padding:9px;box-sizing:border-box;background:var(--preview-rim,#b6dce1);border:1px solid #7cadb7"><div style="width:100%;height:100%;border-radius:50%;background:conic-gradient(#ffdadc 0deg 51.43deg,#d3e2ba 51.43deg 102.86deg,#bddce5 102.86deg 154.29deg,#f4e3ab 154.29deg 205.72deg,#ff9c9c 205.72deg 257.15deg,#eed0df 257.15deg 308.58deg,#cbd5df 308.58deg);box-shadow:inset 0 0 12px #14242b70"></div><div data-wheel-preview-badge style="position:absolute;top:4%;left:50%;transform:translate(-50%,-50%);width:29%;aspect-ratio:1;border:2px dashed #7cadb7;border-radius:50%;background:white;display:grid;place-items:center;box-sizing:border-box;font-size:26px">🐾</div></div><figcaption class="muted" style="font-size:11px">Sample preview · Rim colour and prize image size</figcaption></figure>
<small>Original rim colour: #b6dce1. Save, then refresh the player page to apply both changes.</small>
<button class="button small" style="align-self:flex-start" type="submit">Save wheel appearance</button></form></article>
</div>
@elseif($settingTab === 'digital-rewards')
@include('admin.partials.digital-reward-settings')
@elseif($settingTab === 'rejections')
@include('admin.partials.rejection-reasons')
@elseif($settingTab === 'currency')
@include('admin.partials.currency-settings')
@elseif($settingTab === 'verification')
@include('admin.partials.verification-settings')
@elseif($settingTab === 'seo')
@include('admin.partials.seo-settings')
@elseif($settingTab === 'reset')
@include('admin.partials.data-reset')
@elseif($settingTab === 'site')
@include('admin.partials.site-branding')
@elseif($settingTab === 'email')
@include('admin.partials.email-setup')
@elseif($settingTab === 'retention')
@if(auth()->user()->admin_role === 'owner')
<article class="panel" style="max-width:680px"><div class="panel-heading"><h2>Activity retention</h2><span class="odds-badge">Owner only</span></div>
@php($activityCount = \Illuminate\Support\Facades\DB::table('admin_events')->count())
@php($oldestActivity = \Illuminate\Support\Facades\DB::table('admin_events')->min('created_at'))
<p class="muted" style="font-size:12px">{{ number_format($activityCount) }} records · Oldest: {{ $oldestActivity ? \Carbon\Carbon::parse($oldestActivity)->format('d M Y') : 'None' }}<br>Last cleanup: {{ $settings->activity_last_cleanup_at ? \Carbon\Carbon::parse($settings->activity_last_cleanup_at)->format('d M Y, H:i') : 'Not run yet' }}</p>
<p class="muted" style="font-size:12px">Routine activity includes media, prizes, credits, and campaign settings. Security history includes administrator account changes, sign-ins, access rules, player account edits, and failed actions. Cleanup runs daily when the scheduler is running, or on the first admin request of the day.</p>
<form class="stack-form" method="post" action="{{ route('admin.activity.retention') }}">@csrf @method('PUT')<div class="form-row"><label>Routine activity<select name="activity_routine_days">@foreach([30,90,180,365] as $days)<option value="{{ $days }}" @selected(old('activity_routine_days', $settings->activity_routine_days) == $days)>{{ $days }} days</option>@endforeach</select></label><label>Security and account activity<select name="activity_security_days">@foreach([90,180,365,730] as $days)<option value="{{ $days }}" @selected(old('activity_security_days', $settings->activity_security_days) == $days)>{{ $days }} days</option>@endforeach</select></label></div>
@include('admin.partials.owner-confirmation')
<button class="button small" type="submit" style="align-self:flex-start">Save retention settings</button></form>
<hr style="border:0;border-top:1px solid var(--line);margin:24px 0"><a class="button small secondary" href="{{ route('admin.activity.export') }}">Export activity CSV</a><p class="muted" style="font-size:12px;margin-top:12px">Export before cleaning up if you need an archive. Cleanup permanently removes expired records only. SQLite reuses the freed space; the database file may keep its current size.</p>
<form class="stack-form" method="post" action="{{ route('admin.activity.cleanup') }}" onsubmit="return confirm('Permanently delete activity older than the configured retention periods? Export first if you need an archive.');">@csrf
@include('admin.partials.owner-confirmation')
<button class="button small secondary" type="submit" style="align-self:flex-start">Clear expired activity now</button></form></article>
@endif
@endif
<style>
.setting-switch{display:flex;flex-direction:row;align-items:center;gap:12px;position:relative;cursor:pointer;color:var(--text);font-size:12px;line-height:1.6}
.setting-switch>input{position:absolute;width:1px;height:1px;opacity:0;margin:0}
.setting-switch-track{display:block;width:46px;height:26px;flex-shrink:0;padding:3px;border-radius:20px;background:#8b9795;transition:background .2s}
.setting-switch-track>span{display:block;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0003;transition:transform .2s}
.setting-switch input:checked+.setting-switch-track{background:#498f88}
.setting-switch input:checked+.setting-switch-track>span{transform:translateX(20px)}
.setting-switch input:focus-visible+.setting-switch-track{outline:2px solid var(--gold);outline-offset:4px}
.setting-switch-state{font-size:11px;min-width:22px;font-weight:600;color:var(--muted)}
.setting-switch .switch-on{display:none}
.setting-switch input:checked~.setting-switch-state .switch-on{display:inline;color:#498f88}
.setting-switch input:checked~.setting-switch-state .switch-off{display:none}
@media(prefers-reduced-motion:reduce){.setting-switch-track,.setting-switch-track>span{transition:none}}
</style>
@endsection

@push('scripts')

<script src="{{ asset('wheel/setting-switch.js') }}" defer></script>
@endpush









@push('scripts')
<script src="{{ asset('wheel/image-size-controls.js') }}" defer></script>
@endpush