<?php
/**
 * KooKoa Folders
 *
 * @package KookoaWPF
 * @license GPL-2.0-or-later
 */

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

/**
 * Admin UI: sidebar HTML and modal dialogs.
 *
 * @since 1.0.0
 */
class KookoaWPF_Admin {

	/**
	 * Singleton instance.
	 *
	 * @var self|null
	 */
	private static $instance = null;

	/**
	 * Return the singleton instance.
	 *
	 * @return self
	 */
	public static function instance() {
		if ( is_null( self::$instance ) ) {
			self::$instance = new self();
		}
		return self::$instance;
	}

	/**
	 * Hook sidebar and modals into admin_footer.
	 */
	private function __construct() {
		add_action( 'admin_footer', array( $this, 'render_sidebar_html' ) );
		add_action( 'admin_footer', array( $this, 'render_modals' ) );
		add_action( 'admin_footer', array( $this, 'render_media_modal_modals' ) );
	}

	/**
	 * Check if the current screen should have the folder sidebar.
	 *
	 * @return bool
	 */
	private function is_folder_screen() {
		if ( ! is_admin() || ! function_exists( 'get_current_screen' ) ) {
			return false; }
		$screen = get_current_screen();
		if ( ! $screen ) {
			return false; }

		// Access Control — check if current user's role is allowed.
		$allowed_roles = kookoawpf_get_allowed_roles();
		$user          = wp_get_current_user();
		$has_access    = false;
		foreach ( $user->roles as $role ) {
			if ( in_array( $role, $allowed_roles, true ) ) {
				$has_access = true;
				break;
			}
		}
		if ( ! $has_access ) {
			return false; }

		$supported = kookoawpf()->get_supported_post_types();

		if ( 'upload' === $screen->base && in_array( 'attachment', $supported, true ) ) {
			return true;
		}

		if ( 'edit' === $screen->base && in_array( $screen->post_type, $supported, true ) ) {
			return true;
		}

		return false;
	}

	/**
	 * Render the folder sidebar in admin
	 */
	public function render_sidebar_html(): void {
		if ( ! $this->is_folder_screen() ) {
			return;
		}

		$screen = get_current_screen();
		if ( null === $screen ) {
			return;
		}
		$post_type = $screen->post_type ? $screen->post_type : 'attachment';
		$width     = kookoawpf_get_sidebar_width();

		$font_size_map = array(
			'compact' => '12px',
			'default' => '13px',
			'large'   => '14px',
			'xlarge'  => '15px',
		);
		$font_pref     = get_option( 'kookoawpf_tree_font_size', 'default' );
		$font_size_css = isset( $font_size_map[ $font_pref ] ) ? $font_size_map[ $font_pref ] : '13px';
		?>
		<?php
		// FOUC prevention: read the per-post-type sidebar-collapsed preference
		// from localStorage BEFORE the sidebar paints, so the user doesn't see
		// the expanded sidebar flash for one frame. Must stay inline to beat
		// the first paint — wp_print_inline_script_tag keeps this compliant
		// with wp.org's "no raw <script> tags" rule.
		$pt_esc = esc_js( $post_type );
		wp_print_inline_script_tag(
			"try{if(localStorage.getItem('kookoawpf_sidebar_collapsed_{$pt_esc}')==='1'){document.body.classList.add('kookoawpf-sidebar-collapsed');document.body.classList.remove('kookoawpf-has-sidebar');}}catch(e){}"
		);
		?>
		<div id="kookoawpf-sidebar-wrapper" class="kookoawpf-sidebar-wrapper" style="width:<?php echo (int) $width; ?>px; --kookoawpf-tree-font-size:<?php echo esc_attr( $font_size_css ); ?>;" data-post-type="<?php echo esc_attr( $post_type ); ?>">
			<?php
			wp_print_inline_script_tag(
				"try{if(localStorage.getItem('kookoawpf_sidebar_collapsed_{$pt_esc}')==='1'){document.getElementById('kookoawpf-sidebar-wrapper').classList.add('kookoawpf-collapsed');}}catch(e){}"
			);
			?>
			<div class="kookoawpf-sidebar-header">
				<div class="kookoawpf-sidebar-title">
					<span class="kookoawpf-brand">Peace <span style="font-family:Arial,sans-serif">&amp;</span> <span style="font-size:18px">♥</span> &gt;<span class="kookoawpf-brand-cursor">_</span></span>
				</div>
				<div class="kookoawpf-sidebar-actions">
					<button type="button" id="kookoawpf-btn-new-folder" class="button kookoawpf-btn-new" title="<?php esc_attr_e( 'New Folder', 'kookoa-folders' ); ?>">
						<span class="dashicons dashicons-plus-alt2"></span> <span style="position:relative;top:1px"><?php esc_html_e( 'Folder', 'kookoa-folders' ); ?></span>
					</button>
					<button type="button" id="kookoawpf-btn-new-dynamic" class="button kookoawpf-btn-new" title="<?php esc_attr_e( 'New Smart Folder', 'kookoa-folders' ); ?>">⚡</button>
					<?php
					/**
					 * Extension point: companion plugins can inject additional
					 * action buttons right after "+ Folder" in the sidebar header.
					 */
					do_action( 'kookoawpf_sidebar_actions_extra' );
					?>
					<input type="file" id="kookoawpf-import-file" accept=".json" style="display:none;" />
				</div>
			</div>

			<?php
			// Sidebar migration hint — only on the Media (attachment) sidebar,
			// only when at least one importer source still has data left to
			// import (not already imported, not dismissed), and only until
			// the user dismisses the hint with "×".
			//
			// Note: uses get_visible() rather than should_show_section() so
			// the hint disappears automatically right after a successful
			// import — the user does not need to also click "×". The
			// Settings page section keeps showing controls (Reset / Hide
			// permanently) for as long as there are imported/dismissed
			// cards, which is correct for that surface but would be noise
			// in the sidebar.
			if ( 'attachment' === $post_type
				&& class_exists( 'KookoaWPF_Importer_Registry' )
				&& KookoaWPF_Importer_Registry::instance()->has_visible_for_post_type( 'attachment' )
				&& '1' !== (string) get_user_meta( get_current_user_id(), 'kookoawpf_sidebar_migrate_hint_dismissed', true )
			) :
				$kookoawpf_migrate_url   = admin_url( 'admin.php?page=kookoa-folders&tab=import-export#kookoawpf-migrate-section' );
				$kookoawpf_brand_sources = KookoaWPF_Importer_Registry::instance()->get_visible_source_brands( 'attachment' );
				if ( 1 === count( $kookoawpf_brand_sources ) ) {
					/* translators: %s: source plugin name (e.g. "FileBird"). */
					$kookoawpf_hint_line1 = sprintf( __( '%s detected', 'kookoa-folders' ), $kookoawpf_brand_sources[0] );
				} else {
					$kookoawpf_hint_line1 = __( 'Other folder plugins detected', 'kookoa-folders' );
				}
				?>
				<?php $kookoawpf_line1_class = 'kookoawpf-sidebar-migrate-hint-line1' . ( 1 === count( $kookoawpf_brand_sources ) ? '' : ' kookoawpf-sidebar-migrate-hint-line1--multi' ); ?>
				<div class="kookoawpf-sidebar-migrate-hint" id="kookoawpf-sidebar-migrate-hint">
					<a class="kookoawpf-sidebar-migrate-hint-link" href="<?php echo esc_url( $kookoawpf_migrate_url ); ?>">
						<span class="<?php echo esc_attr( $kookoawpf_line1_class ); ?>">
							<?php if ( 1 === count( $kookoawpf_brand_sources ) ) : ?>
								<span class="dashicons dashicons-portfolio"></span>
							<?php endif; ?>
							<?php echo esc_html( $kookoawpf_hint_line1 ); ?>
						</span>
						<span class="kookoawpf-sidebar-migrate-hint-line2"><?php esc_html_e( 'IMPORT FOLDERS', 'kookoa-folders' ); ?></span>
					</a>
					<button type="button" class="kookoawpf-sidebar-migrate-hint-dismiss" id="kookoawpf-sidebar-migrate-hint-dismiss" aria-label="<?php esc_attr_e( "Don't show again", 'kookoa-folders' ); ?>">&times;</button>
				</div>
			<?php endif; ?>

			<div class="kookoawpf-sidebar-search">
				<?php
				// FOUC prevention: render the search input already in its
				// disabled state (matches the default rendered when 0 or 1
				// folders exist). JS in sidebar-ui.js → _updateNoFolderState()
				// flips this on once it counts >= 2 folders. Without this,
				// users with empty / single-folder sidebars saw a white
				// "active" flash for ~one frame on every load.
				?>
				<input type="text" id="kookoawpf-search-folders" placeholder="<?php esc_attr_e( 'Search folders...', 'kookoa-folders' ); ?>" class="kookoawpf-ui-disabled" disabled />
			</div>

			<div class="kookoawpf-sidebar-sort">
				<button type="button" id="kookoawpf-btn-sort" class="kookoawpf-sort-toggle kookoawpf-ui-disabled" title="<?php esc_attr_e( 'Sort folders', 'kookoa-folders' ); ?>">
					<span class="dashicons dashicons-sort"></span>
					<span class="kookoawpf-sort-label"><?php esc_html_e( 'Sort', 'kookoa-folders' ); ?></span>
					<span class="kookoawpf-sort-current" id="kookoawpf-sort-current"></span>
				</button>
				<button type="button" id="kookoawpf-btn-more" class="kookoawpf-more-toggle" title="<?php esc_attr_e( 'More options', 'kookoa-folders' ); ?>">
					<span class="dashicons dashicons-ellipsis"></span>
				</button>
				<div id="kookoawpf-more-dropdown" class="kookoawpf-more-dropdown" style="display:none;">
					<a href="#" class="kookoawpf-more-option" id="kookoawpf-more-bulk-select" data-action="bulk-select">
						<span class="dashicons dashicons-screenoptions"></span>
						<span class="kookoawpf-more-label"><?php esc_html_e( 'Bulk Select', 'kookoa-folders' ); ?></span>
					</a>
					<a href="#" class="kookoawpf-more-option" id="kookoawpf-more-expand" data-action="expand-all">
						<span class="dashicons dashicons-arrow-down-alt2"></span>
						<span class="kookoawpf-more-label"><?php esc_html_e( 'Expand All', 'kookoa-folders' ); ?></span>
					</a>
					<a href="#" class="kookoawpf-more-option" id="kookoawpf-more-folder-id" data-action="show-folder-id">
						<span class="dashicons dashicons-info-outline"></span>
						<span class="kookoawpf-more-label"><?php esc_html_e( 'Display Folder ID', 'kookoa-folders' ); ?></span>
					</a>
					<div class="kookoawpf-more-has-sub">
						<a href="#" class="kookoawpf-more-option" data-action="export-import">
							<span class="dashicons dashicons-database-export"></span>
							<span class="kookoawpf-more-label"><?php esc_html_e( 'Export / Import', 'kookoa-folders' ); ?></span>
							<span class="kookoawpf-more-arrow dashicons dashicons-arrow-right-alt2"></span>
						</a>
						<div class="kookoawpf-more-submenu">
							<a href="#" class="kookoawpf-more-option" id="kookoawpf-more-export" data-action="export">
								<span class="dashicons dashicons-upload"></span>
								<span class="kookoawpf-more-label"><?php esc_html_e( 'Export Folders', 'kookoa-folders' ); ?></span>
							</a>
							<a href="#" class="kookoawpf-more-option" id="kookoawpf-more-import" data-action="import">
								<span class="dashicons dashicons-download"></span>
								<span class="kookoawpf-more-label"><?php esc_html_e( 'Import Folders', 'kookoa-folders' ); ?></span>
							</a>
						</div>
					</div>
					<?php if ( 'upload' === $screen->base ) : ?>
					<a href="#" class="kookoawpf-more-option" id="kookoawpf-more-upload-folder" data-action="upload-folder">
						<span class="dashicons dashicons-open-folder"></span>
						<span class="kookoawpf-more-label"><?php esc_html_e( 'Upload Folder', 'kookoa-folders' ); ?></span>
					</a>
					<?php endif; ?>
					<a href="#" class="kookoawpf-more-option" id="kookoawpf-more-shortcuts" data-action="shortcuts">
						<span class="dashicons dashicons-shortcode"></span>
						<span class="kookoawpf-more-label"><?php esc_html_e( 'Keyboard Shortcuts', 'kookoa-folders' ); ?></span>
					</a>
				</div>
				<div id="kookoawpf-sort-dropdown" class="kookoawpf-sort-dropdown" style="display:none;">
					<div class="kookoawpf-sort-group">
						<div class="kookoawpf-sort-group-title"><?php esc_html_e( 'Sort by', 'kookoa-folders' ); ?></div>
						<a href="#" class="kookoawpf-sort-option" data-sort="custom"><span class="dashicons dashicons-move"></span> <?php esc_html_e( 'Manual order', 'kookoa-folders' ); ?></a>
						<a href="#" class="kookoawpf-sort-option" data-sort="name"><span class="dashicons dashicons-editor-textcolor"></span> <?php esc_html_e( 'Name', 'kookoa-folders' ); ?></a>
						<a href="#" class="kookoawpf-sort-option" data-sort="date"><span class="dashicons dashicons-calendar-alt"></span> <?php esc_html_e( 'Date created', 'kookoa-folders' ); ?></a>
						<a href="#" class="kookoawpf-sort-option" data-sort="count"><span class="dashicons dashicons-editor-ol"></span> <?php esc_html_e( 'Item count', 'kookoa-folders' ); ?></a>
					</div>
					<div class="kookoawpf-sort-sep"></div>
					<div class="kookoawpf-sort-group">
						<div class="kookoawpf-sort-group-title"><?php esc_html_e( 'Direction', 'kookoa-folders' ); ?></div>
						<a href="#" class="kookoawpf-sort-dir" data-dir="ASC"><span class="dashicons dashicons-arrow-up-alt"></span> <?php esc_html_e( 'Ascending', 'kookoa-folders' ); ?> <span class="kookoawpf-sort-hint"></span></a>
						<a href="#" class="kookoawpf-sort-dir" data-dir="DESC"><span class="dashicons dashicons-arrow-down-alt"></span> <?php esc_html_e( 'Descending', 'kookoa-folders' ); ?> <span class="kookoawpf-sort-hint"></span></a>
					</div>
				</div>
			</div>

			<?php
			$kookoawpf_qs            = isset( $_SERVER['QUERY_STRING'] ) ? sanitize_text_field( wp_unslash( $_SERVER['QUERY_STRING'] ) ) : '';
			$kookoawpf_is_all_active = ( false === strpos( $kookoawpf_qs, 'post_status=' ) ) ? ' active' : '';
			?>
			<div class="kookoawpf-sidebar-nav">
				<a href="#" class="kookoawpf-nav-item kookoawpf-nav-all<?php echo esc_attr( $kookoawpf_is_all_active ); ?>" data-folder="all">
					<span class="dashicons dashicons-category"></span>
					<span class="kookoawpf-nav-label"><?php esc_html_e( 'All Items', 'kookoa-folders' ); ?></span>
					<span class="kookoawpf-nav-count" id="kookoawpf-count-all"></span>
				</a>
				<a href="#" class="kookoawpf-nav-item kookoawpf-nav-uncategorized" data-folder="uncategorized">
					<span class="dashicons dashicons-portfolio"></span>
					<span class="kookoawpf-nav-label"><?php esc_html_e( 'Uncategorized', 'kookoa-folders' ); ?></span>
					<span class="kookoawpf-nav-count" id="kookoawpf-count-uncategorized"></span>
				</a>
			</div>

			<!-- Folder Bulk Actions Toolbar -->
			<?php
			// Pin/Lock are toggle actions — when the user hides them from the
			// context menu we must hide them from the bulk toolbar too, otherwise
			// they could pin/lock via toolbar with no way to unpin/unlock.
			$kookoawpf_ctx_disabled_fb = (array) get_option( 'kookoawpf_ctx_disabled', array() );
			$kookoawpf_show_pin_btn    = ! in_array( 'pin', $kookoawpf_ctx_disabled_fb, true );
			$kookoawpf_show_lock_btn   = ! in_array( 'lock', $kookoawpf_ctx_disabled_fb, true );
			?>
			<div id="kookoawpf-folder-bulk-bar" class="kookoawpf-folder-bulk-bar">
				<label class="kookoawpf-fb-toggle" title="<?php esc_attr_e( 'Select folders', 'kookoa-folders' ); ?>">
					<input type="checkbox" id="kookoawpf-fb-master" />
					<span class="kookoawpf-fb-check"></span>
				</label>
				<?php if ( $kookoawpf_show_pin_btn ) : ?>
				<button type="button" class="kookoawpf-fb-btn" data-action="pin" title="<?php esc_attr_e( 'Pin to Top', 'kookoa-folders' ); ?>" disabled>
					<span class="dashicons dashicons-star-filled"></span>
				</button>
				<?php endif; ?>
				<?php if ( $kookoawpf_show_lock_btn ) : ?>
				<button type="button" class="kookoawpf-fb-btn" data-action="lock" title="<?php esc_attr_e( 'Lock', 'kookoa-folders' ); ?>" disabled>
					<span class="dashicons dashicons-lock"></span>
				</button>
				<?php endif; ?>
				<button type="button" class="kookoawpf-fb-btn" data-action="duplicate" title="<?php esc_attr_e( 'Duplicate', 'kookoa-folders' ); ?>" disabled>
					<span class="dashicons dashicons-admin-page"></span>
				</button>
				<button type="button" class="kookoawpf-fb-btn kookoawpf-fb-btn-danger" data-action="delete" title="<?php esc_attr_e( 'Delete', 'kookoa-folders' ); ?>" disabled>
					<span class="dashicons dashicons-trash"></span>
				</button>
			</div>

			<div id="kookoawpf-tree-container" class="kookoawpf-tree-container">
				<div id="kookoawpf-jstree"></div>
			</div>

			<div id="kookoawpf-empty-state" class="kookoawpf-empty-state" style="display:none;">
				<div class="kookoawpf-empty-state-img-wrap">
					<img src="<?php echo esc_url( KOOKOAWPF_PLUGIN_URL . 'assets/images/adamo.gif' ); ?>" alt="" class="kookoawpf-empty-state-img kookoawpf-empty-state-img--base" />
					<img src="<?php echo esc_url( KOOKOAWPF_PLUGIN_URL . 'assets/images/adamo2.gif' ); ?>" alt="" class="kookoawpf-empty-state-img kookoawpf-empty-state-img--hover" />
				</div>
				<p class="kookoawpf-empty-state-text"><?php esc_html_e( 'Create your first folder!', 'kookoa-folders' ); ?></p>
				<button type="button" class="kookoawpf-empty-state-btn" id="kookoawpf-empty-new-folder">
					<span class="dashicons dashicons-plus-alt2"></span> <?php esc_html_e( 'New Folder', 'kookoa-folders' ); ?>
				</button>
			</div>

			<div id="kookoawpf-free-limits" class="kookoawpf-free-limits" style="display:none;"></div>

			<div class="kookoawpf-sidebar-resize" id="kookoawpf-sidebar-resize"></div>
		</div>
		<?php
	}

	/**
	 * Render color/icon/delete modals on non-folder screens (e.g. post.php)
	 * so the media modal context menu can reuse them.
	 */
	public function render_media_modal_modals(): void {
		// Skip if already rendered by render_modals() on folder screens.
		if ( $this->is_folder_screen() ) {
			return;
		}

		// On frontend (page builder context), skip admin screen checks.
		if ( ! is_admin() ) {
			// Only if attachment folders are enabled.
			$supported = kookoawpf()->get_supported_post_types();
			if ( ! in_array( 'attachment', $supported, true ) ) {
				return;
			}
		} else {
			// Only render on admin screens where our JS is enqueued.
			$screen = get_current_screen();
			if ( ! $screen || ! in_array( $screen->base, array( 'post', 'page' ), true ) ) {
				return;
			}

			// Only if attachment folders are enabled.
			$supported = kookoawpf()->get_supported_post_types();
			if ( ! in_array( 'attachment', $supported, true ) ) {
				return;
			}
		}
		?>
		<!-- Color Picker Modal (for media modal) -->
		<div id="kookoawpf-modal-color" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-sm">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Folder Color', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<div id="kookoawpf-color-palette" class="kookoawpf-color-palette">
						<?php
						$color_rows = array(
							array( '#39FF14', '#34C759', '#00BCD4', '#007AFF', '#9966FF', '#FF66FF' ),
							array( '#FF3300', '#FF9500', '#FFCC00', '#CC9933', '#FFCCFF' ),
							array( '#999999', '#FFFFFF', '#000000' ),
						);
						foreach ( $color_rows as $row ) :
							?>
							<div class="kookoawpf-color-row">
								<?php foreach ( $row as $c ) : ?>
									<span class="kookoawpf-color-swatch" data-color="<?php echo esc_attr( $c ); ?>" style="background-color:<?php echo esc_attr( $c ); ?>;"></span>
								<?php endforeach; ?>
							</div>
							<?php
						endforeach;
						$custom_colors = get_option( 'kookoawpf_custom_colors', array() );
						if ( ! empty( $custom_colors ) ) :
							?>
							<div class="kookoawpf-color-separator"></div>
							<div class="kookoawpf-color-row kookoawpf-color-row-custom">
								<?php foreach ( (array) $custom_colors as $cc ) : ?>
									<span class="kookoawpf-color-swatch" data-color="<?php echo esc_attr( $cc ); ?>" style="background-color:<?php echo esc_attr( $cc ); ?>;"></span>
								<?php endforeach; ?>
							</div>
						<?php endif; ?>
					</div>
					<div class="kookoawpf-color-reset-row">
						<a href="#" id="kookoawpf-color-reset" class="kookoawpf-color-reset-link" style="display:none;"><?php esc_html_e( 'Reset color', 'kookoa-folders' ); ?></a>
					</div>
					<input type="hidden" id="kookoawpf-color-folder-id" value="0" />
				</div>
			</div>
		</div>

		<!-- Icon Picker Modal (for media modal) -->
		<div id="kookoawpf-modal-icon" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Change Icon', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body kookoawpf-icon-picker-body">
					<div class="kookoawpf-icon-reset-row" id="kookoawpf-icon-reset-row" style="display:none;">
						<button type="button" id="kookoawpf-icon-reset" class="button"><?php esc_html_e( 'Reset to Default', 'kookoa-folders' ); ?></button>
					</div>
					<?php
					$icon_categories = array(
						'folders'     => array(
							'label' => __( 'Folders', 'kookoa-folders' ),
							'icons' => array( '⭐', '🔒', '🔗', '🗂️', '📂', '📌', '📍', '✂️', '❓', '🔍', '📚', '🧱', '🧻', '🧰' ),
						),
						'images'      => array(
							'label' => __( 'Images', 'kookoa-folders' ),
							'icons' => array( '🖼️', '🌄', '🎨', '🧩', '🏞️', '🌇', '📷' ),
						),
						'documents'   => array(
							'label' => __( 'Documents', 'kookoa-folders' ),
							'icons' => array( '📄', '📝', '📕', '📘', '📗', '📒', '📊', '📑', '📰', '📋', '🧮', '📶', '📈', '📉' ),
						),
						'video-audio' => array(
							'label' => __( 'Video/Audio', 'kookoa-folders' ),
							'icons' => array( '🎬', '▶️', '🎞️', '🎵', '🎧', '💿', '📀' ),
						),
						'tech'        => array(
							'label' => __( 'Tech', 'kookoa-folders' ),
							'icons' => array( '⚙️', '🧠', '🔧', '💻', '🖥️', '📱', '🌐', '📟', '🤖', '🧭', '🔋', '🛡️', '💡', '🧲' ),
						),
						'actions'     => array(
							'label' => __( 'Actions', 'kookoa-folders' ),
							'icons' => array( '➕', '📥', '✏️', '🗑️', '🔍', '🏷️', '🔄', '✅', '✴️', '🚀', '🧹', '♻️', '🧬', '🔥' ),
						),
						'states'      => array(
							'label' => __( 'States', 'kookoa-folders' ),
							'icons' => array( '✔️', '❌', '🌍', '⏳', '⚠️', '🕘', '🎯', '🔴', '🟢', '🟡', '🟠', '🔵', '🟣', '⚪' ),
						),
						'special'     => array(
							'label' => __( 'Special', 'kookoa-folders' ),
							'icons' => array( '🐹', '🐭', '🐶', '🐼', '🍒', '🍉', '🍎', '❤️', '💛', '🩵', '🤍', '🎁', '🛒', '☎️', '⏰', '🚚', '💰', '🌟', '✨', '🔆', '💩', '😍', '😁', '😎', '🤮', '👽', '👻', '🤡', '👍', '👎', '👆', '👌', '✌️', '👈', '🤘' ),
						),
					);
					$icon_blocks_off = get_option( 'kookoawpf_icon_blocks_disabled', array() );
					foreach ( $icon_categories as $cat_key => $cat_data ) :
						if ( in_array( $cat_key, (array) $icon_blocks_off, true ) ) {
							continue; }
						?>
						<div class="kookoawpf-icon-category">
							<div class="kookoawpf-icon-category-label"><?php echo esc_html( $cat_data['label'] ); ?></div>
							<div class="kookoawpf-icon-grid">
								<?php foreach ( $cat_data['icons'] as $ico ) : ?>
									<span class="kookoawpf-icon-option" data-icon="<?php echo esc_attr( $ico ); ?>"><?php echo esc_html( $ico ); ?></span>
								<?php endforeach; ?>
							</div>
						</div>
					<?php endforeach; ?>
					<input type="hidden" id="kookoawpf-icon-folder-id" value="0" />
				</div>
			</div>
		</div>

		<!-- Delete Confirm Modal (for media modal) -->
		<div id="kookoawpf-modal-delete" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-sm">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Delete Folder', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<p><?php esc_html_e( 'Are you sure you want to delete this folder? All subfolders will also be deleted. The items inside will NOT be deleted.', 'kookoa-folders' ); ?></p>
					<input type="hidden" id="kookoawpf-delete-folder-id" value="0" />
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary kookoawpf-btn-danger" id="kookoawpf-confirm-delete"><?php esc_html_e( 'Delete', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- Move to Folder Modal (for media modal) -->
		<div id="kookoawpf-modal-move-to-folder" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-sm">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Move to Folder', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<input type="hidden" id="kookoawpf-move-to-folder-id" value="0" />
					<label><?php esc_html_e( 'Destination', 'kookoa-folders' ); ?></label>
					<select id="kookoawpf-move-to-folder-select">
						<option value="root"><?php esc_html_e( '— Root (no parent) —', 'kookoa-folders' ); ?></option>
					</select>
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary" id="kookoawpf-confirm-move-to-folder"><?php esc_html_e( 'Move', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- Keyboard Shortcuts Modal (for media modal) -->
		<div id="kookoawpf-modal-shortcuts" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-shortcuts-content">
				<button type="button" class="kookoawpf-modal-close">&times;</button>
				<h3><?php esc_html_e( 'Keyboard Shortcuts', 'kookoa-folders' ); ?></h3>
				<table class="kookoawpf-shortcuts-table">
					<tr><td><?php esc_html_e( 'Create New Folder', 'kookoa-folders' ); ?></td><td>Alt + N</td></tr>
					<tr><td><?php esc_html_e( 'Create Subfolder', 'kookoa-folders' ); ?></td><td>Alt + S</td></tr>
					<tr><td><?php esc_html_e( 'Rename Folder', 'kookoa-folders' ); ?></td><td>F2</td></tr>
					<tr><td><?php esc_html_e( 'Delete Folder', 'kookoa-folders' ); ?></td><td>Del</td></tr>
					<tr><td><?php esc_html_e( 'Move to Folder', 'kookoa-folders' ); ?></td><td>Alt + M</td></tr>
					<tr><td><?php esc_html_e( 'Bulk Organize', 'kookoa-folders' ); ?></td><td>Alt + B</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Copy Folder', 'kookoa-folders' ); ?></td><td>Ctrl + C</td></tr>
					<tr><td><?php esc_html_e( 'Cut Folder', 'kookoa-folders' ); ?></td><td>Ctrl + X</td></tr>
					<tr><td><?php esc_html_e( 'Paste Folder', 'kookoa-folders' ); ?></td><td>Ctrl + V</td></tr>
					<tr><td><?php esc_html_e( 'Duplicate Folder', 'kookoa-folders' ); ?></td><td>Ctrl + D</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Change Color', 'kookoa-folders' ); ?></td><td>Alt + C</td></tr>
					<tr><td><?php esc_html_e( 'Change Icon', 'kookoa-folders' ); ?></td><td>Alt + I</td></tr>
					<tr><td><?php esc_html_e( 'Pin / Unpin', 'kookoa-folders' ); ?></td><td>Alt + P</td></tr>
					<tr><td><?php esc_html_e( 'Lock / Unlock', 'kookoa-folders' ); ?></td><td>Alt + L</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Navigate Folders', 'kookoa-folders' ); ?></td><td>&uarr; &darr;</td></tr>
					<tr><td><?php esc_html_e( 'Expand / Collapse', 'kookoa-folders' ); ?></td><td>&rarr; &larr;</td></tr>
					<tr><td><?php esc_html_e( 'Reorder Folder', 'kookoa-folders' ); ?></td><td>Shift + &uarr; &darr;</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Keyboard Shortcuts', 'kookoa-folders' ); ?></td><td>Alt + K</td></tr>
					<tr><td><?php esc_html_e( 'Close Modal / Exit Bulk Mode', 'kookoa-folders' ); ?></td><td>Esc</td></tr>
					<tr><td><?php esc_html_e( 'Confirm Action', 'kookoa-folders' ); ?></td><td>Enter</td></tr>
				</table>
			</div>
		</div>
		<?php
	}

	/**
	 * Render modal dialogs
	 */
	public function render_modals(): void {
		if ( ! $this->is_folder_screen() ) {
			return;
		}

		/**
		 * Extension point: companion plugins can inject their own modal HTML
		 * into the folder screen footer before the core modals. Runs only
		 * when the sidebar is actually visible (is_folder_screen gate above).
		 */
		do_action( 'kookoawpf_render_extra_modals' );
		?>
		<!-- Smart Folder Modal -->
		<div id="kookoawpf-modal-dynamic" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-dynamic-content">
				<div class="kookoawpf-modal-header">
					<h3 id="kookoawpf-dynamic-modal-title"><?php esc_html_e( 'Smart Folder', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<div class="kookoawpf-dynamic-name-row">
						<label for="kookoawpf-dynamic-name"><?php esc_html_e( 'Smart Folder Name', 'kookoa-folders' ); ?></label>
						<input type="text" id="kookoawpf-dynamic-name" />
					</div>
					<div class="kookoawpf-dynamic-rules-header">
						<span><?php esc_html_e( 'Show items matching ALL of:', 'kookoa-folders' ); ?></span>
						<button type="button" id="kookoawpf-dynamic-add-rule" class="button kookoawpf-btn-add-rule">
							<span class="dashicons dashicons-plus-alt2"></span>
							<?php esc_html_e( 'Add Rule', 'kookoa-folders' ); ?>
						</button>
					</div>
					<div id="kookoawpf-dynamic-rules-list" class="kookoawpf-dynamic-rules-list"></div>
					<input type="hidden" id="kookoawpf-dynamic-folder-id" value="0" />
					<input type="hidden" id="kookoawpf-dynamic-mode" value="create" />
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary" id="kookoawpf-dynamic-save"><?php esc_html_e( 'Save', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- New/Rename Folder Modal -->
		<div id="kookoawpf-modal-folder" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content">
				<div class="kookoawpf-modal-header">
					<h3 id="kookoawpf-modal-folder-title"><?php esc_html_e( 'New Folder', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<label for="kookoawpf-folder-name"><?php esc_html_e( 'Folder Name', 'kookoa-folders' ); ?></label>
					<input type="text" id="kookoawpf-folder-name" maxlength="100" />

					<div id="kookoawpf-parent-folder-row" style="margin-top:12px;">
						<label for="kookoawpf-folder-parent-select"><?php esc_html_e( 'Parent Folder', 'kookoa-folders' ); ?></label>
						<select id="kookoawpf-folder-parent-select" style="width:100%;padding:8px;font-size:14px;">
							<option value="0"><?php esc_html_e( '— None (Root folder)', 'kookoa-folders' ); ?></option>
						</select>
					</div>

					<input type="hidden" id="kookoawpf-folder-action" value="create" />
					<input type="hidden" id="kookoawpf-folder-id" value="0" />
					<input type="hidden" id="kookoawpf-folder-parent" value="0" />
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary" id="kookoawpf-modal-folder-save"><?php esc_html_e( 'Save', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- Color Picker Modal -->
		<div id="kookoawpf-modal-color" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-sm">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Folder Color', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<div id="kookoawpf-color-palette" class="kookoawpf-color-palette">
						<?php
						$color_rows = array(
							array( '#39FF14', '#34C759', '#00BCD4', '#007AFF', '#9966FF', '#FF66FF' ),
							array( '#FF3300', '#FF9500', '#FFCC00', '#CC9933', '#FFCCFF' ),
							array( '#999999', '#FFFFFF', '#000000' ),
						);
						foreach ( $color_rows as $row ) :
							?>
							<div class="kookoawpf-color-row">
								<?php foreach ( $row as $c ) : ?>
									<span class="kookoawpf-color-swatch" data-color="<?php echo esc_attr( $c ); ?>" style="background-color:<?php echo esc_attr( $c ); ?>;"></span>
								<?php endforeach; ?>
							</div>
							<?php
						endforeach;
						$custom_colors = get_option( 'kookoawpf_custom_colors', array() );
						if ( ! empty( $custom_colors ) ) :
							?>
							<div class="kookoawpf-color-separator"></div>
							<div class="kookoawpf-color-row kookoawpf-color-row-custom">
								<?php foreach ( (array) $custom_colors as $cc ) : ?>
									<span class="kookoawpf-color-swatch" data-color="<?php echo esc_attr( $cc ); ?>" style="background-color:<?php echo esc_attr( $cc ); ?>;"></span>
								<?php endforeach; ?>
							</div>
						<?php endif; ?>
					</div>
					<div class="kookoawpf-color-reset-row">
						<a href="#" id="kookoawpf-color-reset" class="kookoawpf-color-reset-link" style="display:none;"><?php esc_html_e( 'Reset color', 'kookoa-folders' ); ?></a>
					</div>
					<input type="hidden" id="kookoawpf-color-folder-id" value="0" />
				</div>
			</div>
		</div>

		<!-- Icon Picker Modal -->
		<div id="kookoawpf-modal-icon" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Change Icon', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body kookoawpf-icon-picker-body">
					<div class="kookoawpf-icon-reset-row" id="kookoawpf-icon-reset-row" style="display:none;">
						<button type="button" id="kookoawpf-icon-reset" class="button"><?php esc_html_e( 'Reset to Default', 'kookoa-folders' ); ?></button>
					</div>
					<?php
					$icon_categories = array(
						'folders'     => array(
							'label' => __( 'Folders', 'kookoa-folders' ),
							'icons' => array( '⭐', '🔒', '🔗', '🗂️', '📂', '📌', '📍', '✂️', '❓', '🔍', '📚', '🧱', '🧻', '🧰' ),
						),
						'images'      => array(
							'label' => __( 'Images', 'kookoa-folders' ),
							'icons' => array( '🖼️', '🌄', '🎨', '🧩', '🏞️', '🌇', '📷' ),
						),
						'documents'   => array(
							'label' => __( 'Documents', 'kookoa-folders' ),
							'icons' => array( '📄', '📝', '📕', '📘', '📗', '📒', '📊', '📑', '📰', '📋', '🧮', '📶', '📈', '📉' ),
						),
						'video-audio' => array(
							'label' => __( 'Video/Audio', 'kookoa-folders' ),
							'icons' => array( '🎬', '▶️', '🎞️', '🎵', '🎧', '💿', '📀' ),
						),
						'tech'        => array(
							'label' => __( 'Tech', 'kookoa-folders' ),
							'icons' => array( '⚙️', '🧠', '🔧', '💻', '🖥️', '📱', '🌐', '📟', '🤖', '🧭', '🔋', '🛡️', '💡', '🧲' ),
						),
						'actions'     => array(
							'label' => __( 'Actions', 'kookoa-folders' ),
							'icons' => array( '➕', '📥', '✏️', '🗑️', '🔍', '🏷️', '🔄', '✅', '✴️', '🚀', '🧹', '♻️', '🧬', '🔥' ),
						),
						'states'      => array(
							'label' => __( 'States', 'kookoa-folders' ),
							'icons' => array( '✔️', '❌', '🌍', '⏳', '⚠️', '🕘', '🎯', '🔴', '🟢', '🟡', '🟠', '🔵', '🟣', '⚪' ),
						),
						'special'     => array(
							'label' => __( 'Special', 'kookoa-folders' ),
							'icons' => array( '🐹', '🐭', '🐶', '🐼', '🍒', '🍉', '🍎', '❤️', '💛', '🩵', '🤍', '🎁', '🛒', '☎️', '⏰', '🚚', '💰', '🌟', '✨', '🔆', '💩', '😍', '😁', '😎', '🤮', '👽', '👻', '🤡', '👍', '👎', '👆', '👌', '✌️', '👈', '🤘' ),
						),
					);
					$icon_blocks_off = get_option( 'kookoawpf_icon_blocks_disabled', array() );
					foreach ( $icon_categories as $cat_key => $cat_data ) :
						if ( in_array( $cat_key, (array) $icon_blocks_off, true ) ) {
							continue; }
						$cat_name = $cat_data['label'];
						$icons    = $cat_data['icons'];
						?>
						<div class="kookoawpf-icon-category">
							<div class="kookoawpf-icon-category-label"><?php echo esc_html( $cat_name ); ?></div>
							<div class="kookoawpf-icon-grid">
								<?php foreach ( $icons as $ico ) : ?>
									<span class="kookoawpf-icon-option" data-icon="<?php echo esc_attr( $ico ); ?>"><?php echo esc_html( $ico ); ?></span>
								<?php endforeach; ?>
							</div>
						</div>
					<?php endforeach; ?>
					<input type="hidden" id="kookoawpf-icon-folder-id" value="0" />
				</div>
			</div>
		</div>

		<!-- Delete Confirm Modal -->
		<div id="kookoawpf-modal-delete" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-sm">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Delete Folder', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<p><?php esc_html_e( 'Are you sure you want to delete this folder? All subfolders will also be deleted. The items inside will NOT be deleted.', 'kookoa-folders' ); ?></p>
					<input type="hidden" id="kookoawpf-delete-folder-id" value="0" />
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary kookoawpf-btn-danger" id="kookoawpf-confirm-delete"><?php esc_html_e( 'Delete', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- Bulk Folder Delete Modal -->
		<div id="kookoawpf-modal-bulk-folder-delete" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-sm">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Delete Folders', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<p><?php esc_html_e( 'Are you sure you want to delete the selected folders? All subfolders will also be deleted. The items inside will NOT be deleted.', 'kookoa-folders' ); ?></p>
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary kookoawpf-btn-danger" id="kookoawpf-confirm-bulk-folder-delete"><?php esc_html_e( 'Delete', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- Bulk Organize Modal -->

		<!-- Move to Folder Modal (reparent) -->
		<div id="kookoawpf-modal-move-to-folder" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-sm">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Move to Folder', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<input type="hidden" id="kookoawpf-move-to-folder-id" value="0" />
					<label><?php esc_html_e( 'Destination', 'kookoa-folders' ); ?></label>
					<select id="kookoawpf-move-to-folder-select">
						<option value="root"><?php esc_html_e( '— Root (no parent) —', 'kookoa-folders' ); ?></option>
					</select>
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary" id="kookoawpf-confirm-move-to-folder"><?php esc_html_e( 'Move', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- Bulk Organize Modal (items) -->
		<div id="kookoawpf-modal-bulk" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Bulk Organize', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<p class="kookoawpf-bulk-info"><?php esc_html_e( 'Move selected items to a folder.', 'kookoa-folders' ); ?></p>
					<p id="kookoawpf-bulk-count" style="font-weight:600;margin-bottom:12px;"></p>
					<label for="kookoawpf-bulk-folder-select"><?php esc_html_e( 'Target Folder', 'kookoa-folders' ); ?></label>
					<select id="kookoawpf-bulk-folder-select" style="width:100%;padding:8px;font-size:14px;">
						<option value=""><?php esc_html_e( 'Select a folder...', 'kookoa-folders' ); ?></option>
						<option value="uncategorized">(<?php esc_html_e( 'Uncategorized', 'kookoa-folders' ); ?>)</option>
					</select>
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary" id="kookoawpf-bulk-apply"><?php esc_html_e( 'Apply', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>

		<!-- Import Folders Modal -->
		<div id="kookoawpf-modal-import" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content">
				<div class="kookoawpf-modal-header">
					<h3><?php esc_html_e( 'Import Folders', 'kookoa-folders' ); ?></h3>
					<button type="button" class="kookoawpf-modal-close">&times;</button>
				</div>
				<div class="kookoawpf-modal-body">
					<p id="kookoawpf-import-info" style="margin-bottom:12px;"></p>
					<div id="kookoawpf-import-preview" style="margin-bottom:16px;background:#161b22;border:1px solid #30363d;border-radius:6px;padding:12px;max-height:200px;overflow:auto;font-family:'Share Tech Mono',monospace;font-size:12px;color:#8b949e;display:none;"></div>
					<div style="display:flex;align-items:center;gap:8px;margin-bottom:6px;">
						<label style="display:flex;align-items:center;gap:4px;white-space:nowrap;">
							<input type="radio" name="kookoawpf_import_mode" value="merge" checked>
							<span style="color:#39FF14;font-weight:600;"><?php esc_html_e( 'Merge', 'kookoa-folders' ); ?></span>
						</label>
						<label style="display:flex;align-items:center;gap:4px;white-space:nowrap;">
							<input type="radio" name="kookoawpf_import_mode" value="replace">
							<span style="color:#FF3B30;font-weight:600;"><?php esc_html_e( 'Replace', 'kookoa-folders' ); ?></span>
						</label>
					</div>
					<div id="kookoawpf-import-mode-desc" style="font-size:13px;color:#39FF14;line-height:1.3;"><?php esc_html_e( 'Keeps current folders and adds imported ones.', 'kookoa-folders' ); ?></div>
				</div>
				<div class="kookoawpf-modal-footer">
					<button type="button" class="button kookoawpf-modal-cancel"><?php esc_html_e( 'Cancel', 'kookoa-folders' ); ?></button>
					<button type="button" class="button button-primary" id="kookoawpf-confirm-import"><?php esc_html_e( 'Import', 'kookoa-folders' ); ?></button>
				</div>
			</div>
		</div>
		<!-- Keyboard Shortcuts Modal -->
		<div id="kookoawpf-modal-shortcuts" class="kookoawpf-modal" style="display:none;">
			<div class="kookoawpf-modal-overlay"></div>
			<div class="kookoawpf-modal-content kookoawpf-modal-shortcuts-content">
				<button type="button" class="kookoawpf-modal-close">&times;</button>
				<h3><?php esc_html_e( 'Keyboard Shortcuts', 'kookoa-folders' ); ?></h3>
				<table class="kookoawpf-shortcuts-table">
					<tr><td><?php esc_html_e( 'Create New Folder', 'kookoa-folders' ); ?></td><td>Alt + N</td></tr>
					<tr><td><?php esc_html_e( 'Create Subfolder', 'kookoa-folders' ); ?></td><td>Alt + S</td></tr>
					<tr><td><?php esc_html_e( 'Rename Folder', 'kookoa-folders' ); ?></td><td>F2</td></tr>
					<tr><td><?php esc_html_e( 'Delete Folder', 'kookoa-folders' ); ?></td><td>Del</td></tr>
					<tr><td><?php esc_html_e( 'Move to Folder', 'kookoa-folders' ); ?></td><td>Alt + M</td></tr>
					<tr><td><?php esc_html_e( 'Bulk Organize', 'kookoa-folders' ); ?></td><td>Alt + B</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Copy Folder', 'kookoa-folders' ); ?></td><td>Ctrl + C</td></tr>
					<tr><td><?php esc_html_e( 'Cut Folder', 'kookoa-folders' ); ?></td><td>Ctrl + X</td></tr>
					<tr><td><?php esc_html_e( 'Paste Folder', 'kookoa-folders' ); ?></td><td>Ctrl + V</td></tr>
					<tr><td><?php esc_html_e( 'Duplicate Folder', 'kookoa-folders' ); ?></td><td>Ctrl + D</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Change Color', 'kookoa-folders' ); ?></td><td>Alt + C</td></tr>
					<tr><td><?php esc_html_e( 'Change Icon', 'kookoa-folders' ); ?></td><td>Alt + I</td></tr>
					<tr><td><?php esc_html_e( 'Pin / Unpin', 'kookoa-folders' ); ?></td><td>Alt + P</td></tr>
					<tr><td><?php esc_html_e( 'Lock / Unlock', 'kookoa-folders' ); ?></td><td>Alt + L</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Navigate Folders', 'kookoa-folders' ); ?></td><td>&uarr; &darr;</td></tr>
					<tr><td><?php esc_html_e( 'Expand / Collapse', 'kookoa-folders' ); ?></td><td>&rarr; &larr;</td></tr>
					<tr><td><?php esc_html_e( 'Reorder Folder', 'kookoa-folders' ); ?></td><td>Shift + &uarr; &darr;</td></tr>
					<tr class="kookoawpf-shortcuts-sep"><td colspan="2"></td></tr>
					<tr><td><?php esc_html_e( 'Keyboard Shortcuts', 'kookoa-folders' ); ?></td><td>Alt + K</td></tr>
					<tr><td><?php esc_html_e( 'Close Modal / Exit Bulk Mode', 'kookoa-folders' ); ?></td><td>Esc</td></tr>
					<tr><td><?php esc_html_e( 'Confirm Action', 'kookoa-folders' ); ?></td><td>Enter</td></tr>
				</table>
			</div>
		</div>
		<?php
	}
}
