@if(auth()->user()->admin_role === 'owner')
@php
$editingTheme=request('theme_editor',$settings->website_theme??'cat-pastel');
if(!in_array($editingTheme,['cat-pastel','christmas']))$editingTheme='cat-pastel';
$themeConfig=request('theme_defaults')==='1' ? \App\Services\WebsiteThemes::defaults($editingTheme) : \App\Services\WebsiteThemes::config($editingTheme,$settings);
@endphp
<article class="panel" id="wheel-appearance" style="grid-column:1/-1;scroll-margin-top:24px">
<div class="panel-heading"><h2>Website theme</h2><span class="odds-badge">Active: {{ ($settings->website_theme??'cat-pastel')==='christmas'?'Christmas':'Cat Pastel' }}</span></div>
<p class="muted" style="font-size:12px">Each theme keeps its own settings. Preview your changes, then apply when ready. Customer pages change; your admin studio stays familiar.</p>
<nav class="settings-tabs" aria-label="Theme settings"><a href="{{ route('admin.preferences',['theme_editor'=>'cat-pastel']) }}#wheel-appearance" @if($editingTheme==='cat-pastel') aria-current="page" @endif>Cat Pastel</a><a href="{{ route('admin.preferences',['theme_editor'=>'christmas']) }}#wheel-appearance" @if($editingTheme==='christmas') aria-current="page" @endif>Christmas</a></nav>
<form method="post" action="{{ route('admin.preferences.website-theme') }}" class="stack-form">
@csrf
<input type="hidden" name="website_theme" value="{{ $editingTheme }}">
<a href="{{ route('admin.preferences',['theme_editor'=>$editingTheme,'theme_defaults'=>1]) }}#wheel-appearance" style="font-size:12px;text-decoration:underline">Load theme defaults</a><small>Defaults are loaded into the editor only. Save or apply to keep them.</small>
<h3>{{ $editingTheme==='christmas'?'Christmas settings':'Cat Pastel settings' }}</h3>
@if($editingTheme==='christmas')
<p class="muted" style="font-size:12px">Midnight blue, snow-covered edges, hanging ornaments and festive colours, inspired by your reference.</p>
<div class="form-row"><label>Night sky colour<input type="color" name="background" value="{{ old('background',$themeConfig['background']) }}" required></label><label>Festive accent<input type="color" name="accent" value="{{ old('accent',$themeConfig['accent']) }}" required></label></div>
<label class="check"><input type="checkbox" name="snow" value="1" @checked(old('snow',$themeConfig['snow']))> Falling snow</label>
<label>Snow intensity<select name="snow_intensity"><option value="gentle" @selected(old('snow_intensity',$themeConfig['snow_intensity'])==='gentle')>Gentle</option><option value="normal" @selected(old('snow_intensity',$themeConfig['snow_intensity'])==='normal')>Normal</option></select></label>
<label class="check"><input type="checkbox" name="snow_mobile" value="1" @checked(old('snow_mobile',$themeConfig['snow_mobile']))> Allow snowfall on mobile</label><small>Snow never blocks controls. Reduced-motion preferences turn animated snow off.</small>
@else
<p class="muted" style="font-size:12px">Your existing pastel colours, cat decorations, patterned background and current wheel finish are preserved.</p>
@endif
<div class="form-row"><label>Outer rim colour<input type="color" name="rim" value="{{ old('rim',$themeConfig['rim']) }}" required></label><label>Prize image size (%)<input type="number" name="image_percent" min="10" max="100" value="{{ old('image_percent',$themeConfig['image_percent']) }}" required></label></div>
<div style="display:flex;gap:10px;flex-wrap:wrap"><button type="submit" class="button small secondary" formaction="{{ route('admin.preferences.website-theme.preview') }}" formtarget="_blank">Preview theme ↗</button><button class="button small secondary" type="submit" name="intent" value="save">Save theme settings</button><button class="button small" type="submit" name="intent" value="apply">Apply theme</button></div>
<small>Preview opens a new tab without saving. Save theme settings updates this theme only; Apply theme also makes it the customer website theme. Form and email designs remain shared.</small>
</form></article>
@endif