{% extends "base.html" %}
{% block title %}Mander Confined Concrete - ConcreteDesignPy{% endblock %}
{% block head %}
<script src="https://cdn.jsdelivr.net/npm/plotly.js-dist-min/plotly.min.js"></script>
<style>
.report-section {
    background: #fff; border: 1px solid var(--gray-200);
    border-radius: var(--radius); padding: 1.25rem; margin-bottom: 1rem;
}
.report-section h4 {
    font-size: .95rem; color: var(--primary-dark); margin: 0 0 .75rem;
    padding-bottom: .35rem; border-bottom: 2px solid var(--primary-light);
}
.report-eq { padding: .6rem 1rem; border-radius: 4px; margin: .5rem 0; font-size: .9rem; }
.report-table {
    width: 100%; border-collapse: collapse; font-size: .8rem; margin: .5rem 0;
}
.report-table th {
    background: var(--primary-dark); color: #fff; padding: .35rem .5rem;
    text-align: center; font-weight: 600; font-size: .75rem;
}
.report-table td {
    padding: .3rem .5rem; text-align: center; border-bottom: 1px solid var(--gray-200);
    font-family: "SF Mono","Fira Code",monospace; font-size: .78rem;
}
.report-table tr:nth-child(even) { background: var(--gray-50); }
.report-result {
    background: #dcfce7; padding: .6rem 1rem; border-radius: 4px; margin: .5rem 0;
    font-size: .95rem; font-weight: 700;
}
.report-ref {
    font-size: .78rem; color: #3b82f6; font-style: italic; margin: 0;
}
.report-placeholder {
    border: 2px dashed var(--gray-300); border-radius: 6px; padding: 2rem;
    text-align: center; color: var(--gray-400); font-size: .85rem; margin: .75rem 0;
    background: var(--gray-50); min-height: 120px; display: flex;
    align-items: center; justify-content: center; flex-direction: column; gap: .5rem;
}
.report-placeholder svg { width: 32px; height: 32px; opacity: .4; }
</style>
{% endblock %}

{% block content %}
<div class="calc-page">
    <a href="/" class="back-link">&larr; All Calculators</a>
    <h1>Mander's Confined Concrete Model</h1>
    <p class="ref">Mander, Priestley, and Park (1988)</p>

    <form id="calc-form" class="calc-form">
        <div class="form-section">
            <h3>Material</h3>
            <div class="form-row">
                <div class="form-group"><label>f'c (MPa)</label><input type="number" name="fc" value="30" step="0.1" required></div>
                <div class="form-group"><label>fy transverse (MPa)</label><input type="number" name="fy_transverse" value="345" step="0.1" required></div>
            </div>
        </div>

        <div class="form-section">
            <h3>Section</h3>
            <div class="form-row">
                <div class="form-group"><label>Width, b (mm)</label><input type="number" name="b" value="500" required></div>
                <div class="form-group"><label>Depth, h (mm)</label><input type="number" name="h" value="500" required></div>
                <div class="form-group"><label>Cover (mm)</label><input type="number" name="cover" value="40" required></div>
            </div>
        </div>

        <div class="form-section">
            <h3>Reinforcement</h3>
            <div class="form-row">
                <div class="form-group"><label>Main bar dia (mm)</label><input type="number" name="db_main" value="16" required></div>
                <div class="form-group"><label>Tie dia (mm)</label><input type="number" name="db_tie" value="10" required></div>
                <div class="form-group"><label>Tie spacing (mm)</label><input type="number" name="s_tie" value="200" required></div>
            </div>
            <div class="form-row">
                <div class="form-group"><label>Bars in x</label><input type="number" name="n_bars_x" value="5" required></div>
                <div class="form-group"><label>Bars in y</label><input type="number" name="n_bars_y" value="5" required></div>
                <div class="form-group"><label>Tie legs x</label><input type="number" name="n_legs_x" value="2"></div>
                <div class="form-group"><label>Tie legs y</label><input type="number" name="n_legs_y" value="2"></div>
            </div>
        </div>

        <button type="submit" class="btn-primary">Calculate</button>
    </form>

    <div id="results" class="results-panel" style="display:none;">
        <h2>Results</h2>
        <div style="display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;">
            <div id="results-content" style="flex:1;min-width:280px;"></div>
            <div id="svg-section" style="flex:0 0 auto;text-align:center;"></div>
        </div>
        <div style="display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;">
            <div id="chart-stress-strain" style="flex:1;min-width:400px;"></div>
            <div id="chart-confinement" style="flex:1;min-width:400px;"></div>
        </div>
        <div id="results-report" class="report-panel"></div>
    </div>
</div>

<script>
// ── Mander solver functions (rectangular biaxial confinement) ──
function manderEqA(r) {
    return 6.8886 - (0.6069 + 17.275 * r) * Math.exp(-4.989 * r);
}
function manderEqB(A, r) {
    var B2 = (5.0 / A) * (0.9849 - 0.6306 * Math.exp(-3.8939 * r)) - 0.1;
    return (4.5 / B2) - 5.0;
}
function manderSolver(r, xi) {
    var A = manderEqA(r);
    var B = manderEqB(A, r);
    var k1 = A * (0.1 + 0.9 / (1.0 + B * xi));
    return 1.0 + k1 * xi;
}
function manderRatio(ratio) {
    return -1.254 + 2.254 * Math.sqrt(1.0 + 7.92 * ratio) - 2.0 * ratio;
}

// ── Chart 1: Stress-Strain Curve ──
function renderStressStrainChart(result) {
    var strain = result.curve_strain;
    var stress = result.curve_stress;
    if (!strain || !stress) return;

    var fc = parseFloat(document.querySelector('[name="fc"]').value);
    var eco = 0.002;
    var uStrain = [], uStress = [];
    for (var i = 0; i <= 100; i++) {
        var e = i * 0.003 / 100;
        uStrain.push(e);
        if (e <= eco) {
            uStress.push(fc * (2 * e / eco - (e / eco) * (e / eco)));
        } else {
            uStress.push(Math.max(0, fc * (1 - 0.15 * (e - eco) / (0.003 - eco))));
        }
    }

    var traces = [
        { x: strain, y: stress, mode: 'lines', name: 'Confined (Mander)', line: { color: '#1e40af', width: 2.5 } },
        { x: uStrain, y: uStress, mode: 'lines', name: 'Unconfined', line: { color: '#dc2626', width: 2, dash: 'dash' } },
    ];

    var annotations = [
        { x: result.ecc, y: result.fcc, text: "f'cc = " + result.fcc + ' MPa', showarrow: true, arrowhead: 2, ax: 40, ay: -30, font: { size: 11, color: '#1e40af' } },
        { x: eco, y: fc, text: "f'co = " + fc + ' MPa', showarrow: true, arrowhead: 2, ax: -50, ay: -25, font: { size: 11, color: '#dc2626' } },
    ];

    var layout = {
        title: { text: "Mander's Stress-Strain Curve", font: { size: 14 } },
        xaxis: { title: 'Strain, \u03b5', zeroline: true, gridcolor: '#e5e7eb', rangemode: 'tozero' },
        yaxis: { title: 'Stress (MPa)', zeroline: true, gridcolor: '#e5e7eb', rangemode: 'tozero' },
        showlegend: true,
        legend: { x: 1, xanchor: 'right', y: 0.4, bgcolor: 'rgba(255,255,255,0.85)', bordercolor: '#d1d5db', borderwidth: 1, font: { size: 10 } },
        annotations: annotations,
        height: 500,
        margin: { t: 50, r: 20, b: 60, l: 65 },
        plot_bgcolor: '#fff', paper_bgcolor: '#fff',
        hovermode: 'closest',
    };

    var config = { responsive: true, displayModeBar: true, modeBarButtonsToRemove: ['lasso2d','select2d'], displaylogo: false };
    Plotly.newPlot('chart-stress-strain', traces, layout, config);
}

// ── Chart 2: Confined Strength Determination (Fig. 5) ──
function renderConfinementChart(result) {
    var fc = parseFloat(document.querySelector('[name="fc"]').value);
    var nPts = 80;
    var yMax = 0.38;
    var ratioVals = [];
    for (var i = 0; i < nPts; i++) ratioVals.push(i * yMax / (nPts - 1));

    // All fl1/fl2 ratio curves from 0 to 0.36 in steps of 0.02
    var palette = [
        '#2563eb','#dc2626','#65a30d','#9333ea','#0891b2','#ea580c',
        '#1d4ed8','#7f1d1d','#4d7c0f','#581c87','#0e7490','#c2410c',
        '#3b82f6','#b91c1c','#84cc16','#a855f7','#06b6d4','#f97316',
        '#60a5fa',
    ];
    var traces = [];
    for (var ci = 0; ci <= 18; ci++) {
        var rVal = ci * 0.02;
        var xVals = [], yVals = [];
        for (var i = 0; i < nPts; i++) {
            xVals.push(manderSolver(rVal, ratioVals[i]));
            yVals.push(ratioVals[i]);
        }
        traces.push({
            x: xVals, y: yVals, mode: 'lines',
            name: rVal.toFixed(2),
            line: { color: palette[ci % palette.length], width: 1.8 },
        });
    }

    // fl1 = fl2 (original Mander Eq. 4 curve)
    var xEq = [], yEq = [];
    for (var i = 0; i < nPts; i++) {
        xEq.push(manderRatio(ratioVals[i]));
        yEq.push(ratioVals[i]);
    }
    traces.push({
        x: xEq, y: yEq, mode: 'lines', name: "fl1 = fl2",
        line: { color: '#dc2626', width: 3, dash: 'dash' },
    });

    // Mark the user's computed point with projected lines
    if (result.ratio && result.fl_eff !== undefined && fc > 0) {
        var ptX = result.ratio;
        var ptY = result.fl_eff / fc;

        // Horizontal projection line (y = ptY from x=0 to ptX)
        traces.push({
            x: [0, ptX], y: [ptY, ptY], mode: 'lines',
            name: 'y = ' + ptY.toFixed(4),
            line: { color: '#000', width: 2, dash: 'dash' },
        });
        // Vertical projection line (x = ptX from y=-0.02 to ptY)
        traces.push({
            x: [ptX, ptX], y: [-0.02, ptY], mode: 'lines',
            name: 'x = ' + ptX.toFixed(2),
            line: { color: '#dc2626', width: 2, dash: 'dashdot' },
        });
        // Marker point
        traces.push({
            x: [ptX], y: [ptY], mode: 'markers', name: "f'cc/f'c = " + ptX.toFixed(2),
            marker: { size: 14, color: '#dc2626', symbol: 'circle',
                      line: { width: 2, color: '#fff' } },
            showlegend: false,
        });
    }

    var layout = {
        title: { text: "Confined Strength Determination &mdash; Mander et al. (1988) Fig. 5<br><sup>Lateral Confining Stresses for Rectangular Section</sup>",
                 font: { size: 13 }, y: 0.98, yanchor: 'top' },
        xaxis: {
            title: { text: "Confined Strength Ratio (f'cc/f'c)", font: { color: '#dc2626', size: 13 }, standoff: 10 },
            range: [0, 2.5], dtick: 0.5, gridcolor: '#e5e7eb', zeroline: false,
            side: 'top',
        },
        yaxis: {
            title: { text: "Largest Effective Confining Stress Ratio (f'lx/f'x)", font: { color: '#2563eb', size: 12 } },
            range: [yMax, -0.02], dtick: 0.02, gridcolor: '#e5e7eb', zeroline: false,
            autorange: false,
        },
        showlegend: true,
        legend: {
            x: 0.5, xanchor: 'center', y: -0.08, yanchor: 'top',
            orientation: 'h', font: { size: 9 },
            bgcolor: 'rgba(255,255,255,0.9)', bordercolor: '#d1d5db', borderwidth: 1,
        },
        height: 750,
        margin: { t: 100, r: 30, b: 140, l: 80 },
        plot_bgcolor: '#fff', paper_bgcolor: '#fff',
        hovermode: 'closest',
    };

    var config = { responsive: true, displayModeBar: true, modeBarButtonsToRemove: ['lasso2d','select2d'], displaylogo: false };
    Plotly.newPlot('chart-confinement', traces, layout, config);
}

// ── Form Submit ──
document.getElementById('calc-form').addEventListener('submit', function(e) {
    e.preventDefault();
    var payload = {};
    new FormData(this).forEach(function(v, k) {
        payload[k] = ['n_bars_x','n_bars_y','n_legs_x','n_legs_y'].indexOf(k) >= 0 ? parseInt(v) : parseFloat(v);
    });
    submitCalc('/api/mander/confined', payload, function(result) {
        var r = result;

        document.getElementById('svg-section').innerHTML = r.svg_section || '';
        renderStressStrainChart(r);
        renderConfinementChart(r);

        var fc = payload.fc;
        var fyh = payload.fy_transverse;
        var h = '';

        // ── Report Header ──
        h += '<div class="report-section">';
        h += '<h4>Mander\'s Confined Concrete Model &mdash; Calculation Report</h4>';
        h += '<p class="report-ref">Reference: Mander, J.B., Priestley, M.J.N., and Park, R. (1988). "Theoretical Stress-Strain Model for Confined Concrete." <i>Journal of Structural Engineering</i>, ASCE, Vol. 114, No. 8, pp. 1804-1826.</p>';
        h += '</div>';

        // ── Placeholder: Section Diagram ──
        h += '<div class="report-section">';
        h += '<h4>Section Geometry &amp; Effectively Confined Core</h4>';
        h += '<p class="report-ref">Ref: Mander et al. (1988) &mdash; Fig. 2: Effectively confined core for rectangular hoop reinforcement</p>';
        h += '<div class="report-placeholder">';
        h += '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><rect x="3" y="3" width="18" height="18" rx="1"/><line x1="7" y1="3" x2="7" y2="21"/><line x1="17" y1="3" x2="17" y2="21"/><line x1="3" y1="7" x2="21" y2="7"/><line x1="3" y1="17" x2="21" y2="17"/></svg>';
        h += '<span>Insert section diagram here (Section x-x &amp; Section z-z showing effectively confined core)</span>';
        h += '</div>';
        h += '</div>';

        // Section 1: Core Dimensions
        h += '<div class="report-section">';
        h += '<h4>1. Core Dimensions</h4>';
        h += '<p class="report-ref">Concrete core dimensions to center lines of perimeter hoops &mdash; Mander et al. (1988), Fig. 2</p>';
        h += '<div class="report-eq">\\[ b_c = b - 2 \\cdot \\text{cover} + d_{bt} = ' + payload.b + ' - 2 \\times ' + payload.cover + ' + ' + payload.db_tie + ' = ' + r.bc + ' \\text{ mm} \\]</div>';
        h += '<div class="report-eq">\\[ d_c = h - 2 \\cdot \\text{cover} + d_{bt} = ' + payload.h + ' - 2 \\times ' + payload.cover + ' + ' + payload.db_tie + ' = ' + r.dc + ' \\text{ mm} \\]</div>';
        h += '</div>';

        // Section 2: Longitudinal Reinforcement
        h += '<div class="report-section">';
        h += '<h4>2. Longitudinal Reinforcement</h4>';
        h += '<div class="report-eq">\\[ n_{\\text{total}} = 2(n_x + n_y) - 4 = 2(' + payload.n_bars_x + ' + ' + payload.n_bars_y + ') - 4 = ' + r.n_total + ' \\text{ bars} \\]</div>';
        h += '<div class="report-eq">\\[ A_{s,\\text{bar}} = \\frac{\\pi d_b^2}{4} = \\frac{\\pi \\times ' + payload.db_main + '^2}{4} = ' + r.as_main + ' \\text{ mm}^2 \\]</div>';
        var as_total = (r.n_total * r.as_main).toFixed(2);
        h += '<div class="report-eq">\\[ A_{s,\\text{total}} = n_{\\text{total}} \\times A_{s,\\text{bar}} = ' + r.n_total + ' \\times ' + r.as_main + ' = ' + as_total + ' \\text{ mm}^2 \\]</div>';
        h += '<div class="report-eq">\\[ \\rho_{cc} = \\frac{A_{s,\\text{total}}}{b_c \\times d_c} = \\frac{' + as_total + '}{' + r.bc + ' \\times ' + r.dc + '} = ' + r.rho_cc + ' \\]</div>';
        h += '</div>';

        // Section 3: Area of Core Section
        h += '<div class="report-section">';
        h += '<h4>3. Area of Core of Section within Center Lines of Perimeter Hoops, A<sub>c</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Eq. referenced in confinement effectiveness derivation</p>';
        h += '<div class="report-eq">\\[ A_c = b_c \\times d_c = ' + r.bc + ' \\times ' + r.dc + ' = ' + r.ac + ' \\text{ mm}^2 \\]</div>';
        h += '</div>';

        // Section 4: Area of Effective Concrete Core
        h += '<div class="report-section">';
        h += '<h4>4. Area of Effective Concrete Core, A<sub>cc</sub></h4>';
        h += '<div class="report-eq">\\[ A_{cc} = A_c (1 - \\rho_{cc}) = ' + r.ac + ' \\times (1 - ' + r.rho_cc + ') = ' + r.acc + ' \\text{ mm}^2 \\]</div>';
        h += '</div>';

        // Section 5: Clear Spacings
        h += '<div class="report-section">';
        h += '<h4>5. Clear Spacings Between Adjacent Longitudinal Bars, w\'<sub>i</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Fig. 2: Arching action between longitudinal bars</p>';
        if (r.wi_x && r.wi_x.length > 0) {
            h += '<p style="font-size:.85rem;"><b>y-direction (along b<sub>c</sub>), n = ' + r.wi_x.length + ':</b></p>';
            h += '<table class="report-table"><tr><th>i</th><th>w\'<sub>yi</sub> (mm)</th><th>w\'<sub>yi</sub><sup>2</sup> (mm<sup>2</sup>)</th></tr>';
            r.wi_x.forEach(function(w, i) {
                h += '<tr><td>' + (i+1) + '</td><td>' + w.toFixed(2) + '</td><td>' + (w*w).toFixed(2) + '</td></tr>';
            });
            h += '</table>';
            h += '<div class="report-eq">\\[ \\sum_{i=1}^{n} w\'^2_{yi} = ' + r.sum_wi2_x.toFixed(2) + ' \\text{ mm}^2 \\]</div>';
        }
        if (r.wi_y && r.wi_y.length > 0) {
            h += '<p style="font-size:.85rem;"><b>z-direction (along d<sub>c</sub>), m = ' + r.wi_y.length + ':</b></p>';
            h += '<table class="report-table"><tr><th>j</th><th>w\'<sub>zj</sub> (mm)</th><th>w\'<sub>zj</sub><sup>2</sup> (mm<sup>2</sup>)</th></tr>';
            r.wi_y.forEach(function(w, i) {
                h += '<tr><td>' + (i+1) + '</td><td>' + w.toFixed(2) + '</td><td>' + (w*w).toFixed(2) + '</td></tr>';
            });
            h += '</table>';
            h += '<div class="report-eq">\\[ \\sum_{j=1}^{m} w\'^2_{zj} = ' + r.sum_wi2_y.toFixed(2) + ' \\text{ mm}^2 \\]</div>';
        }
        h += '</div>';

        // Section 6: Effectively Confined Core Area
        h += '<div class="report-section">';
        h += '<h4>6. Total Area of Effectively Confined Core Concrete, A<sub>e</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Derived from arching action in plan (Fig. 2) and elevation</p>';
        h += '<div class="report-eq">\\[ s\' = s - d_{bt} = ' + payload.s_tie + ' - ' + payload.db_tie + ' = ' + r.s_prime + ' \\text{ mm (clear spacing between hoops)} \\]</div>';
        h += '<div class="report-eq">\\[ A_e = \\left( b_c d_c - \\frac{\\sum_{i=1}^{n} (w\'_{yi})^2 + \\sum_{j=1}^{m} (w\'_{zj})^2}{6} \\right) \\left(1 - \\frac{s\'}{2 b_c}\\right) \\left(1 - \\frac{s\'}{2 d_c}\\right) \\]</div>';
        h += '<div class="report-eq">\\[ A_e = \\left(' + r.bc + ' \\times ' + r.dc + ' - \\frac{' + r.sum_wi2_x.toFixed(2) + ' + ' + r.sum_wi2_y.toFixed(2) + '}{6}\\right) \\left(1 - \\frac{' + r.s_prime + '}{2 \\times ' + r.bc + '}\\right) \\left(1 - \\frac{' + r.s_prime + '}{2 \\times ' + r.dc + '}\\right) \\]</div>';
        h += '<div class="report-result">\\[ \\mathbf{A_e = ' + r.ae + ' \\text{ mm}^2} \\]</div>';
        h += '</div>';

        // Section 7: Confinement Effectiveness Coefficient
        h += '<div class="report-section">';
        h += '<h4>7. Confinement Effectiveness Coefficient, k<sub>e</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; k<sub>e</sub> = A<sub>e</sub> / A<sub>cc</sub>, should be &leq; 1.0</p>';
        h += '<div class="report-eq">\\[ k_e = \\frac{A_e}{A_{cc}} = \\frac{' + r.ae + '}{' + r.acc + '} \\]</div>';
        h += '<div class="report-result">\\[ \\mathbf{k_e = ' + r.ke + '} \\quad (\\leq 1.0) \\]</div>';
        h += '</div>';

        // Section 8: Transverse Steel Ratios
        h += '<div class="report-section">';
        h += '<h4>8. Transverse Reinforcement Ratios, &rho;<sub>y</sub> and &rho;<sub>z</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Ratio of volume of transverse confining steel to volume of confined concrete core</p>';
        h += '<div class="report-eq">\\[ A_{sp} = \\frac{\\pi d_{bt}^2}{4} = \\frac{\\pi \\times ' + payload.db_tie + '^2}{4} = ' + r.as_tie + ' \\text{ mm}^2 \\]</div>';
        h += '<div class="report-eq">\\[ A_{sy} = n_{\\text{legs},x} \\times A_{sp} = ' + payload.n_legs_x + ' \\times ' + r.as_tie + ' = ' + r.asy + ' \\text{ mm}^2 \\]</div>';
        h += '<div class="report-eq">\\[ A_{sz} = n_{\\text{legs},y} \\times A_{sp} = ' + payload.n_legs_y + ' \\times ' + r.as_tie + ' = ' + r.asz + ' \\text{ mm}^2 \\]</div>';
        h += '<div class="report-eq">\\[ \\rho_y = \\frac{A_{sy}}{d_c \\cdot s} = \\frac{' + r.asy + '}{' + r.dc + ' \\times ' + payload.s_tie + '} = ' + r.rho_x + ' \\]</div>';
        h += '<div class="report-eq">\\[ \\rho_z = \\frac{A_{sz}}{b_c \\cdot s} = \\frac{' + r.asz + '}{' + r.bc + ' \\times ' + payload.s_tie + '} = ' + r.rho_y + ' \\]</div>';
        h += '</div>';

        // Section 9: Effective Lateral Confining Stresses
        h += '<div class="report-section">';
        h += '<h4>9. Effective Lateral Confining Stresses on the Concrete, f\'<sub>ly</sub> and f\'<sub>lz</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; f\'<sub>l</sub> = k<sub>e</sub> &middot; &rho; &middot; f<sub>yh</sub></p>';
        h += '<div class="report-eq">\\[ f\'_{ly} = k_e \\cdot \\rho_y \\cdot f_{yh} = ' + r.ke + ' \\times ' + r.rho_x + ' \\times ' + fyh + ' = ' + r.fl_x + ' \\text{ MPa} \\]</div>';
        h += '<div class="report-eq">\\[ f\'_{lz} = k_e \\cdot \\rho_z \\cdot f_{yh} = ' + r.ke + ' \\times ' + r.rho_y + ' \\times ' + fyh + ' = ' + r.fl_y + ' \\text{ MPa} \\]</div>';
        h += '</div>';

        // ── Placeholder: Confined Strength Chart from Paper ──
        h += '<div class="report-section">';
        h += '<h4>Confined Strength Determination for Rectangular Sections</h4>';
        h += '<p class="report-ref">Ref: Mander et al. (1988) &mdash; Fig. 5: Determination of confined concrete strength from lateral confining stresses for rectangular sections</p>';
        h += '<div class="report-placeholder">';
        h += '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"><path d="M3 20L8 10l5 6 4-8 4 12"/><circle cx="8" cy="10" r="1.5"/></svg>';
        h += '<span>Insert Fig. 5 from Mander et al. (1988) &mdash; Biaxial confined strength determination chart</span>';
        h += '</div>';
        h += '</div>';

        // Section 10: Confined Concrete Strength (with biaxial method)
        h += '<div class="report-section">';
        h += '<h4>10. Confined Concrete Strength, f\'<sub>cc</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Eq. 4 (equal confinement) or biaxial method per Fig. 5</p>';

        // 10a: Effective confining stress
        h += '<p style="font-size:.85rem;margin-top:.75rem;"><b>Effective lateral confining stress:</b></p>';
        h += '<div class="report-eq">\\[ f\'_{l} = \\frac{f\'_{ly} + f\'_{lz}}{2} = \\frac{' + r.fl_x + ' + ' + r.fl_y + '}{2} = ' + r.fl_eff + ' \\text{ MPa} \\]</div>';

        // 10b: Biaxial confinement parameters (6-step method)
        var fl1 = Math.min(r.fl_x, r.fl_y);
        var fl2 = Math.max(r.fl_x, r.fl_y);
        var q_val = fl2 > 0 ? (fl1 / fl2).toFixed(4) : '0.0000';
        h += '<p style="font-size:.85rem;margin-top:.75rem;"><b>Biaxial confinement parameters (Mander et al., 1988, Fig. 5):</b></p>';
        h += '<div class="report-eq">\\[ \\text{1) } q = \\frac{f\'_{l1}}{f\'_{l2}} = \\frac{' + fl1.toFixed(4) + '}{' + fl2.toFixed(4) + '} = ' + q_val + ' \\quad (f\'_{l2} \\geq f\'_{l1}) \\]</div>';
        h += '<div class="report-eq">\\[ \\text{2) } A = 6.886 - (0.6069 + 17.275 q) \\, e^{-4.989 q} \\]</div>';
        h += '<div class="report-eq">\\[ \\text{3) } B = \\frac{4.5}{\\frac{5}{A} \\left( 0.9849 - 0.6306 \\, e^{-3.8939 q} \\right) - 0.1} - 5 \\]</div>';
        h += '<div class="report-eq">\\[ \\text{4) } x\' = \\frac{f\'_{l1} + f\'_{l2}}{2 f\'_{co}} = \\frac{' + fl1.toFixed(4) + ' + ' + fl2.toFixed(4) + '}{2 \\times ' + fc + '} = ' + (r.fl_eff / fc).toFixed(6) + ' \\]</div>';
        h += '<div class="report-eq">\\[ \\text{5) } k_1 = A \\left[ 0.1 + \\frac{0.9}{1 + B \\cdot x\'} \\right] \\]</div>';
        h += '<div class="report-eq">\\[ \\text{6) } f\'_{cc} = f\'_{co} \\left( 1.0 + k_1 \\cdot x\' \\right) \\]</div>';

        // 10c: Equal confinement formula (Eq. 4)
        h += '<p style="font-size:.85rem;margin-top:.75rem;"><b>For equal lateral confining stress (Eq. 4):</b></p>';
        h += '<div class="report-eq">\\[ \\frac{f\'_{cc}}{f\'_{co}} = -1.254 + 2.254\\sqrt{1 + \\frac{7.94 \\, f\'_l}{f\'_{co}}} - 2 \\frac{f\'_l}{f\'_{co}} \\]</div>';
        h += '<div class="report-eq">\\[ \\frac{f\'_{cc}}{f\'_{co}} = -1.254 + 2.254\\sqrt{1 + \\frac{7.94 \\times ' + r.fl_eff + '}{' + fc + '}} - 2 \\times \\frac{' + r.fl_eff + '}{' + fc + '} = ' + r.ratio + ' \\]</div>';
        h += '<div class="report-result">\\[ \\mathbf{f\'_{cc} = ' + r.ratio + ' \\times ' + fc + ' = ' + r.fcc + ' \\text{ MPa}} \\]</div>';
        h += '</div>';

        // Section 11: Confined Strain
        h += '<div class="report-section">';
        h += '<h4>11. Confined Concrete Strain, &epsilon;<sub>cc</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Eq. 5</p>';
        h += '<div class="report-eq">\\[ \\varepsilon_{cc} = \\varepsilon_{co} \\left[ 1 + 5 \\left( \\frac{f\'_{cc}}{f\'_{co}} - 1 \\right) \\right] \\]</div>';
        h += '<div class="report-eq">\\[ \\varepsilon_{cc} = ' + r.eco + ' \\left[ 1 + 5 \\left( ' + r.ratio + ' - 1 \\right) \\right] \\]</div>';
        h += '<div class="report-result">\\[ \\mathbf{\\varepsilon_{cc} = ' + r.ecc + '} \\]</div>';
        h += '</div>';

        // Section 12: Ultimate Strain
        h += '<div class="report-section">';
        h += '<h4>12. Ultimate Strain for Confined Concrete, &epsilon;<sub>cu</sub></h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Based on energy balance approach; Paulay and Priestley (1992) simplified expression</p>';
        h += '<div class="report-eq">\\[ \\varepsilon_{cu} = 0.004 + 1.4 \\frac{f\'_l \\cdot \\varepsilon_{su}}{f\'_{cc}} \\quad \\text{where } \\varepsilon_{su} = 0.01 \\text{ (assumed)} \\]</div>';
        h += '<div class="report-eq">\\[ \\varepsilon_{cu} = 0.004 + 1.4 \\times \\frac{' + r.fl_eff + ' \\times 0.01}{' + r.fcc + '} \\quad \\text{but not less than } 3\\varepsilon_{cc} = ' + (3 * r.ecc).toFixed(6) + ' \\]</div>';
        h += '<div class="report-result">\\[ \\mathbf{\\varepsilon_{cu} = ' + r.ecu + '} \\]</div>';
        h += '</div>';

        // Section 13: Stress-Strain Curve Parameters
        h += '<div class="report-section">';
        h += '<h4>13. Stress-Strain Relationship</h4>';
        h += '<p class="report-ref">Mander et al. (1988) &mdash; Eqs. 6, 7, 8: Popovics (1973) base curve adapted for confined concrete</p>';
        h += '<div class="report-eq">\\[ E_c = 5000 \\sqrt{f\'_c} = 5000 \\sqrt{' + fc + '} = ' + r.ec + ' \\text{ MPa} \\]</div>';
        h += '<div class="report-eq">\\[ E_{\\sec} = \\frac{f\'_{cc}}{\\varepsilon_{cc}} = \\frac{' + r.fcc + '}{' + r.ecc + '} = ' + r.e_sec + ' \\text{ MPa} \\]</div>';
        h += '<div class="report-eq">\\[ r = \\frac{E_c}{E_c - E_{\\sec}} = \\frac{' + r.ec + '}{' + r.ec + ' - ' + r.e_sec + '} = ' + r.r + ' \\quad \\text{(Eq. 8)} \\]</div>';
        h += '<div class="report-eq">\\[ f_c = \\frac{f\'_{cc} \\cdot x \\cdot r}{r - 1 + x^r} \\quad \\text{where } x = \\frac{\\varepsilon_c}{\\varepsilon_{cc}} \\quad \\text{(Eqs. 6 \\& 7)} \\]</div>';
        h += '</div>';

        // ── Summary Table ──
        h += '<div class="report-section">';
        h += '<h4>Summary of Results</h4>';
        h += '<table class="report-table">';
        h += '<tr><th>Parameter</th><th>Symbol</th><th>Value</th><th>Unit</th></tr>';
        h += '<tr><td>Core width</td><td>b<sub>c</sub></td><td>' + r.bc + '</td><td>mm</td></tr>';
        h += '<tr><td>Core depth</td><td>d<sub>c</sub></td><td>' + r.dc + '</td><td>mm</td></tr>';
        h += '<tr><td>Confinement effectiveness</td><td>k<sub>e</sub></td><td>' + r.ke + '</td><td>&mdash;</td></tr>';
        h += '<tr><td>Lateral stress (y-dir)</td><td>f\'<sub>ly</sub></td><td>' + r.fl_x + '</td><td>MPa</td></tr>';
        h += '<tr><td>Lateral stress (z-dir)</td><td>f\'<sub>lz</sub></td><td>' + r.fl_y + '</td><td>MPa</td></tr>';
        h += '<tr style="background:#dcfce7;font-weight:700;"><td>Confined strength</td><td>f\'<sub>cc</sub></td><td>' + r.fcc + '</td><td>MPa</td></tr>';
        h += '<tr style="background:#dcfce7;font-weight:700;"><td>Confined strain</td><td>&epsilon;<sub>cc</sub></td><td>' + r.ecc + '</td><td>&mdash;</td></tr>';
        h += '<tr style="background:#dcfce7;font-weight:700;"><td>Ultimate strain</td><td>&epsilon;<sub>cu</sub></td><td>' + r.ecu + '</td><td>&mdash;</td></tr>';
        h += '<tr><td>Elastic modulus</td><td>E<sub>c</sub></td><td>' + r.ec + '</td><td>MPa</td></tr>';
        h += '<tr><td>Secant modulus</td><td>E<sub>sec</sub></td><td>' + r.e_sec + '</td><td>MPa</td></tr>';
        h += '<tr><td>Curve parameter</td><td>r</td><td>' + r.r + '</td><td>&mdash;</td></tr>';
        h += '</table>';
        h += '</div>';

        document.getElementById('results-report').innerHTML = h;
        if (window.MathJax) MathJax.typeset();
    });
});
</script>
{% endblock %}