<?php
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

/**
 * Variables in scope (injected via mbs_get_template_part from imp-exp-ui.php).
 * @var bool   $is_registered
 * @var bool   $is_pro
 * @var string $nonce
 * @var string $template_url
 */
?>

			<!-- Panel: CSV / XLSX Import -->
		<div id="mbs-panel-csv"
		     class="mbs-imp-exp-panel"
		     role="tabpanel"
		     hidden>
			<h3><?php esc_html_e( 'Import Books — CSV / XLSX', 'my-book-showroom' ); ?></h3>
			<p class="mbs-panel-lead"><?php esc_html_e( 'Upload a CSV or Excel file to bulk-import books. After upload, you\'ll map your file\'s columns to My Book Showroom fields.', 'my-book-showroom' ); ?></p>

			<div class="mbs-imp-exp-hint">
				<?php esc_html_e( 'Accepted columns include: ', 'my-book-showroom' ); ?>
				<code>title</code>, <code>author</code>, <code>isbn13</code>, <code>asin</code>,
				<code>publisher</code>, <code>pub_date</code>, <code>price</code>, <code>format</code>,
				<code>series</code>, <code>cover_image_url</code>, and more.
				<?php /* translators: link text for CSV template download */ ?>
				<a href="<?php echo esc_url( $template_url ); ?>" class="mbs-template-link"><?php esc_html_e( 'Download template CSV', 'my-book-showroom' ); ?></a>
			</div>

			<div id="mbs-csv-import-area">
				<input type="file"
				       id="mbs-csv-file"
				       accept=".csv,.xlsx"
				       data-nonce="<?php echo esc_attr( $nonce ); ?>" />
				<button type="button"
				        id="mbs-csv-upload-btn"
				        class="button button-primary">
					<?php esc_html_e( 'Upload File', 'my-book-showroom' ); ?>
				</button>
			</div>

			<!-- Progress bar (shown during file upload and import) -->
			<div id="mbs-csv-progress-bar" style="display:none;margin-top:1rem;margin-bottom:0.4rem;">
				<div style="background:#e9ecef;border-radius:4px;height:8px;overflow:hidden;">
					<div id="mbs-csv-bar" style="height:100%;background:#2271b1;width:0%;border-radius:4px;transition:width 0.45s ease;"></div>
				</div>
			</div>
			<div id="mbs-csv-msgarea" style="display:none;margin:0 0 0.5rem;font-size:0.875rem;color:#555;"></div>
			<p id="mbs-csv-status" style="display:none;margin:0.5rem 0;font-size:0.875rem;"></p>

			<!-- Column mapping UI and result panel are injected here by mbs-admin-csv-import.js -->
		</div><!-- #mbs-panel-csv -->
