<?php
/**
 * Admin Color Customizer page shell.
 *
 * @var array<string, mixed>                $settings
 * @var array<string, mixed>                $site_settings
 * @var array<string, mixed>                $network_settings
 * @var array<string, array<string, mixed>> $schemes
 * @var array<string, array<string, mixed>> $built_in
 * @var array<string, mixed>|null           $active_scheme
 * @var array<int, array<string, mixed>>    $accessibility
 * @var string                              $view
 * @var string                              $screen_url
 * @var string                              $settings_source
 * @var array<string, array<string, string>> $editable_roles
 */

use WP_PowerSuite\Admin\PageHero;
use WP_PowerSuite\AdminColorCustomizer\Settings;

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

$mode_labels = [
	'disabled'            => __( 'Disabled', 'wppowersuite-lite' ),
	'global_default'      => __( 'Global default', 'wppowersuite-lite' ),
	'force_all'           => __( 'Force for all users', 'wppowersuite-lite' ),
	'force_by_role'       => __( 'Force by role', 'wppowersuite-lite' ),
	'per_user_selectable' => __( 'Per-user selectable', 'wppowersuite-lite' ),
];

$source_labels = [
	'site'           => __( 'Site settings', 'wppowersuite-lite' ),
	'network'        => __( 'Network default', 'wppowersuite-lite' ),
	'network_forced' => __( 'Network forced', 'wppowersuite-lite' ),
];

$current_mode  = (string) ( $settings['mode'] ?? 'global_default' );
$emergency_off = Settings::is_emergency_disabled();
$is_active     = $current_mode !== 'disabled' && ! empty( $settings['enabled'] );

$nav_items = [
	'setup'         => [ 'label' => __( 'Setup', 'wppowersuite-lite' ), 'icon' => 'dashicons-admin-settings' ],
	'colors'        => [ 'label' => __( 'Colors', 'wppowersuite-lite' ), 'icon' => 'dashicons-art' ],
	'advanced'      => [ 'label' => __( 'Advanced', 'wppowersuite-lite' ), 'icon' => 'dashicons-admin-tools' ],
];
?>
<div class="wrap wpps-acc-wrap">
	<hr class="wp-header-end" style="margin:0;padding:0;border:none;height:0;overflow:hidden;">

	<?php if ( $emergency_off ) : ?>
		<div class="notice notice-warning">
			<p><?php esc_html_e( 'WPPS_DISABLE_ADMIN_COLOR_CUSTOMIZER is active. Custom CSS and forced admin colors are disabled.', 'wppowersuite-lite' ); ?></p>
		</div>
	<?php elseif ( ! $is_active ) : ?>
		<div class="notice notice-info">
			<p><?php esc_html_e( 'Admin colors are off. Set Application mode to something other than Disabled on the Setup tab, then save.', 'wppowersuite-lite' ); ?></p>
		</div>
	<?php endif; ?>

	<?php if ( is_multisite() ) : ?>
		<div class="notice notice-info inline">
			<p>
				<?php
				printf(
					/* translators: %s: string value. */
					esc_html__( 'Settings source: %s', 'wppowersuite-lite' ),
					esc_html( $source_labels[ $settings_source ] ?? $settings_source )
				);
				?>
			</p>
		</div>
	<?php endif; ?>

	<?php
	PageHero::render_for_module(
		[
			'icon'    => 'dashicons-admin-appearance',
			'title'   => __( 'Admin Color Customizer', 'wppowersuite-lite' ),
			'tagline' => __( 'Apply WordPress-native admin colors site-wide — menu, toolbar, buttons, forms, and more.', 'wppowersuite-lite' ),
		]
	);
	?>

	<div id="wpps-acc-notices"></div>

	<nav class="wpps-acc-nav" aria-label="<?php esc_attr_e( 'Admin Color Customizer sections', 'wppowersuite-lite' ); ?>">
		<?php foreach ( $nav_items as $nav_key => $nav_item ) : ?>
			<a
				class="wpps-acc-nav__link<?php echo $view === $nav_key ? ' is-active' : ''; ?>"
				href="<?php echo esc_url( add_query_arg( 'view', $nav_key, $screen_url ) ); ?>"
			>
				<span class="dashicons <?php echo esc_attr( (string) $nav_item['icon'] ); ?>" aria-hidden="true"></span>
				<?php echo esc_html( (string) $nav_item['label'] ); ?>
			</a>
		<?php endforeach; ?>
	</nav>

	<div class="wpps-acc-layout">
		<div class="wpps-acc-main">
			<?php
			$view_file = __DIR__ . '/views/view-' . str_replace( '_', '-', $view ) . '.php';
			if ( is_readable( $view_file ) ) {
				include $view_file;
			}
			?>
		</div>

		<aside class="wpps-acc-preview-panel" aria-label="<?php esc_attr_e( 'Live preview', 'wppowersuite-lite' ); ?>">
			<h2><?php esc_html_e( 'Live preview', 'wppowersuite-lite' ); ?></h2>
			<p class="description"><?php esc_html_e( 'Preview updates as you edit. Nothing is saved until you click Save settings.', 'wppowersuite-lite' ); ?></p>

			<div id="wpps-acc-preview" class="wpps-acc-preview">
				<div class="wpps-acc-preview__toolbar" data-part="toolbar">
					<span class="wpps-acc-preview__toolbar-title"><?php esc_html_e( 'Toolbar', 'wppowersuite-lite' ); ?></span>
				</div>
				<div class="wpps-acc-preview__body">
					<div class="wpps-acc-preview__menu" data-part="menu">
						<div class="wpps-acc-preview__menu-item is-current"><?php esc_html_e( 'Dashboard', 'wppowersuite-lite' ); ?></div>
						<div class="wpps-acc-preview__menu-item"><?php esc_html_e( 'Posts', 'wppowersuite-lite' ); ?></div>
						<div class="wpps-acc-preview__menu-item is-hover"><?php esc_html_e( 'Media', 'wppowersuite-lite' ); ?></div>
						<div class="wpps-acc-preview__submenu" data-part="submenu">
							<div class="wpps-acc-preview__submenu-item is-hover"><?php esc_html_e( 'All Posts', 'wppowersuite-lite' ); ?></div>
							<div class="wpps-acc-preview__submenu-item"><?php esc_html_e( 'Add New', 'wppowersuite-lite' ); ?></div>
						</div>
					</div>
					<div class="wpps-acc-preview__content">
						<div class="wpps-acc-preview__buttons">
							<button type="button" class="wpps-acc-preview__btn-primary" data-part="button-primary"><?php esc_html_e( 'Primary', 'wppowersuite-lite' ); ?></button>
							<button type="button" class="wpps-acc-preview__btn-secondary" data-part="button-secondary"><?php esc_html_e( 'Secondary', 'wppowersuite-lite' ); ?></button>
						</div>
						<div class="wpps-acc-preview__notice" data-part="notice">
							<?php esc_html_e( 'This is an admin notice preview.', 'wppowersuite-lite' ); ?>
						</div>
					</div>
				</div>
			</div>

			<div id="wpps-acc-a11y-warnings" class="wpps-acc-a11y-warnings"></div>

			<div class="wpps-acc-settings-footer">
				<button type="button" class="button button-primary button-large" id="wpps-acc-save"><?php esc_html_e( 'Save settings', 'wppowersuite-lite' ); ?></button>
				<button type="button" class="button button-secondary button-large" id="wpps-acc-reset-accessible"><?php esc_html_e( 'Reset to accessible defaults', 'wppowersuite-lite' ); ?></button>
			</div>
		</aside>
	</div>
</div>

