{% extends "indy_hub/base.html" %}
{% load i18n %}
{% load static %}
{% load humanize %}

{% block page_title %}{{ bp_name }} - {% trans "Crafting Requirements" %}{% endblock page_title %}

{% block extra_css %}
<link rel="stylesheet" href="{% static 'indy_hub/css/page_headers.css' %}">
<link rel="stylesheet" href="{% static 'indy_hub/css/blueprints.css' %}">
<link rel="stylesheet" href="{% static 'indy_hub/css/craft_bp.css' %}?v=20260524-buy-equation-summary">
{% endblock extra_css %}

{% block content %}
<div class="container-fluid py-4">
    {% if is_project_workspace and project %}
        {% url 'indy_hub:rename_production_project' project.project_ref as rename_url %}
        {% include "indy_hub/partials/page_header.html" with icon_class="fas fa-tools" title=bp_name subtitle=_("Production workspace") back_url=back_url back_label=_("Back") header_controls=craft_header_controls title_action_template="indy_hub/partials/project_name_edit.html" %}
    {% else %}
        {% include "indy_hub/partials/page_header.html" with icon_class="fas fa-tools" title=bp_name subtitle=_("Production workspace") back_url=back_url back_label=_("Back") header_controls=craft_header_controls %}
    {% endif %}

    <div id="craftPendingRefreshNotice" class="small text-danger fw-semibold mb-3 d-none" role="status" aria-live="polite">
        <i class="fas fa-circle-exclamation me-1"></i>
        Changes pending. Switch tabs to refresh calculations.
    </div>

    {% if sde_snapshot_has_changed %}
    <div class="alert alert-warning d-flex flex-column flex-lg-row align-items-lg-center justify-content-between gap-3 mb-4" role="alert">
        <div>
            <div class="fw-semibold">{% trans "Saved snapshot uses older SDE data" %}</div>
            <div class="small mb-0">{% trans "One of this project's blueprints, materials, products, or activity times changed since the last save. Refresh the plan from current SDE data, then save it again to update the snapshot." %}</div>
        </div>
        <a class="btn btn-warning btn-sm flex-shrink-0" href="{{ sde_refresh_url }}">
            <i class="fas fa-arrows-rotate me-1"></i>{% trans "Refresh from current SDE" %}
        </a>
    </div>
    {% endif %}

    <div id="bpTabs-loading" class="craft-bp-loading-inline" aria-live="polite" aria-busy="true">
        <svg class="craft-bp-loading-spinner" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor">
            <g>
                <circle cx="12" cy="12" r="10" fill="none" stroke-width="1" stroke-linecap="round">
                    <animate attributeName="stroke-dasharray" dur="1.5s" calcMode="spline" values="0 150;42 150;42 150;42 150" keyTimes="0;0.475;0.95;1" keySplines="0.42,0,0.58,1;0.42,0,0.58,1;0.42,0,0.58,1" repeatCount="indefinite" />
                    <animate attributeName="stroke-dashoffset" dur="1.5s" calcMode="spline" values="0;-16;-59;-59" keyTimes="0;0.475;0.95;1" keySplines="0.42,0,0.58,1;0.42,0,0.58,1;0.42,0,0.58,1" repeatCount="indefinite" />
                </circle>
                <animateTransform attributeName="transform" type="rotate" dur="2s" values="0 12 12;360 12 12" repeatCount="indefinite" />
            </g>
        </svg>
        <div class="craft-bp-loading-inline__content">
            <div id="craft-bp-loading-title" class="craft-bp-loading-inline__title">{% trans "Preparing production workspace" %}</div>
            <div id="craft-bp-loading-message" class="craft-bp-loading-inline__text">{% trans "Loading workspace..." %}</div>
            <div class="craft-bp-loading-progress" aria-hidden="true">
                <div id="craft-bp-loading-progress-bar" class="craft-bp-loading-progress__bar" style="width: 0%;"></div>
            </div>
            <div id="craft-bp-loading-progress-label" class="craft-bp-loading-progress__label d-none"></div>
            <ol id="craft-bp-loading-steps" class="craft-bp-loading-steps d-none"></ol>
        </div>
    </div>

    {% if deferred_shell %}
    <div id="craft-bp-workspace" class="craft-bp-workspace is-loading" aria-hidden="true"></div>
    {% else %}
    <div id="craft-bp-workspace" class="craft-bp-workspace is-loading" aria-hidden="true">
        <div class="dev-alert alert alert-warning d-flex align-items-center gap-3 mb-4" role="alert">
            <i class="fas fa-exclamation-triangle fa-lg"></i>
            <div>
                <h3 class="h6 fw-semibold mb-1 text-uppercase">{% trans "Active development" %}</h3>
                <p class="mb-0 small">{% trans "This crafting workspace is under active development. Please don't rely on the displayed data for production decisions yet." %}</p>
            </div>
        </div>

        <div class="d-flex justify-content-end mb-3">
            <span id="simulationStatus" class="badge bg-secondary d-none"></span>
        </div>

    {% with current_tab=active_tab|default:'materials' %}

    {% if bp_type_id and final_outputs|length <= 1 %}
    <div class="card border-0 shadow-sm mb-4">
        <div class="card-body py-3">
            <div class="d-flex flex-column flex-lg-row align-items-lg-end justify-content-between gap-3">
                <div>
                    <h2 class="h6 mb-1">{% if is_project_workspace %}{% trans "Production target" %}{% else %}{% trans "Runs target" %}{% endif %}</h2>
                    <p class="text-muted small mb-0">{% trans "Adjust the final run count for this workspace, then apply to refresh the plan." %}</p>
                </div>
                <div class="d-flex flex-wrap align-items-end gap-2">
                    <div>
                        <label for="runsInput" class="form-label form-label-sm text-uppercase small fw-semibold mb-1">{% if is_project_workspace %}{% trans "Final runs" %}{% else %}{% trans "Runs" %}{% endif %}</label>
                        <input
                            type="number"
                            min="1"
                            step="1"
                            class="form-control"
                            id="runsInput"
                            value="{{ num_runs|default:1 }}"
                            inputmode="numeric"
                        >
                    </div>
                    <input type="hidden" id="activeTabInput" value="{{ current_tab }}">
                    <button type="button" class="btn btn-primary" id="recalcNowBtn">
                        <i class="fas fa-arrows-rotate me-1"></i>{% trans "Apply" %}
                    </button>
                </div>
            </div>
        </div>
    </div>
    {% endif %}

    <!-- HIDDEN TAB SYSTEM FOR JS COMPATIBILITY -->
    <div id="bpTabs" class="d-none nav nav-pills" role="tablist">
        <button class="nav-link blueprint-tab {% if current_tab == 'materials' %}active{% endif %}" id="materials-tab" data-bs-toggle="tab" data-bs-target="#tab-materials" type="button" role="tab" aria-controls="tab-materials" aria-selected="{% if current_tab == 'materials' %}true{% else %}false{% endif %}"></button>
        <button class="nav-link blueprint-tab {% if current_tab == 'tree' %}active{% endif %}" id="tree-tab" data-bs-toggle="tab" data-bs-target="#tab-tree" type="button" role="tab" aria-controls="tab-tree" aria-selected="{% if current_tab == 'tree' %}true{% else %}false{% endif %}"></button>
        <button class="nav-link blueprint-tab {% if current_tab == 'cycles' %}active{% endif %}" id="cycles-tab" data-bs-toggle="tab" data-bs-target="#tab-cycles" type="button" role="tab" aria-controls="tab-cycles" aria-selected="{% if current_tab == 'cycles' %}true{% else %}false{% endif %}"></button>
        <button class="nav-link blueprint-tab {% if current_tab == 'financial' %}active{% endif %}" id="financial-tab" data-bs-toggle="tab" data-bs-target="#tab-financial" type="button" role="tab" aria-controls="tab-financial" aria-selected="{% if current_tab == 'financial' %}true{% else %}false{% endif %}"></button>
        <button class="nav-link blueprint-tab {% if current_tab == 'needed' %}active{% endif %}" id="needed-tab" data-bs-toggle="tab" data-bs-target="#tab-needed" type="button" role="tab" aria-controls="tab-needed" aria-selected="{% if current_tab == 'needed' %}true{% else %}false{% endif %}"></button>
        <button class="nav-link blueprint-tab {% if current_tab == 'config' %}active{% endif %}" id="config-tab" data-bs-toggle="tab" data-bs-target="#tab-config" type="button" role="tab" aria-controls="tab-config" aria-selected="{% if current_tab == 'config' %}true{% else %}false{% endif %}"></button>
    </div>
    <div class="tab-content d-none" id="bpTabsContent"></div>

    <div class="craft-tabs-modern">
        <ul class="nav nav-tabs craft-nav-tabs" id="craftMainTabs" role="tablist">
            <li class="nav-item" role="presentation">
                <button class="nav-link active" id="plan-tab-btn" data-bs-toggle="tab" data-bs-target="#plan-pane" type="button" role="tab" aria-controls="plan-pane" data-tab-name="plan">
                    <i class="fas fa-map"></i>
                    <span>{% trans "Plan" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="buy-tab-btn" data-bs-toggle="tab" data-bs-target="#buy-pane" type="button" role="tab" aria-controls="buy-pane" data-tab-name="buy">
                    <i class="fas fa-shopping-bag"></i>
                    <span>{% trans "Buy" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="stock-tab-btn" data-bs-toggle="tab" data-bs-target="#stock-pane" type="button" role="tab" aria-controls="stock-pane" data-tab-name="stock">
                    <i class="fas fa-box-open"></i>
                    <span>{% trans "Stock" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="build-tab-btn" data-bs-toggle="tab" data-bs-target="#build-pane" type="button" role="tab" aria-controls="build-pane" data-tab-name="build">
                    <i class="fas fa-hammer"></i>
                    <span>{% trans "Build" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="timing-tab-btn" data-bs-toggle="tab" data-bs-target="#timing-pane" type="button" role="tab" aria-controls="timing-pane" data-tab-name="timing">
                    <i class="fas fa-clock"></i>
                    <span>{% trans "Timing" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="steps-tab-btn" data-bs-toggle="tab" data-bs-target="#steps-pane" type="button" role="tab" aria-controls="steps-pane" data-tab-name="steps">
                    <i class="fas fa-list-check"></i>
                    <span>{% trans "Steps" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="structure-tab-btn" data-bs-toggle="tab" data-bs-target="#structure-pane" type="button" role="tab" aria-controls="structure-pane" data-tab-name="structure">
                    <i class="fas fa-industry"></i>
                    <span>{% trans "Structure" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="configure-tab-btn" data-bs-toggle="tab" data-bs-target="#configure-pane" type="button" role="tab" aria-controls="configure-pane" data-tab-name="configure">
                    <i class="fas fa-sliders-h"></i>
                    <span>{% trans "Blueprints" %}</span>
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="run-optimized-tab-btn" data-bs-toggle="tab" data-bs-target="#run-optimized-pane" type="button" role="tab" aria-controls="run-optimized-pane" data-tab-name="run_optimized">
                    <i class="fas fa-scale-balanced"></i>
                    <span>{% trans "Decisions" %}</span>
                </button>
            </li>
        </ul>

        <div class="tab-content craft-tab-content" id="craftMainTabsContent">
            <!-- ========== PLAN TAB (V2) ========== -->
            <div class="tab-pane fade show active" id="plan-pane" role="tabpanel" aria-labelledby="plan-tab-btn">
                <div class="alert alert-info mb-3" id="planPaneLazyNotice" data-plan-hydrated="false">
                    <i class="fas fa-hourglass-half me-2"></i>{% trans "Preparing production tree and materials view…" %}
                </div>
                <template id="plan-pane-template">
                <div class="craft-quick-stats mb-4">
                    <div class="craft-stat-card">
                        <div class="craft-stat-icon bg-primary"><i class="fas fa-scroll"></i></div>
                        <div class="craft-stat-content">
                            <div class="craft-stat-label">{% trans "Blueprints" %}</div>
                            <div class="craft-stat-value" id="totalBlueprintsCount">-</div>
                        </div>
                    </div>
                    <div class="craft-stat-card">
                        <div class="craft-stat-icon bg-info"><i class="fas fa-cubes"></i></div>
                        <div class="craft-stat-content">
                            <div class="craft-stat-label">{% trans "Unique Materials" %}</div>
                            <div class="craft-stat-value" id="totalMaterialsCount">-</div>
                        </div>
                    </div>
                    <div class="craft-stat-card">
                        <div class="craft-stat-icon bg-success"><i class="fas fa-dollar-sign"></i></div>
                        <div class="craft-stat-content">
                            <div class="craft-stat-label">{% trans "Est. Profit" %}</div>
                            <div class="craft-stat-value text-success" id="quickProfit">-</div>
                        </div>
                    </div>
                    <div class="craft-stat-card">
                        <div class="craft-stat-icon bg-warning"><i class="fas fa-percentage"></i></div>
                        <div class="craft-stat-content">
                            <div class="craft-stat-label">{% trans "Margin" %}</div>
                            <div class="craft-stat-value" id="quickMargin">-</div>
                            <div class="small text-warning fw-semibold craft-zero-price-alert d-none" id="quickMarginZeroPriceAlert"></div>
                        </div>
                    </div>
                </div>

                <div class="craft-kpi-row mb-3">
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">{% if is_project_workspace %}{% trans "Targets" %}{% else %}{% trans "Runs" %}{% endif %}</span>
                        <span class="craft-kpi-value">{% if is_project_workspace %}{{ final_outputs|length|default:0|intcomma }}{% else %}{{ num_runs|default:1|intcomma }}{% endif %}</span>
                    </div>
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">{% if is_project_workspace %}{% trans "Requested units" %}{% else %}{% trans "Output" %}{% endif %}</span>
                        <span class="craft-kpi-value text-success">{{ final_product_qty|default:num_runs|intcomma }}</span>
                    </div>
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">ME</span>
                        <span class="craft-kpi-value" id="craftPlanMEValue">{{ me|default:0 }}</span>
                    </div>
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">TE</span>
                        <span class="craft-kpi-value" id="craftPlanTEValue">{{ te|default:0 }}</span>
                    </div>
                </div>

                <div class="craft-dashboard-columns">
                    <div class="craft-dashboard-col">
                        <section class="craft-section">
                            <div class="craft-section-header-with-actions">
                                <h3 class="craft-section-title">
                                    <i class="fas fa-sitemap text-success"></i> {% trans "Production Tree" %}
                                </h3>
                                <div class="craft-section-controls">
                                    <button class="btn btn-outline-secondary btn-sm" type="button" id="expand-tree" title="{% trans 'Expand all' %}">
                                        <i class="fas fa-plus-square"></i>
                                    </button>
                                    <button class="btn btn-outline-secondary btn-sm" type="button" id="collapse-tree" title="{% trans 'Collapse all' %}">
                                        <i class="fas fa-minus-square"></i>
                                    </button>
                                </div>
                            </div>

                            <div class="craft-tree-container" id="tab-tree"></div>
                        </section>
                    </div>

                    <div class="craft-dashboard-col">
                        <section class="craft-section">
                            <div class="craft-section-header-with-actions">
                                <h3 class="craft-section-title">
                                    <i class="fas fa-cubes text-primary"></i> {% trans "Materials" %}
                                </h3>
                                <div class="craft-section-controls">
                                    <button class="btn btn-outline-secondary btn-sm" type="button" id="expand-materials" title="{% trans 'Expand all' %}">
                                        <i class="fas fa-chevron-down"></i>
                                    </button>
                                    <button class="btn btn-outline-secondary btn-sm" type="button" id="collapse-materials" title="{% trans 'Collapse all' %}">
                                        <i class="fas fa-chevron-up"></i>
                                    </button>
                                </div>
                            </div>
                            <div id="materialsGroupsContainer" class="craft-materials-list"></div>
                            <div id="materialsEmptyState" class="alert alert-info">
                                <i class="fas fa-info-circle me-2"></i>{% trans "No material requirements have been detected for this blueprint." %}
                            </div>
                        </section>
                    </div>
                </div>
                </template>
            </div>

            <!-- ========== BUY TAB (V2) ========== -->
            <div class="tab-pane fade" id="buy-pane" role="tabpanel" aria-labelledby="buy-tab-btn">
                <div class="alert alert-warning d-none align-items-center mb-4" id="missingPricesAlert" hidden>
                    <i class="fas fa-exclamation-triangle fa-lg me-3"></i>
                    <div class="flex-grow-1">
                        <strong>{% trans "Missing Prices" %}</strong>
                        <p class="mb-0 small">
                            <span id="missingPricesCount">0</span>
                            <span id="missingPricesMessage">{% trans "items are missing price data. Load Fuzzwork prices or enter them manually." %}</span>
                        </p>
                    </div>
                    <button class="btn btn-sm btn-warning" id="loadFuzzworkFromAlert">
                        <i class="fas fa-cloud-download-alt me-1"></i>{% trans "Load Prices" %}
                    </button>
                </div>

                <div class="craft-financial-hero mb-4">
                    <div class="craft-buy-summary">
                        <div class="craft-buy-equation">
                            <div class="craft-buy-equation-item">
                                <span class="craft-financial-label">{% trans "Cash needed" %}</span>
                                <strong class="craft-buy-equation-value text-danger" id="financialSummaryInvestmentNeeded">0 ISK</strong>
                            </div>
                            <span class="craft-buy-equation-symbol"></span>
                            <div class="craft-buy-equation-item">
                                <span class="craft-financial-label">{% trans "Revenue" %}</span>
                                <strong class="craft-buy-equation-value text-success" id="financialSummaryRevenue">0 ISK</strong>
                            </div>
                            <span class="craft-buy-equation-symbol"></span>
                            <div class="craft-buy-equation-item">
                                <span class="craft-financial-label">{% trans "Profit" %}</span>
                                <strong class="craft-buy-equation-value" id="financialSummaryProfit">0 ISK</strong>
                                <div id="financialSurplusWrapper" class="craft-buy-surplus d-none">
                                    <span>{% trans "Surplus" %}</span>
                                    <strong id="financialSummarySurplus">0 ISK</strong>
                                </div>
                            </div>
                            <div class="craft-buy-equation-item craft-buy-equation-item--margin">
                                <span class="craft-financial-label">{% trans "Margin" %}</span>
                                <strong class="craft-financial-margin-badge" id="financialSummaryMargin">0%</strong>
                            </div>
                        </div>
                        <div class="craft-buy-cost-details">
                            <div class="craft-buy-cost-details-header">
                                <span>{% trans "Cost details" %}</span>
                                <button
                                    type="button"
                                    class="btn btn-link btn-sm craft-financial-details-action"
                                    id="structureSummaryDetailsBtn"
                                    data-bs-toggle="modal"
                                    data-bs-target="#structureInstallationDetailsModal"
                                >
                                    <i class="fas fa-list-ul me-1"></i>{% trans "Installation details" %}
                                </button>
                            </div>
                            <div class="craft-buy-cost-grid">
                                <div class="craft-buy-cost-row craft-buy-cost-row--total">
                                    <span>{% trans "Total cost" %}</span>
                                    <strong id="financialSummaryCost">0 ISK</strong>
                                </div>
                                <div class="craft-buy-cost-row">
                                    <span>{% trans "Materials" %}</span>
                                    <strong id="financialSummaryMaterialCost">0 ISK</strong>
                                </div>
                                <div class="craft-buy-cost-row">
                                    <span>{% trans "From stock" %}</span>
                                    <strong id="financialSummaryStockValue">0 ISK</strong>
                                </div>
                                <div class="craft-buy-cost-row">
                                    <span>{% trans "Installation total" %}</span>
                                    <strong id="financialSummaryInstallationCost">0 ISK</strong>
                                </div>
                                <div class="craft-buy-cost-row">
                                    <span>{% trans "Incl. facility tax" %}</span>
                                    <strong id="financialSummaryFacilityTaxInline">0 ISK</strong>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div id="structureSummaryEmpty" class="alert alert-info mb-0 mt-3 d-none">
                        <i class="fas fa-info-circle me-2"></i>{% trans "Assign a structure to produced items to include installation costs." %}
                    </div>
                </div>

                <section class="craft-section mb-4">
                    <div class="craft-financial-table-header">
                        <h4 class="text-sm fw-semibold mb-0">
                            <i class="fas fa-list-ul me-2"></i>{% trans "Purchase Planner" %}
                        </h4>
                        <div class="craft-financial-actions">
                            <button id="exportPurchaseCSV" type="button" class="btn btn-outline-success btn-sm" title="{% trans 'Export to CSV' %}">
                                <i class="fas fa-file-csv me-1"></i>{% trans "Export" %}
                            </button>
                            <button id="resetManualPricesBtn" type="button" class="btn btn-outline-secondary btn-sm" title="{% trans 'Reset overrides' %}">
                                <i class="fas fa-undo-alt"></i>
                            </button>
                            <button id="loadFuzzworkBtn" type="button" class="btn btn-outline-info btn-sm" title="{% trans 'Load Fuzzwork prices' %}">
                                <i class="fas fa-cloud-download-alt me-1"></i>{% trans "Fuzzwork" %}
                            </button>
                        </div>
                    </div>

                    <div class="craft-financial-toolbar">
                        <div class="craft-financial-planner-stats">
                            <span class="craft-financial-stat"><span id="financialPlannerLineCount">0</span> {% trans "lines" %}</span>
                            <span class="craft-financial-stat"><span id="financialPlannerGroupCount">0</span> {% trans "groups" %}</span>
                            <span class="craft-financial-stat"><span id="financialPlannerManualCount">0</span> {% trans "manual" %}</span>
                            <span class="craft-financial-stat"><span id="financialPlannerMissingCount">0</span> {% trans "missing" %}</span>
                        </div>
                        <div class="craft-financial-filters">
                            <div class="input-group input-group-sm">
                                <span class="input-group-text"><i class="fas fa-search"></i></span>
                                <input type="search" id="financialSearchInput" class="form-control" placeholder="{% trans 'Search item or group' %}" autocomplete="off">
                                <button type="button" class="btn btn-outline-secondary" id="financialSearchClear" title="{% trans 'Clear search' %}">
                                    <i class="fas fa-times"></i>
                                </button>
                            </div>
                            <select id="financialPlannerScopeFilter" class="form-select form-select-sm">
                                <option value="all">{% trans "All lines" %}</option>
                                <option value="buy">{% trans "Buy inputs" %}</option>
                                <option value="revenue">{% trans "Revenue targets" %}</option>
                                <option value="manual">{% trans "Manual only" %}</option>
                                <option value="missing">{% trans "Missing prices" %}</option>
                            </select>
                        </div>
                    </div>

                    <div class="small text-muted mt-2">
                        {% trans "Grouped by the dashboard material order. Filter the planner to focus manual overrides, missing prices, buy inputs, or revenue targets." %}
                    </div>

                    <div class="table-responsive craft-financial-table craft-table-text-120 mt-2">
                        <table class="table table-sm align-middle mb-0">
                            <thead class="table-light">
                                <tr>
                                    <th class="col-item">{% trans "Item" %}</th>
                                    <th class="text-end col-qty">{% trans "Qty" %}</th>
                                    <th class="text-end col-fuzzwork">{% trans "Reference" %}</th>
                                    <th class="text-end col-real">{% trans "Override" %}</th>
                                    <th class="text-end col-total">{% trans "Line Total" %}</th>
                                    <th class="text-end col-margin">{% trans "Source" %}</th>
                                </tr>
                            </thead>
                            <tbody id="financialItemsBody">
                                <tr class="craft-financial-section-row" id="financialPurchaseSectionRow" data-export-skip="true">
                                    <td colspan="6">
                                        <span class="badge bg-primary-subtle text-primary-emphasis me-2">{% trans "Inputs" %}</span>
                                        {% trans "Items you still need to source for the plan." %}
                                    </td>
                                </tr>
                                {% for mat in materials %}
                                <tr data-type-id="{{ mat.type_id }}" data-market-group="{{ mat.market_group|default:'' }}" data-row-kind="buy">
                                    <td class="fw-semibold" data-manual-label="{% trans 'Manual' %}" data-fuzzwork-label="{% trans 'Fuzzwork' %}" data-missing-label="{% trans 'Missing' %}" data-buy-label="{% trans 'Buy input' %}" data-revenue-label="{% trans 'Revenue target' %}">
                                        <div class="d-flex align-items-start gap-2 craft-financial-item-shell">
                                            <img src="https://images.evetech.net/types/{{ mat.type_id }}/icon?size=32" alt="{{ mat.type_name }}" loading="lazy" decoding="async" fetchpriority="low" class="rounded eve-type-icon eve-type-icon--28" onerror="this.style.display='none';">
                                            <span class="craft-planner-item-name-wrap">
                                                <span class="d-flex flex-wrap align-items-center gap-2">
                                                    <span class="fw-bold text-xs craft-planner-item-name">{{ mat.type_name }}</span>
                                                    <span class="badge bg-secondary-subtle text-secondary-emphasis financial-row-kind">{% trans "Buy input" %}</span>
                                                </span>
                                                <span class="d-flex flex-wrap align-items-center gap-2 small text-muted mt-1">
                                                    <span class="financial-market-group"{% if not mat.market_group %} style="display:none"{% endif %}>{{ mat.market_group|default:'' }}</span>
                                                </span>
                                            </span>
                                            <button type="button" class="btn btn-link btn-sm text-body-tertiary financial-row-reset" data-type-id="{{ mat.type_id }}" title="{% trans 'Reset this override' %}">
                                                <i class="fas fa-rotate-left"></i>
                                            </button>
                                        </div>
                                    </td>
                                    <td class="text-end text-xs" data-qty="{{ mat.quantity }}">
                                        <span class="badge bg-primary text-white">{{ mat.quantity|intcomma }}</span>
                                    </td>
                                    <td class="text-end">
                                        <input type="number" min="0" step="0.01" class="form-control form-control-sm fuzzwork-price text-end bg-light text-xs" data-type-id="{{ mat.type_id }}" value="0" readonly>
                                    </td>
                                    <td class="text-end">
                                        <input type="number" min="0" step="0.01" class="form-control form-control-sm real-price text-end text-xs" data-type-id="{{ mat.type_id }}" value="0">
                                    </td>
                                    <td class="text-end text-xs total-cost fw-semibold">0</td>
                                    <td class="text-end text-xs item-margin"><span class="badge bg-secondary-subtle text-secondary-emphasis financial-source-badge">{% trans "Missing" %}</span></td>
                                </tr>
                                {% endfor %}
                                <tr class="craft-financial-section-row" id="financialRevenueSectionRow" data-export-skip="true">
                                    <td colspan="6">
                                        <span class="badge bg-success-subtle text-success-emphasis me-2">{% trans "Outputs" %}</span>
                                        {% trans "Final products and revenue targets for this workspace." %}
                                    </td>
                                </tr>
                                {% if final_outputs %}
                                {% for output in final_outputs %}
                                <tr{% if forloop.first %} id="finalProductRow"{% endif %} class="table-success fw-semibold" data-type-id="{{ output.type_id|default:0 }}" data-final-output="true" data-row-kind="revenue">
                                    <td data-manual-label="{% trans 'Manual' %}" data-fuzzwork-label="{% trans 'Fuzzwork' %}" data-missing-label="{% trans 'Missing' %}" data-buy-label="{% trans 'Buy input' %}" data-revenue-label="{% trans 'Revenue target' %}">
                                        <div class="d-flex align-items-start gap-2 craft-financial-item-shell">
                                            <img src="https://images.evetech.net/types/{{ output.type_id|default:0 }}/icon?size=32" alt="{{ output.type_name|default:_('Final product') }}" loading="lazy" decoding="async" fetchpriority="low" class="rounded eve-type-icon eve-type-icon--28" onerror="this.style.display='none';">
                                            <span class="craft-planner-item-name-wrap">
                                                <span class="d-flex flex-wrap align-items-center gap-2">
                                                    <span class="text-xs fw-bold craft-planner-item-name">{{ output.type_name|default:_('Final product') }}</span>
                                                    <span class="badge bg-success-subtle text-success-emphasis financial-row-kind">{% trans "Revenue target" %}</span>
                                                </span>
                                                <span class="d-flex flex-wrap align-items-center gap-2 small text-muted mt-1">
                                                    <span class="financial-market-group" style="display:none"></span>
                                                </span>
                                            </span>
                                            <button type="button" class="btn btn-link btn-sm text-body-tertiary financial-row-reset" data-type-id="{{ output.type_id|default:0 }}" title="{% trans 'Reset this override' %}">
                                                <i class="fas fa-rotate-left"></i>
                                            </button>
                                        </div>
                                    </td>
                                    <td class="text-end text-xs" data-qty="{{ output.quantity|default:0 }}">
                                        <span class="badge bg-success text-white">{{ output.quantity|default:0|intcomma }}</span>
                                    </td>
                                    <td class="text-end">
                                        <input type="number" min="0" step="0.01" class="form-control form-control-sm fuzzwork-price text-end bg-light text-xs" data-type-id="{{ output.type_id|default:0 }}" value="0" readonly>
                                    </td>
                                    <td class="text-end">
                                        <input type="number" min="0" step="0.01" class="form-control form-control-sm sale-price-unit text-end text-xs" data-type-id="{{ output.type_id|default:0 }}" value="0">
                                    </td>
                                    <td class="text-end text-xs total-revenue fw-semibold">0</td>
                                    <td class="text-end text-xs item-margin"><span class="badge bg-secondary-subtle text-secondary-emphasis financial-source-badge">{% trans "Missing" %}</span></td>
                                </tr>
                                {% endfor %}
                                {% else %}
                                <tr id="finalProductRow" class="table-success fw-semibold" data-type-id="{{ product_type_id|default:0 }}" data-final-output="true" data-row-kind="revenue">
                                    <td data-manual-label="{% trans 'Manual' %}" data-fuzzwork-label="{% trans 'Fuzzwork' %}" data-missing-label="{% trans 'Missing' %}" data-buy-label="{% trans 'Buy input' %}" data-revenue-label="{% trans 'Revenue target' %}">
                                        <div class="d-flex align-items-start gap-2 craft-financial-item-shell">
                                            <img src="https://images.evetech.net/types/{{ product_type_id }}/icon?size=32" alt="{% trans 'Final product' %}" loading="lazy" decoding="async" fetchpriority="low" class="rounded eve-type-icon eve-type-icon--28" onerror="this.style.display='none';">
                                            <span class="craft-planner-item-name-wrap">
                                                <span class="d-flex flex-wrap align-items-center gap-2">
                                                    <span class="text-xs fw-bold craft-planner-item-name">{% trans "Final product" %}</span>
                                                    <span class="badge bg-success-subtle text-success-emphasis financial-row-kind">{% trans "Revenue target" %}</span>
                                                </span>
                                                <span class="d-flex flex-wrap align-items-center gap-2 small text-muted mt-1">
                                                    <span class="financial-market-group" style="display:none"></span>
                                                </span>
                                            </span>
                                            <button type="button" class="btn btn-link btn-sm text-body-tertiary financial-row-reset" data-type-id="{{ product_type_id|default:0 }}" title="{% trans 'Reset this override' %}">
                                                <i class="fas fa-rotate-left"></i>
                                            </button>
                                        </div>
                                    </td>
                                    <td class="text-end text-xs" data-qty="{{ final_product_qty|default:num_runs }}">
                                        <span class="badge bg-success text-white">{{ final_product_qty|default:num_runs|intcomma }}</span>
                                    </td>
                                    <td class="text-end">
                                        <input type="number" min="0" step="0.01" class="form-control form-control-sm fuzzwork-price text-end bg-light text-xs" data-type-id="{{ product_type_id|default:0 }}" value="0" readonly>
                                    </td>
                                    <td class="text-end">
                                        <input type="number" min="0" step="0.01" class="form-control form-control-sm sale-price-unit text-end text-xs" data-type-id="{{ product_type_id|default:0 }}" value="0">
                                    </td>
                                    <td class="text-end text-xs total-revenue fw-semibold">0</td>
                                    <td class="text-end text-xs item-margin"><span class="badge bg-secondary-subtle text-secondary-emphasis financial-source-badge">{% trans "Missing" %}</span></td>
                                </tr>
                                {% endif %}
                            </tbody>
                            <tfoot class="table-light">
                                <tr>
                                    <th colspan="4" class="text-end text-xs">{% trans "Total Material Cost" %}</th>
                                    <th class="text-end text-xs grand-total-material-cost fw-semibold text-danger" colspan="2">0</th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end text-xs">{% trans "Cash Needed For Materials" %}</th>
                                    <th class="text-end text-xs grand-total-material-investment fw-semibold" colspan="2">0</th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end text-xs text-muted">{% trans "Allocated From Stock" %}</th>
                                    <th class="text-end text-xs grand-total-stock-value text-muted" colspan="2">0</th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end text-xs">{% trans "Installation Cost" %}</th>
                                    <th class="text-end text-xs grand-total-installation fw-semibold" colspan="2">0</th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end text-xs text-muted">{% trans "Facility Tax (included in installation)" %}</th>
                                    <th class="text-end text-xs grand-total-facility-tax text-muted" colspan="2">0</th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end text-xs">{% trans "Cash Investment Needed" %}</th>
                                    <th class="text-end text-xs grand-total-investment-needed fw-semibold" colspan="2">0</th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end text-xs">{% trans "Total Cost" %}</th>
                                    <th class="text-end text-xs grand-total-cost fw-semibold text-danger" colspan="2">0</th>
                                </tr>
                                <tr class="craft-revenue-mode-row" data-export-skip="true">
                                    <td colspan="6" class="py-2">
                                        <div class="d-flex flex-wrap align-items-center gap-2 justify-content-end">
                                            <label for="financialRevenueMode" class="text-xs fw-semibold mb-0 me-1">
                                                {% trans "Revenue mode" %}
                                            </label>
                                            <select id="financialRevenueMode" class="form-select form-select-sm w-auto" data-revenue-mode>
                                                <option value="per_unit">{% trans "Per-unit sale prices (× qty)" %}</option>
                                                <option value="total">{% trans "Total sale price (whole project)" %}</option>
                                            </select>
                                            <div class="input-group input-group-sm w-auto" id="financialRevenueTotalGroup" hidden>
                                                <span class="input-group-text">{% trans "Total" %}</span>
                                                <input id="financialRevenueTotalOverride" type="number" min="0" step="0.01" class="form-control form-control-sm text-end" value="0" data-revenue-total-override>
                                                <span class="input-group-text">ISK</span>
                                            </div>
                                            <span class="small text-muted" id="financialRevenueModeHint">
                                                {% trans "Per-unit prices are summed across every final output." %}
                                            </span>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end text-xs">{% trans "Total Revenue" %}</th>
                                    <th class="text-end text-xs grand-total-rev fw-semibold text-success" colspan="2">0</th>
                                </tr>
                                <tr class="table-primary">
                                    <th colspan="4" class="text-end text-xs">{% trans "Net Profit" %}</th>
                                    <th class="text-end text-xs profit fw-bold" colspan="2">0 <span class="profit-pct">(0%)</span></th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>

                    <div id="financialPlannerEmptyState" class="alert alert-info mt-3 d-none mb-0">
                        <i class="fas fa-filter me-2"></i>{% trans "No planner lines match the current filter." %}
                    </div>
                </section>

                <section class="craft-section">
                    <div class="craft-section-header-with-actions">
                        <h3 class="craft-section-title">
                            <i class="fas fa-shopping-cart text-warning"></i> {% trans "Shopping List" %}
                        </h3>
                        <div>
                            <button id="exportShoppingCSV" class="btn btn-outline-success btn-sm me-2">
                                <i class="fas fa-file-csv me-1"></i>{% trans "Export" %}
                            </button>
                            <button id="compute-needed" class="btn btn-outline-warning btn-sm">
                                <i class="fas fa-calculator me-1"></i>{% trans "Compute" %}
                            </button>
                        </div>
                    </div>

                    <div class="table-responsive craft-needed-table mt-2">
                        <table class="table table-sm align-middle mb-0" id="needed-table">
                            <thead class="table-light">
                                <tr>
                                    <th>{% trans "Item" %}</th>
                                    <th class="text-end">{% trans "Qty" %}</th>
                                    <th class="text-end">{% trans "Unit Price" %}</th>
                                    <th class="text-end">{% trans "Total" %}</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                            <tfoot class="table-light">
                                <tr>
                                    <th colspan="3" class="text-end text-xs">{% trans "Total Shopping Cost" %}</th>
                                    <th class="text-end text-xs purchase-total fw-semibold">0</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </section>
            </div>

            <div class="tab-pane fade" id="stock-pane" role="tabpanel" aria-labelledby="stock-tab-btn">
                <div id="stockScopeMissingNotice" class="alert alert-warning d-none mb-4">
                    <i class="fas fa-key me-2"></i>{% trans "Character asset scope is missing or stale. Stock data may be incomplete until the next asset refresh." %}
                </div>

                <section class="craft-section mb-4">
                    <div class="craft-section-header-with-actions">
                        <h3 class="craft-section-title">
                            <i class="fas fa-box-open text-primary"></i> {% trans "Stock Management" %}
                        </h3>
                        <div class="craft-section-controls">
                            <button type="button" class="btn btn-outline-secondary btn-sm" id="stockResetAllocationsBtn">
                                <i class="fas fa-rotate-left me-1"></i>{% trans "Reset allocations" %}
                            </button>
                        </div>
                    </div>

                    <div class="small text-muted mb-3">
                        {% trans "Allocate cached character assets to reduce what still needs to be bought. Stock lowers cash investment, but the full material value remains part of production cost and profit." %}
                    </div>

                    <div class="craft-stock-kpis mb-3">
                        <article class="craft-stock-kpi-card">
                            <span class="craft-stock-kpi-label">{% trans "Lines" %}</span>
                            <strong class="craft-stock-kpi-value" id="stockSummaryLineCount">0</strong>
                        </article>
                        <article class="craft-stock-kpi-card">
                            <span class="craft-stock-kpi-label">{% trans "Required" %}</span>
                            <strong class="craft-stock-kpi-value" id="stockSummaryRequiredQty">0</strong>
                        </article>
                        <article class="craft-stock-kpi-card">
                            <span class="craft-stock-kpi-label">{% trans "Allocated" %}</span>
                            <strong class="craft-stock-kpi-value" id="stockSummaryAllocatedQty">0</strong>
                        </article>
                        <article class="craft-stock-kpi-card">
                            <span class="craft-stock-kpi-label">{% trans "Still to buy" %}</span>
                            <strong class="craft-stock-kpi-value" id="stockSummaryRemainingQty">0</strong>
                        </article>
                        <article class="craft-stock-kpi-card">
                            <span class="craft-stock-kpi-label">{% trans "Stock value used" %}</span>
                            <strong class="craft-stock-kpi-value" id="stockSummaryValue">0 ISK</strong>
                        </article>
                    </div>

                    <div class="small text-muted mb-3">
                        {% trans "Last cached asset sync" %}: <span id="stockSummaryUpdated">{% trans "No asset sync yet" %}</span>
                    </div>

                    <div class="alert alert-info py-2 small mb-3 d-none" id="stockRefreshStatusNotice" role="status" aria-live="polite" aria-atomic="true"></div>

                    <div class="alert alert-info py-2 small mb-3" id="stockAvailableOnlyNotice">
                        {% trans "Only required items with cached stock available are shown." %}
                    </div>

                    <div class="table-responsive craft-stock-table-wrap">
                        <table class="table table-sm align-middle mb-0 craft-stock-table">
                            <thead class="table-light">
                                <tr>
                                    <th>{% trans "Item" %}</th>
                                    <th class="text-end">{% trans "Required" %}</th>
                                    <th class="text-end">{% trans "In stock" %}</th>
                                    <th class="text-end">{% trans "Use" %}</th>
                                    <th class="text-end">{% trans "Still to buy" %}</th>
                                    <th class="text-end">{% trans "Value used" %}</th>
                                    <th>{% trans "By character" %}</th>
                                </tr>
                            </thead>
                            <tbody id="stockManagementRows">
                                <tr>
                                    <td colspan="7" class="text-center text-muted py-4">{% trans "Open this tab to allocate stock against the current sourcing plan." %}</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </section>
            </div>

            <!-- ========== RUN OPTIMIZED TAB (V2) ========== -->
            <div class="tab-pane fade" id="run-optimized-pane" role="tabpanel" aria-labelledby="run-optimized-tab-btn">
                <section class="craft-section craft-decision-center mb-4" id="decisionStrategySection">
                    <div class="craft-section-header-with-actions">
                        <h3 class="craft-section-title">
                            <i class="fas fa-scale-balanced text-primary"></i> {% trans "Buy / Produce Strategy" %}
                        </h3>
                        <div class="craft-section-controls craft-decision-controls flex-wrap">
                            <div class="input-group input-group-sm craft-decision-tolerance">
                                <span class="input-group-text">{% trans "Buy tolerance" %}</span>
                                <input type="number" class="form-control" id="decisionBuyToleranceInput" min="0" step="1000" value="0">
                                <span class="input-group-text">ISK</span>
                            </div>
                            <button class="btn btn-outline-secondary btn-sm" type="button" id="decisionStrategyRefreshBtn">
                                <i class="fas fa-rotate me-1"></i>{% trans "Refresh" %}
                            </button>
                            <button class="btn btn-outline-success btn-sm" type="button" id="set-tree-prod" title="{% trans 'All prod' %}">
                                <i class="fas fa-industry me-1"></i>{% trans "All produce" %}
                            </button>
                            <button class="btn btn-outline-danger btn-sm" type="button" id="set-tree-buy" title="{% trans 'All buy' %}">
                                <i class="fas fa-shopping-cart me-1"></i>{% trans "All buy" %}
                            </button>
                            <button class="btn btn-primary btn-sm" type="button" id="optimize-profit" title="{% trans 'Apply the recommended buy vs produce strategy' %}">
                                <i class="fas fa-magic me-1"></i>{% trans "Apply recommendations" %}
                            </button>
                        </div>
                    </div>

                    <div class="craft-decision-intro mb-3">
                        <p class="mb-1 fw-semibold">{% trans "Centralize all Buy / Produce choices here." %}</p>
                        <p class="mb-0 text-muted small">{% trans "If Buy is only slightly more expensive than Produce, you can still prefer Buy globally with the tolerance above." %}</p>
                    </div>

                    <div class="craft-decision-metrics mb-3">
                        <article class="craft-decision-metric">
                            <span class="craft-decision-metric-label">{% trans "Reviewed items" %}</span>
                            <strong class="craft-decision-metric-value" id="decisionStrategyItemCount">0</strong>
                        </article>
                        <article class="craft-decision-metric">
                            <span class="craft-decision-metric-label">{% trans "Current buy" %}</span>
                            <strong class="craft-decision-metric-value" id="decisionStrategyCurrentBuyCount">0</strong>
                        </article>
                        <article class="craft-decision-metric">
                            <span class="craft-decision-metric-label">{% trans "Recommended buy" %}</span>
                            <strong class="craft-decision-metric-value" id="decisionStrategyRecommendedBuyCount">0</strong>
                        </article>
                        <article class="craft-decision-metric">
                            <span class="craft-decision-metric-label">{% trans "Potential savings" %}</span>
                            <strong class="craft-decision-metric-value" id="decisionStrategyPotentialSavings">0 ISK</strong>
                        </article>
                    </div>

                    <div class="small text-muted mb-3" id="decisionStrategySummary">{% trans "Open this tab to review buy / produce recommendations." %}</div>

                    <div class="table-responsive craft-decision-table-wrap">
                        <table class="table table-sm align-middle craft-decision-table mb-0">
                            <thead class="table-light">
                                <tr>
                                    <th>{% trans "Item" %}</th>
                                    <th class="text-end">{% trans "Qty" %}</th>
                                    <th class="text-end">{% trans "Buy" %}</th>
                                    <th class="text-end">{% trans "Produce" %}</th>
                                    <th class="text-end">{% trans "Delta" %}</th>
                                    <th class="text-end">{% trans "Ratio" %}</th>
                                    <th>{% trans "Recommended" %}</th>
                                    <th>{% trans "Selected" %}</th>
                                </tr>
                            </thead>
                            <tbody id="decisionStrategyRows">
                                <tr>
                                    <td colspan="8" class="text-center text-muted py-4">{% trans "Decision analysis will appear here." %}</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </section>
            </div>

            <!-- ========== BUILD TAB (V2) ========== -->
            <div class="tab-pane fade" id="build-pane" role="tabpanel" aria-labelledby="build-tab-btn">
                <div class="alert alert-info mb-0">{% trans "Open this tab to review production cycles and surplus by item." %}</div>
            </div>

            <div class="tab-pane fade" id="timing-pane" role="tabpanel" aria-labelledby="timing-tab-btn">
                <div class="alert alert-info mb-0">{% trans "Open this tab to review per-item production durations." %}</div>
            </div>

            <div class="tab-pane fade" id="steps-pane" role="tabpanel" aria-labelledby="steps-tab-btn">
                <div class="alert alert-info mb-0">{% trans "Open this tab to review the recommended production sequence." %}</div>
            </div>

            <div class="tab-pane fade" id="structure-pane" role="tabpanel" aria-labelledby="structure-tab-btn">
                <section class="craft-section mb-4">
                    <div class="craft-section-header-with-actions">
                        <h3 class="craft-section-title">
                            <i class="fas fa-industry text-primary"></i> {% trans "Structure Planner" %}
                        </h3>
                        <div class="d-flex flex-wrap align-items-center gap-2">
                            <div class="input-group input-group-sm" style="min-width: 320px;">
                                <span class="input-group-text">
                                    <i class="fas fa-location-crosshairs"></i>
                                </span>
                                <input
                                    type="text"
                                    id="structureMotherSystemInput"
                                    class="form-control"
                                    list="structureMotherSystemSuggestions"
                                    placeholder="{% trans 'Main production system' %}"
                                    autocomplete="off"
                                >
                                <datalist id="structureMotherSystemSuggestions"></datalist>
                            </div>
                            <button type="button" id="structureMotherSystemValidate" class="btn btn-sm btn-primary">
                                <i class="fas fa-route me-1"></i>{% trans "Validate" %}
                            </button>
                        </div>
                    </div>
                    <div id="structureMotherSystemStatus" class="small text-muted mt-2"></div>
                    <div id="structurePlannerSummary" class="craft-structure-summary-grid"></div>
                </section>

                <section class="craft-section">
                    <div class="craft-section-header-with-actions">
                        <h3 class="craft-section-title">
                            <i class="fas fa-route text-info"></i> {% trans "Assignments" %}
                        </h3>
                    </div>
                    <div id="structurePlannerEmpty" class="alert alert-info d-none mb-0">
                        <i class="fas fa-info-circle me-2"></i>{% trans "No compatible structures are currently available for this craft plan." %}
                    </div>
                    <div class="table-responsive">
                        <table class="table table-sm align-middle mb-0 craft-structure-table">
                            <thead class="table-light">
                                <tr>
                                    <th>{% trans "Item" %}</th>
                                    <th>{% trans "Recommended" %}</th>
                                    <th>{% trans "Selected Structure" %}</th>
                                    <th class="text-end">ME</th>
                                    <th class="text-end">TE</th>
                                    <th class="text-end">{% trans "Job" %}</th>
                                    <th>{% trans "Distance" %}</th>
                                </tr>
                            </thead>
                            <tbody id="structurePlannerRows"></tbody>
                        </table>
                    </div>
                </section>
            </div>

            <!-- ========== BLUEPRINTS TAB (V2) ========== -->
            <div class="tab-pane fade" id="configure-pane" role="tabpanel" aria-labelledby="configure-tab-btn" data-config-hydrated="false">
                <div id="configurePaneLazyNotice" class="alert alert-info mb-0">
                    <i class="fas fa-sliders-h me-2"></i>{% trans "Open this tab to load blueprint configuration and copy-request controls." %}
                </div>
                <template id="configure-pane-template">
                <section class="craft-section mb-4">
                    <h3 class="craft-section-title"><i class="fas fa-magic text-primary"></i> {% trans "Quick Presets" %}</h3>
                    <div class="btn-group btn-group-sm w-100" role="group">
                        <button class="btn btn-outline-success" type="button" id="presetMaxEfficiency" title="{% trans 'ME: 10, TE: 20' %}">
                            <i class="fas fa-star me-1"></i>{% trans "Max" %}
                        </button>
                        <button class="btn btn-outline-info" type="button" id="presetOwnedEfficiency" title="{% trans 'Apply parameters from owned blueprints' %}">
                            <i class="fas fa-cube me-1"></i>{% trans "From Owned BP" %}
                        </button>
                        <button class="btn btn-outline-secondary" type="button" id="presetResetEfficiency" title="{% trans 'ME: 0, TE: 0' %}">
                            <i class="fas fa-undo me-1"></i>{% trans "Reset" %}
                        </button>
                    </div>
                </section>

                <section class="craft-section">
                    <div class="craft-section-header-with-actions mb-3">
                        <h3 class="craft-section-title mb-0">
                            <i class="fas fa-sliders-h text-danger"></i> {% trans "Blueprint Configuration" %}
                        </h3>
                        <div class="d-flex gap-2 align-items-center">
                            <div class="input-group input-group-sm" style="max-width: 250px;">
                                <span class="input-group-text bg-white"><i class="fas fa-search text-muted"></i></span>
                                <input type="text" class="form-control" id="blueprintSearchInput" placeholder="{% trans 'Search blueprints...' %}">
                                <button class="btn btn-outline-secondary" type="button" id="clearSearch" title="{% trans 'Clear search' %}">
                                    <i class="fas fa-times"></i>
                                </button>
                            </div>
                            <div class="btn-group btn-group-sm" role="group" style="display: none;">
                                <button type="button" class="btn btn-outline-secondary" id="expandAllConfig" title="{% trans 'Expand all groups' %}">
                                    <i class="fas fa-plus-square"></i>
                                </button>
                                <button type="button" class="btn btn-outline-secondary" id="collapseAllConfig" title="{% trans 'Collapse all groups' %}">
                                    <i class="fas fa-minus-square"></i>
                                </button>
                            </div>
                        </div>
                    </div>

                    {% if blueprint_configs_grouped %}
                    <div class="accordion" id="blueprintConfigAccordion">
                        {% for group in blueprint_configs_grouped %}
                        <div class="accordion-item">
                            <h4 class="accordion-header" id="heading-group-{{ forloop.counter }}">
                                <div class="px-3 py-2 fw-bold" style="cursor: default; background-color: transparent;">
                                    <i class="fas fa-scroll me-2 text-primary"></i>{{ group.group_name }}
                                </div>
                            </h4>
                            <div id="collapse-group-{{ forloop.counter }}" class="accordion-collapse show" aria-labelledby="heading-group-{{ forloop.counter }}">
                                <div class="accordion-body p-2">
                                    {% for level in group.levels %}
                                    <div class="craft-config-level">
                                        <div class="craft-config-items-grid">
                                            {% for bc in level.blueprints %}
                                            <div class="craft-bp-card card h-100" data-blueprint-type-id="{{ bc.type_id }}" {% if not bc.user_owns %}data-blueprint-not-owned="true"{% endif %} {% if bc.is_reaction %}data-blueprint-is-reaction="true"{% endif %}>
                                                <div class="card-header text-center py-1 {% if bc.user_owns %}bg-success bg-opacity-10{% elif bc.shared_copies_available and not bc.is_reaction %}bg-warning bg-opacity-10{% else %}bg-danger bg-opacity-10{% endif %}">
                                                    <img
                                                        src="https://images.evetech.net/types/{{ bc.type_id }}/bp?size=128"
                                                        alt="{{ bc.type_name }}"
                                                        class="craft-bp-icon mx-auto d-block mb-1"
                                                        onerror="this.style.display='none';"
                                                    >
                                                    {% if bc.user_owns %}
                                                        {% if bc.is_copy %}
                                                        <span class="badge bg-info w-100 mb-1" style="font-size: 0.7rem;">
                                                            <i class="fas fa-copy me-1"></i>COPY OWNED{% if not bc.is_reaction %} - {{ bc.runs_available|default:"0" }} runs{% endif %}
                                                        </span>
                                                        {% else %}
                                                        <span class="badge bg-success w-100 mb-1" style="font-size: 0.7rem;">
                                                            <i class="fas fa-star me-1"></i>ORIGINAL OWNED
                                                        </span>
                                                        {% endif %}
                                                    {% elif bc.shared_copies_available and not bc.is_reaction %}
                                                    <span class="badge bg-warning w-100 mb-1" style="font-size: 0.75rem;">
                                                        <i class="fas fa-share-alt me-1"></i>{% trans "Available" %}
                                                    </span>
                                                    {% else %}
                                                    <span class="badge bg-danger w-100 mb-1" style="font-size: 0.75rem;">
                                                        <i class="fas fa-times-circle me-1"></i>{% trans "Not available" %}
                                                    </span>
                                                    {% endif %}
                                                </div>
                                                <div class="card-body p-2">
                                                    <h6 class="card-title text-center fw-bold mb-2" style="min-height: 2rem; font-size: 0.95rem;">{{ bc.type_name }}</h6>

                                                    <div class="runs-validation-alert" data-bp-type-id="{{ bc.type_id }}"></div>

                                                    {% if not bc.is_reaction %}
                                                    <div class="craft-efficiency-controls mb-2">
                                                        <div class="d-flex gap-1" style="align-items: flex-start;">
                                                            <div style="flex: 1; min-width: 0;">
                                                                <label class="form-label small fw-bold text-uppercase text-muted" style="font-size: 0.65rem; margin-bottom: 0.25rem;">
                                                                    <i class="fas fa-cubes me-1"></i>ME
                                                                </label>
                                                                <input
                                                                    type="number"
                                                                    name="me_{{ bc.type_id }}"
                                                                    value="{{ bc.material_efficiency }}"
                                                                    min="0"
                                                                    max="10"
                                                                    class="form-control form-control-sm text-center fw-bold bp-me-input"
                                                                    style="font-size: 0.9rem; padding: 0.3rem;"
                                                                >
                                                            </div>
                                                            <div style="flex: 1; min-width: 0;">
                                                                <label class="form-label small fw-bold text-uppercase text-muted" style="font-size: 0.65rem; margin-bottom: 0.25rem;">
                                                                    <i class="fas fa-clock me-1"></i>TE
                                                                </label>
                                                                <input
                                                                    type="number"
                                                                    name="te_{{ bc.type_id }}"
                                                                    value="{{ bc.time_efficiency }}"
                                                                    min="0"
                                                                    max="20"
                                                                    class="form-control form-control-sm text-center fw-bold bp-te-input"
                                                                    style="font-size: 0.9rem; padding: 0.3rem;"
                                                                >
                                                            </div>
                                                        </div>
                                                    </div>
                                                    {% endif %}

                                                    {% if bc.is_reaction %}
                                                    <div class="alert alert-secondary py-1 px-2 mb-0" style="font-size: 0.75rem;">
                                                        <small class="text-muted"><i class="fas fa-flask me-1"></i>{% trans "Reaction blueprints have fixed ME/TE and cannot be copied." %}</small>
                                                    </div>
                                                    {% elif not bc.user_owns or bc.is_copy %}
                                                    <div class="blueprint-sharing-section{% if bc.user_owns and bc.is_copy %} d-none{% endif %}" data-bp-type-id="{{ bc.type_id }}" data-bp-owned-copy="{% if bc.user_owns and bc.is_copy %}1{% else %}0{% endif %}">
                                                        {% if bc.shared_copies_available %}
                                                        <div class="alert alert-info py-1 px-2 mb-0" style="font-size: 0.8rem;">
                                                            <div class="d-flex align-items-center justify-content-between gap-1 mb-1">
                                                                <small class="fw-bold" style="flex-shrink: 0;"><i class="fas fa-share-alt me-1"></i>Copies</small>
                                                                <span class="badge bg-primary" style="font-size: 0.65rem;">{{ bc.shared_copies_available|length }}</span>
                                                            </div>
                                                            <select class="form-select form-select-sm mb-1" id="bpCopySelect{{ bc.type_id }}" style="font-size: 0.8rem; padding: 0.25rem;" {% if bc.shared_copies_available|length == 1 %}disabled{% endif %}>
                                                                {% for copy in bc.shared_copies_available %}
                                                                <option value="{{ copy.me }},{{ copy.te }}">ME{{ copy.me }}/TE{{ copy.te }}</option>
                                                                {% endfor %}
                                                            </select>

                                                            <div class="d-flex gap-1 mb-1">
                                                                <input
                                                                    type="number"
                                                                    id="bpRunsRequested{{ bc.type_id }}"
                                                                    class="form-control form-control-sm"
                                                                    min="1"
                                                                    value="300"
                                                                    title="{% trans 'Runs requested' %}"
                                                                    placeholder="{% trans 'Runs' %}"
                                                                    style="font-size: 0.8rem; padding: 0.25rem;"
                                                                >
                                                                <input
                                                                    type="number"
                                                                    id="bpCopiesRequested{{ bc.type_id }}"
                                                                    class="form-control form-control-sm"
                                                                    min="1"
                                                                    value="1"
                                                                    title="{% trans 'Copies requested' %}"
                                                                    placeholder="{% trans 'Copies' %}"
                                                                    style="font-size: 0.8rem; padding: 0.25rem;"
                                                                >
                                                            </div>

                                                            <button type="button" class="btn btn-sm btn-primary w-100" data-request-blueprint-copy="{{ bc.type_id }}" style="font-size: 0.8rem; padding: 0.25rem;">
                                                                <i class="fas fa-paper-plane me-1"></i>{% trans "Request" %}
                                                            </button>
                                                        </div>
                                                        {% else %}
                                                        <div class="alert alert-danger py-1 px-2 mb-0" style="font-size: 0.8rem;">
                                                            <small class="text-muted"><i class="fas fa-times-circle me-1"></i>{% trans "No copies" %}</small>
                                                        </div>
                                                        {% endif %}
                                                    </div>
                                                    {% endif %}
                                                </div>
                                            </div>
                                            {% endfor %}
                                        </div>
                                    </div>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                        {% endfor %}
                    </div>
                    {% else %}
                    <div class="alert alert-info"><i class="fas fa-info-circle me-2"></i>{% trans "No child blueprints require configuration tweaks for this item." %}</div>
                    {% endif %}
                </section>
                </template>
            </div>
        </div>
    </div>

    {% endwith %}
</div>

<!-- MODALS -->
<div class="modal fade" id="saveSimulationModal" tabindex="-1" aria-labelledby="saveSimulationModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="saveSimulationModalLabel">{% if is_project_workspace %}{% trans "Save Table" %}{% else %}{% trans "Save Simulation" %}{% endif %}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% trans 'Close' %}"></button>
            </div>
            <div class="modal-body">
                <form id="saveSimulationForm">
                    <div class="mb-3">
                        <label for="simulationName" class="form-label">{% if is_project_workspace %}{% trans "Table Name" %}{% else %}{% trans "Simulation Name" %}{% endif %}</label>
                        <input type="text" class="form-control" id="simulationName" required placeholder="{% if is_project_workspace %}{% trans 'Enter a name for this table' %}{% else %}{% trans 'Enter a name for this simulation' %}{% endif %}">
                    </div>
                    <div class="mb-3">
                        <label for="simulationNotes" class="form-label">{% trans "Notes (optional)" %}</label>
                        <textarea class="form-control" id="simulationNotes" rows="3" placeholder="{% if is_project_workspace %}{% trans 'Add any notes about this table' %}{% else %}{% trans 'Add any notes about this simulation' %}{% endif %}"></textarea>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% trans "Cancel" %}</button>
                <button type="button" class="btn btn-primary" id="confirmSaveSimulation">{% if is_project_workspace %}{% trans "Save table" %}{% else %}{% trans "Save" %}{% endif %}</button>
            </div>
        </div>
    </div>
</div>

{% if not is_project_workspace %}
<div class="modal fade" id="loadSimulationModal" tabindex="-1" aria-labelledby="loadSimulationModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="loadSimulationModalLabel">{% trans "Load Simulation" %}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% trans 'Close' %}"></button>
            </div>
            <div class="modal-body">
                <div id="simulationsList">
                    <p class="text-muted">{% trans "Loading saved simulations..." %}</p>
                </div>
            </div>
        </div>
    </div>
</div>
{% endif %}

<div class="modal fade" id="structureInstallationDetailsModal" tabindex="-1" aria-labelledby="structureInstallationDetailsModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-xl modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="structureInstallationDetailsModalLabel">{% trans "Installation Cost Details" %}</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% trans 'Close' %}"></button>
            </div>
            <div class="modal-body">
                <div class="craft-kpi-row mb-3">
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">{% trans "Estimated Item Value" %}</span>
                        <span class="craft-kpi-value" id="structureSummaryEstimatedValue">0 ISK</span>
                    </div>
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">{% trans "Job Cost" %}</span>
                        <span class="craft-kpi-value" id="structureSummaryJobCost">0 ISK</span>
                    </div>
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">{% trans "Facility Tax" %}</span>
                        <span class="craft-kpi-value" id="structureSummaryFacilityTax">0 ISK</span>
                    </div>
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">{% trans "SCC Surcharge" %}</span>
                        <span class="craft-kpi-value" id="structureSummaryScc">0 ISK</span>
                    </div>
                    <div class="craft-kpi craft-kpi-sm">
                        <span class="craft-kpi-label">{% trans "Installation Total" %}</span>
                        <span class="craft-kpi-value" id="structureSummaryInstallationModal">0 ISK</span>
                    </div>
                </div>
                <div id="structureSummaryModalEmpty" class="alert alert-info mb-3 d-none">
                    <i class="fas fa-info-circle me-2"></i>{% trans "Assign a structure to produced items to include installation costs." %}
                </div>
                <div class="table-responsive">
                    <table class="table table-sm align-middle mb-0">
                        <thead class="table-light">
                            <tr>
                                <th>{% trans "Item" %}</th>
                                <th>{% trans "Structure" %}</th>
                                <th class="text-end">{% trans "Cycles" %}</th>
                                <th>{% trans "Breakdown" %}</th>
                                <th class="text-end">{% trans "Cost" %}</th>
                            </tr>
                        </thead>
                        <tbody id="structureCostRows"></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

{% endif %}
{% endblock content %}

{% block extra_javascript %}
{{ blueprint_payload|json_script:"blueprint-payload" }}
<script src="{% static 'indy_hub/js/craft_bp_page.js' %}?v=20260426-pending-refresh-fix"></script>
{% if not deferred_shell %}
<script src="{% static 'indy_hub/js/craft_bp_simulation_api.js' %}?v=20260524-build-final-targets"></script>
<script src="{% static 'indy_hub/js/craft_bp_active_tab.js' %}?v=20260505-deferred-tab-init"></script>
<script src="{% static 'indy_hub/js/craft_bp_financial_planner.js' %}?v=20260428-no-output-override"></script>
<script src="{% static 'indy_hub/js/craft_bp.js' %}?v=20260524-zero-revenue-margin"></script>
<script src="{% static 'indy_hub/js/craft_bp_inline.js' %}?v=20260524-tab-change-autosave"></script>
<script src="{% static 'indy_hub/js/craft_bp_project_rename.js' %}?v=20260523-project-rename-status"></script>
{% endif %}
{% endblock extra_javascript %}