<?php

use AdminColumnsCustomizer\ScreenSupport;
use WP_PowerSuite\Core\ModuleRegistry;

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

if ( ! function_exists( 'wp_powersuite_is_license_valid' ) || ! wp_powersuite_is_license_valid() ) {
	$license_page_url = admin_url( 'admin.php?page=powersuite-license' );
	?>
	<div class="wp-powersuite-module-settings wpps-settings-panel" data-module-id="<?php echo esc_attr( $module_id ?? 'admin-columns-customizer' ); ?>">
		<div class="notice notice-warning inline" style="margin:0;">
			<p>
				<?php esc_html_e( 'Admin Columns Customizer requires an active license. Activate your license to customize admin list-table columns.', 'wppowersuite-lite' ); ?>
				<a href="<?php echo esc_url( $license_page_url ); ?>"><?php esc_html_e( 'Activate license', 'wppowersuite-lite' ); ?></a>
			</p>
		</div>
	</div>
	<?php
	return;
}

require_once __DIR__ . '/supports.php';

$module_id = 'admin-columns-customizer';

$module_meta = ModuleRegistry::getInstance()->getModuleMetadata( $module_id );
$is_pro = ! empty( $module_meta['is_pro'] );

$post_types = get_post_types( [], 'objects' );
$taxonomies = get_taxonomies( [ 'public' => true ], 'objects' );

$selected_screen_type = ScreenSupport::sanitizeScreenType(
	sanitize_text_field( wp_unslash( $_GET['screen_type'] ?? 'post_type' ) )
);
$selected_screen_id = sanitize_text_field( wp_unslash( $_GET['screen_id'] ?? 'post' ) );

if ( ! ScreenSupport::isSupportedEditorScreen( $selected_screen_type, $selected_screen_id ) ) {
	$selected_screen_type = 'post_type';
	$selected_screen_id   = 'post';
}

$show_quick_add = (
	$selected_screen_type === 'post_type'
	&& ! in_array( $selected_screen_id, [ 'comments', 'attachment' ], true )
	&& ScreenSupport::isManageablePostType( $selected_screen_id )
);
$quick_add_taxonomies = [];
if ( $show_quick_add ) {
	$tax_objects = get_object_taxonomies( $selected_screen_id, 'objects' );
	foreach ( $tax_objects as $tax ) {
		if ( ScreenSupport::isManageableTaxonomy( $tax->name ) ) {
			$quick_add_taxonomies[] = [
				'slug'       => $tax->name,
				'label'      => $tax->labels->name,
				'column_key' => ScreenSupport::taxonomyListColumnKey( $tax->name ),
			];
		}
	}
}

?>
<div class="wrap wpps-admin-columns-page">
	<hr class="wp-header-end">
	<?php
	\WP_PowerSuite\Admin\PageHero::render_for_module(
		[
			'icon'    => 'dashicons-columns',
			'title'   => __( 'Admin Columns Customizer', 'wppowersuite-lite' ),
			'tagline' => __( 'Customize columns on post, media, comment, user, and taxonomy admin lists.', 'wppowersuite-lite' ),
			'status'  => $is_pro ? __( 'Premium', 'wppowersuite-lite' ) : '',
		]
	);
	?>

	<div class="wpps-columns-container">
		<div class="wpps-columns-sidebar">
			<div class="wpps-screen-selector">
				<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;">
					<h2 style="margin: 0;"><?php esc_html_e( 'Select Screen', 'wppowersuite-lite' ); ?></h2>
					<button type="button" class="button wpps-reset-all-columns" style="font-size: 12px; padding: 4px 8px; height: auto;">
						<?php esc_html_e( 'Reset All', 'wppowersuite-lite' ); ?>
					</button>
				</div>

				<div class="wpps-screen-type-tabs">
					<button type="button" class="wpps-tab-button <?php echo $selected_screen_type === 'post_type' ? 'active' : ''; ?>" data-screen-type="post_type">
						<?php esc_html_e( 'Post Types', 'wppowersuite-lite' ); ?>
					</button>
					<button type="button" class="wpps-tab-button <?php echo $selected_screen_type === 'user' ? 'active' : ''; ?>" data-screen-type="user">
						<?php esc_html_e( 'Users', 'wppowersuite-lite' ); ?>
					</button>
					<button type="button" class="wpps-tab-button <?php echo $selected_screen_type === 'taxonomy' ? 'active' : ''; ?>" data-screen-type="taxonomy">
						<?php esc_html_e( 'Taxonomies', 'wppowersuite-lite' ); ?>
					</button>
				</div>

				<div class="wpps-screen-list" data-screen-type="post_type" style="<?php echo $selected_screen_type !== 'post_type' ? 'display: none;' : ''; ?>">
					<?php foreach ( $post_types as $post_type ) : ?>
						<?php
						if ( in_array( $post_type->name, [ 'attachment', 'comments' ], true ) ) {
							continue;
						}
						if ( ! ScreenSupport::isManageablePostType( $post_type->name ) ) {
							continue;
						}
						$is_selected = $selected_screen_type === 'post_type' && $selected_screen_id === $post_type->name;
						$label = $post_type->labels->name;
						$key  = $post_type->name;
						?>
						<a href="<?php echo esc_url( add_query_arg( [ 'screen_type' => 'post_type', 'screen_id' => $post_type->name ] ) ); ?>" 
						   class="wpps-screen-item <?php echo $is_selected ? 'active' : ''; ?>">
							<span class="dashicons dashicons-admin-post"></span>
							<?php echo esc_html( $label ); ?> <span class="wpps-screen-key">(<?php echo esc_html( $key ); ?>)</span>
						</a>
					<?php endforeach; ?>
					<?php
					$is_comments_selected = $selected_screen_type === 'post_type' && $selected_screen_id === 'comments';
					?>
					<a href="<?php echo esc_url( add_query_arg( [ 'screen_type' => 'post_type', 'screen_id' => 'comments' ] ) ); ?>" 
					   class="wpps-screen-item <?php echo $is_comments_selected ? 'active' : ''; ?>">
						<span class="dashicons dashicons-admin-comments"></span>
						<?php esc_html_e( 'Comments', 'wppowersuite-lite' ); ?> <span class="wpps-screen-key">(comments)</span>
					</a>
					<?php
					$is_media_selected = $selected_screen_type === 'post_type' && $selected_screen_id === 'attachment';
					?>
					<a href="<?php echo esc_url( add_query_arg( [ 'screen_type' => 'post_type', 'screen_id' => 'attachment' ] ) ); ?>" 
					   class="wpps-screen-item <?php echo $is_media_selected ? 'active' : ''; ?>">
						<span class="dashicons dashicons-format-gallery"></span>
						<?php esc_html_e( 'Media', 'wppowersuite-lite' ); ?> <span class="wpps-screen-key">(attachment)</span>
					</a>
				</div>

				<div class="wpps-screen-list" data-screen-type="user" style="<?php echo $selected_screen_type !== 'user' ? 'display: none;' : ''; ?>">
					<a href="<?php echo esc_url( add_query_arg( [ 'screen_type' => 'user', 'screen_id' => 'users' ] ) ); ?>" 
					   class="wpps-screen-item <?php echo $selected_screen_type === 'user' ? 'active' : ''; ?>">
						<span class="dashicons dashicons-admin-users"></span>
						<?php esc_html_e( 'Users', 'wppowersuite-lite' ); ?> <span class="wpps-screen-key">(users)</span>
					</a>
				</div>

				<div class="wpps-screen-list" data-screen-type="taxonomy" style="<?php echo $selected_screen_type !== 'taxonomy' ? 'display: none;' : ''; ?>">
					<?php foreach ( $taxonomies as $taxonomy ) : ?>
						<?php
						if ( ! ScreenSupport::isManageableTaxonomy( $taxonomy->name ) ) {
							continue;
						}
						$is_selected = $selected_screen_type === 'taxonomy' && $selected_screen_id === $taxonomy->name;
						?>
						<a href="<?php echo esc_url( add_query_arg( [ 'screen_type' => 'taxonomy', 'screen_id' => $taxonomy->name ] ) ); ?>" 
						   class="wpps-screen-item <?php echo $is_selected ? 'active' : ''; ?>">
							<span class="dashicons dashicons-tag"></span>
							<?php echo esc_html( $taxonomy->labels->name ); ?> <span class="wpps-screen-key">(<?php echo esc_html( $taxonomy->name ); ?>)</span>
						</a>
					<?php endforeach; ?>
				</div>
			</div>
			
		</div>

		<div class="wpps-columns-main">
			<?php if ( $selected_screen_type && $selected_screen_id ) : ?>
				<div class="wpps-columns-editor" data-screen-type="<?php echo esc_attr( $selected_screen_type ); ?>" data-screen-id="<?php echo esc_attr( $selected_screen_id ); ?>">
					<div class="wpps-columns-header">
						<h2>
							<?php
							if ( $selected_screen_type === 'post_type' ) {
								if ( $selected_screen_id === 'comments' ) {
									esc_html_e( 'Comments', 'wppowersuite-lite' );
								} elseif ( $selected_screen_id === 'attachment' ) {
									esc_html_e( 'Media', 'wppowersuite-lite' );
								} else {
									$post_type_obj = get_post_type_object( $selected_screen_id );
									echo esc_html( $post_type_obj ? $post_type_obj->labels->name : $selected_screen_id );
								}
							} elseif ( $selected_screen_type === 'user' ) {
								esc_html_e( 'Users', 'wppowersuite-lite' );
							} else {
								$taxonomy_obj = get_taxonomy( $selected_screen_id );
								echo esc_html( $taxonomy_obj ? $taxonomy_obj->labels->name : $selected_screen_id );
							}
							?>
							<span class="wpps-screen-key" style="font-weight:400;opacity:0.85;">(<?php echo esc_html( $selected_screen_type === 'post_type' ? $selected_screen_id : ( $selected_screen_type === 'user' ? 'users' : $selected_screen_id ) ); ?>)</span>
						</h2>
						<div class="wpps-columns-actions">
							<?php
							$view_url = '';
							if ( $selected_screen_type === 'post_type' ) {
								if ( $selected_screen_id === 'comments' ) {
									$view_url = admin_url( 'edit-comments.php' );
								} elseif ( $selected_screen_id === 'attachment' ) {
									$view_url = admin_url( 'upload.php' );
								} elseif ( $selected_screen_id === 'post' ) {
									$view_url = admin_url( 'edit.php' );
								} else {
									$view_url = admin_url( 'edit.php?post_type=' . $selected_screen_id );
								}
							} elseif ( $selected_screen_type === 'user' ) {
								$view_url = admin_url( 'users.php' );
							} elseif ( $selected_screen_type === 'taxonomy' ) {
								$view_url = admin_url( 'edit-tags.php?taxonomy=' . $selected_screen_id );
							}
							if ( $view_url ) :
								?>
								<a href="<?php echo esc_url( $view_url ); ?>" class="button" target="_blank" rel="noopener"><?php esc_html_e( 'View', 'wppowersuite-lite' ); ?></a>
							<?php endif; ?>
							<button type="button" class="button wpps-add-column">
								<?php esc_html_e( 'Add Column', 'wppowersuite-lite' ); ?>
							</button>
							<button type="button" class="button wpps-restore-columns">
								<?php esc_html_e( 'Restore Columns', 'wppowersuite-lite' ); ?>
							</button>
							<button type="button" class="button button-primary wpps-save-columns">
								<?php esc_html_e( 'Save Changes', 'wppowersuite-lite' ); ?>
							</button>
						</div>
					</div>

					<?php if ( $show_quick_add ) : ?>
					<div class="wpps-quick-add-inline">
						<h3 class="wpps-quick-add-inline-title"><?php esc_html_e( 'Quick Add', 'wppowersuite-lite' ); ?></h3>
						<div class="wpps-quick-add-inline-buttons">
							<button type="button" class="wpps-quick-add-btn button" data-type="id" data-key="id" data-label="<?php esc_attr_e( 'ID', 'wppowersuite-lite' ); ?>">
								<span class="wpps-quick-add-icon wpps-quick-add-icon-hash">#</span> <?php esc_html_e( 'ID', 'wppowersuite-lite' ); ?>
							</button>
							<button type="button" class="wpps-quick-add-btn button" data-type="date_modified" data-key="date_modified" data-label="<?php esc_attr_e( 'Last Modified', 'wppowersuite-lite' ); ?>">
								<span class="dashicons dashicons-clock"></span> <?php esc_html_e( 'Last Modified', 'wppowersuite-lite' ); ?>
							</button>
							<button type="button" class="wpps-quick-add-btn button" data-type="featured_image" data-key="featured_image" data-label="<?php esc_attr_e( 'Featured Image', 'wppowersuite-lite' ); ?>">
								<span class="dashicons dashicons-format-image"></span> <?php esc_html_e( 'Featured Image', 'wppowersuite-lite' ); ?>
							</button>
							<button type="button" class="wpps-quick-add-btn button" data-type="word_count" data-key="word_count" data-label="<?php esc_attr_e( 'Word Count', 'wppowersuite-lite' ); ?>">
								<span class="dashicons dashicons-editor-alignleft"></span> <?php esc_html_e( 'Word Count', 'wppowersuite-lite' ); ?>
							</button>
							<button type="button" class="wpps-quick-add-btn button" data-type="slug" data-key="slug" data-label="<?php esc_attr_e( 'Slug', 'wppowersuite-lite' ); ?>">
								<span class="dashicons dashicons-admin-links"></span> <?php esc_html_e( 'Slug', 'wppowersuite-lite' ); ?>
							</button>
							<?php foreach ( $quick_add_taxonomies as $tax ) : ?>
							<button type="button" class="wpps-quick-add-btn wpps-quick-add-taxonomy button" data-type="taxonomy" data-key="<?php echo esc_attr( $tax['column_key'] ); ?>" data-label="<?php echo esc_attr( $tax['label'] ); ?>" data-taxonomy="<?php echo esc_attr( $tax['slug'] ); ?>">
								<span class="dashicons dashicons-tag"></span> <?php echo esc_html( $tax['label'] ); ?>
							</button>
							<?php endforeach; ?>
						</div>
					</div>
					<?php endif; ?>

					<?php
					$show_layout_settings = ScreenSupport::supportsLayoutSettings( $selected_screen_type, $selected_screen_id );
					$show_default_sort    = ScreenSupport::supportsSortableConfig( $selected_screen_type, $selected_screen_id );
					?>
					<?php if ( $show_layout_settings ) : ?>
					<div class="wpps-layout-settings">
						<div class="wpps-acc-accordion" id="wpps-layout-accordion" data-accordion-id="list-table-layout">
							<button type="button" class="wpps-acc-accordion-header" aria-expanded="false" aria-controls="wpps-layout-accordion-body">
								<span class="wpps-acc-accordion-title"><?php esc_html_e( 'List Table Layout', 'wppowersuite-lite' ); ?></span>
								<span class="dashicons dashicons-arrow-down-alt2 wpps-acc-accordion-chevron" aria-hidden="true"></span>
							</button>
							<div id="wpps-layout-accordion-body" class="wpps-acc-accordion-body">
								<table class="form-table" role="presentation">
									<tbody>
										<tr>
											<th scope="row"><?php esc_html_e( 'Horizontal Scroll', 'wppowersuite-lite' ); ?></th>
											<td>
												<label>
													<input type="checkbox" id="wpps-disable-horizontal-scroll" value="1">
													<?php esc_html_e( 'Disable horizontal scroll (expand table to full width)', 'wppowersuite-lite' ); ?>
												</label>
											</td>
										</tr>
										<tr class="wpps-freeze-columns-row">
											<th scope="row"><label for="wpps-freeze-first-columns"><?php esc_html_e( 'Freeze First Columns', 'wppowersuite-lite' ); ?></label></th>
											<td>
												<select id="wpps-freeze-first-columns">
													<option value="0"><?php esc_html_e( 'None', 'wppowersuite-lite' ); ?></option>
													<?php for ( $i = 1; $i <= 5; $i++ ) : ?>
														<?php /* translators: 1: number, 2: number, 3: number. */ ?>
														<option value="<?php echo esc_attr( (string) $i ); ?>"><?php echo esc_html( sprintf( /* translators: %d: number of columns */ _n( '%d column', '%d columns', $i, 'wppowersuite-lite' ), $i ) ); ?></option>
													<?php endfor; ?>
												</select>
											</td>
										</tr>
										<tr>
											<th scope="row"><?php esc_html_e( 'Sticky Header', 'wppowersuite-lite' ); ?></th>
											<td>
												<label>
													<input type="checkbox" id="wpps-freeze-header-row" value="1">
													<?php esc_html_e( 'Keep table header visible while scrolling', 'wppowersuite-lite' ); ?>
												</label>
											</td>
										</tr>
										<?php if ( $show_default_sort ) : ?>
										<tr>
											<th scope="row"><label for="wpps-default-sort-column"><?php esc_html_e( 'Default Sort Column', 'wppowersuite-lite' ); ?></label></th>
											<td>
												<select id="wpps-default-sort-column">
													<option value=""><?php esc_html_e( 'WordPress default', 'wppowersuite-lite' ); ?></option>
												</select>
												<select id="wpps-default-sort-order" style="margin-left: 8px;">
													<option value="desc"><?php esc_html_e( 'Descending', 'wppowersuite-lite' ); ?></option>
													<option value="asc"><?php esc_html_e( 'Ascending', 'wppowersuite-lite' ); ?></option>
												</select>
												<p class="description"><?php esc_html_e( 'Applied when opening the list screen without an existing sort.', 'wppowersuite-lite' ); ?></p>
											</td>
										</tr>
										<?php endif; ?>
									</tbody>
								</table>
								<p class="description wpps-list-visit-note" style="display: none;">
									<?php esc_html_e( 'Visit the list screen once to detect plugin-added columns before customizing.', 'wppowersuite-lite' ); ?>
								</p>
							</div>
						</div>
					</div>
					<?php endif; ?>

					<div class="wpps-columns-list" id="wpps-columns-sortable">
						<p class="description">
							<?php esc_html_e( 'Drag and drop columns to reorder. Check/uncheck to show/hide columns.', 'wppowersuite-lite' ); ?>
						</p>
						<div class="wpps-columns-loading" style="display: none;">
							<?php esc_html_e( 'Loading columns...', 'wppowersuite-lite' ); ?>
						</div>
						<div class="wpps-columns-items"></div>
					</div>
					
				</div>
			<?php else : ?>
				<div class="wpps-columns-welcome">
					<h2><?php esc_html_e( 'Welcome to Admin Columns Customizer', 'wppowersuite-lite' ); ?></h2>
					<p><?php esc_html_e( 'Select a screen from the sidebar to start customizing columns.', 'wppowersuite-lite' ); ?></p>
				</div>
			<?php endif; ?>
		</div>
	</div>
</div>

<!-- Add Column Modal -->
<div id="wpps-add-column-modal" class="wpps-modal" style="display: none;">
	<div class="wpps-modal-content">
		<div class="wpps-modal-header">
			<h2 class="wpps-modal-title"><?php esc_html_e( 'Add Column', 'wppowersuite-lite' ); ?></h2>
			<button type="button" class="wpps-modal-close">&times;</button>
		</div>
		<div class="wpps-modal-body">
			<form id="wpps-add-column-form">
				<input type="hidden" id="wpps-edit-column-key" name="edit_column_key" value="">
				<input type="hidden" id="wpps-column-key" name="column_key" value="">
				<table class="form-table">
					<tbody>
						<tr>
							<th scope="row">
								<label for="wpps-column-type"><?php esc_html_e( 'Type', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<select id="wpps-column-type" name="column_type" class="regular-text" required>
									<option value=""><?php esc_html_e( 'Select Column Type', 'wppowersuite-lite' ); ?></option>
								</select>
							</td>
						</tr>
						<tr>
							<th scope="row">
								<label for="wpps-column-label"><?php esc_html_e( 'Label', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<input type="text" id="wpps-column-label" name="column_label" class="regular-text" required>
							</td>
						</tr>
						<tr id="wpps-meta-key-row" style="display: none;">
							<th scope="row">
								<label for="wpps-meta-key"><?php esc_html_e( 'Custom Field Key', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<input type="text" id="wpps-meta-key" name="meta_key" class="regular-text" placeholder="<?php esc_attr_e( 'Enter meta key', 'wppowersuite-lite' ); ?>">
								<button type="button" class="button wpps-browse-fields"><?php esc_html_e( 'Browse Fields', 'wppowersuite-lite' ); ?></button>
								<p class="description"><?php esc_html_e( 'Enter the custom field meta key or browse available fields.', 'wppowersuite-lite' ); ?></p>
							</td>
						</tr>
						<tr id="wpps-taxonomy-row" style="display: none;">
							<th scope="row">
								<label for="wpps-taxonomy"><?php esc_html_e( 'Taxonomy', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<select id="wpps-taxonomy" name="taxonomy" class="regular-text">
									<option value=""><?php esc_html_e( 'Select Taxonomy', 'wppowersuite-lite' ); ?></option>
								</select>
							</td>
						</tr>
						<tr id="wpps-field-type-row" style="display: none;">
							<th scope="row">
								<label for="wpps-field-type"><?php esc_html_e( 'Field Type', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<select id="wpps-field-type" name="field_type" class="regular-text">
									<option value="text"><?php esc_html_e( 'Text', 'wppowersuite-lite' ); ?></option>
									<option value="number"><?php esc_html_e( 'Number', 'wppowersuite-lite' ); ?></option>
									<option value="date"><?php esc_html_e( 'Date', 'wppowersuite-lite' ); ?></option>
									<option value="color"><?php esc_html_e( 'Color', 'wppowersuite-lite' ); ?></option>
									<option value="image"><?php esc_html_e( 'Image', 'wppowersuite-lite' ); ?></option>
									<option value="url"><?php esc_html_e( 'URL', 'wppowersuite-lite' ); ?></option>
									<option value="true_false"><?php esc_html_e( 'True/False', 'wppowersuite-lite' ); ?></option>
									<option value="array"><?php esc_html_e( 'Array', 'wppowersuite-lite' ); ?></option>
								</select>
								<p class="description"><?php esc_html_e( 'Select how the custom field value should be formatted.', 'wppowersuite-lite' ); ?></p>
							</td>
						</tr>
						<tr>
							<th scope="row">
								<label for="wpps-column-width-value"><?php esc_html_e( 'Width', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<div style="display: flex; align-items: center; gap: 15px;">
									<input type="text" id="wpps-column-width-value" name="width_value" class="small-text" value="" placeholder="<?php esc_attr_e( 'Enter value', 'wppowersuite-lite' ); ?>" style="width: 100px;">
									<fieldset style="border: none; padding: 0; margin: 0; display: flex; gap: 15px;">
										<label style="display: flex; align-items: center; gap: 5px; cursor: pointer;">
											<input type="radio" name="wpps-width-unit" id="wpps-width-unit-px" value="px">
											<span>px</span>
										</label>
										<label style="display: flex; align-items: center; gap: 5px; cursor: pointer;">
											<input type="radio" name="wpps-width-unit" id="wpps-width-unit-percent" value="%">
											<span>%</span>
										</label>
										<label style="display: flex; align-items: center; gap: 5px; cursor: pointer;">
											<input type="radio" name="wpps-width-unit" id="wpps-width-unit-auto" value="auto" checked>
											<span>Auto</span>
										</label>
									</fieldset>
								</div>
								<input type="hidden" id="wpps-column-width" name="width" value="">
								<p class="description"><?php esc_html_e( 'Enter a numeric value and select the unit. Select "Auto" for WordPress default width.', 'wppowersuite-lite' ); ?></p>
							</td>
						</tr>
						<tr id="wpps-column-sortable-row">
							<th scope="row">
								<label for="wpps-column-sortable"><?php esc_html_e( 'Sorting', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<label class="wpps-toggle-switch">
									<input type="checkbox" id="wpps-column-sortable" name="sortable" value="1">
									<span class="wpps-toggle-slider"></span>
								</label>
							</td>
						</tr>
						<tr>
							<th scope="row">
								<label for="wpps-column-force-width"><?php esc_html_e( 'Force Width', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<label class="wpps-toggle-switch">
									<input type="checkbox" id="wpps-column-force-width" name="force_width" value="1">
									<span class="wpps-toggle-slider"></span>
								</label>
								<p class="description"><?php esc_html_e( 'Override table layout to strictly enforce column width.', 'wppowersuite-lite' ); ?></p>
							</td>
						</tr>
						<tr>
							<th scope="row">
								<label for="wpps-column-css-class"><?php esc_html_e( 'CSS Class', 'wppowersuite-lite' ); ?></label>
							</th>
							<td>
								<input type="text" id="wpps-column-css-class" name="css_class" class="regular-text" placeholder="<?php esc_attr_e( 'e.g. my-column-class', 'wppowersuite-lite' ); ?>">
								<p class="description"><?php esc_html_e( 'Optional CSS class to add to this column\'s cells.', 'wppowersuite-lite' ); ?></p>
							</td>
						</tr>
					</tbody>
				</table>
			</form>
		</div>
		<div class="wpps-modal-footer">
			<button type="button" class="button wpps-modal-cancel"><?php esc_html_e( 'Cancel', 'wppowersuite-lite' ); ?></button>
			<button type="button" class="button button-primary wpps-modal-save"><?php esc_html_e( 'Add Column', 'wppowersuite-lite' ); ?></button>
		</div>
	</div>
</div>

