*/ public array $data = []; public string $selectedPreset = 'custom'; public function mount(): void { $this->fillForm(); } protected function fillForm(): void { $this->data = [ 'preset' => $this->getSetting('preset', 'default'), 'color_primary' => $this->getSetting('color_primary', '#eeb425'), 'color_background' => $this->getSetting('color_background', '#1a1a2e'), 'color_surface' => $this->getSetting('color_surface', '#2d2d44'), 'color_dropdown' => $this->getSetting('color_dropdown', '#2d2d44'), 'color_navbar' => $this->getSetting('color_navbar', '#2d2d44'), 'card_background' => $this->getSetting('card_background', '#2d2d44'), 'card_border_color' => $this->getSetting('card_border_color', '#4b5563'), 'color_navbar_text' => $this->getSetting('color_navbar_text', '#ffffff'), 'color_text' => $this->getSetting('color_text', '#ffffff'), 'color_text_muted' => $this->getSetting('color_text_muted', '#9ca3af'), 'color_accent' => $this->getSetting('color_accent', '#10b981'), 'dropdown_style' => $this->getSetting('dropdown_style', 'rounded'), 'dropdown_border' => $this->getSettingBool('dropdown_border', true), 'dropdown_shadow' => $this->getSetting('dropdown_shadow', 'medium'), 'font_family' => $this->getSetting('font_family', 'Nunito'), 'border_radius' => $this->getSetting('border_radius', '12'), 'border_color' => $this->getSetting('border_color', '#eeb425'), 'dark_mode' => $this->getSettingBool('dark_mode', true), 'animations' => $this->getSettingBool('animations', true), // Sizing settings 'size_navigation_font' => $this->getSetting('size_navigation_font', '14'), 'size_navigation_padding' => $this->getSetting('size_navigation_padding', '16'), 'size_navigation_height' => $this->getSetting('size_navigation_height', '60'), 'size_heading_h1' => $this->getSetting('size_heading_h1', '32'), 'size_heading_h2' => $this->getSetting('size_heading_h2', '24'), 'size_heading_h3' => $this->getSetting('size_heading_h3', '20'), 'size_body_text' => $this->getSetting('size_body_text', '16'), 'size_small_text' => $this->getSetting('size_small_text', '14'), 'size_button_text' => $this->getSetting('size_button_text', '14'), 'size_card_padding' => $this->getSetting('size_card_padding', '24'), 'size_icon_small' => $this->getSetting('size_icon_small', '16'), 'size_icon_medium' => $this->getSetting('size_icon_medium', '24'), 'size_icon_large' => $this->getSetting('size_icon_large', '32'), // Button settings from ButtonSettings 'button_enabled' => $this->getSettingBool('button_enabled', true), 'button_primary_color' => $this->getSetting('button_primary_color', '#eeb425'), 'button_secondary_color' => $this->getSetting('button_secondary_color', '#1a1a2e'), 'button_text_color' => $this->getSetting('button_text_color', '#1a1a2e'), 'button_hover_color' => $this->getSetting('button_hover_color', '#cf9d15'), 'button_border_color' => $this->getSetting('button_border_color', '#cf9d15'), 'button_border_width' => $this->getSetting('button_border_width', '2'), 'button_border_radius' => $this->getSetting('button_border_radius', '8'), 'button_font_size' => $this->getSetting('button_font_size', '14'), 'button_padding_x' => $this->getSetting('button_padding_x', '16'), 'button_padding_y' => $this->getSetting('button_padding_y', '8'), 'button_hover_scale' => $this->getSetting('button_hover_scale', '1.05'), 'button_shadow' => $this->getSetting('button_shadow', 'lg'), 'button_transition' => $this->getSetting('button_transition', 'all'), 'button_transition_duration' => $this->getSetting('button_transition_duration', '300'), 'toolbar_primary_color' => $this->getSetting('toolbar_primary_color', '#eeb425'), 'toolbar_hover_color' => $this->getSetting('toolbar_hover_color', '#cf9d15'), 'toolbar_border_color' => $this->getSetting('toolbar_border_color', '#cf9d15'), 'toolbar_text_color' => $this->getSetting('toolbar_text_color', '#1a1a2e'), 'button_border_only' => $this->getSettingBool('button_border_only', false), 'button_effects_enabled' => $this->getSettingBool('button_effects_enabled', false), 'button_effects_navigation' => $this->getSetting('button_effects_navigation', 'none'), 'button_effects_buttons' => $this->getSetting('button_effects_buttons', 'none'), 'button_effects_links' => $this->getSetting('button_effects_links', 'none'), 'button_effects_speed' => $this->getSetting('button_effects_speed', 'normal'), 'button_text_uppercase' => $this->getSettingBool('button_text_uppercase', false), 'button_font_weight' => $this->getSetting('button_font_weight', '600'), 'background_image' => $this->getSetting('background_image', ''), // Secondary button settings 'button_secondary_enabled' => $this->getSettingBool('button_secondary_enabled', true), 'button_secondary_btn_color' => $this->getSetting('button_secondary_color', '#22c55e'), 'button_secondary_text_color' => $this->getSetting('button_secondary_text_color', '#ffffff'), 'button_secondary_hover_color' => $this->getSetting('button_secondary_hover_color', '#16a34a'), 'button_secondary_border_color' => $this->getSetting('button_secondary_border_color', '#16a34a'), // Danger button settings 'button_danger_enabled' => $this->getSettingBool('button_danger_enabled', true), 'button_danger_color' => $this->getSetting('button_danger_color', '#ef4444'), 'button_danger_text_color' => $this->getSetting('button_danger_text_color', '#ffffff'), 'button_danger_hover_color' => $this->getSetting('button_danger_hover_color', '#dc2626'), 'button_danger_border_color' => $this->getSetting('button_danger_border_color', '#dc2626'), // Outline button settings 'button_outline_enabled' => $this->getSettingBool('button_outline_enabled', true), 'button_outline_color' => $this->getSetting('button_outline_color', '#eeb425'), 'button_outline_text_color' => $this->getSetting('button_outline_text_color', '#1a1a2e'), 'button_outline_hover_color' => $this->getSetting('button_outline_hover_color', '#cf9d15'), // Navigation icons 'nav_icon_discord_url' => $this->getSetting('nav_icon_discord_url', ''), 'nav_icon_radio' => $this->getSettingBool('nav_icon_radio', true), // Navbar settings 'navbar_height' => $this->getSetting('navbar_height', '64'), 'navbar_sticky' => $this->getSettingBool('navbar_sticky', true), 'navbar_shadow' => $this->getSettingBool('navbar_shadow', true), 'navbar_style' => $this->getSetting('navbar_style', 'default'), // Avatar settings 'avatar_border_radius' => $this->getSetting('avatar_border_radius', '8'), 'avatar_border' => $this->getSettingBool('avatar_border', true), 'avatar_border_color' => $this->getSetting('avatar_border_color', '#eeb425'), // Badge settings 'badge_background' => $this->getSetting('badge_background', '#eeb425'), 'badge_text_color' => $this->getSetting('badge_text_color', '#000000'), 'badge_border_radius' => $this->getSetting('badge_border_radius', '4'), // Shadow settings 'shadow_color' => $this->getSetting('shadow_color', '#000000'), 'shadow_opacity' => $this->getSetting('shadow_opacity', '20'), // Spinner 'spinner_color' => $this->getSetting('spinner_color', '#eeb425'), // Input settings 'input_background' => $this->getSetting('input_background', '#1f2937'), 'input_border_color' => $this->getSetting('input_border_color', '#4b5563'), 'input_text_color' => $this->getSetting('input_text_color', '#ffffff'), 'input_placeholder_color' => $this->getSetting('input_placeholder_color', '#9ca3af'), 'input_focus_color' => $this->getSetting('input_focus_color', '#eeb425'), // Link settings 'link_color' => $this->getSetting('link_color', '#eeb425'), 'link_hover_color' => $this->getSetting('link_hover_color', '#cf9d15'), 'link_underline' => $this->getSettingBool('link_underline', false), // Card settings 'card_border_width' => $this->getSetting('card_border_width', '1'), 'card_border_radius' => $this->getSetting('card_border_radius', '12'), // Page transition 'page_transition' => $this->getSettingBool('page_transition', true), // Header/Footer colors 'header_background' => $this->getSetting('header_background', '#2d2d44'), 'header_text_color' => $this->getSetting('header_text_color', '#ffffff'), 'header_link_color' => $this->getSetting('header_link_color', '#eeb425'), 'footer_background' => $this->getSetting('footer_background', '#2d2d44'), 'footer_text_color' => $this->getSetting('footer_text_color', '#ffffff'), 'footer_link_color' => $this->getSetting('footer_link_color', '#eeb425'), // Card colors 'card_background' => $this->getSetting('card_background', '#2d2d44'), 'card_border_color' => $this->getSetting('card_border_color', '#4b5563'), 'card_padding' => $this->getSetting('card_padding', '24'), // v1.2 Profile Page Customization 'profile_show_online_status' => $this->getSettingBool('profile_show_online_status', true), 'profile_show_guilds' => $this->getSettingBool('profile_show_guilds', true), 'profile_show_friends' => $this->getSettingBool('profile_show_friends', true), 'profile_show_guestbook' => $this->getSettingBool('profile_show_guestbook', true), 'profile_show_photos' => $this->getSettingBool('profile_show_photos', true), 'profile_show_badges' => $this->getSettingBool('profile_show_badges', true), 'profile_show_stats' => $this->getSettingBool('profile_show_stats', true), 'profile_show_activity' => $this->getSettingBool('profile_show_activity', true), 'profile_header_style' => $this->getSetting('profile_header_style', 'default'), 'profile_default_tab' => $this->getSetting('profile_default_tab', 'guestbook'), // v1.2 Custom CSS 'custom_css_enabled' => $this->getSettingBool('custom_css_enabled', false), 'custom_css' => $this->getSetting('custom_css', ''), 'custom_js_enabled' => $this->getSettingBool('custom_js_enabled', false), 'custom_js' => $this->getSetting('custom_js', ''), // v1.2 Advanced Header/Footer 'header_custom_html' => $this->getSetting('header_custom_html', ''), 'footer_custom_html' => $this->getSetting('footer_custom_html', ''), 'footer_show_copyright' => $this->getSettingBool('footer_show_copyright', true), 'footer_show_links' => $this->getSettingBool('footer_show_links', true), // v1.3 PWA Settings 'pwa_enabled' => $this->getSettingBool('pwa_enabled', false), 'pwa_name' => $this->getSetting('pwa_name', 'Epicnabbo Hotel'), 'pwa_short_name' => $this->getSetting('pwa_short_name', 'Epicnabbo'), 'pwa_description' => $this->getSetting('pwa_description', 'Welcome to Epicnabbo - Your Habbo Hotel'), 'pwa_theme_color' => $this->getSetting('pwa_theme_color', '#eeb425'), 'pwa_background_color' => $this->getSetting('pwa_background_color', '#1a1a2e'), ]; $this->selectedPreset = $this->data['preset']; } protected function getSetting(string $key, string $default = ''): string { /** @var WebsiteSetting|null $setting */ $setting = WebsiteSetting::where('key', $key)->first(); return $setting?->value ?? $default; } protected function getSettingBool(string $key, bool $default = false): bool { /** @var WebsiteSetting|null $setting */ $setting = WebsiteSetting::where('key', $key)->first(); $value = $setting?->value; return $value !== null ? (bool) $value : $default; } protected function saveSettings(array $keys): void { foreach ($keys as $key) { if (isset($this->data[$key]) && is_string($key)) { WebsiteSetting::updateOrCreate( ['key' => $key], ['value' => $this->data[$key]], ); } } } protected function saveBoolSettings(array $keys): void { foreach ($keys as $key) { if (isset($this->data[$key]) && is_string($key)) { WebsiteSetting::updateOrCreate( ['key' => $key], ['value' => $this->data[$key] ? '1' : '0'], ); } } } protected function exportSettingsToFile(): void { try { $settingsFile = base_path('theme-settings-export.json'); $exportData = [ 'exported_at' => now()->toDateTimeString(), 'settings' => $this->data, ]; file_put_contents( $settingsFile, json_encode($exportData, JSON_PRETTY_PRINT | JSON_UNESCAPED_SLASHES), ); } catch (\Throwable) { // Silent fail - don't break the form } } public function applyPreset(string $preset): void { $presets = [ 'default' => [ 'color_primary' => '#eeb425', 'color_background' => '#f3f4f6', 'color_surface' => '#ffffff', 'color_dropdown' => '#ffffff', 'color_navbar' => '#ffffff', 'color_navbar_text' => '#1f2937', 'color_text' => '#1f2937', 'color_text_muted' => '#6b7280', 'color_accent' => '#10b981', 'input_text_color' => '#1f2937', 'input_placeholder_color' => '#6b7280', 'input_border_color' => '#d1d5db', 'input_background' => '#ffffff', 'input_focus_color' => '#eeb425', 'button_primary_color' => '#eeb425', 'button_text_color' => '#1f2937', 'button_hover_color' => '#cf9d15', 'button_border_color' => '#cf9d15', 'toolbar_primary_color' => '#eeb425', 'toolbar_text_color' => '#1f2937', 'toolbar_hover_color' => '#cf9d15', 'toolbar_border_color' => '#cf9d15', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'button_text_uppercase' => false, 'button_font_weight' => '600', 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'small', 'font_family' => 'Nunito', 'border_radius' => '12', 'border_color' => '#eeb425', 'background_image' => '', ], 'modern' => [ 'color_primary' => '#6366f1', 'color_background' => '#0f172a', 'color_surface' => '#1e293b', 'color_dropdown' => '#1e293b', 'color_navbar' => '#1e293b', 'color_navbar_text' => '#f8fafc', 'color_text' => '#f8fafc', 'color_text_muted' => '#94a3b8', 'color_accent' => '#22d3ee', 'input_text_color' => '#f8fafc', 'input_placeholder_color' => '#94a3af', 'input_border_color' => '#475569', 'input_background' => '#1e293b', 'input_focus_color' => '#6366f1', 'button_primary_color' => '#6366f1', 'button_text_color' => '#ffffff', 'button_hover_color' => '#4f46e5', 'button_border_color' => '#6366f1', 'toolbar_primary_color' => '#6366f1', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#4f46e5', 'toolbar_border_color' => '#6366f1', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'large', 'font_family' => 'Inter', 'border_radius' => '8', 'border_color' => '#6366f1', ], 'retro' => [ 'color_primary' => '#f43f5e', 'color_background' => '#18181b', 'color_surface' => '#27272a', 'color_dropdown' => '#27272a', 'color_navbar' => '#18181b', 'color_navbar_text' => '#fafafa', 'color_text' => '#fafafa', 'color_text_muted' => '#a1a1aa', 'color_accent' => '#fbbf24', 'input_text_color' => '#fafafa', 'input_placeholder_color' => '#a1a1aa', 'input_border_color' => '#3f3f46', 'input_background' => '#27272a', 'button_primary_color' => '#f43f5e', 'button_text_color' => '#ffffff', 'button_hover_color' => '#e11d48', 'button_border_color' => '#f43f5e', 'toolbar_primary_color' => '#f43f5e', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#e11d48', 'toolbar_border_color' => '#f43f5e', 'button_border_width' => '2', 'button_border_radius' => '0', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.0', 'button_shadow' => 'none', 'button_transition' => 'none', 'button_transition_duration' => '0', 'button_border_only' => false, 'dropdown_style' => 'square', 'dropdown_border' => true, 'dropdown_shadow' => 'none', 'font_family' => 'Pixel', 'border_radius' => '0', 'border_color' => '#f43f5e', ], 'nature' => [ 'color_primary' => '#22c55e', 'color_background' => '#052e16', 'color_surface' => '#14532d', 'color_dropdown' => '#14532d', 'color_navbar' => '#052e16', 'color_navbar_text' => '#f0fdf4', 'color_text' => '#f0fdf4', 'color_text_muted' => '#86efac', 'color_accent' => '#34d399', 'input_text_color' => '#f0fdf4', 'input_placeholder_color' => '#86efac', 'input_border_color' => '#166534', 'input_background' => '#14532d', 'button_primary_color' => '#22c55e', 'button_text_color' => '#ffffff', 'button_hover_color' => '#16a34a', 'button_border_color' => '#22c55e', 'toolbar_primary_color' => '#22c55e', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#16a34a', 'toolbar_border_color' => '#22c55e', 'toolbar_primary_color' => '#22c55e', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#16a34a', 'toolbar_border_color' => '#22c55e', 'button_border_width' => '2', 'button_border_radius' => '20', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => false, 'dropdown_shadow' => 'medium', 'font_family' => 'Nunito', 'border_radius' => '20', 'border_color' => '#22c55e', ], 'ocean' => [ 'color_primary' => '#0ea5e9', 'color_background' => '#0c4a6e', 'color_surface' => '#164e63', 'color_dropdown' => '#164e63', 'color_navbar' => '#164e63', 'color_navbar_text' => '#f0f9ff', 'color_text' => '#f0f9ff', 'color_text_muted' => '#7dd3fc', 'color_accent' => '#06b6d4', 'input_text_color' => '#f0f9ff', 'input_placeholder_color' => '#7dd3fc', 'input_border_color' => '#155e75', 'input_background' => '#164e63', 'button_primary_color' => '#0ea5e9', 'button_text_color' => '#ffffff', 'button_hover_color' => '#0284c7', 'button_border_color' => '#0ea5e9', 'toolbar_primary_color' => '#0ea5e9', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#0284c7', 'toolbar_border_color' => '#0ea5e9', 'button_border_width' => '2', 'button_border_radius' => '16', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'large', 'font_family' => 'Inter', 'border_radius' => '16', 'border_color' => '#0ea5e9', 'background_image' => '/assets/images/themes/arctic-ice.png', ], 'sunset' => [ 'color_primary' => '#f97316', 'color_background' => '#1c1917', 'color_surface' => '#292524', 'color_dropdown' => '#292524', 'color_navbar' => '#1c1917', 'color_navbar_text' => '#fafaf9', 'color_text' => '#fafaf9', 'color_text_muted' => '#a8a29e', 'color_accent' => '#fb923c', 'input_text_color' => '#fafaf9', 'input_placeholder_color' => '#a8a29e', 'input_border_color' => '#44403c', 'input_background' => '#292524', 'button_primary_color' => '#f97316', 'button_text_color' => '#ffffff', 'button_hover_color' => '#ea580c', 'button_border_color' => '#f97316', 'toolbar_primary_color' => '#f97316', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#ea580c', 'toolbar_border_color' => '#f97316', 'button_border_width' => '2', 'button_border_radius' => '24', 'button_font_size' => '14', 'button_padding_x' => '24', 'button_padding_y' => '12', 'button_hover_scale' => '1.05', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => false, 'dropdown_shadow' => 'large', 'font_family' => 'Poppins', 'border_radius' => '24', 'border_color' => '#f97316', ], 'royal' => [ 'color_primary' => '#8b5cf6', 'color_background' => '#1e1b4b', 'color_surface' => '#312e81', 'color_dropdown' => '#312e81', 'color_navbar' => '#1e1b4b', 'color_navbar_text' => '#ede9fe', 'color_text' => '#ede9fe', 'color_text_muted' => '#a5b4fc', 'color_accent' => '#c4b5fd', 'input_text_color' => '#ede9fe', 'input_placeholder_color' => '#a5b4fc', 'input_border_color' => '#4c1d95', 'input_background' => '#312e81', 'button_primary_color' => '#8b5cf6', 'button_text_color' => '#ffffff', 'button_hover_color' => '#7c3aed', 'button_border_color' => '#8b5cf6', 'toolbar_primary_color' => '#8b5cf6', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#7c3aed', 'toolbar_border_color' => '#8b5cf6', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Playfair Display', 'border_radius' => '8', 'border_color' => '#8b5cf6', ], 'atom_original' => [ 'color_primary' => '#eeb425', 'color_background' => '#f3f4f6', 'color_surface' => '#ffffff', 'color_dropdown' => '#ffffff', 'color_navbar' => '#ffffff', 'color_navbar_text' => '#1f2937', 'color_text' => '#1f2937', 'color_text_muted' => '#6b7280', 'color_accent' => '#10b981', 'input_text_color' => '#1f2937', 'input_placeholder_color' => '#6b7280', 'input_border_color' => '#d1d5db', 'input_background' => '#ffffff', 'input_focus_color' => '#eeb425', 'button_primary_color' => '#eeb425', 'button_text_color' => '#1f2937', 'button_hover_color' => '#cf9d15', 'button_border_color' => '#cf9d15', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'small', 'font_family' => 'Poppins', 'border_radius' => '8', 'border_color' => '#eeb425', ], 'galaxy' => [ 'color_primary' => '#c0c0c0', 'color_background' => '#0a0a1a', 'color_surface' => '#1a1a2e', 'color_dropdown' => '#1a1a2e', 'color_navbar' => '#0a0a1a', 'color_navbar_text' => '#e2e8f0', 'color_text' => '#e2e8f0', 'color_text_muted' => '#94a3b8', 'color_accent' => '#60a5fa', 'input_text_color' => '#e2e8f0', 'input_placeholder_color' => '#94a3b8', 'input_border_color' => '#334155', 'input_background' => '#1a1a2e', 'button_primary_color' => '#c0c0c0', 'button_text_color' => '#0a0a1a', 'button_hover_color' => '#a3a3a3', 'button_border_color' => '#c0c0c0', 'toolbar_primary_color' => '#c0c0c0', 'toolbar_text_color' => '#0a0a1a', 'toolbar_hover_color' => '#a3a3a3', 'toolbar_border_color' => '#c0c0c0', 'button_border_width' => '2', 'button_border_radius' => '16', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => false, 'dropdown_shadow' => 'large', 'font_family' => 'Inter', 'border_radius' => '16', 'border_color' => '#c0c0c0', 'background_image' => '/assets/images/themes/arctic-ice.png', ], 'minimal' => [ 'color_primary' => '#000000', 'color_background' => '#ffffff', 'color_surface' => '#f9fafb', 'color_dropdown' => '#ffffff', 'color_navbar' => '#ffffff', 'color_navbar_text' => '#111827', 'color_text' => '#111827', 'color_text_muted' => '#6b7280', 'color_accent' => '#3b82f6', 'input_text_color' => '#111827', 'input_placeholder_color' => '#6b7280', 'input_border_color' => '#d1d5db', 'input_background' => '#ffffff', 'input_focus_color' => '#000000', 'button_primary_color' => '#000000', 'button_text_color' => '#ffffff', 'button_hover_color' => '#374151', 'button_border_color' => '#000000', 'toolbar_primary_color' => '#000000', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#374151', 'toolbar_border_color' => '#000000', 'button_border_width' => '2', 'button_border_radius' => '0', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.0', 'button_shadow' => 'sm', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'dropdown_style' => 'square', 'dropdown_border' => true, 'dropdown_shadow' => 'small', 'font_family' => 'Inter', 'border_radius' => '0', 'border_color' => '#000000', ], 'cyberpunk' => [ 'color_primary' => '#f0f', 'color_background' => '#0a0a0f', 'color_surface' => '#1a1a2e', 'color_dropdown' => '#1a1a2e', 'color_navbar' => '#0a0a0f', 'color_navbar_text' => '#0ff', 'color_text' => '#b3e0e0', 'color_text_muted' => '#f0f', 'color_accent' => '#ff0', 'input_text_color' => '#b3e0e0', 'input_placeholder_color' => '#806080', 'input_border_color' => '#ec4899', 'input_background' => '#1a1a2e', 'input_focus_color' => '#f0f', 'button_primary_color' => '#f0f', 'button_text_color' => '#000', 'button_hover_color' => '#d0d', 'button_border_color' => '#f0f', 'button_border_width' => '2', 'button_border_radius' => '4', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.1', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '150', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'large', 'font_family' => 'Inter', 'border_radius' => '4', 'border_color' => '#f0f', ], 'christmas' => [ 'color_primary' => '#dc2626', 'color_background' => '#0f172a', 'color_surface' => '#1e293b', 'color_dropdown' => '#1e293b', 'color_navbar' => '#dc2626', 'color_navbar_text' => '#ffffff', 'color_text' => '#ffffff', 'color_text_muted' => '#86efac', 'color_accent' => '#22c55e', 'input_text_color' => '#ffffff', 'input_placeholder_color' => '#86efac', 'input_border_color' => '#334155', 'input_background' => '#1e293b', 'button_primary_color' => '#dc2626', 'button_text_color' => '#ffffff', 'button_hover_color' => '#b91c1c', 'button_border_color' => '#dc2626', 'button_border_width' => '2', 'button_border_radius' => '12', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Nunito', 'border_radius' => '12', 'border_color' => '#dc2626', ], 'halloween' => [ 'color_primary' => '#f97316', 'color_background' => '#0c0a09', 'color_surface' => '#1c1917', 'color_dropdown' => '#1c1917', 'color_navbar' => '#0c0a09', 'color_navbar_text' => '#f97316', 'color_text' => '#fafaf9', 'color_text_muted' => '#78716c', 'color_accent' => '#a855f7', 'input_text_color' => '#fafaf9', 'input_placeholder_color' => '#78716c', 'input_border_color' => '#44403c', 'input_background' => '#1c1917', 'button_primary_color' => '#f97316', 'button_text_color' => '#000', 'button_hover_color' => '#ea580c', 'button_border_color' => '#f97316', 'toolbar_primary_color' => '#f97316', 'toolbar_text_color' => '#ffffff', 'toolbar_hover_color' => '#ea580c', 'toolbar_border_color' => '#f97316', 'button_border_width' => '2', 'button_border_radius' => '20', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => false, 'dropdown_shadow' => 'large', 'font_family' => 'Poppins', 'border_radius' => '20', 'border_color' => '#f97316', ], 'valentine' => [ 'color_primary' => '#ec4899', 'color_background' => '#fdf2f8', 'color_surface' => '#fce7f3', 'color_dropdown' => '#ffffff', 'color_navbar' => '#ec4899', 'color_navbar_text' => '#ffffff', 'color_text' => '#831843', 'color_text_muted' => '#db2777', 'color_accent' => '#f472b6', 'input_text_color' => '#831843', 'input_placeholder_color' => '#db2777', 'input_border_color' => '#fbcfe8', 'input_background' => '#ffffff', 'input_focus_color' => '#ec4899', 'button_primary_color' => '#ec4899', 'button_text_color' => '#ffffff', 'button_hover_color' => '#db2777', 'button_border_color' => '#ec4899', 'button_border_width' => '2', 'button_border_radius' => '16', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Playfair Display', 'border_radius' => '16', 'border_color' => '#ec4899', ], 'matrix' => [ 'color_primary' => '#00ff00', 'color_background' => '#000000', 'color_surface' => '#0a0a0a', 'color_dropdown' => '#0a0a0a', 'color_navbar' => '#000000', 'color_navbar_text' => '#00ff00', 'color_text' => '#00ff00', 'color_text_muted' => '#00cc00', 'color_accent' => '#00ff41', 'input_text_color' => '#00ff00', 'input_placeholder_color' => '#00cc00', 'input_border_color' => '#003300', 'input_background' => '#0a0a0a', 'button_primary_color' => '#00ff00', 'button_text_color' => '#000000', 'button_hover_color' => '#00cc00', 'button_border_color' => '#00ff00', 'button_border_width' => '2', 'button_border_radius' => '0', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.0', 'button_shadow' => 'none', 'button_transition' => 'none', 'button_transition_duration' => '0', 'button_border_only' => false, 'dropdown_style' => 'square', 'dropdown_border' => true, 'dropdown_shadow' => 'none', 'font_family' => 'Roboto', 'border_radius' => '0', 'border_color' => '#00ff00', ], 'discord' => [ 'color_primary' => '#5865f2', 'color_background' => '#36393f', 'color_surface' => '#2f3136', 'color_dropdown' => '#202225', 'color_navbar' => '#202225', 'color_navbar_text' => '#ffffff', 'color_text' => '#dcddde', 'color_text_muted' => '#72767d', 'color_accent' => '#5865f2', 'input_text_color' => '#dcddde', 'input_placeholder_color' => '#72767d', 'input_border_color' => '#202225', 'input_background' => '#2f3136', 'button_primary_color' => '#5865f2', 'button_text_color' => '#ffffff', 'button_hover_color' => '#4752c4', 'button_border_color' => '#5865f2', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.02', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => false, 'dropdown_shadow' => 'large', 'font_family' => 'Inter', 'border_radius' => '8', 'border_color' => '#5865f2', ], 'neon' => [ 'color_primary' => '#ff00ff', 'color_background' => '#0f0f23', 'color_surface' => '#1a1a3e', 'color_dropdown' => '#1a1a3e', 'color_navbar' => '#0f0f23', 'color_navbar_text' => '#00ffff', 'color_text' => '#e0b0e0', 'color_text_muted' => '#9400d3', 'color_accent' => '#00ffff', 'input_text_color' => '#e0b0e0', 'input_placeholder_color' => '#b366b3', 'input_border_color' => '#4c1d95', 'input_background' => '#1a1a3e', 'input_focus_color' => '#ff00ff', 'button_primary_color' => '#ff00ff', 'button_text_color' => '#000000', 'button_hover_color' => '#d900d9', 'button_border_color' => '#ff00ff', 'button_border_width' => '2', 'button_border_radius' => '24', 'button_font_size' => '14', 'button_padding_x' => '24', 'button_padding_y' => '12', 'button_hover_scale' => '1.1', 'button_shadow' => 'xl', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'xl', 'font_family' => 'Inter', 'border_radius' => '24', 'border_color' => '#ff00ff', ], 'coffee' => [ 'color_primary' => '#8b5a2b', 'color_background' => '#f5f5dc', 'color_surface' => '#faf0e6', 'color_dropdown' => '#fff8dc', 'color_navbar' => '#8b5a2b', 'color_navbar_text' => '#fff8dc', 'color_text' => '#4a3728', 'color_text_muted' => '#a0826d', 'color_accent' => '#d2691e', 'input_text_color' => '#4a3728', 'input_placeholder_color' => '#a0826d', 'input_border_color' => '#d4c4b0', 'input_background' => '#fff8dc', 'input_focus_color' => '#8b5a2b', 'button_primary_color' => '#8b5a2b', 'button_text_color' => '#fff8dc', 'button_hover_color' => '#6f4620', 'button_border_color' => '#8b5a2b', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Playfair Display', 'border_radius' => '8', 'border_color' => '#8b5a2b', ], 'strawberry' => [ 'color_primary' => '#ff6b6b', 'color_background' => '#fff5f5', 'color_surface' => '#ffe0e0', 'color_dropdown' => '#ffffff', 'color_navbar' => '#ff6b6b', 'color_navbar_text' => '#ffffff', 'color_text' => '#c92a2a', 'color_text_muted' => '#fa5252', 'color_accent' => '#ff8787', 'input_text_color' => '#c92a2a', 'input_placeholder_color' => '#fa5252', 'input_border_color' => '#fed7d7', 'input_background' => '#ffffff', 'input_focus_color' => '#ff6b6b', 'button_primary_color' => '#ff6b6b', 'button_text_color' => '#ffffff', 'button_hover_color' => '#fa5252', 'button_border_color' => '#ff6b6b', 'button_border_width' => '2', 'button_border_radius' => '16', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Nunito', 'border_radius' => '16', 'border_color' => '#ff6b6b', 'background_image' => '', ], 'lavender' => [ 'color_primary' => '#a855f7', 'color_background' => '#faf5ff', 'color_surface' => '#f3e8ff', 'color_dropdown' => '#ffffff', 'color_navbar' => '#a855f7', 'color_navbar_text' => '#ffffff', 'color_text' => '#581c87', 'color_text_muted' => '#9333ea', 'color_accent' => '#c084fc', 'input_text_color' => '#581c87', 'input_placeholder_color' => '#9333ea', 'input_border_color' => '#e9d5ff', 'input_background' => '#ffffff', 'input_focus_color' => '#a855f7', 'button_primary_color' => '#a855f7', 'button_text_color' => '#ffffff', 'button_hover_color' => '#9333ea', 'button_border_color' => '#a855f7', 'button_border_width' => '2', 'button_border_radius' => '12', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Inter', 'border_radius' => '12', 'border_color' => '#a855f7', 'background_image' => '', ], 'midnight' => [ 'color_primary' => '#60a5fa', 'color_background' => '#020617', 'color_surface' => '#0f172a', 'color_dropdown' => '#0f172a', 'color_navbar' => '#020617', 'color_navbar_text' => '#e2e8f0', 'color_text' => '#e2e8f0', 'color_text_muted' => '#64748b', 'color_accent' => '#38bdf8', 'input_text_color' => '#e2e8f0', 'input_placeholder_color' => '#64748b', 'input_border_color' => '#1e293b', 'input_background' => '#0f172a', 'button_primary_color' => '#3b82f6', 'button_text_color' => '#ffffff', 'button_hover_color' => '#2563eb', 'button_border_color' => '#3b82f6', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.05', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'large', 'font_family' => 'Inter', 'border_radius' => '8', 'border_color' => '#60a5fa', 'background_image' => '', ], 'golden' => [ 'color_primary' => '#fbbf24', 'color_background' => '#451a03', 'color_surface' => '#78350f', 'color_dropdown' => '#92400e', 'color_navbar' => '#451a03', 'color_navbar_text' => '#fef3c7', 'color_text' => '#fef3c7', 'color_text_muted' => '#d97706', 'color_accent' => '#f59e0b', 'input_text_color' => '#fef3c7', 'input_placeholder_color' => '#d97706', 'input_border_color' => '#92400e', 'input_background' => '#78350f', 'button_primary_color' => '#fbbf24', 'button_text_color' => '#451a03', 'button_hover_color' => '#f59e0b', 'button_border_color' => '#fbbf24', 'button_border_width' => '2', 'button_border_radius' => '12', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'large', 'font_family' => 'Playfair Display', 'border_radius' => '12', 'border_color' => '#fbbf24', 'background_image' => '/assets/images/themes/golden-pattern.png', ], 'arctic' => [ 'color_primary' => '#06b6d4', 'color_background' => '#ecfeff', 'color_surface' => '#cffafe', 'color_dropdown' => '#a5f3fc', 'color_navbar' => '#06b6d4', 'color_navbar_text' => '#ffffff', 'color_text' => '#164e63', 'color_text_muted' => '#0891b2', 'color_accent' => '#22d3ee', 'input_text_color' => '#164e63', 'input_placeholder_color' => '#0891b2', 'input_border_color' => '#a5f3fc', 'input_background' => '#ffffff', 'input_focus_color' => '#06b6d4', 'button_primary_color' => '#06b6d4', 'button_text_color' => '#ffffff', 'button_hover_color' => '#0891b2', 'button_border_color' => '#06b6d4', 'button_border_width' => '2', 'button_border_radius' => '16', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Inter', 'border_radius' => '16', 'border_color' => '#06b6d4', 'background_image' => '/assets/images/themes/arctic-ice.png', ], 'magma' => [ 'color_primary' => '#ef4444', 'color_background' => '#1c1917', 'color_surface' => '#292524', 'color_dropdown' => '#44403c', 'color_navbar' => '#1c1917', 'color_navbar_text' => '#fca5a5', 'color_text' => '#fecaca', 'color_text_muted' => '#b91c1c', 'color_accent' => '#f87171', 'input_text_color' => '#fecaca', 'input_placeholder_color' => '#b91c1c', 'input_border_color' => '#57534e', 'input_background' => '#292524', 'button_primary_color' => '#ef4444', 'button_text_color' => '#ffffff', 'button_hover_color' => '#dc2626', 'button_border_color' => '#ef4444', 'button_border_width' => '2', 'button_border_radius' => '4', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.05', 'button_shadow' => 'xl', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'xl', 'font_family' => 'Roboto', 'border_radius' => '4', 'border_color' => '#ef4444', ], 'forest' => [ 'color_primary' => '#16a34a', 'color_background' => '#052e16', 'color_surface' => '#14532d', 'color_dropdown' => '#166534', 'color_navbar' => '#052e16', 'color_navbar_text' => '#86efac', 'color_text' => '#bbf7d0', 'color_text_muted' => '#15803d', 'color_accent' => '#4ade80', 'input_text_color' => '#bbf7d0', 'input_placeholder_color' => '#15803d', 'input_border_color' => '#166534', 'input_background' => '#14532d', 'button_primary_color' => '#16a34a', 'button_text_color' => '#ffffff', 'button_hover_color' => '#15803d', 'button_border_color' => '#16a34a', 'button_border_width' => '2', 'button_border_radius' => '8', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'rounded', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Nunito', 'border_radius' => '8', 'border_color' => '#16a34a', ], 'sakura' => [ 'color_primary' => '#f472b6', 'color_background' => '#fdf2f8', 'color_surface' => '#fce7f3', 'color_dropdown' => '#fbcfe8', 'color_navbar' => '#f472b6', 'color_navbar_text' => '#ffffff', 'color_text' => '#be185d', 'color_text_muted' => '#db2777', 'color_accent' => '#f9a8d4', 'input_text_color' => '#be185d', 'input_placeholder_color' => '#db2777', 'input_border_color' => '#fbcfe8', 'input_background' => '#ffffff', 'input_focus_color' => '#f472b6', 'button_primary_color' => '#f472b6', 'button_text_color' => '#ffffff', 'button_hover_color' => '#ec4899', 'button_border_color' => '#f472b6', 'button_border_width' => '2', 'button_border_radius' => '20', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'sm', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'small', 'font_family' => 'Poppins', 'border_radius' => '20', 'border_color' => '#f472b6', ], 'space' => [ 'color_primary' => '#a855f7', 'color_background' => '#0f0518', 'color_surface' => '#1e0b33', 'color_dropdown' => '#2d1654', 'color_navbar' => '#0f0518', 'color_navbar_text' => '#e9d5ff', 'color_text' => '#f3e8ff', 'color_text_muted' => '#9333ea', 'color_accent' => '#c084fc', 'input_text_color' => '#f3e8ff', 'input_placeholder_color' => '#9333ea', 'input_border_color' => '#581c87', 'input_background' => '#1e0b33', 'button_primary_color' => '#a855f7', 'button_text_color' => '#ffffff', 'button_hover_color' => '#9333ea', 'button_border_color' => '#a855f7', 'button_border_width' => '2', 'button_border_radius' => '16', 'button_font_size' => '14', 'button_padding_x' => '20', 'button_padding_y' => '10', 'button_hover_scale' => '1.05', 'button_shadow' => 'xl', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => false, 'dropdown_shadow' => 'xl', 'font_family' => 'Inter', 'border_radius' => '16', 'border_color' => '#a855f7', 'background_image' => '/assets/images/themes/arctic-ice.png', ], 'bubblegum' => [ 'color_primary' => '#ff69b4', 'color_background' => '#fff0f5', 'color_surface' => '#ffe4e1', 'color_dropdown' => '#ffffff', 'color_navbar' => '#ff69b4', 'color_navbar_text' => '#ffffff', 'color_text' => '#c71585', 'color_text_muted' => '#ff1493', 'color_accent' => '#ff1493', 'input_text_color' => '#c71585', 'input_placeholder_color' => '#ff1493', 'input_border_color' => '#ffb6c1', 'input_background' => '#ffffff', 'input_focus_color' => '#ff69b4', 'button_primary_color' => '#ff69b4', 'button_text_color' => '#ffffff', 'button_hover_color' => '#ff1493', 'button_border_color' => '#ff69b4', 'button_border_width' => '2', 'button_border_radius' => '24', 'button_font_size' => '14', 'button_padding_x' => '24', 'button_padding_y' => '12', 'button_hover_scale' => '1.05', 'button_shadow' => 'md', 'button_transition' => 'all', 'button_transition_duration' => '300', 'button_border_only' => false, 'dropdown_style' => 'pill', 'dropdown_border' => true, 'dropdown_shadow' => 'medium', 'font_family' => 'Poppins', 'border_radius' => '24', 'border_color' => '#ff69b4', ], 'obsidian' => [ 'color_primary' => '#71717a', 'color_background' => '#09090b', 'color_surface' => '#18181b', 'color_dropdown' => '#27272a', 'color_navbar' => '#000000', 'color_navbar_text' => '#a1a1aa', 'color_text' => '#d4d4d8', 'color_text_muted' => '#52525b', 'color_accent' => '#a1a1aa', 'input_text_color' => '#d4d4d8', 'input_placeholder_color' => '#52525b', 'input_border_color' => '#3f3f46', 'input_background' => '#18181b', 'button_primary_color' => '#52525b', 'button_text_color' => '#fafafa', 'button_hover_color' => '#3f3f46', 'button_border_color' => '#52525b', 'button_border_width' => '2', 'button_border_radius' => '2', 'button_font_size' => '14', 'button_padding_x' => '16', 'button_padding_y' => '8', 'button_hover_scale' => '1.0', 'button_shadow' => 'lg', 'button_transition' => 'all', 'button_transition_duration' => '200', 'button_border_only' => false, 'dropdown_style' => 'square', 'dropdown_border' => false, 'dropdown_shadow' => 'large', 'font_family' => 'Inter', 'border_radius' => '2', 'border_color' => '#71717a', ], ]; if (isset($presets[$preset])) { foreach ($presets[$preset] as $key => $value) { $this->data[$key] = $value; } $this->data['preset'] = $preset; $this->selectedPreset = $preset; } } public function form(Schema $schema): Schema { return $schema ->components([ // PRESETS Section::make(__('Choose a Style')) ->description(__('Choose a preset style or customize yourself')) ->schema([ Select::make('preset') ->label(__('Style')) ->options([ 'custom' => '✏️ Custom (eigen)', 'atom_original' => '🏨 Atom (Origineel)', 'galaxy' => '🌌 Galaxy (Nacht)', 'default' => '🌟 Default (Goud)', 'modern' => '💜 Modern (Paars)', 'retro' => '🎮 Retro (Rood/Zwart)', 'nature' => '🌿 Nature (Groen)', 'ocean' => '🌊 Ocean (Blauw)', 'sunset' => '🌅 Sunset (Oranje)', 'royal' => '👑 Royal (Paars)', 'minimal' => '⚪ Minimal (Zwart/Wit)', 'cyberpunk' => '⚡ Cyberpunk (Roze/Cyaan)', 'christmas' => '🎄 Christmas (Rood/Groen)', 'halloween' => '🎃 Halloween (Oranje/Paars)', 'valentine' => '💝 Valentine (Roze)', 'matrix' => '💻 Matrix (Groen/Zwart)', 'discord' => '💬 Discord (Blauw/Grijs)', 'neon' => '💡 Neon (Roze/Blauw)', 'coffee' => '☕ Coffee (Bruin/Creme)', 'strawberry' => '🍓 Strawberry (Rood/Roze)', 'lavender' => '💜 Lavender (Paars/Wit)', 'midnight' => '🌙 Midnight (Donkerblauw)', 'golden' => '✨ Golden (Goud/Bruin)', 'arctic' => '❄️ Arctic (Cyaan/Wit)', 'magma' => '🔥 Magma (Rood/Zwart)', 'forest' => '🌲 Forest (Groen/Donker)', 'sakura' => '🌸 Sakura (Roze/Wit)', 'space' => '🚀 Space (Paars/Zwart)', 'bubblegum' => '🍬 Bubblegum (Roze)', 'obsidian' => '🖤 Obsidian (Zwart/Grijs)', ]) ->allowHtml() ->default('custom') ->reactive() ->afterStateUpdated(function ($state) { if ($state !== 'custom') { $this->applyPreset($state); } }), ]), // BRAND COLOR Section::make(__('Primary Color')) ->description(__('The primary color of your website')) ->schema([ ColorPicker::make('color_primary') ->label(__('Color')) ->default('#eeb425') ->helperText(__('This color is used for logo, buttons, etc.')), ]), // COLORS Section::make(__('Colors')) ->schema([ ColorPicker::make('color_background') ->label(__('Background')) ->default('#1a1a2e'), ColorPicker::make('color_surface') ->label(__('Surface')) ->default('#2d2d44') ->helperText(__('For cards and containers')), ColorPicker::make('color_dropdown') ->label(__('Dropdown')) ->default('#2d2d44') ->helperText(__('Background color of dropdown menus')), ColorPicker::make('color_navbar') ->label(__('Navbar')) ->default('#2d2d44') ->helperText(__('Background color of the navbar')), ColorPicker::make('color_navbar_text') ->label(__('Navbar Text')) ->default('#ffffff') ->helperText(__('Text color in the navbar')), ColorPicker::make('color_text') ->label(__('Text')) ->default('#ffffff'), ColorPicker::make('color_text_muted') ->label(__('Muted Text')) ->default('#9ca3af') ->helperText(__('For captions and placeholder text')), ColorPicker::make('color_accent') ->label(__('Accent')) ->default('#10b981') ->helperText(__('For success messages, links, etc.')), ]), // SIZING Section::make(__('Element Sizes')) ->description(__('Adjust the size of various elements')) ->schema([ TextInput::make('size_navigation_font') ->label(__('Navigation font size (px)')) ->numeric() ->minValue(10) ->maxValue(24) ->default(14), TextInput::make('size_navigation_padding') ->label(__('Navigation padding (px)')) ->numeric() ->minValue(8) ->maxValue(40) ->default(16), TextInput::make('size_navigation_height') ->label(__('Navigation height (px)')) ->numeric() ->minValue(40) ->maxValue(120) ->default(60), TextInput::make('size_heading_h1') ->label(__('Heading H1 size (px)')) ->numeric() ->minValue(20) ->maxValue(64) ->default(32), TextInput::make('size_heading_h2') ->label(__('Heading H2 size (px)')) ->numeric() ->minValue(16) ->maxValue(48) ->default(24), TextInput::make('size_heading_h3') ->label(__('Heading H3 size (px)')) ->numeric() ->minValue(14) ->maxValue(36) ->default(20), TextInput::make('size_body_text') ->label(__('Body text size (px)')) ->numeric() ->minValue(12) ->maxValue(24) ->default(16), TextInput::make('size_small_text') ->label(__('Small text size (px)')) ->numeric() ->minValue(10) ->maxValue(20) ->default(14), TextInput::make('size_button_text') ->label(__('Button text size (px)')) ->numeric() ->minValue(10) ->maxValue(24) ->default(14), TextInput::make('size_card_padding') ->label(__('Card padding (px)')) ->numeric() ->minValue(8) ->maxValue(48) ->default(24), TextInput::make('size_icon_small') ->label(__('Small icon size (px)')) ->numeric() ->minValue(12) ->maxValue(32) ->default(16), TextInput::make('size_icon_medium') ->label(__('Medium icon size (px)')) ->numeric() ->minValue(16) ->maxValue(48) ->default(24), TextInput::make('size_icon_large') ->label(__('Large icon size (px)')) ->numeric() ->minValue(24) ->maxValue(64) ->default(32), ]) ->columns(3), // BUTTONS - Uitgebreid van ButtonSettings Section::make(__('Client Toolbar')) ->description(__('Toolbar customization for client')) ->schema([ ColorPicker::make('toolbar_primary_color') ->label(__('Toolbar color (background)')) ->default('#eeb425'), ColorPicker::make('toolbar_text_color') ->label(__('Toolbar icon/text color')) ->default('#1a1a2e'), ColorPicker::make('toolbar_hover_color') ->label(__('Toolbar hover color')) ->default('#cf9d15'), ColorPicker::make('toolbar_border_color') ->label(__('Toolbar border color')) ->default('#cf9d15'), ]) ->columns(4), Section::make(__('Button Settings')) ->description(__('Customize your hotel buttons')) ->schema([ ColorPicker::make('button_primary_color') ->label(__('Primary color (background)')) ->default('#eeb425'), ColorPicker::make('button_text_color') ->label(__('Text color')) ->default('#1a1a2e'), ColorPicker::make('button_hover_color') ->label(__('Hover color')) ->default('#cf9d15'), Toggle::make('button_border_only') ->label(__('Border only (no background)')) ->helperText(__('Show only the border without background color')), ColorPicker::make('button_border_color') ->label(__('Border color')) ->default('#cf9d15'), TextInput::make('button_border_width') ->label(__('Border width (px)')) ->numeric() ->minValue(0) ->maxValue(50) ->default(2), TextInput::make('button_border_radius') ->label(__('Border radius (px)')) ->numeric() ->minValue(0) ->maxValue(100) ->default(8), TextInput::make('button_font_size') ->label(__('Font size (px)')) ->numeric() ->minValue(8) ->maxValue(32) ->default(14), TextInput::make('button_padding_x') ->label(__('Padding X (px)')) ->numeric() ->minValue(0) ->maxValue(100) ->default(16), TextInput::make('button_padding_y') ->label(__('Padding Y (px)')) ->numeric() ->minValue(0) ->maxValue(50) ->default(8), TextInput::make('button_hover_scale') ->label(__('Hover scale (1.0 = none)')) ->numeric() ->minValue(0.5) ->maxValue(2.0) ->step(0.01) ->default(1.05), Select::make('button_shadow') ->label(__('Shadow')) ->options([ 'none' => __('None'), 'sm' => __('Small'), 'md' => __('Medium'), 'lg' => __('Large'), 'xl' => __('Extra Large'), ]) ->default('lg'), Select::make('button_transition') ->label(__('Transition type')) ->options([ 'none' => __('None'), 'all' => __('All'), 'color' => __('Color only'), 'transform' => __('Transform only'), ]) ->default('all'), TextInput::make('button_transition_duration') ->label(__('Transition duration (ms)')) ->numeric() ->minValue(0) ->maxValue(5000) ->default(300), Select::make('button_effects_speed') ->label(__('Effect speed')) ->options([ 'slow' => __('Slow'), 'normal' => __('Normal'), 'fast' => __('Fast'), ]) ->default('normal') ->helperText(__('How fast the animation plays')), Toggle::make('button_text_uppercase') ->label(__('Uppercase text')) ->default(false) ->helperText(__('Make button text uppercase')), Select::make('button_font_weight') ->label(__('Font weight')) ->options([ '400' => __('Normal'), '500' => __('Medium'), '600' => __('Semi Bold'), '700' => __('Bold'), ]) ->default('600'), ]) ->columns(2), // BUTTON EFFECTS Section::make(__('Button Animations')) ->description(__('Animation effects for different elements')) ->schema([ Toggle::make('button_effects_enabled') ->label(__('Enable effects')) ->default(false) ->helperText(__('Enable or disable all button effects')), Select::make('button_effects_navigation') ->label(__('Navigation effect')) ->options([ 'none' => __('None'), 'sparkle' => '✨ ' . __('Sparkle'), 'glow' => '💡 ' . __('Glow'), 'float' => '🎈 ' . __('Float'), 'bounce' => '⚡ ' . __('Bounce'), 'pulse' => '💓 ' . __('Pulse'), 'shine' => '✨ ' . __('Shine'), 'shake' => '📳 ' . __('Shake'), 'wobble' => '🌀 ' . __('Wobble'), 'heartbeat' => '❤️ ' . __('Heartbeat'), 'rubber-band' => '🎯 ' . __('Rubber Band'), 'flip' => '🔄 ' . __('Flip'), 'swing' => '🎪 ' . __('Swing'), 'jello' => '🍮 Jello', 'color-cycle' => '🌈 ' . __('Color Cycle'), 'rotate' => '🔄 ' . __('Rotate'), 'scale-pulse' => '💫 ' . __('Scale Pulse'), 'fade-in' => '👻 ' . __('Fade In'), 'fade-out' => '🌫️ ' . __('Fade Out'), 'slide-up' => '⬆️ ' . __('Slide Up'), 'slide-down' => '⬇️ ' . __('Slide Down'), 'slide-left' => '⬅️ ' . __('Slide Left'), 'slide-right' => '➡️ ' . __('Slide Right'), 'zoom-in' => '🔍 ' . __('Zoom In'), 'zoom-out' => '🔎 ' . __('Zoom Out'), 'blur' => '🔮 ' . __('Blur'), 'neon-pulse' => '💡 ' . __('Neon Pulse'), 'shake-hard' => '💥 ' . __('Shake Hard'), 'vibrate' => '📳 ' . __('Vibrate'), 'spin' => '🔄 ' . __('Spin'), 'flip-x' => '↔️ ' . __('Flip X'), 'flip-y' => '↕️ ' . __('Flip Y'), 'skew' => '⛷️ ' . __('Skew'), 'stretch' => '🦒 ' . __('Stretch'), 'squeeze' => '🤏 ' . __('Squeeze'), 'elastic' => '🌀 ' . __('Elastic'), 'flash' => '⚡ ' . __('Flash'), 'rainbow' => '🌈 ' . __('Rainbow'), 'wave' => '〰️ ' . __('Wave'), 'ripple' => '💧 ' . __('Ripple'), 'fire' => '🔥 ' . __('Fire'), 'ice' => '🧊 ' . __('Ice'), 'shadow-move' => '👥 ' . __('Shadow Move'), 'glitch' => '👾 ' . __('Glitch'), 'typewriter' => '📝 ' . __('Typewriter'), 'falling' => '🍂 ' . __('Falling'), 'rising' => '🚀 ' . __('Rising'), 'pop' => '🎉 ' . __('Pop'), 'slam' => '💥 ' . __('Slam'), 'invert' => '🔱 ' . __('Invert'), 'hue-rotate' => '🎨 ' . __('Hue Rotate'), 'blur-in' => '🌟 ' . __('Blur In'), 'blur-out' => '💨 ' . __('Blur Out'), ]) ->default('none') ->helperText(__('Effect for navigation items')), Select::make('button_effects_buttons') ->label(__('Buttons effect')) ->options([ 'none' => __('None'), 'sparkle' => '✨ ' . __('Sparkle'), 'glow' => '💡 ' . __('Glow'), 'float' => '🎈 ' . __('Float'), 'bounce' => '⚡ ' . __('Bounce'), 'pulse' => '💓 ' . __('Pulse'), 'shine' => '✨ ' . __('Shine'), 'shake' => '📳 ' . __('Shake'), 'wobble' => '🌀 ' . __('Wobble'), 'heartbeat' => '❤️ ' . __('Heartbeat'), 'rubber-band' => '🎯 ' . __('Rubber Band'), 'flip' => '🔄 ' . __('Flip'), 'swing' => '🎪 ' . __('Swing'), 'jello' => '🍮 Jello', 'color-cycle' => '🌈 ' . __('Color Cycle'), 'rotate' => '🔄 ' . __('Rotate'), 'scale-pulse' => '💫 ' . __('Scale Pulse'), 'fade-in' => '👻 ' . __('Fade In'), 'fade-out' => '🌫️ ' . __('Fade Out'), 'slide-up' => '⬆️ ' . __('Slide Up'), 'slide-down' => '⬇️ ' . __('Slide Down'), 'slide-left' => '⬅️ ' . __('Slide Left'), 'slide-right' => '➡️ ' . __('Slide Right'), 'zoom-in' => '🔍 ' . __('Zoom In'), 'zoom-out' => '🔎 ' . __('Zoom Out'), 'blur' => '🔮 ' . __('Blur'), 'neon-pulse' => '💡 ' . __('Neon Pulse'), 'shake-hard' => '💥 ' . __('Shake Hard'), 'vibrate' => '📳 ' . __('Vibrate'), 'spin' => '🔄 ' . __('Spin'), 'flip-x' => '↔️ ' . __('Flip X'), 'flip-y' => '↕️ ' . __('Flip Y'), 'skew' => '⛷️ ' . __('Skew'), 'stretch' => '🦒 ' . __('Stretch'), 'squeeze' => '🤏 ' . __('Squeeze'), 'elastic' => '🌀 ' . __('Elastic'), 'flash' => '⚡ ' . __('Flash'), 'rainbow' => '🌈 ' . __('Rainbow'), 'wave' => '〰️ ' . __('Wave'), 'ripple' => '💧 ' . __('Ripple'), 'fire' => '🔥 ' . __('Fire'), 'ice' => '🧊 ' . __('Ice'), 'shadow-move' => '👥 ' . __('Shadow Move'), 'glitch' => '👾 ' . __('Glitch'), 'typewriter' => '📝 ' . __('Typewriter'), 'falling' => '🍂 ' . __('Falling'), 'rising' => '🚀 ' . __('Rising'), 'pop' => '🎉 ' . __('Pop'), 'slam' => '💥 ' . __('Slam'), 'invert' => '🔱 ' . __('Invert'), 'hue-rotate' => '🎨 ' . __('Hue Rotate'), 'blur-in' => '🌟 ' . __('Blur In'), 'blur-out' => '💨 ' . __('Blur Out'), 'contrast' => '📺 ' . __('Contrast'), 'grayscale' => '⬛ ' . __('Grayscale'), 'sepia' => '🟤 ' . __('Sepia'), 'saturate' => '🎭 ' . __('Saturate'), 'brightness' => '☀️ ' . __('Brightness'), 'drop-shadow' => '🎭 ' . __('Drop Shadow'), ]) ->default('none') ->helperText(__('Effect for all buttons')), Select::make('button_effects_links') ->label('Links effect') ->options([ 'none' => __('None'), 'sparkle' => '✨ ' . __('Sparkle'), 'glow' => '💡 ' . __('Glow'), 'float' => '🎈 ' . __('Float'), 'bounce' => '⚡ ' . __('Bounce'), 'pulse' => '💓 ' . __('Pulse'), 'shine' => '✨ ' . __('Shine'), 'shake' => '📳 ' . __('Shake'), 'wobble' => '🌀 ' . __('Wobble'), 'heartbeat' => '❤️ ' . __('Heartbeat'), 'rubber-band' => '🎯 ' . __('Rubber Band'), 'flip' => '🔄 ' . __('Flip'), 'swing' => '🎪 ' . __('Swing'), 'jello' => '🍮 Jello', 'color-cycle' => '🌈 ' . __('Color Cycle'), 'rotate' => '🔄 ' . __('Rotate'), 'scale-pulse' => '💫 ' . __('Scale Pulse'), 'fade-in' => '👻 ' . __('Fade In'), 'fade-out' => '🌫️ ' . __('Fade Out'), 'slide-up' => '⬆️ ' . __('Slide Up'), 'slide-down' => '⬇️ ' . __('Slide Down'), 'slide-left' => '⬅️ ' . __('Slide Left'), 'slide-right' => '➡️ ' . __('Slide Right'), 'zoom-in' => '🔍 ' . __('Zoom In'), 'zoom-out' => '🔎 ' . __('Zoom Out'), 'blur' => '🔮 ' . __('Blur'), 'neon-pulse' => '💡 ' . __('Neon Pulse'), 'shake-hard' => '💥 ' . __('Shake Hard'), 'vibrate' => '📳 ' . __('Vibrate'), 'spin' => '🔄 ' . __('Spin'), 'flip-x' => '↔️ ' . __('Flip X'), 'flip-y' => '↕️ ' . __('Flip Y'), 'skew' => '⛷️ ' . __('Skew'), 'stretch' => '🦒 ' . __('Stretch'), 'squeeze' => '🤏 ' . __('Squeeze'), 'elastic' => '🌀 ' . __('Elastic'), 'flash' => '⚡ ' . __('Flash'), 'rainbow' => '🌈 ' . __('Rainbow'), 'wave' => '〰️ ' . __('Wave'), 'ripple' => '💧 ' . __('Ripple'), 'fire' => '🔥 ' . __('Fire'), 'ice' => '🧊 ' . __('Ice'), 'shadow-move' => '👥 ' . __('Shadow Move'), 'glitch' => '👾 ' . __('Glitch'), 'typewriter' => '📝 ' . __('Typewriter'), 'falling' => '🍂 ' . __('Falling'), 'rising' => '🚀 ' . __('Rising'), 'pop' => '🎉 ' . __('Pop'), 'slam' => '💥 ' . __('Slam'), 'invert' => '🔱 ' . __('Invert'), 'hue-rotate' => '🎨 ' . __('Hue Rotate'), 'blur-in' => '🌟 ' . __('Blur In'), 'blur-out' => '💨 ' . __('Blur Out'), 'contrast' => '📺 ' . __('Contrast'), 'grayscale' => '⬛ ' . __('Grayscale'), 'sepia' => '🟤 ' . __('Sepia'), 'saturate' => '🎭 ' . __('Saturate'), 'brightness' => '☀️ ' . __('Brightness'), 'drop-shadow' => '🎭 ' . __('Drop Shadow'), 'outline' => '🔲 ' . __('Outline'), 'underline' => ' ' . __('underline') . ' ' . __('Underline'), 'overline' => ' ' . __('overline') . ' ' . __('Overline'), 'line-through' => '➖ ' . __('Line Through'), 'blink' => '💫 ' . __('Blink'), 'tada' => '🎊 ' . __('Tada'), ' wiggle' => '〿 ' . __('Wiggle'), 'hang' => '📉 ' . __('Hang'), 'indent' => '📏 ' . __('Indent'), 'outdent' => '📐 ' . __('Outdent'), 'quote' => '💬 ' . __('Quote'), 'strike' => '〰️ ' . __('Strike'), ]) ->default('none') ->helperText(__('Effect for links')), ]), // SECONDARY BUTTONS Section::make(__('Secondary Button')) ->description(__('Style for secondary/green buttons')) ->schema([ Toggle::make('button_secondary_enabled') ->label(__('Enable secondary button style')) ->default(true), ColorPicker::make('button_secondary_color') ->label(__('Background color')) ->default('#22c55e'), ColorPicker::make('button_secondary_text_color') ->label(__('Text color')) ->default('#ffffff'), ColorPicker::make('button_secondary_hover_color') ->label(__('Hover color')) ->default('#16a34a'), ColorPicker::make('button_secondary_border_color') ->label(__('Border color')) ->default('#16a34a'), ]) ->columns(2), // DANGER BUTTONS Section::make(__('Danger Button')) ->description(__('Style for danger/red buttons')) ->schema([ Toggle::make('button_danger_enabled') ->label(__('Enable danger button style')) ->default(true), ColorPicker::make('button_danger_color') ->label(__('Background color')) ->default('#ef4444'), ColorPicker::make('button_danger_text_color') ->label(__('Text color')) ->default('#ffffff'), ColorPicker::make('button_danger_hover_color') ->label(__('Hover color')) ->default('#dc2626'), ColorPicker::make('button_danger_border_color') ->label(__('Border color')) ->default('#dc2626'), ]) ->columns(2), // OUTLINE BUTTONS Section::make(__('Outline Button')) ->description(__('Style for outline buttons (transparent with border)')) ->schema([ Toggle::make('button_outline_enabled') ->label(__('Enable outline button style')) ->default(true), ColorPicker::make('button_outline_color') ->label(__('Border color')) ->default('#eeb425'), ColorPicker::make('button_outline_text_color') ->label(__('Text color')) ->default('#1a1a2e'), ColorPicker::make('button_outline_hover_color') ->label(__('Hover background color')) ->default('#cf9d15'), ]) ->columns(2), // DROPDOWNS Section::make(__('Dropdowns')) ->description(__('Style of dropdown menus in the navigation')) ->schema([ Select::make('dropdown_style') ->label(__('Dropdown style')) ->options([ 'square' => __('Square'), 'rounded' => __('Rounded'), 'pill' => __('Pill (extra round)'), ]) ->default('rounded'), Toggle::make('dropdown_border') ->label(__('Show border')) ->default(true) ->helperText(__('Show a border around the dropdown')), Select::make('dropdown_shadow') ->label(__('Shadow')) ->options([ 'none' => __('None'), 'small' => __('Small'), 'medium' => __('Medium'), 'large' => __('Large'), ]) ->default('medium'), ]), // TYPOGRAPHY Section::make(__('Typography')) ->schema([ Select::make('font_family') ->label(__('Font Family')) ->options([ // Modern & Clean 'Inter' => 'Inter (Modern & Clean)', 'DM Sans' => 'DM Sans (' . __('Minimalist') . ')', 'Space Grotesk' => 'Space Grotesk (' . __('Futuristic') . ')', 'Work Sans' => 'Work Sans (' . __('Functional') . ')', // Friendly & Warm 'Nunito' => 'Nunito (' . __('Friendly & Warm') . ')', 'Quicksand' => 'Quicksand (' . __('Round & Soft') . ')', 'Varela Round' => 'Varela Round (' . __('Super Round') . ')', 'Comfortaa' => 'Comfortaa (' . __('Cozy') . ')', // Playful & Fun 'Poppins' => 'Poppins (' . __('Playful') . ')', 'Fredoka One' => 'Fredoka One (' . __('Bubbly') . ')', 'Baloo 2' => 'Baloo 2 (' . __('Friendly') . ')', // Classic & Professional 'Roboto' => 'Roboto (' . __('Classic') . ')', 'Open Sans' => 'Open Sans (' . __('Readable') . ')', 'Lato' => 'Lato (' . __('Professional') . ')', 'PT Sans' => 'PT Sans (' . __('Versatile') . ')', 'Source Sans Pro' => 'Source Sans Pro (Open Source)', 'Noto Sans' => 'Noto Sans (Universeel)', // Bold & Strong 'Montserrat' => 'Montserrat (' . __('Bold & Modern') . ')', 'Oswald' => 'Oswald (' . __('Condensed') . ')', 'Bebas Neue' => 'Bebas Neue (' . __('Ultra Bold') . ')', 'Anton' => 'Anton (' . __('Impact') . ')', 'Archivo Black' => 'Archivo Black (' . __('Heavy') . ')', // Elegant & Serif 'Playfair Display' => 'Playfair Display (Elegant Serif)', 'Merriweather' => 'Merriweather (' . __('Classic Serif') . ')', 'Libre Baskerville' => 'Libre Baskerville (' . __('Timeless') . ')', 'Lora' => 'Lora (' . __('Literary') . ')', 'Crimson Pro' => 'Crimson Pro (' . __('Book') . ')', // Stylish & Unique 'Raleway' => 'Raleway (' . __('Stylish') . ')', 'Ubuntu' => 'Ubuntu (' . __('Unique') . ')', 'Fira Sans' => 'Fira Sans (' . __('Technical') . ')', 'Exo 2' => 'Exo 2 (' . __('Sci-Fi') . ')', 'Orbitron' => 'Orbitron (' . __('Cyberpunk') . ')', // Gaming & Retro 'Pixel' => 'Pixel (' . __('Retro/Gaming') . ')', 'Press Start 2P' => 'Press Start 2P (Arcade)', 'VT323' => 'VT323 (Terminal)', 'Creepster' => 'Creepster (Horror)', // Handwritten & Fun 'Pacifico' => 'Pacifico (Handgeschreven)', 'Dancing Script' => 'Dancing Script (Sierlijk)', 'Permanent Marker' => 'Permanent Marker (Stoer)', 'Lobster' => 'Lobster (Feestelijk)', // Monospace & Code 'JetBrains Mono' => 'JetBrains Mono (Code)', 'Fira Code' => 'Fira Code (Developer)', 'Source Code Pro' => 'Source Code Pro (Terminal)', // Comic & Cartoon 'Comic Neue' => 'Comic Neue (Strip)', 'Bangers' => 'Bangers (Cartoon)', 'Chewy' => 'Chewy (Speels)', // Minimal & Clean 'Manrope' => 'Manrope (Modern)', 'Outfit' => 'Outfit (Geometrisch)', 'Plus Jakarta Sans' => 'Plus Jakarta (Urban)', 'Sora' => 'Sora (Techno)', 'Syne' => 'Syne (Artistic)', // Elegant & Luxury 'Cormorant Garamond' => 'Cormorant (Luxury Serif)', 'Cardo' => 'Cardo (Classic Book)', 'EB Garamond' => 'EB Garamond (Renaissance)', 'Cinzel' => 'Cinzel (Ancient)', 'Forum' => 'Forum (Elegant)', 'Marcellus' => 'Marcellus (Roman)', 'Italiana' => 'Italiana (Italian)', // Display & Decorative 'Abril Fatface' => 'Abril Fatface (Bold Serif)', 'Alfa Slab One' => 'Alfa Slab (Heavy Slab)', 'Audiowide' => 'Audiowide (Tech Display)', 'Black Ops One' => 'Black Ops (Military)', 'Bungee' => 'Bungee (Urban)', 'Carter One' => 'Carter One (Sporty)', 'Concert One' => 'Concert One (Rounded)', 'Days One' => 'Days One (News)', 'Fugaz One' => 'Fugaz One (Italic)', 'Kaushan Script' => 'Kaushan Script (Brush)', 'Knewave' => 'Knewave (Paint)', 'Lilita One' => 'Lilita One (Chubby)', 'Monoton' => 'Monoton (Neon)', 'Righteous' => 'Righteous (Geometric)', 'Russo One' => 'Russo One (Industrial)', 'Shrikhand' => 'Shrikhand (Indian)', 'Sigmar One' => 'Sigmar One (Comic)', 'Syncopate' => 'Syncopate (Space)', 'Titan One' => 'Titan One (Thick)', 'Ultra' => 'Ultra (Heavy Serif)', 'Unica One' => 'Unica One (Vintage)', 'Yeseva One' => 'Yeseva One (Curvy)', // Nature & Organic 'Amatic SC' => 'Amatic (Handdrawn)', 'Caveat' => 'Caveat (Casual Script)', 'Courgette' => 'Courgette (Smooth)', 'Great Vibes' => 'Great Vibes (Elegant Script)', 'Indie Flower' => 'Indie Flower (Messy)', 'Kalam' => 'Kalam (Quick)', 'Sacramento' => 'Sacramento (Retro Script)', 'Satisfy' => 'Satisfy (Charming)', 'Shadows Into Light' => 'Shadows (Sketchy)', // Corporate & Business 'Arimo' => 'Arimo (Corporate)', 'Cabin' => 'Cabin (Humanist)', 'Hind' => 'Hind (Indian)', 'IBM Plex Sans' => 'IBM Plex (Tech Corp)', 'Karla' => 'Karla (Friendly)', 'Libre Franklin' => 'Libre Franklin (News)', 'Muli' => 'Muli (Versatile)', 'Nobile' => 'Nobile (Italian)', 'Questrial' => 'Questrial (Minimal)', 'Rubik' => 'Rubik (Cubic)', 'Tajawal' => 'Tajawal (Arabic)', 'Titillium Web' => 'Titillium (Professional)', // Fun & Whimsical 'Barrio' => 'Barrio (Funky)', 'Bonbon' => 'Bonbon (Sweet)', 'Butterfly Kids' => 'Butterfly (Kids)', 'Chelsea Market' => 'Chelsea (Market)', 'Fruktur' => 'Fruktur (Fruit)', 'Gorditas' => 'Gorditas (Puffy)', 'Henny Penny' => 'Henny Penny (Storybook)', 'Kirang Haerang' => 'Kirang (Korean)', 'Lily Script One' => 'Lily (Flowery)', 'Mystery Quest' => 'Mystery (Spooky)', 'Paprika' => 'Paprika (Spicy)', 'Pompiere' => 'Pompiere (French)', 'Ranchers' => 'Ranchers (Western)', 'Ribeye' => 'Ribeye (Meaty)', 'Snowburst One' => 'Snowburst (Winter)', 'Spirax' => 'Spirax (Mysterious)', 'Unkempt' => 'Unkempt (Messy)', 'Zcool KuaiLe' => 'Zcool (Chinese)', // Modern Sans-Serif 'Geologica' => 'Geologica (Variable)', 'Lexend' => 'Lexend (Readable)', 'Gabarito' => 'Gabarito (Rounded)', 'Schibsted Grotesk' => 'Schibsted (Nordic)', 'Albert Sans' => 'Albert Sans (Swiss)', 'Instrument Sans' => 'Instrument (Clean)', 'Figtree' => 'Figtree (Friendly)', 'Nokora' => 'Nokora (Khmer)', 'Noto Sans SC' => 'Noto SC (Chinese)', 'Noto Sans JP' => 'Noto JP (Japanese)', 'Noto Sans KR' => 'Noto KR (Korean)', // Creative & Artistic 'Bodoni Moda' => 'Bodoni (High Fashion)', 'Cormorant' => 'Cormorant (Poetry)', 'Josefin Sans' => 'Josefin (Art Deco)', 'Josefin Slab' => 'Josefin Slab (Vintage)', 'Alegreya' => 'Alegreya (Literature)', 'Alegreya Sans' => 'Alegreya Sans (Story)', 'Bitter' => 'Bitter (Serif Slab)', 'Inconsolata' => 'Inconsolata (Coding)', // Elegant & Wedding 'Alex Brush' => 'Alex Brush (Calligraphy)', 'Allura' => 'Allura (Wedding)', 'Great Vibes L' => 'Great Vibes (Luxury)', 'Herr Von Muellerhoff' => 'Herr (Signature)', 'Monsieur La Doulaise' => 'Monsieur (French)', 'Parisienne' => 'Parisienne (Romantic)', 'Pinyon Script' => 'Pinyon (Classic Script)', 'Tangerine' => 'Tangerine (Thin Script)', 'WindSong' => 'WindSong (Flowing)', // Industrial & Tech 'Chakra Petch' => 'Chakra (Thai Tech)', 'Rajdhani' => 'Rajdhani (Indian Tech)', 'Sarpanch' => 'Sarpanch (Bold Hindi)', 'Share Tech Mono' => 'Share Tech (Display)', 'Teko' => 'Teko (Indian Display)', 'Yatra One' => 'Yatra (Sanskrit)', // Retro & Vintage 'Abril Fatface V' => 'Abril (Magazine)', 'Alfa Slab One V' => 'Alfa Slab (Newspaper)', 'Arvo' => 'Arvo (Slab Serif)', 'Bevan' => 'Bevan (Heavy)', 'BioRhyme' => 'BioRhyme (Wide)', 'Bree Serif' => 'Bree (Energetic)', 'Crete Round' => 'Crete (Soft Slab)', 'Patua One' => 'Patua (Curvy)', 'Sanchez' => 'Sanchez (Classic Slab)', 'Scope One' => 'Scope (Academic)', 'Special Elite' => 'Special Elite (Typewriter)', 'Stint Ultra Expanded' => 'Stint (Wide)', 'Ultra V' => 'Ultra (Black)', // Groovy & 70s 'Shrikhand V' => 'Shrikhand (Gujarati)', 'Sedgwick Ave' => 'Sedgwick (Street)', 'Sedgwick Ave Display' => 'Sedgwick Display (Bold)', 'Londrina Solid' => 'Londrina (Brazilian)', 'Londrina Shadow' => 'Londrina Shadow (3D)', 'Londrina Sketch' => 'Londrina Sketch (Hand)', 'Londrina Outline' => 'Londrina Outline (Line)', // Fantasy & Medieval 'Almendra' => 'Almendra (Fantasy)', 'Almendra Display' => 'Almendra Display (Magic)', 'Cinzel Decorative' => 'Cinzel Deco (Royal)', 'Metamorphous' => 'Metamorphous (Wizard)', 'Pirata One' => 'Pirata (Pirate)', 'Rye' => 'Rye (Western)', 'Smokum' => 'Smokum (Wild West)', // Japanese 'Kosugi' => 'Kosugi (Sans)', 'Kosugi Maru' => 'Kosugi Maru (Rounded)', 'M PLUS 1p' => 'M PLUS (Modern JP)', 'M PLUS Rounded 1c' => 'M PLUS Rounded (Soft)', 'Sawarabi Gothic' => 'Sawarabi (Gothic)', 'Sawarabi Mincho' => 'Sawarabi Mincho (Traditional)', // Arabic & Hebrew 'Alef' => 'Alef (Hebrew)', 'Amatic SC H' => 'Amatic (Hebrew Script)', 'Frank Ruhl Libre' => 'Frank Ruhl (Jewish)', 'Heebo' => 'Heebo (Modern Hebrew)', 'Secular One' => 'Secular (Israeli)', 'Suez One' => 'Suez (Bold Hebrew)', 'Varela' => 'Varela (Hebrew Sans)', ]) ->default('Nunito'), TextInput::make('border_radius') ->label(__('Border radius (0-50)')) ->numeric() ->minValue(0) ->maxValue(100) ->default(12) ->helperText(__('How round are the corners?')), ]), // EXTRAS Section::make(__('Extra Options')) ->schema([ Toggle::make('dark_mode') ->label(__('Dark mode support')) ->helperText(__('Automatic dark theme for systems that prefer it')), Toggle::make('animations') ->label(__('Animations')) ->helperText(__('Enable animations and transitions')), TextInput::make('background_image') ->label(__('Background Image')) ->placeholder('/assets/images/themes/your-image.png') ->helperText(__('URL to the background image (leave empty for no image)')), ]), // HEADER & FOOTER Section::make(__('Header & Footer')) ->schema([ ColorPicker::make('header_background') ->label(__('Header Background')) ->default('#2d2d44'), ColorPicker::make('header_text_color') ->label(__('Header Text')) ->default('#ffffff'), ColorPicker::make('header_link_color') ->label(__('Header Links')) ->default('#ffffff'), ColorPicker::make('footer_background') ->label(__('Footer Background')) ->default('#1a1a2e'), ColorPicker::make('footer_text_color') ->label(__('Footer Text')) ->default('#9ca3af'), ColorPicker::make('footer_link_color') ->label(__('Footer Links')) ->default('#eeb425'), ]), // CARDS & CONTAINERS Section::make(__('Cards & Containers')) ->schema([ ColorPicker::make('card_background') ->label(__('Card Background')) ->default('#2d2d44'), ColorPicker::make('card_border_color') ->label(__('Card Border')) ->default('transparent'), TextInput::make('card_border_width') ->label(__('Card Border Width')) ->numeric() ->default(0), TextInput::make('card_padding') ->label(__('Card Padding')) ->numeric() ->default(16), TextInput::make('card_border_radius') ->label(__('Card Border Radius')) ->numeric() ->default(12), ]), // FORM INPUTS Section::make(__('Form Inputs')) ->schema([ ColorPicker::make('input_background') ->label(__('Input Background')) ->default('#1a1a2e'), ColorPicker::make('input_border_color') ->label(__('Input Border')) ->default('#4b5563'), ColorPicker::make('input_text_color') ->label(__('Input Text')) ->default('#ffffff'), ColorPicker::make('input_placeholder_color') ->label(__('Input Placeholder')) ->default('#9ca3af'), ColorPicker::make('input_focus_color') ->label(__('Input Focus')) ->default('#eeb425'), ]), // LINKS Section::make(__('Links')) ->schema([ ColorPicker::make('link_color') ->label(__('Link Color')) ->default('#eeb425'), ColorPicker::make('link_hover_color') ->label(__('Link Hover')) ->default('#cf9d15'), Toggle::make('link_underline') ->label(__('Underline Links')) ->default(false), ]), // BORDERS Section::make(__('Borders')) ->schema([ ColorPicker::make('border_color') ->label(__('Default Border')) ->default('#4b5563'), TextInput::make('border_width') ->label(__('Default Border Width')) ->numeric() ->default(1), ]), // NAVIGATION Section::make(__('Navigation')) ->schema([ TextInput::make('navbar_height') ->label(__('Navbar Height')) ->numeric() ->default(64), Toggle::make('navbar_sticky') ->label(__('Sticky Navbar')) ->default(true), Toggle::make('navbar_shadow') ->label(__('Navbar Shadow')) ->default(true), Select::make('navbar_style') ->label(__('Navbar Style')) ->options([ 'transparent' => __('Transparent'), 'solid' => __('Solid'), 'glass' => __('Glass Effect'), ]) ->default('solid'), ]), // AVATARS & IMAGES Section::make(__('Avatars & Images')) ->schema([ TextInput::make('avatar_border_radius') ->label(__('Avatar Border Radius')) ->numeric() ->default(50), Toggle::make('avatar_border') ->label(__('Avatar Border')) ->default(true), ColorPicker::make('avatar_border_color') ->label(__('Avatar Border Color')) ->default('#eeb425'), ]), // BADGES & TAGS Section::make(__('Badges & Tags')) ->schema([ ColorPicker::make('badge_background') ->label(__('Badge Background')) ->default('#eeb425'), ColorPicker::make('badge_text_color') ->label(__('Badge Text')) ->default('#1a1a2e'), TextInput::make('badge_border_radius') ->label(__('Badge Border Radius')) ->numeric() ->default(12), ]), // SHADOWS Section::make(__('Shadows')) ->schema([ ColorPicker::make('shadow_color') ->label(__('Shadow Color')) ->default('#000000'), TextInput::make('shadow_opacity') ->label(__('Shadow Opacity')) ->numeric() ->minValue(0) ->maxValue(100) ->default(25), ]), // LOADING & SPINNERS Section::make(__('Loading & Spinners')) ->schema([ ColorPicker::make('spinner_color') ->label(__('Spinner Color')) ->default('#eeb425'), Toggle::make('page_transition') ->label(__('Page Transitions')) ->default(true), ]), // v1.2 PROFILE PAGE CUSTOMIZATION Section::make(__('Profile Page')) ->description(__('Customize the user profile page')) ->icon('heroicon-o-user') ->schema([ Toggle::make('profile_show_online_status') ->label(__('Show Online Status')) ->default(true), Toggle::make('profile_show_guilds') ->label(__('Show Guilds/Groups')) ->default(true), Toggle::make('profile_show_friends') ->label(__('Show Friends')) ->default(true), Toggle::make('profile_show_guestbook') ->label(__('Show Guestbook')) ->default(true), Toggle::make('profile_show_photos') ->label(__('Show Photos')) ->default(true), Toggle::make('profile_show_badges') ->label(__('Show Badges')) ->default(true), Toggle::make('profile_show_stats') ->label(__('Show Statistics')) ->default(true), Toggle::make('profile_show_activity') ->label(__('Show Recent Activity')) ->default(true), Select::make('profile_header_style') ->label(__('Header Style')) ->options([ 'default' => __('Default'), 'banner' => __('Banner'), 'minimal' => __('Minimal'), ]) ->default('default'), Select::make('profile_default_tab') ->label(__('Default Tab')) ->options([ 'guestbook' => __('Guestbook'), 'photos' => __('Photos'), 'badges' => __('Badges'), 'friends' => __('Friends'), ]) ->default('guestbook'), ]) ->columns(2), // v1.2 CUSTOM CSS & JS Section::make(__('Custom CSS & JavaScript')) ->description(__('Add custom CSS and JavaScript to your site')) ->icon('heroicon-o-code-bracket') ->schema([ Toggle::make('custom_css_enabled') ->label(__('Enable Custom CSS')) ->default(false), TextInput::make('custom_css') ->label(__('Custom CSS')) ->helperText(__('Add your own CSS styles here')) ->columnSpanFull(), Toggle::make('custom_js_enabled') ->label(__('Enable Custom JavaScript')) ->default(false), TextInput::make('custom_js') ->label(__('Custom JavaScript')) ->helperText(__('Add your own JavaScript here')) ->columnSpanFull(), ]) ->columns(2), // v1.2 ADVANCED HEADER/FOOTER Section::make(__('Advanced Header & Footer')) ->description(__('Add custom HTML to header and footer')) ->icon('heroicon-o-paint-brush') ->schema([ TextInput::make('header_custom_html') ->label(__('Custom Header HTML')) ->helperText(__('Add custom HTML before ')) ->columnSpanFull(), TextInput::make('footer_custom_html') ->label(__('Custom Footer HTML')) ->helperText(__('Add custom HTML before ')) ->columnSpanFull(), Toggle::make('footer_show_copyright') ->label(__('Show Copyright')) ->default(true), Toggle::make('footer_show_links') ->label(__('Show Footer Links')) ->default(true), ]) ->columns(2), // v1.3 PWA (PROGRESSIVE WEB APP) Section::make(__('PWA - Progressive Web App')) ->description(__('Make your hotel installable as an app')) ->icon('heroicon-o-device-phone-mobile') ->schema([ Toggle::make('pwa_enabled') ->label(__('Enable PWA')) ->default(false) ->helperText(__('Users can install your site as an app on mobile')), TextInput::make('pwa_name') ->label(__('App Name')) ->default('Epicnabbo Hotel') ->helperText(__('Full name of the app')), TextInput::make('pwa_short_name') ->label(__('Short Name')) ->default('Epicnabbo') ->maxLength(12) ->helperText(__('Name shown on home screen')), TextInput::make('pwa_description') ->label(__('Description')) ->default('Welcome to Epicnabbo - Your Habbo Hotel') ->columnSpanFull(), ColorPicker::make('pwa_theme_color') ->label(__('Theme Color')) ->default('#eeb425'), ColorPicker::make('pwa_background_color') ->label(__('Background Color')) ->default('#1a1a2e'), ]) ->columns(2), ]) ->statePath('data'); } public function save(): void { $this->saveBoolSettings([ 'dark_mode', 'animations', 'dropdown_border', 'button_enabled', 'button_border_only', 'button_effects_enabled', 'button_secondary_enabled', 'button_danger_enabled', 'button_outline_enabled', 'button_text_uppercase', 'link_underline', 'navbar_sticky', 'navbar_shadow', 'nav_icon_radio', 'avatar_border', 'page_transition', ]); $this->saveSettings([ 'preset', 'color_primary', 'color_background', 'color_surface', 'color_dropdown', 'color_navbar', 'color_navbar_text', 'color_text', 'color_text_muted', 'color_accent', 'button_primary_color', 'button_text_color', 'button_hover_color', 'button_border_color', 'button_border_width', 'button_border_radius', 'button_font_size', 'button_padding_x', 'button_padding_y', 'button_hover_scale', 'button_shadow', 'button_transition', 'button_transition_duration', 'button_effects_speed', 'button_effects_navigation', 'button_effects_buttons', 'button_effects_links', 'button_text_uppercase', 'button_font_weight', 'dropdown_style', 'dropdown_shadow', 'font_family', 'border_radius', 'background_image', // Sizing settings 'size_navigation_font', 'size_navigation_padding', 'size_navigation_height', 'size_heading_h1', 'size_heading_h2', 'size_heading_h3', 'size_body_text', 'size_small_text', 'size_button_text', 'size_card_padding', 'size_icon_small', 'size_icon_medium', 'size_icon_large', 'button_secondary_color', 'button_secondary_text_color', 'button_secondary_hover_color', 'button_secondary_border_color', 'button_danger_color', 'button_danger_text_color', 'button_danger_hover_color', 'button_danger_border_color', 'button_outline_color', 'button_outline_text_color', 'button_outline_hover_color', // NEW SETTINGS 'header_background', 'header_text_color', 'header_link_color', 'footer_background', 'footer_text_color', 'footer_link_color', 'card_background', 'card_border_color', 'card_border_width', 'card_padding', 'card_border_radius', 'input_background', 'input_border_color', 'input_text_color', 'input_placeholder_color', 'input_focus_color', 'link_color', 'link_hover_color', 'border_color', 'border_width', 'navbar_height', 'navbar_style', 'nav_icon_discord_url', 'nav_icon_radio', 'avatar_border_radius', 'avatar_border_color', 'badge_background', 'badge_text_color', 'badge_border_radius', 'shadow_color', 'shadow_opacity', 'spinner_color', // v1.2 Profile Page Customization 'profile_show_online_status', 'profile_show_guilds', 'profile_show_friends', 'profile_show_guestbook', 'profile_show_photos', 'profile_show_badges', 'profile_show_stats', 'profile_show_activity', 'profile_header_style', 'profile_default_tab', // v1.2 Custom CSS/JS 'custom_css_enabled', 'custom_css', 'custom_js_enabled', 'custom_js', // v1.2 Advanced Header/Footer 'header_custom_html', 'footer_custom_html', 'footer_show_copyright', 'footer_show_links', // v1.3 PWA Settings 'pwa_enabled', 'pwa_name', 'pwa_short_name', 'pwa_description', 'pwa_theme_color', 'pwa_background_color', ]); SettingsService::clearCache(); // Export to JSON file for auto-commit $this->exportSettingsToFile(); Notification::make() ->success() ->title('Opgeslagen!') ->body('Je thema en knoppen zijn succesvol aangepast.') ->send(); } #[\Override] protected function getActions(): array { return [ Action::make('save') ->label(__('Save Theme & Buttons')) ->action('save') ->color('primary'), ]; } }