[advanced_tbsa_calculator]

/**

 * Shortcode: [advanced_tbsa_calculator]

 */

function advanced_tbsa_calculator_shortcode($atts) {

    ob_start();

    ?>

    <style>

      .adv-burncalc .card-header {

        background-color: #f0f0f0;

      }

      .fluid-formula-table td {

        vertical-align: middle;

      }

      .alert-secondary {

        background-color: #f8f9fa;

        border-color: #f8f9fa;

      }

      /* Two cards side by side */

      .row-flex-container {

        display: flex;

        flex-wrap: wrap;

        gap: 1rem;

      }

      .row-flex-container > .card {

        flex: 1 1 0px;

        min-width: 320px;

      }

      /* Collapsible panel style for Real-time Titration */

      .collapse {

        display: none;

      }

      .collapse.show {

        display: block;

      }

    </style>

    <div class="adv-burncalc">

      <div class="row-flex-container mb-3">

        <!-- CARD 1: Patient Metrics -->

        <div class="card">

          <div class="card-header">

            <h5 class="mb-0"><?php esc_html_e('Patient Metrics', 'mediscore360'); ?></h5>

          </div>

          <div class="card-body">

            <!-- Age -->

            <div class="mb-3">

              <label for="advAgeInput" class="form-label">

                <?php esc_html_e('Age (Years)', 'mediscore360'); ?>

              </label>

              <input type="number"

                     class="form-control"

                     id="advAgeInput"

                     min="0"

                     max="120"

                     step="1"

                     value="" />

              <div class="text-muted" id="ageDisclaimer" style="display:none;">

                <!-- We'll fill in if age < 15 => "Child approach" else "Adult approach" -->

              </div>

            </div>

            <!-- Weight -->

            <div class="mb-3">

              <label for="advWeightInput" class="form-label">

                <?php esc_html_e('Weight (kg)', 'mediscore360'); ?>

              </label>

              <input type="number"

                     class="form-control"

                     id="advWeightInput"

                     min="0"

                     max="300"

                     step="0.1"

                     value="" />

            </div>

            <!-- Height -->

            <div class="mb-3">

              <label for="advHeightInput" class="form-label">

                <?php esc_html_e('Height (cm)', 'mediscore360'); ?>

              </label>

              <input type="number"

                     class="form-control"

                     id="advHeightInput"

                     min="30"

                     max="250"

                     step="0.5"

                     value="" />

            </div>

            <!-- BSA read-only -->

            <div class="mb-3">

              <label for="bsaOutput" class="form-label">

                <?php esc_html_e('Estimated BSA (m²)', 'mediscore360'); ?>

              </label>

              <input type="text" class="form-control" id="bsaOutput" readonly />

            </div>

          </div>

        </div><!-- card 1 -->

        <!-- CARD 2: Burn Details -->

        <div class="card">

          <div class="card-header">

            <h5 class="mb-0"><?php esc_html_e('Burn Details', 'mediscore360'); ?></h5>

          </div>

          <div class="card-body">

            <div class="row g-3 mb-3">

              <div class="col-sm-4">

                <label for="secondDegInput" class="form-label">

                  <?php esc_html_e('2nd-degree (%)', 'mediscore360'); ?>

                </label>

                <input type="number" class="form-control" id="secondDegInput" min="0" max="100" step="0.1" value="0" />

              </div>

              <div class="col-sm-4">

                <label for="thirdDegInput" class="form-label">

                  <?php esc_html_e('3rd-degree (%)', 'mediscore360'); ?>

                </label>

                <input type="number" class="form-control" id="thirdDegInput" min="0" max="100" step="0.1" value="0" />

              </div>

              <div class="col-sm-4">

                <label for="totalTbsaInput" class="form-label">

                  <?php esc_html_e('Total TBSA (%)', 'mediscore360'); ?>

                </label>

                <input type="number" class="form-control" id="totalTbsaInput" min="0" max="100" step="0.1" value="0" readonly />

              </div>

            </div>

            <div class="form-check mb-3">

              <input class="form-check-input" type="checkbox" id="chkInhalation">

              <label class="form-check-label" for="chkInhalation">

                <?php esc_html_e('Suspected Inhalation Injury?', 'mediscore360'); ?>

              </label>

            </div>

            <!-- Calculate Button -->

            <button class="btn btn-primary w-100" id="btnAdvCalculate">

              <?php esc_html_e('Calculate / Show Guidance', 'mediscore360'); ?>

            </button>

          </div>

        </div><!-- card 2 -->

      </div><!-- row-flex-container -->

      <!-- Results card -->

      <div class="card mt-3" id="advResultsCard" style="display:none;">

        <div class="card-header">

          <h5 class="mb-0"><?php esc_html_e('Results & Recommendations', 'mediscore360'); ?></h5>

        </div>

        <div class="card-body">

          <!-- A) Fluid Formulas Table -->

          <div class="table-responsive" id="fluidFormulaWrap" style="display:none;">

            <table class="table table-bordered fluid-formula-table">

              <thead class="table-light">

                <tr>

                  <th><?php esc_html_e('Formula', 'mediscore360'); ?></th>

                  <th><?php esc_html_e('24h Total (mL)', 'mediscore360'); ?></th>

                  <th><?php esc_html_e('First 8h', 'mediscore360'); ?></th>

                  <th><?php esc_html_e('Next 16h', 'mediscore360'); ?></th>

                </tr>

              </thead>

              <tbody>

                <!-- 1) Parkland -->

                <tr id="rowParkland" style="display:none;">

                  <td><strong>Parkland</strong></td>

                  <td id="parklandTotal"></td>

                  <td id="parkland8hr"></td>

                  <td id="parkland16hr"></td>

                </tr>

                <!-- 2) Modified Brooke -->

                <tr id="rowBrooke" style="display:none;">

                  <td><strong>Modified Brooke</strong></td>

                  <td id="brookeTotal"></td>

                  <td id="brooke8hr"></td>

                  <td id="brooke16hr"></td>

                </tr>

                <!-- 3) Galveston -->

                <tr id="rowGalveston" style="display:none;">

                  <td><strong>Galveston</strong></td>

                  <td id="galvestonTotal"></td>

                  <td colspan="2" id="galvestonMaintNote" class="text-muted"></td>

                </tr>

                <!-- 4) Shriners–Cincinnati -->

                <tr id="rowShriners" style="display:none;">

                  <td><strong>Shriners–Cincinnati</strong></td>

                  <td id="shrinersTotal"></td>

                  <td id="shriners8hr"></td>

                  <td id="shriners16hr"></td>

                </tr>

                <!-- 5) Rule of Ten -->

                <tr id="rowRuleOfTen" style="display:none;">

                  <td><strong>Rule of Ten</strong></td>

                  <td colspan="3" id="ruleTenOutput" class="text-muted"></td>

                </tr>

              </tbody>

            </table>

          </div>

          <!-- B) Inhalation Notice -->

          <div class="alert alert-danger" id="inhalationAlert" style="display:none;">

            <strong><?php esc_html_e('Inhalation Injury Suspected:', 'mediscore360'); ?></strong><br/>

            <?php esc_html_e('Provide 100% O2, consider COHb level checks, possible bronchoscopy if airway compromise.', 'mediscore360'); ?>

          </div>

          <!-- C) Wound Care & Pain -->

          <div class="alert alert-secondary" id="woundPainBlock" style="display:none;">

            <strong><?php esc_html_e('Wound Care & Pain Management', 'mediscore360'); ?></strong><br/>

            <ul style="margin-bottom:0;">

              <li><?php esc_html_e('For large partial-thickness, clean & debride, manage blisters carefully, consider silver-based dressings.', 'mediscore360'); ?></li>

              <li><?php esc_html_e('Check tetanus prophylaxis; update if necessary.', 'mediscore360'); ?></li>

              <li><?php esc_html_e('Use appropriate analgesics: NSAIDs, acetaminophen, or opioids; consider regional anesthesia for large limb burns.', 'mediscore360'); ?></li>

            </ul>

          </div>

          <!-- D) Admission vs. Outpatient -->

          <div class="alert alert-info" id="dispositionBlock" style="display:none;"></div>

          <!-- E) Real-time Titration collapsible -->

          <button class="btn btn-sm btn-outline-secondary mt-3" id="toggleTitrationBtn">

            <?php esc_html_e('Toggle Real-Time Titration', 'mediscore360'); ?>

          </button>

          <div class="collapse" id="titrationPanel">

            <hr/>

            <h6><?php esc_html_e('Urine Output / MAP Data', 'mediscore360'); ?></h6>

            <div class="row g-2 mb-3">

              <div class="col">

                <label for="uopInput" class="form-label">

                  <?php esc_html_e('Urine Output (mL/kg/hr)', 'mediscore360'); ?>

                </label>

                <input type="number" class="form-control" id="uopInput" step="0.1" min="0" />

              </div>

              <div class="col">

                <label for="mapInput" class="form-label">

                  <?php esc_html_e('Mean Arterial Pressure (mmHg)', 'mediscore360'); ?>

                </label>

                <input type="number" class="form-control" id="mapInput" min="0" max="200" />

              </div>

            </div>

            <button class="btn btn-secondary" id="btnTitrate">

              <?php esc_html_e('Calculate Titration Recommendation', 'mediscore360'); ?>

            </button>

            <div class="alert alert-warning mt-3" id="titrationResult" style="display:none;"></div>

          </div>

          <!-- F) Disclaimers -->

          <div class="alert alert-warning mt-3">

            <strong><?php esc_html_e('Disclaimer:', 'mediscore360'); ?></strong><br/>

            <?php esc_html_e('This tool is for educational purposes only and does not replace clinical judgment. Formulas vary by protocol; always titrate fluids to urine output and hemodynamics.', 'mediscore360'); ?>

          </div>

        </div><!-- card-body -->

      </div><!-- #advResultsCard -->

    </div><!-- .adv-burncalc -->

    <script>

    document.addEventListener('DOMContentLoaded', () => {

      // Retrieve localStorage data if desired...

      // For brevity, we won't re-implement parsing here.

      // 1) Set up watchers for Age => show disclaimers (peds vs. adult)

      document.getElementById('advAgeInput').addEventListener('input', handleAgeDisclaimer);

      function handleAgeDisclaimer(){

        const ageVal = parseFloat(document.getElementById('advAgeInput').value) || 0;

        const disclaim = document.getElementById('ageDisclaimer');

        if (ageVal < 15) {

          disclaim.style.display = 'block';

          disclaim.innerHTML = "<?php esc_html_e('Child approach recommended (pediatric fluid formulas).','mediscore360'); ?>";

        } else {

          disclaim.style.display = 'block';

          disclaim.innerHTML = "<?php esc_html_e('Adult approach recommended (Parkland, Brooke, etc).','mediscore360'); ?>";

        }

      }

      // 2) BSA calculation => watch weight & height

      document.getElementById('advWeightInput').addEventListener('input', computeBSA);

      document.getElementById('advHeightInput').addEventListener('input', computeBSA);

      function computeBSA() {

        const w = parseFloat(document.getElementById('advWeightInput').value) || 0;

        const h = parseFloat(document.getElementById('advHeightInput').value) || 0;

        if (w > 0 && h > 0) {

          // Basic validation

          if (h < 50 || h > 250) {

            alert("Height out of typical range (50–250 cm). Check input.");

          }

          // Mosteller

          const bsa = Math.sqrt((w * h)/3600);

          if (bsa < 0.2 || bsa > 3) {

            // BSA might be suspicious for certain extremes. Just a warning

            alert("Computed BSA seems out of normal range (<0.2 or >3.0). Verify data.");

          }

          document.getElementById('bsaOutput').value = bsa.toFixed(2);

        } else {

          document.getElementById('bsaOutput').value = "";

        }

      }

      // 3) Summation => total TBSA

      document.getElementById('secondDegInput').addEventListener('input', autoRecalcTBSA);

      document.getElementById('thirdDegInput').addEventListener('input', autoRecalcTBSA);

      function autoRecalcTBSA() {

        const s = parseFloat(document.getElementById('secondDegInput').value) || 0;

        const t = parseFloat(document.getElementById('thirdDegInput').value) || 0;

        document.getElementById('totalTbsaInput').value = (s + t).toFixed(1);

      }

      // 4) Calculate button => Show results

      document.getElementById('btnAdvCalculate').addEventListener('click', doAdvancedCalculate);

      function doAdvancedCalculate(){

        document.getElementById('advResultsCard').style.display = 'block';

        // Clear/hide

        document.getElementById('fluidFormulaWrap').style.display = 'none';

        ["rowParkland","rowBrooke","rowGalveston","rowShriners","rowRuleOfTen"].forEach(id=>{

          document.getElementById(id).style.display = 'none';

        });

        document.getElementById('inhalationAlert').style.display = 'none';

        document.getElementById('woundPainBlock').style.display = 'none';

        document.getElementById('dispositionBlock').style.display = 'none';

        document.getElementById('dispositionBlock').innerHTML = '';

        document.getElementById('galvestonMaintNote').innerHTML = '';

        const ageVal = parseFloat(document.getElementById('advAgeInput').value) || 0;

        const wVal   = parseFloat(document.getElementById('advWeightInput').value) || 0;

        const hVal   = parseFloat(document.getElementById('advHeightInput').value) || 0;

        const bsaTxt = document.getElementById('bsaOutput').value || "";

        let bsaVal   = 0;

        if (bsaTxt) bsaVal = parseFloat(bsaTxt);

        const secondD= parseFloat(document.getElementById('secondDegInput').value) || 0;

        const thirdD = parseFloat(document.getElementById('thirdDegInput').value) || 0;

        const totalT = parseFloat(document.getElementById('totalTbsaInput').value) || 0;

        const inhalation = document.getElementById('chkInhalation').checked;

        if (wVal <= 0 || totalT < 0) {

          alert("Please provide valid weight and burn data.");

          return;

        }

        // Show fluid formula table

        document.getElementById('fluidFormulaWrap').style.display = 'block';

        // Parkland

        const parkTotal = 4 * wVal * totalT;

        const park8     = parkTotal / 2;

        const park16    = parkTotal / 2;

        const p8hrRate  = park8/8, p16hrRate = park16/16;

        document.getElementById('rowParkland').style.display='table-row';

        document.getElementById('parklandTotal').textContent=

          Math.round(parkTotal) + " mL (24h)";

        document.getElementById('parkland8hr').textContent=

          Math.round(park8)+" mL ("+Math.round(p8hrRate)+" mL/hr)";

        document.getElementById('parkland16hr').textContent=

          Math.round(park16)+" mL ("+Math.round(p16hrRate)+" mL/hr)";

        // Modified Brooke => if age >= 15

        if (ageVal >= 15) {

          const brookeTotal= 2 * wVal * totalT;

          const b8=brookeTotal/2, b16=brookeTotal/2;

          const b8r=b8/8, b16r=b16/16;

          document.getElementById('rowBrooke').style.display='table-row';

          document.getElementById('brookeTotal').textContent=

            Math.round(brookeTotal)+" mL (24h)";

          document.getElementById('brooke8hr').textContent=

            Math.round(b8)+" mL ("+Math.round(b8r)+" mL/hr)";

          document.getElementById('brooke16hr').textContent=

            Math.round(b16)+" mL ("+Math.round(b16r)+" mL/hr)";

        }

        // Galveston => if peds (age<15) & have BSA

        if (ageVal<15 && bsaVal>0) {

          // e.g. 5000*(%burn/100)*BSA + 2000*BSA

          const galvResus=5000*(totalT/100)*bsaVal;

          const galvMaint=2000*bsaVal;

          const galvTotal=galvResus+galvMaint;

          document.getElementById('rowGalveston').style.display='table-row';

          document.getElementById('galvestonTotal').textContent=

            Math.round(galvTotal)+" mL (24h)";

          document.getElementById('galvestonMaintNote').innerHTML=

            "5,000 mL/m² for burn area + 2,000 mL/m² maintenance. (Simplified)";

        }

        // Shriners–Cincinnati => if child <18 & BSA>0

        if (ageVal<18 && bsaVal>0) {

          const shrBase=4*wVal*totalT;

          const shrMaint=1500*bsaVal;

          const shrTot=shrBase+shrMaint;

          const shr8=shrTot/2, shr16=shrTot/2;

          const shr8r=shr8/8, shr16r=shr16/16;

          document.getElementById('rowShriners').style.display='table-row';

          document.getElementById('shrinersTotal').textContent=

            Math.round(shrTot)+" mL (24h)";

          document.getElementById('shriners8hr').textContent=

            Math.round(shr8)+" mL ("+Math.round(shr8r)+" mL/hr)";

          document.getElementById('shriners16hr').textContent=

            Math.round(shr16)+" mL ("+Math.round(shr16r)+" mL/hr)";

        }

        // Rule of Ten => if adult

        if (ageVal>=15 && totalT>0) {

          let nearest10 = Math.round(totalT/10)*10;

          if (nearest10<10) nearest10=10; 

          let baseRate = nearest10*10; 

          let adjust=0;

          if (wVal>80) {

            const over80 = Math.floor((wVal-80)/10);

            adjust= over80*100;

          }

          const ruleRate= baseRate+adjust;

          document.getElementById('rowRuleOfTen').style.display='table-row';

          document.getElementById('ruleTenOutput').textContent=

            "Initial rate ~"+ruleRate+" mL/hr. Titrate to urine output.";

        }

        // Inhalation

        if (inhalation) {

          document.getElementById('inhalationAlert').style.display='block';

        }

        // Show Wound/Pain if total>0

        if (totalT>0) {

          document.getElementById('woundPainBlock').style.display='block';

        }

        // Admission vs Outpatient

        const dispEl=document.getElementById('dispositionBlock');

        dispEl.style.display='block';

        let recHtml="";

        if (secondD>10||thirdD>5||inhalation) {

          recHtml+="- Inpatient or specialized burn center likely required.<br/>";

        } else {

          recHtml+="- Possibly outpatient if stable; recheck 24–48h.<br/>";

        }

        if (totalT>20) {

          recHtml+="- Over 20% TBSA => watch fluid requirements, consider ICU-level care.<br/>";

        }

        dispEl.innerHTML=recHtml;

      }

      // 5) Toggling Real-time Titration

      const toggleBtn = document.getElementById('toggleTitrationBtn');

      const titrationPanel = document.getElementById('titrationPanel');

      toggleBtn.addEventListener('click', ()=>{

        titrationPanel.classList.toggle('show');

      });

      // 6) Titration logic => if UOP too low => increase fluids, etc.

      document.getElementById('btnTitrate').addEventListener('click', ()=>{

        const uop = parseFloat(document.getElementById('uopInput').value) || 0;

        const map = parseFloat(document.getElementById('mapInput').value) || 0;

        const resDiv = document.getElementById('titrationResult');

        let msg="";

        // e.g. if UOP < 0.5 => increase fluid by 10–20%

        // if MAP < 60 => possible pressors vs. fluid

        if (uop<0.5) {

          msg+="- Urine output <0.5 mL/kg/hr => consider raising fluid rate 10–20%.<br/>";

        } else if (uop>2) {

          msg+="- High urine output => consider reducing fluid rate to avoid overload.<br/>";

        } else {

          msg+="- Urine output in acceptable range (0.5–1 mL/kg/hr).<br/>";

        }

        if (map<60 && map>0) {

          msg+="- MAP <60 => possible hypotension => check for under-resuscitation vs. pressor need.<br/>";

        }

        if (!msg) msg= "No immediate changes indicated by these values.";

        resDiv.innerHTML= msg;

        resDiv.style.display='block';

      });

    });

    </script>

    <?php

    return ob_get_clean();

}

add_shortcode('advanced_tbsa_calculator', 'advanced_tbsa_calculator_shortcode');