import { heroImage } from "/helpers/hero.js";
hero_url = "./../../images/livestockInvest.webp";

hero = heroImage(notebookTitle, hero_url);
html`${hero}`;

import { atlasTOC } from '/helpers/toc.ojs' 
{
  await nbText // force wait/reload with nbText to load so headings have correct labels/languages
  return atlasTOC({
      heading: `<b>${_lang({en:"In this notebook", fr:"Dans ce notebook"})}</b>`,
      skip: [notebookTitle, "notebook-title", "Appendix", "source-code"]
      })
}

// pretty view of language toggle
viewof prettyLanguageView = {
  return Inputs.bind(
    Inputs.radio(languages, {
      label: _lang(nbText.legends.language),
      format: (d) => d.label
    }),
    viewof language
  );
}

viewof colorblindData = {
  const data = [
    { key: "None", label: _lang(nbText.legends.colorblind.values.non) },
    { key: "Deuteranopia", label: _lang(nbText.legends.colorblind.values.deu) },
    { key: "Protanopia", label: _lang(nbText.legends.colorblind.values.pro) },
    { key: "Tritanopia", label: _lang(nbText.legends.colorblind.values.tri) },
  ];
  return Inputs.select(data, {
    label: _lang(nbText.legends.colorblind.label),
    format: x => x.label,
    value: data.find(d => d.key == 'None')
  });
}

{
  const title = _lang(nbText.sections.overview.title);
  const intro = _lang(nbText.sections.overview.intro);
  const inspiration = _lang(nbText.sections.overview.inspiration);

  return md`# ${title}

${intro}

${inspiration}`;
}

{
  const title = _lang(nbText.sections.livestockExplosion.title)
  const intro = _lang(nbText.sections.livestockExplosion.intro)

  return md`# ${title}

  ${intro}`
}

// viewof Area_chart_type = Inputs.radio(["Stock", "GHG Emissions", "Value of production"], {label: "Variable", value: 'Stock'})

viewof Area_chart_type = {
  const data = [
    {
      key: "stock",
      label: _lang(
        nbText.sections.livestockExplosion.chart.variables.stock.label
      ),
      yLabel: _lang(nbText.sections.livestockExplosion.chart.variables.stock.tip)
    },
    {
      key: "ghg",
      label: _lang(
        nbText.sections.livestockExplosion.chart.variables.ghg.label
      ),
      yLabel: _lang(nbText.sections.livestockExplosion.chart.variables.ghg.tip)
    },
    {
      key: "vop",
      label: _lang(
        nbText.sections.livestockExplosion.chart.variables.vop.label
      ),
      yLabel: _lang(nbText.sections.livestockExplosion.chart.variables.vop.tip)
    }
  ].map((d) => ({
    // common values
    ...d,
    xLabel: _lang(nbText.sections.livestockExplosion.chart.labels.year)
  }));

  return Inputs.radio(data, {
    label: _lang(nbText.sections.livestockExplosion.chart.inputLabel),
    format: (x) => x.label,
    value: data.find((x) => x.key == "stock")
  });
}

areaChart = {
  // Note the colour change in the origional plots is from stock vs dataStock in other notebook...
  // TODO: Double check this
  if (Area_chart_type.key === "stock") {
    const titles = [
      _lang(nbText.sections.livestockExplosion.chart.variables.stock.tip),
      _lang(nbText.sections.livestockExplosion.chart.labels.year)
    ];
    return buildAreaChart(
      dataStock.map((obj, i) => convertToFloat(obj, "TLU (millons)")),
      titles,
      colorblindData.key
    );
  } else if (Area_chart_type.key === "ghg") {
    const titles = [
      _lang(nbText.sections.livestockExplosion.chart.variables.ghg.tip),
      _lang(nbText.sections.livestockExplosion.chart.labels.year)
    ];
    return buildAreaChart(
      dataGHG.map((obj, i) => convertToFloat(obj, "emissions (MtCo2e)")),
      titles,
      colorblindData.key
    );
  } else if (Area_chart_type.key === "vop") {
    const titles = [
      _lang(nbText.sections.livestockExplosion.chart.variables.vop.tip),
      _lang(nbText.sections.livestockExplosion.chart.labels.year)
    ];
    return buildAreaChart(
      dataVOP.map((obj, i) => convertToFloat(obj, "VOP (billions usd)")),
      titles,
      colorblindData.key,
      true
    );
  }
}

areaDownload = {
  let button;
  let data;
  let filename;

  const fButtonLabel = _lang(
    nbText.sections.livestockExplosion.download.labelFunc
  );
  const buttonLabel = fButtonLabel(Area_chart_type.label);

  if (Area_chart_type.key === "stock") {
    data = await FileAttachment("1_FAO_stocks_years.csv").csv();
    filename = "stock";
  } else if (Area_chart_type.key === "ghg") {
    data = await FileAttachment("1_FAO_ghg_years.csv").csv();
    filename = "ghg";
  } else if (Area_chart_type.key === "vop") {
    data = await FileAttachment("1_FAO_vop_year.csv").csv();
    filename = "vop";
  }

  button = build_download_button_dev(data, buttonLabel, filename);

  return button;
}

dynamicTextQuickInsightsRegion();

{
  const title = _lang(nbText.sections.leversOfChange.title)
  const intro = _lang(nbText.sections.leversOfChange.intro)

  return md`# ${title}

  ${intro}`
}

viewof map_configuration = Inputs.radio(
  new Map([
    [_lang(nbText.sections.leversOfChange.inputs.radio.values.adap), 'adaptation'],
    [_lang(nbText.sections.leversOfChange.inputs.radio.values.adap_mit), 'adaptation_mitigation'],
    [_lang(nbText.sections.leversOfChange.inputs.radio.values.mit), 'mitigation']
  ]),
  {label: _lang(nbText.sections.leversOfChange.inputs.radio.label), value: 'adaptation_mitigation'}
)

viewof num_priorities = {
let num_selector = Inputs.number([1, 42], {label: _lang(nbText.sections.leversOfChange.inputs.num.label), value : 5})

  num_selector.addEventListener('input', (event) => {
  d3.select("#num_countries").html(`${event.target.value}`)
  });


return num_selector
}

create_map(colorblindData.key);

create_map(colorblindData.key).node();

{
  const div = document.createElement("div");
  div.style.display = "flex";
  div.style.flexDirection = "row";

  div.appendChild(
    build_download_button_dev(
      data_categories,
      _lang(nbText.sections.leversOfChange.chart.download.categories),
      "adaptation_mitigation_categories",
      ".download_data_am"
    )
  );
  div.appendChild(
    build_download_button_dev(
      climate,
      _lang(nbText.sections.leversOfChange.chart.download.climate),
      "climate_hazards_per_adaptation",
      ".download_data_am"
    )
  );
  div.appendChild(
    build_download_button_dev(
      emissions,
      _lang(nbText.sections.leversOfChange.chart.download.emissions),
      "emissions_per_animals",
      ".download_data_am",
      "clasetatata"
    )
  );

  return div;
}

viewof country_select = Inputs.select([''].concat(countriesFiltered), {label: _lang(nbText.sections.leversOfChange.livestockProductionSystems.countryInput.label), value: '', format: l => _lang(nbText.general.admin0_ISO3[l])})

{
  const title = _lang(nbText.sections.leversOfChange.insights.title)
  return md`### ${title}`
}

{
  const template = _lang(
    nbText.sections.leversOfChange.insights.investmentPriorities
  );
  const insight = template({
    percAdaptation: initial_data[0].percent,
    percMitigation: initial_data[1].percent,
    countryCount: num_priorities,
    livestockProd: insight_object.vop_text,
    peopleExposed: insight_object.people,
    ggEmissions: insight_object.emissions
  });

  return md`${insight}`;
}

{
  const template = _lang(
    nbText.sections.leversOfChange.insights.mostCritical
  );
  const insight = template({
    lever: _lang(nbText.general.country_article1[insight_object.iso_selected]), 
    percVop: insight_object.per_vop, 
    percEmissions: insight_object.per_emi
  });

  return md`${insight}`;
}

{
  const template = _lang(
    nbText.sections.leversOfChange.insights.countrySystems
  );
  const insight = template({
    first: _lang(nbText.general.lps[insight_object.lps1]),
    second: _lang(nbText.general.lps[insight_object.lps2]),
    third: _lang(nbText.general.lps[insight_object.lps3]),
  });

  return md`${insight}`;
}

{
  const template = _lang(
    nbText.sections.leversOfChange.insights.sigHazard
  );
  const insight = template({
    location: _lang(nbText.general.country_article2[insight_object.iso_selected]),
    hazard: insight_object.top_hazard,
    vop: insight_object.top_haz_vop
  });

  return md`${insight}`;
}

{
  const header = _lang(nbText.sections.leversOfChange.livestockProductionSystems.header)
  const intro = _lang(nbText.sections.leversOfChange.livestockProductionSystems.tableIntro)

  return md`### ${header}

  ${intro}`
}

render_country_table();

{
  const div = document.createElement("div");
  div.style.display = "flex";
  div.style.flexDirection = "row";

  FileAttachment("country_emissions_hazards-4.csv")
    .csv()
    .then((data) => {
      div.appendChild(
        build_download_button_dev(
          data,
          _lang(nbText.sections.leversOfChange.livestockProductionSystems.download.ghg),
          "GHG emissions and exposure",
          ".button_container_ghg",
          "button_download_ghg"
        )
      );
    });

  FileAttachment("3_country_lps_hazards.csv")
    .csv()
    .then((data_lps) => {
      div.appendChild(
        build_download_button_dev(
          data_lps,
          _lang(nbText.sections.leversOfChange.livestockProductionSystems.download.lps_hazards),
          "LPS Hazards",
          ".button_container_ghg",
          "button_download_lps_hazards"
        )
      );
    });

  FileAttachment("3_country_lps_emissions.csv")
    .csv()
    .then((data_lps) => {
      div.appendChild(
        build_download_button_dev(
          data_lps,
          _lang(nbText.sections.leversOfChange.livestockProductionSystems.download.lps_emissions),
          "LPS Emissions",
          ".button_container_ghg",
          "button_download_lps_emissions"
        )
      );
    });

  return div;
}

{
  const title = _lang(nbText.sections.scalableSolutions.title)
  const intro = _lang(nbText.sections.scalableSolutions.intro)

  return md`# ${title}

  ${intro}`
}

viewof solution_Selectors = {
  const title = _lang(nbText.sections.scalableSolutions.table.title);
  return Inputs.form([viewof select_system, viewof select_species], {
    template: (inputs) =>
      html`<h3>${title}</h3><div style="display: flex; gap: 2em;"> ${Object.values(
        inputs
      )}</div>`
  });
}

createSolutionTable(filterSolutions);

build_download_button_dev(
  solutionData,
  _lang(nbText.sections.scalableSolutions.download),
  "Adaptation and mitigation options",
  ".button_container",
);

{
  const title = _lang(nbText.sections.summary.title)
  return md`# ${title}`
}

{
  // summary, based on num countries in 'levers of change'
  
  const iIntro = _lang(nbText.sections.summary.intro);

  const countryListFunc = _lang(nbText.sections.summary.countryListFunc);
  const multiCountryString =
    num_priorities > 1
      ? _lang(nbText.sections.summary.countryListSupport.topStringFunc)({
          num: num_priorities
        })
      : "";
  const topCountry = _lang(
    nbText.sections.summary.countryListSupport.topCountryFunc
  )({
    top: _lang(nbText.general.country_article1[summary_object.firstCountry])
  });
  let countryList = summary_object.countryArray
    .map((d, i) => (i < 4 ? ` **${_lang(nbText.general.country_article1[d])}**` : ""))
    .filter(Boolean)
    .join(", ");
  const followedBy = _lang(nbText.sections.summary.countryListSupport.followedBy);
  countryList =
    summary_object.countryArray.length > 0
      ? `${followedBy} ${countryList}`
      : countryList;
  const severalOthers =
    summary_object.countryArray.length > 4
      ? _lang(nbText.sections.summary.countryListSupport.severalOthers)
      : "";

  const iCountryList = countryListFunc({
    num: num_priorities,
    multiCountryString: multiCountryString,
    topCountryString: topCountry,
    multiString: countryList,
    severalOthersString: severalOthers
  });

  const outroFunc = _lang(nbText.sections.summary.outroFunc);
  const iOutro = outroFunc({
    people: summary_object.sumPopulationMillion.toFixed(0),
    livestock: summary_object.sumVOPBillion.toFixed(0),
    footprint: summary_object.sumGHG.toFixed(2)
  });
  return md`${iIntro} ${iCountryList} ${iOutro}`;
}

html`<section>
  <h1>${_lang(nbText.sections.methods.title)}</h1>
  <div>
    <h3>${_lang(nbText.sections.methods.sections.datasets.title)}</h3>
    <p>${_lang(nbText.sections.methods.sections.datasets.body)}</p>
  </div>
  <div>
    <h4>${_lang(nbText.sections.methods.sections.livestockProdSystems.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.livestockProdSystems.body)}</p>
  </div>
  <div>
    <h4>${_lang(nbText.sections.methods.sections.exposureData.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.exposureData.body)}</p>
  </div>
  <div>
    <h4>${_lang(nbText.sections.methods.sections.hazardData.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.hazardData.body)}</p>
  </div>
  <div>
    <h4>${_lang(nbText.sections.methods.sections.povertyData.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.povertyData.body)}</p>
  </div>
  <div>
    <h4>${_lang(nbText.sections.methods.sections.greenhouseEmissionsData.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.greenhouseEmissionsData.body)}</p>
  </div>
  <div>
    <h4>${_lang(nbText.sections.methods.sections.boundaries.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.boundaries.body)}</p>
  </div>
  <div>
    <h4>${_lang(nbText.sections.methods.sections.adaptationOptions.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.adaptationOptions.body)}</p>
  </div>
  <div>
    <h3>${_lang(nbText.sections.methods.sections.methods.title)}</h3>
    <h4>${_lang(nbText.sections.methods.sections.prioritizationAnalysis.title)}</h4>
    <p>${_lang(nbText.sections.methods.sections.prioritizationAnalysis.body)}</p>
  </div>
  <div>
    <h3>${_lang(nbText.sections.methods.sections.references.title)}</h3>
    <p>${_lang(nbText.sections.methods.sections.references.body)}</p>
  </div>
</section>`;

Appendix

md`### Download Button`;

build_download_button_dev = (data, text, file_name) => {
  const container = DOM.element("div");
  const button = DOM.element("button");
  button.className = "button_download_data";
  button.textContent = text;
  button.onclick = () => download_data(data, file_name);
  container.appendChild(button);
  return container;
};

download_data = (data, file_name) => {
  const csv_file_name = file_name + ".csv";
  const csvContent = convertToCSV(data);
  const blob = new Blob([csvContent], { type: "text/csv" });
  const url = window.URL.createObjectURL(blob);

  const link = document.createElement("a");
  link.href = url;
  link.setAttribute("download", csv_file_name);
  document.body.appendChild(link);

  link.click();

  // Limpiar y revocar el objeto URL creado
  window.URL.revokeObjectURL(url);
  document.body.removeChild(link);
};

convertToCSV = (data) => {
  const csvContent = [];

  // En cabezados del CSV
  const headers = Object.keys(data[0]);

  csvContent.push(headers.join(","));

  // Filas de datos del CSV
  data.forEach((item) => {
    const values = headers.map((header) => item[header]);
    csvContent.push(values.join(","));
  });

  return csvContent.join("\n");
};

md`### Color Blind Helpers`;

color_blind = import("https://cdn.jsdelivr.net/npm/color-blind@0.1.3/+esm");

function getColorBlind(colorBlind) {
  let colorScaleBase = d3[`schemeTableau10`];
  if (colorBlind === "Deuteranopia")
    colorScaleBase = colorScaleBase.map((e) =>
      color_blind.default.deuteranopia(e),
    );
  else if (colorBlind === "Protanopia")
    colorScaleBase = colorScaleBase.map((e) =>
      color_blind.default.protanopia(e),
    );
  else if (colorBlind === "Tritanopia")
    colorScaleBase = colorScaleBase.map((e) =>
      color_blind.default.tritanopia(e),
    );
  return colorScaleBase;
}

function getColorBlind_Input(colorBlind, color) {
  if (colorBlind === "Deuteranopia")
    color = color_blind.default.deuteranopia(color);
  else if (colorBlind === "Protanopia")
    color = color_blind.default.protanopia(color);
  else if (colorBlind === "Tritanopia")
    color = color_blind.default.tritanopia(color);
  return color;
}

function getColorBlindRGB(colorBlind, color) {
  if (colorBlind === "Deuteranopia")
    color = color_blind.default.deuteranopia(color, true);
  else if (colorBlind === "Protanopia")
    color = color_blind.default.protanopia(color, true);
  else if (colorBlind === "Tritanopia")
    color = color_blind.default.tritanopia(color, true);

  return !color.R ? color : `rgb(${color.R}, ${color.G}, ${color.B})`;
}

getColorBlindRGB(colorblindData.key, "#216729");

md`## Livestock Explosion / Area Plot`;

function convertToFloat(obj, i) {
  obj[i] = parseFloat(obj[i]);
  obj["year"] = parseInt(obj["year"]);
  return obj;
}

buildAreaChart = (data, titles, colorBlind = "None", condition = false) => {
  const data_titles = Object.keys(data[0]);

  let plotAreaGraph = Plot.areaY(data, {
    x: data_titles[0],
    y: data_titles[2],
    fill: data_titles[1],
    tip: {
      channels: {
        cat: {
          label: _lang(
            nbText.sections.livestockExplosion.chart.labels.category,
          ),
          value: (d) =>
            _lang(
              nbText.sections.livestockExplosion.chart.legend[
                d.category.replace(" ", "").toLowerCase()
              ],
            ),
        },
      },
      format: {
        x: (d) => d3.format("d")(d).replace(/\D/g, ""),
        cat: true,
        y: true,
        fill: false,
        z: false,
      },
    },
  });

  let chartColor = {
    legend: true,
    range: getColorBlind(colorBlind),
    tickFormat: (label) =>
      _lang(
        nbText.sections.livestockExplosion.chart.legend[
          label.replace(" ", "").toLowerCase()
        ],
      ),
  };

  if (condition) {
    plotAreaGraph = Plot.areaY(data, {
      x: data_titles[0],
      y: data_titles[1],
      fill: true,
      tip: {
        format: {
          x: (d) => d3.format("d")(d).replace(/\D/g, ""),
          z: false,
          fill: false,
        },
      },
    });

    chartColor = {
      range: getColorBlind(colorBlind),
      tickFormat: (label) =>
        _lang(
          nbText.sections.livestockExplosion.chart.legend[
            label.replace(" ", "").toLowerCase()
          ],
        ),
    };
  }
  const plotArea = Plot.plot({
    height: 500,
    width,
    color: chartColor,
    y: {
      label: titles[0],
    },
    x: {
      label: titles[1],
      tickFormat: (d) => d3.format("d")(d).replace(/\D/g, ""),
    },
    marginBottom: 35,
    marginLeft: condition ? 65 : titles[0] == "Emissions" ? 45 : 60,
    marks: [plotAreaGraph, Plot.ruleY([0])],
  });

  return plotArea;
};

async function dynamicTextLivestockExplosion() {
  const boldElement = document.createElement("b");
  boldElement.textContent = `(2010 - 2021)`;

  return Object.assign(
    html`<h1>The livestock explosion</h1><p>The visualization below helps you explore historical <b> ${boldElement.textContent}  </b>trends in livestock population, value of production (VoP), and greenhouse gas (GHG) emissions. These trends give a measure of the rapid pace of growth of the sector, and therefore its importance for people and the environment.</p>`,
  );
}

function dynamicTextQuickInsightsRegion() {
  const maxYearStock = Math.max(...dataStock.map((obj) => parseInt(obj.year)));
  const minYearStock = Math.min(...dataStock.map((obj) => parseInt(obj.year)));

  const lastYearDataStock = dataStock.filter(
    (obj) => parseInt(obj.year) === maxYearStock,
  );
  const firstYearDataStock = dataStock.filter(
    (obj) => parseInt(obj.year) === minYearStock,
  );

  const sumTLULastMillion = lastYearDataStock.reduce(
    (acc, obj) => acc + parseFloat(obj["TLU (millons)"]),
    0,
  );
  const sumTLULastBillion = sumTLULastMillion / 1000;
  const sumTLUFirstMillion = firstYearDataStock.reduce(
    (acc, obj) => acc + parseFloat(obj["TLU (millons)"]),
    0,
  );
  const sumTLUFirstBillion = sumTLUFirstMillion / 1000;

  const percentageIncreaseStock =
    ((sumTLULastBillion - sumTLUFirstBillion) / sumTLUFirstBillion) * 100;

  const maxYearVOP = Math.max(...dataVOP.map((obj) => parseInt(obj.year)));
  const minYearVOP = Math.min(...dataVOP.map((obj) => parseInt(obj.year)));

  const lastYearDataVOP = dataVOP.filter(
    (obj) => parseInt(obj.year) === maxYearVOP,
  );
  const firstYearDataVOP = dataVOP.filter(
    (obj) => parseInt(obj.year) === minYearVOP,
  );

  const sumVOPLastMillion = lastYearDataVOP.reduce(
    (acc, obj) => acc + parseFloat(obj["VOP (millones usd)"]),
    0,
  );
  const sumVOPLastBillion = sumVOPLastMillion / 1000;
  const sumVOPFirstMillion = firstYearDataVOP.reduce(
    (acc, obj) => acc + parseFloat(obj["VOP (millones usd)"]),
    0,
  );
  const sumVOPFirstBillion = sumVOPFirstMillion / 1000;

  const percentageIncreaseVOP =
    ((sumVOPLastBillion - sumVOPFirstBillion) / sumVOPFirstBillion) * 100;

  const maxYearGHG = Math.max(...dataGHG.map((obj) => parseInt(obj.year)));
  const minYearGHG = Math.min(...dataGHG.map((obj) => parseInt(obj.year)));

  const lastYearDataGHG = dataGHG.filter(
    (obj) => parseInt(obj.year) === maxYearGHG,
  );
  const firstYearDataGHG = dataGHG.filter(
    (obj) => parseInt(obj.year) === minYearGHG,
  );

  const sumGHGLast = lastYearDataGHG.reduce(
    (acc, obj) => acc + parseFloat(obj["emissions (MtCo2e)"]),
    0,
  );
  const sumGHGFirst = firstYearDataGHG.reduce(
    (acc, obj) => acc + parseFloat(obj["emissions (MtCo2e)"]),
    0,
  );

  const timesIncreaseGHG = sumGHGLast / sumGHGFirst;

  // insight, translated
  const i = {
    title: _lang(nbText.sections.quickInsightsGeneral.header)({
      selection: _lang(nbText.legends.ssa),
    }),
    livestock: _lang(nbText.sections.livestockExplosion.insights.livestock)({
      selection: _lang(nbText.legends.ssa),
      year: maxYearStock,
      population: sumTLULastBillion.toFixed(0),
      percent: percentageIncreaseStock.toFixed(1),
      yearSince: minYearStock,
    }),
    vop: _lang(nbText.sections.livestockExplosion.insights.vop)({
      selection: _lang(nbText.legends.ssa),
      year: maxYearVOP,
      population: sumVOPLastBillion.toFixed(0),
      percent: percentageIncreaseVOP.toFixed(1),
      yearSince: minYearVOP,
    }),
    ghg: _lang(nbText.sections.livestockExplosion.insights.ghg)({
      mult: timesIncreaseGHG.toFixed(1),
    }),
  };

  return Object.assign(
    html`<h3>${i.title}</h3>
<p>${i.livestock}</p>
<p>${i.vop}</p>
<p>${i.ghg}</p>`,
  );

  //   return Object.assign(
  //     html`<h3>Quick Insights for Sub-Saharan Africa</h3>
  // <p><b>Sub-Saharan Africa’s</b> livestock population in <b>${maxYearStock}</b> is <b>${sumTLULastBillion.toFixed(
  //       0
  //     )} billion</b>, and has grown by <b>${percentageIncreaseStock.toFixed(
  //       1
  //     )}%</b> since <b>${minYearStock}</b></p>
  // <p><b>Sub-Saharan Africa’s</b> value of production in <b>${maxYearVOP}</b> is <b>${sumVOPLastBillion.toFixed(
  //       0
  //     )} billion</b>, and has grown by <b>${percentageIncreaseVOP.toFixed(
  //       1
  //     )}%</b> since <b>${minYearVOP}</b></p>
  // <p>The explosion in livestock numbers comes at the expense of a growth in <b>GHG emissions</b> of <b>${timesIncreaseGHG.toFixed(
  //       1
  //     )}</b> times in the same period</p>`
  //   );
}

md`## Countries as Levers / Map`;

md`### Icons`;

icons = new Object({
  bovine:
    '<svg xmlns="http://www.w3.org/2000/svg" width="45px" height="45px" viewBox="0 0 512 512"><path fill="currentColor" d="M468.958 108.958c-27.507 2.08-48.997 7.94-71.375 22.572c-5.333-2.214-12.62-17.738-16-16c-11.82 6.08-14.892 19.555-4.916 32.817l-59.084 9.916c-24.776 3.341-49.567 4.838-74.187 5.334c1.326 3.832 2.96 7.636 4.812 10.05c5.219 6.802 20.323 6.21 21.07 14.75c1.935 22.098-24.876 47.415-47.056 47.057c-15.401-.248-17.017-28.762-31.604-33.713c-19.097-6.482-41.62 18.77-59.699 9.832c-15.267-7.547-24.992-39.8-27.836-50.41c-10.213-.127-20.327-.142-30.316.035c-12.564.366-22.902 5.645-29.408 14.239c-8.676 11.458-11.652 26.658-13.254 42.925c-1.78 18.057 6.147 53.007 5.517 70.282c-.504 13.85-7.493 11.87-11.912 18.888c-13.52 21.47 8.894 20.83 17.014 5.56c12.482-23.473 4.253-63.11 7.195-92.974c1.855-35.76 10.597-23.937 15.664-24.588c-4.2 13.065-6.21 30.962-7 51.334c6.895-2.342 36.498-11.6 42.73-.174c6.872 12.598-27.802 22.016-23.878 35.819c2.464 8.666 22.95 2.378 24.582 11.238c3.322 18.035-32.13 38.713-42.236 44.209c.812 23.329 1.564 45.567 1.238 65.086H88.91c-4.234-16.543-12.038-49.944-4.06-55.084c21.425-18.091 29.836-37.484 42.732-56.428c8.755 2.556 16.92 4.787 24.782 6.672c3.553.972 7.244 1.771 10.984 2.44c24.859 4.967 61.553 5.678 90.783-.172c3.76 34.12 7.263 68.452 4.602 102.572h28.957c-12.375-26.902-4.263-65.044 13.892-86.27l44.934-33.462c24.881-16.384 42.93-37.996 55.982-63.38c30.402 3.413 57.086 3.29 77.192-.786l12.84-19.55c-24.257-17.857-43.3-36.585-62.948-58.13c10.063-14.533 25.027-22.765 39.375-32.506zm-39.375 54.572a8 8 0 1 1 0 16a8 8 0 0 1 0-16M366.2 183.481c5.029 9.822-26.17 10.808-24.933 21.772c.998 8.847 22.204 3.839 23.53 12.643c3.818 25.373-28.44 53.805-54.08 54.78c-14.262.544-34.902-14.06-32.308-28.093c2.605-14.092 34.551-1.657 40.383-14.748c4.724-10.603-18.352-22.01-12.992-32.307c6.264-12.032 30.364-22.553 41.934-22.646c11.57-.093 15.606 3.347 18.466 8.6zm-26.585 126.346l-34.707 23.96l6.464 69.255h34.414c-11.783-22.454-15.58-55.506-6.171-93.215m-204.561 1.41c-6.047 12.184-14.147 21.97-22.174 31.242c5.97 3.235 11.648 5.414 17.154 6.614c11.218 2.443 21.636.333 29.948-4.408c10.056-5.737 17.521-14.452 24.115-23.368c-14.615-.869-32.96-2.962-49.043-10.08m24.252 52c-8.737 2.585-17.452 3.7-25.566 2.96c5.167 12.624 10.45 24.152 15.824 36.845h28.306c-10.393-18.48-16.148-29.285-18.564-39.805"/></svg>',
  pig: '<svg xmlns="http://www.w3.org/2000/svg" width="40px" height="40px" viewBox="0 0 512 512"><path fill="currentColor" d="m213.705 344.935l2.7 53.87h-26.24l-19.46-55.41zm150.56.33l-.34 4.38l18.15 49.16h24.44l-5.66-56.51a326.16 326.16 0 0 1-36.57 2.97zm32.79-164.08a90.06 90.06 0 0 0 13.05-1.12c51.2-7.62 36.49-49.56 36.49-49.56s-40.36 9-52.83 23.42c.02 0-28.12 27.26 3.31 27.26zm81.85-25.33s-6.81 0-15.92.82a47 47 0 0 1-13.28 22.9a116.55 116.55 0 0 1 7.44 14.09c25.25-9.43 21.79-37.81 21.79-37.81zm11.8 100.18v41.49s-53.15 31.9-134.5 31.9c-2.19 0-4.44-.15-6.67-.2l-5.48 69.58h-19l-24.45-66.86l-162.59-5.87l-9.4 72.73h-22.63s-48.15-101.58-23.18-182.06c-5.55-3.84-11.38-8.17-16.73-12.7c-5.13 2.65-10.26 4.11-15 3.85c-15.76-.85-28.37-12.73-29.78-14.09l11.16-11.46c2.6 2.5 11.21 9.13 19.48 9.57a7.93 7.93 0 0 0 1.7-.11a46.36 46.36 0 0 1-4.59-6.47c-5.65-9.83-7-20.32-3.84-28.79a25.1 25.1 0 0 1 15.94-14.87c11.29-3.81 26.85-3.35 34.75 4.9c2.94 3.07 7.24 9.84 3 20.7c-3.59 9.29-10.85 19.34-19.36 27.12c2.87 2.3 5.94 4.61 9.09 6.87c9.46-20.85 24.84-39.58 48.52-53.76a238.9 238.9 0 0 1 124-34.31a259.14 259.14 0 0 1 120.54 30.12a80.94 80.94 0 0 0-7.77 9.25c-7.6 10.67-9.67 20.49-6.15 29.19c2.85 7 10.23 15.42 29.24 15.42a105 105 0 0 0 15.41-1.3a80.49 80.49 0 0 0 24-7.18c15.75 25.72 17.22 58.67 28 61c12.79 2.72 26.29 6.34 26.29 6.34m-406.69-94.52c.43-1.12 1.05-3.11.32-3.87c-1.32-1.38-4.81-2.26-8.92-2.26a29.18 29.18 0 0 0-9.16 1.42c-3.13 1.05-5.12 2.81-6.09 5.38c-1.46 3.95-.46 9.62 2.75 15.19a36.3 36.3 0 0 0 4.79 6.25c6.66-5.82 13.19-14.04 16.31-22.11m331.14 81.55a9.05 9.05 0 1 0-9.05 9.05a9.05 9.05 0 0 0 9.05-9.05"/></svg>',
  poultry:
    '<svg xmlns="http://www.w3.org/2000/svg" width="40px" height="40px" viewBox="0 0 24 24"><path fill="currentColor" d="M19.886 7.426c.057-.011.126-.018.179-.026a.4.4 0 0 1 .2.049a.061.061 0 0 0 .089-.067c-.02-.063-.049-.138-.065-.19a.144.144 0 0 0-.1-.093a.106.106 0 0 1-.081-.126a.266.266 0 0 1 .049-.108a.762.762 0 0 0 .142-.64a.511.511 0 0 0-.2-.261a.077.077 0 0 1-.02-.115a.233.233 0 0 0 .044-.13a.91.91 0 0 0-.06-.294a.489.489 0 0 1 0-.168c.016-.078-.086-.126-.086-.126s.077-.082 0-.246c-.077-.164-.6-.215-.6-.215s.077-.335-.345-.5c-.341-.13-.613.4-.706.617a.124.124 0 0 1-.142.067a.08.08 0 0 1-.053-.13l.28-.3a.112.112 0 0 0-.041-.179l-.032-.015l.016-.007a.236.236 0 0 0 .146-.3v-.001a.237.237 0 0 0-.142-.145l-.058-.023a.273.273 0 0 1-.138-.126l-.044-.089a.282.282 0 0 0-.268-.145a1.46 1.46 0 0 0-.894.412c-.511.469-.869 2.523-.93 2.928a.25.25 0 0 1-.06.127c-.053.063-.143.167-.268.305a3.734 3.734 0 0 1-1.708 1.027a17.71 17.71 0 0 1-2.3.126a6.685 6.685 0 0 1-2.347-.405c-.538-.314-.997-1.946-1.61-2.552a3.388 3.388 0 0 0-1.559-.811a1.1 1.1 0 0 0-.341-.015a.076.076 0 0 1-.077-.112a1.039 1.039 0 0 0 .073-.138c.008-.048-.069-.167-.069-.167l-.138-.112l-.057-.078l-.155-.048l-.028-.019a.072.072 0 0 0-.1.037l-.045.131s-.1-.2-.167-.168c-.109.056 0 .35 0 .35s-.2-.335-.312-.283c-.2.09.04.521.04.521s-.15-.264-.255-.223c-.053.018 0 .35 0 .35s-.109-.038-.15-.019c-.041.019.045.279.045.279H4.31a.082.082 0 0 0-.077.052l-.016.045l-.073.059a.212.212 0 0 0-.073.2l.016.086l-.021.089l.009.1a1.785 1.785 0 0 0-.313.294a.831.831 0 0 0-.118.457a.415.415 0 0 1 .179-.119l.191-.1a.664.664 0 0 1 .381-.067a.479.479 0 0 0 .065 0h.175a1.275 1.275 0 0 0-.1.361a.574.574 0 0 0 .669.566a.536.536 0 0 0 .39-.257A6.978 6.978 0 0 0 4.952 8.8a4.639 4.639 0 0 0 .921 3.318C7.035 13.6 8.781 13.971 9.2 14.272c.419.301.974.923 1.364 1.131c.345.186.845.729 1.393 1.15a3.7 3.7 0 0 0 .642.431a11.784 11.784 0 0 1-.662 2.065a.278.278 0 0 1-.285.156a5.751 5.751 0 0 0-.836-.022a2.259 2.259 0 0 0-.54.167c-.041.015-.024.067.016.067c.191 0 .483 0 .593.011c0 0 .219.067.223.067c-.032 0-.3.008-.345.012a7.256 7.256 0 0 0-1.218.186a.036.036 0 0 0 .008.07c.2.019.585.056.755.082c.256.041.362.164.63.212a1.689 1.689 0 0 1-.309.164c-.13.03-.312.335-.422.536c-.016.029.02.063.057.048c.227-.119.731-.387.792-.409a5.557 5.557 0 0 1 1.27-.376c.029-.007.078-.019.159-.145c.219.03.463.071.662.108a1.6 1.6 0 0 1-.309.163c-.13.03-.3.324-.418.529a.039.039 0 0 0 .057.048c.2-.115.572-.335.735-.42a6.957 6.957 0 0 1 1.319-.354c.033-.007.094-.026.2-.216a.291.291 0 0 1 .171-.137a1.772 1.772 0 0 1 .426-.108c.09.1.382.1.512.093h.085a.025.025 0 0 0 .02-.041l-.056-.059c0-.008-.143-.153-.248-.253a1.471 1.471 0 0 0-.646-.1c.094-.253.207-.577.333-1.012c.118-.372.224-.748.309-1.075a2.083 2.083 0 0 0 1.027-1.112a2.957 2.957 0 0 0 1.218-2a8.472 8.472 0 0 0-.58-2.392a3.86 3.86 0 0 0 1.266-.4a2.678 2.678 0 0 0 .845-1.715a8.267 8.267 0 0 0 .049-1.034a.218.218 0 0 1 .122-.175a.7.7 0 0 0 .146-.085A2.716 2.716 0 0 1 20.243 8a.067.067 0 0 0 .053-.1a.876.876 0 0 0-.207-.205l-.236-.156a.064.064 0 0 1 .033-.113M14.2 19.041c-.04.09-.2.09-.308.082a5.074 5.074 0 0 0-.861-.022a3.3 3.3 0 0 0-.333.048c.089-.245.585-1.856.682-2.221a4.536 4.536 0 0 0 .755-.457c.285-.264.309-.395.309-.395a1.391 1.391 0 0 0 .451.8a12.607 12.607 0 0 1-.695 2.165"/></svg>',
  shoat:
    '<svg xmlns="http://www.w3.org/2000/svg" width="40px" height="40px" viewBox="0 0 512 512"><path fill="currentColor" d="M392.8 107.5c9.3 5.3 25.8 9.3 40 9.2c7.7-.1 14.6-1.2 19.5-3.2c5-1.8 6.9-4.9 8.9-8.8c-9.2-6.08-22.1-12.27-31.8-12.87c-14.9.53-28.8 8.13-36.6 15.67m-253 20.2c-1.7 5.5-7.9 8.1-13 5.4c-26.5-14.5-50.46-6.9-67.71 8.7c-35.93 32.6-45.13 87.3-32.47 145.7c7.31 33.6 18.99 53 41.29 62.8c0 .1.1.1.15.1c2.22 1 4.21 1.9 6.09 2.8l4.61-22c1.02-4.9 5.8-8 10.66-7s7.98 5.8 6.96 10.7l-23.5 112c4.79 7.2 16.4 1.2 21.3-1.2l38.12-106.5c10.8-9.4 21.2-19 28.7-29.2c6.6-9.1 10.4-18.4 10.6-23.5c.2-5 4.4-8.9 9.4-8.7c5 .2 9 4.6 8.6 9.6c-.6 11.2-6.2 22.4-14 33.2c-7.3 10-16.7 19.6-27.2 27.2l-3.3 8.9c6.9 8.7 13.4 13.8 19.6 16.8c8.8 4.1 17.7 4.6 28.5 3.3c16.4-1.9 34.6-12.9 43.5-37.2c2.8-7.7 13.6-8 16.8-.5c7.7 21.2 36.1 32.6 55.1 24l-3.9-23.3c-.8-4.9 2.5-9.6 7.4-10.4c4.9-.9 9.6 2.5 10.4 7.4l17.6 105.9c9.2 6.3 14.5 2.4 19.9-4.4l-13.8-114.4c-.7-5.3 3.3-10 8.6-10.2c4.8-.2 8.8 3.3 9.3 8l4.3 35.7c5.1-1.2 9.1-2.5 12.4-5c4.3-3.2 8.5-8.7 12.1-21.5c1.7-6 9-8.5 14.1-4.7c13.6 8.3 27.4-1.8 35.6-12.2c12.9-16.5 14.7-42.4 13.2-69.2c-2.1.3-4.2.5-6.3.6c-8.8.5-17.9-.9-25.7-4.4c-12.4-7-22-18.4-28.2-28.9c-3.9-6.8-7.3-13.7-10.5-20c-5.4 9.9-11 23.1-19.2 25c-12.5 2.1-23.9-3.7-29.8-12.7c-5.9-8.9-7.4-20.2-4.8-31.1c2.7-11.7 9.8-38.3 22.6-56.1c2.2-2.9 4.5-5.3 6.8-7.4c-7.5-3.1-16.2-3.8-22.9-3.8c-5.8 0-13.5 1.8-19.7 5c-6.2 3.3-10.7 7.8-12.2 11.8c-3.2 8.5-15.5 7.5-17.3-1.3c-3.8-22.78-53.9-17.8-65.6 2c-3.8 7-14.1 5.9-16.5-1.7c-8.1-22.61-62.7-21.3-66.7 5.9m345-1.5c1.7 16.4 3.5 32.2 4.2 45.6c1.8 6.5 6 18.9 8.7 7.3c.9-4.1.8-11-.4-18.6c-.1-7.1-14.5-47.3-12.5-34.3m-112.7-2.5c-11.9 15-19.2 37.4-23.3 53.7c-.6 5.8-.6 12.6 2.3 17.1c2.3 3.4 4.8 5.2 9.4 5c5.8-9.4 12.1-19.8 15.6-28.2c-1.2-7.9-2.8-19.9-3.6-31.4c-.4-5.8-.6-11.2-.4-16.2m94.4 2.4c-2.4 1.6-4.8 3.1-7.5 4.1c-7.8 3.2-16.8 4.4-26 4.5c-14.8.1-30.2-2.7-42.9-8.4c0 3.6.1 7.7.4 12.3c.9 12.6 3 27.2 4 33.5c10.5 16.6 19.9 44.4 36.8 52.5c5.8 2 11.9 3.1 17.2 2.9c6-.4 10.6-2.6 11.5-3.7c3.5-8 5.9-15.2 7.3-22.3c2.1-10.9 3.4-23.3 3.6-31.6c.3-6.4-.6-13.3-1.1-18.7c-1.4 4.1-5.7 6.6-10 5.9c-4.3-.7-7.5-4.4-7.5-8.8c0-5.1 4.2-9.2 9.3-9c3 0 5.8 1.7 7.4 4.3c-.9-6.1-1.4-12-2.5-17.5m-58.3 16.5c4.9.2 8.7 4.2 8.7 9c0 5-4 9-9 9c-4.9 0-9-4-9-9s4.2-9.1 9.3-9m47.5 48.3c3.7-.1 6.5 1.9 6.5 6.2c0 7.8-5.8 15-12.7 19l-1-23.1c2.5-1.4 5-2.1 7.2-2.1m-24.1 2c1.8-.1 3.9.4 5.8 1.3l3.8 22.5c-6-3.7-15.4-3.6-16.5-16.1c-.5-5.2 2.8-7.7 6.9-7.7m-30.9 164.2c-3.7 5.1-7.6 9.1-12.6 12.1l16.6 62c7.6 1.5 15.9 1 19.2-5.1zm-241.2 33.7l1.5 46.8c7.9 7.9 12.9 4.8 19.7-3l-3.7-39.5c-6.3-.9-12.6-2.2-17.5-4.3"/></svg>',
  "forest loss to pasture":
    '<svg width="40px" height="40px" viewBox="0 0 559 455" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M547.5 131H389.5" stroke="black" stroke-width="23" stroke-linecap="round"/><path d="M427.563 0.938011C279.435 127.053 198.49 333.144 176.313 454.5H253.531C285.128 332.005 304.666 191.006 427.564 0.937012L427.563 0.938011ZM44.375 53.374C96.772 116.17 146.685 185.824 186.469 252.654C193.619 264.667 200.557 276.804 207.279 289.062C215.326 269.35 224.029 249.911 233.374 230.78C181.557 159.55 119.91 95.775 44.374 53.375L44.375 53.374ZM435.563 187.094C383.975 233.592 356.707 301.547 344.969 377.749C358.744 403.584 371.673 429.044 383.905 453.624H423.28C398.03 382.164 411.743 291.264 435.563 187.094ZM33 202.437C105.962 275.697 153.794 391.037 113.094 453.217H158.094C162.588 428.097 169.434 399.584 178.781 368.967C160.338 284.68 97.42 204.927 33 202.44V202.437ZM0.125 290.374C53.145 371.31 61.83 415.34 41.063 452.97H108.563C95.463 380.95 77.119 336.665 0.125 290.375V290.374ZM301.063 335.968C290.413 377.328 281.875 416.405 272.25 454.218H363.97C344.826 415.932 324.051 375.826 301.063 335.968Z" fill="black"/></svg>',
  "forest loss to soy":
    '<svg width="40px" height="40px" viewBox="0 0 72 72" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#clip0_297_267)"><path d="M23.98 40.57C28.548 44.089 38.95 49.85 44.593 51.988C47.791 53.2 54.507 54.605 58.152 55.006C58.817 55.08 59.67 54.977 60.572 54.87C61.606 54.746 63.165 54.561 63.653 54.862C63.807 55.005 64.128 55.67 64.416 56.432C63.646 56.785 62.592 57.292 62.114 57.637C61.733 57.913 61.249 58.295 60.717 58.715C60.03 59.259 59.189 59.923 58.432 60.449C53.535 61.629 47.989 60.298 44.572 58.983C34.665 55.173 25.804 47.837 20.947 42.98C18.057 40.09 15.789 36.86 13.017 32.293V28.463C15.237 31.458 19.9 37.428 23.98 40.57Z" fill="white"/><path d="M25.2002 38.985C25.0782 38.891 24.9532 38.785 24.8302 38.685C25.1878 37.7642 25.8158 36.9732 26.6315 36.4159C27.4471 35.8587 28.4123 35.5614 29.4002 35.563C30.3706 35.5615 31.3198 35.8471 32.1283 36.3838C32.9369 36.9204 33.5686 37.6842 33.9442 38.579C34.0479 38.8229 34.2438 39.0159 34.4892 39.1159C34.7346 39.2159 35.0095 39.2149 35.2542 39.113C35.4091 39.0454 35.544 38.939 35.646 38.8042C35.7479 38.6693 35.8134 38.5105 35.8362 38.343C36.0262 38.9221 36.1369 39.5242 36.1652 40.133C34.955 41.3032 34.1375 42.8198 33.8252 44.474C30.4212 42.55 27.2222 40.543 25.2002 38.985ZM47.0612 50.694C46.3992 50.499 45.7982 50.304 45.3012 50.115C42.7542 49.15 39.2142 47.427 35.7032 45.516C35.9382 42.343 38.5892 39.831 41.8212 39.831C42.8354 39.8304 43.834 40.0812 44.7275 40.5611C45.6211 41.0411 46.3816 41.7351 46.9412 42.581C47.0882 42.8018 47.3169 42.9552 47.5769 43.0075C47.837 43.0598 48.1072 43.0068 48.3282 42.86C48.5227 42.7282 48.6638 42.5313 48.7261 42.3047C48.7885 42.0781 48.7679 41.8368 48.6682 41.624C49.159 42.4036 49.5122 43.2617 49.7122 44.161C48.8699 44.9745 48.2 45.9492 47.7425 47.0271C47.2849 48.105 47.0492 49.264 47.0492 50.435C47.0492 50.522 47.0592 50.607 47.0612 50.694ZM60.3352 52.881C59.5832 52.971 58.8062 53.06 58.3702 53.015C56.0262 52.758 52.2382 52.041 49.1022 51.25C49.0702 50.98 49.0482 50.708 49.0482 50.435C49.0482 46.711 52.0782 43.682 55.8012 43.682C59.5242 43.682 62.5552 46.712 62.5552 50.435C62.5552 51.216 62.4152 51.979 62.1542 52.708C61.5632 52.736 60.9442 52.808 60.3342 52.881M23.2512 37.307C21.4492 35.619 19.6192 33.561 18.0292 31.632C18.523 31.317 19.0955 31.1472 19.6812 31.142C20.4045 31.1431 21.1052 31.3942 21.6647 31.8527C22.2242 32.3112 22.608 32.949 22.7512 33.658C22.7766 33.7868 22.8273 33.9093 22.9001 34.0185C22.973 34.1278 23.0666 34.2216 23.1758 34.2946C23.2849 34.3676 23.4073 34.4183 23.5361 34.444C23.6649 34.4696 23.7974 34.4696 23.9262 34.444C24.1508 34.3977 24.3522 34.2745 24.4957 34.0956C24.6392 33.9167 24.7157 33.6933 24.7122 33.464C24.7502 33.715 24.7892 33.965 24.7892 34.226C24.7892 34.681 24.7032 35.11 24.5852 35.526C24.0471 36.0436 23.5965 36.645 23.2512 37.307Z" fill="white"/><path d="M8.51997 23.86C8.96397 23.565 10.088 23.3 11.36 23.776C12.281 24.12 13.205 24.664 14.105 25.394C14.358 25.6 14.594 25.806 14.807 26.006H12.019C11.7538 26.006 11.4994 26.1114 11.3119 26.2989C11.1243 26.4864 11.019 26.7408 11.019 27.006V31.11L10.067 29.863C9.88397 29.623 9.60197 29.479 9.29897 29.47C8.98297 29.482 8.70697 29.591 8.51097 29.822L7.72397 30.747C7.52697 29.403 7.35697 28.076 7.35697 27.594C7.35697 26.242 7.55997 24.496 8.51997 23.86ZM13.017 34.066V32.173L13.045 32.219V32.312C15.817 36.88 18.085 40.109 20.975 42.999C25.832 47.856 34.692 55.192 44.599 59.002C47.283 60.035 51.279 61.072 55.243 60.9C55.31 60.898 55.377 60.896 55.443 60.892C55.684 60.879 55.923 60.86 56.163 60.837C56.291 60.826 56.42 60.817 56.548 60.802C56.67 60.789 56.791 60.768 56.913 60.752C57.413 60.685 57.908 60.589 58.399 60.477C57.919 60.809 57.474 61.084 57.127 61.233C51.501 63.643 44.393 61.266 42.348 60.479C31.382 56.261 22.292 47.697 19.768 45.173C16.934 42.339 14.745 39.151 12.242 35.028C12.274 35.021 12.306 35.023 12.337 35.013C12.5351 34.9461 12.7073 34.8187 12.8293 34.6488C12.9512 34.479 13.0169 34.2751 13.017 34.066ZM64.53 49.914L64.543 49.922C65.031 50.232 65.783 51.284 66.043 51.885C65.814 51.978 65.623 52.04 65.435 52.098C65.089 52.208 64.733 52.321 64.287 52.584H64.284C64.463 51.8823 64.5544 51.1612 64.556 50.437C64.556 50.261 64.54 50.088 64.53 49.914Z" fill="black"/><path d="M34.8499 38.19C34.3729 37.0577 33.556 36.1015 32.5121 35.4535C31.4682 34.8056 30.2488 34.4979 29.0224 34.573C27.7961 34.6481 26.6233 35.1023 25.6662 35.8728C24.7092 36.6432 24.0151 37.692 23.6799 38.874M47.7569 42.027C46.9098 40.7471 45.6728 39.7743 44.2293 39.2527C42.7858 38.7311 41.2127 38.6885 39.7431 39.1313C38.2736 39.574 36.9858 40.4786 36.0707 41.7107C35.1556 42.9429 34.6619 44.4372 34.6629 45.972M62.9299 53.454C63.396 52.3491 63.5995 51.1511 63.5243 49.9543C63.4492 48.7574 63.0974 47.5943 62.4968 46.5564C61.8961 45.5184 61.0629 44.6339 60.0627 43.9725C59.0624 43.311 57.9223 42.8905 56.7321 42.7441C55.5418 42.5977 54.3339 42.7294 53.2031 43.1288C52.0724 43.5282 51.0497 44.1844 50.2154 45.0459C49.3812 45.9073 48.7581 46.9505 48.3952 48.0935C48.0322 49.2365 47.9394 50.4481 48.1239 51.633" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M13.2701 27.141C15.2621 29.877 20.2601 36.456 24.5731 39.777C29.1831 43.327 39.4901 48.989 44.9301 51.051C48.1191 52.259 54.8551 53.637 58.2441 54.009C59.7141 54.171 62.9031 53.232 64.1611 54.009C64.8641 54.444 65.6411 56.968 65.6411 56.968C65.6411 56.968 63.3531 57.964 62.6811 58.448C61.4091 59.365 58.9461 61.528 57.5041 62.145C52.3271 64.365 45.7841 62.872 41.9721 61.405C32.3561 57.707 23.7571 50.588 19.0421 45.873C16.0841 42.915 13.8051 39.609 10.9071 34.779C10.2281 33.648 9.82712 32.379 9.59512 31.161M6.33711 20.34C6.33711 20.34 5.88712 19.778 5.43812 18.856C4.93512 17.822 4.98811 15.709 4.98811 15.709" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M23.7149 33.463C23.565 32.7135 23.2101 32.0203 22.6897 31.4605C22.1692 30.9008 21.5037 30.4963 20.7671 30.2923C20.0305 30.0882 19.2518 30.0925 18.5175 30.3046C17.7832 30.5168 17.1222 30.9285 16.6079 31.494M63.6169 53.796C63.6169 53.796 64.6029 53.55 64.7219 53.476C65.4549 53.028 65.8579 53.106 66.9109 52.576C67.7099 52.174 65.9819 49.66 65.0609 49.076C64.5969 48.781 63.9909 48.489 63.2849 48.202M11.6899 22.832C12.8579 23.268 13.8839 23.936 14.7159 24.611C16.1759 25.796 17.0409 27.001 17.0409 27.001H11.9999V34.06L9.25293 30.464L7.04893 33.054C7.04893 33.054 6.33693 28.697 6.33693 27.587C6.33693 24.629 7.21193 23.507 7.94693 23.02C8.65893 22.549 10.1029 22.242 11.6889 22.833L11.6899 22.832Z" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M43 26.5C56.2 26.5 60.8333 26.5 61.5 26.5" stroke="black" stroke-width="3" stroke-linecap="round"/></g><defs><clipPath id="clip0_297_267"><rect width="72" height="72" fill="white" transform="matrix(-1 0 0 1 72 0)"/></clipPath></defs></svg>',
});

icons1 = new Object({
  "Tropical livestock units":
    '<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 72 72"><path fill="#fff" d="M15 12.021c0 .612.306 1.183.815 1.522l4.244 2.83c.577.384 1.774.872 1.688 1.56l-1.705 6.728c-.028.224-.014.451.04.67l1.835 7.338a1.8 1.8 0 0 1 .04.67l-.915 7.322c-.028.224-.014.452.04.67l1.747 6.983c.11.442.38.826.76 1.078l1.73 1.154c.434.29.723.749.797 1.264l-.26 3.798s-.292 3.108 2.301 6.05c1.633 1.854 5.715 3.885 8.266 3.885c3.34 0 5.954-1.938 7.395-3.646c.891-1.058 2.54-2.498 3.282-5.825c.201-.902-.1-3.696-.1-3.696c0-.248.401-1.311.499-1.539l1.306-2.508a.574.574 0 0 1 .039-.08c.54-.863.788-1.878.885-2.892c0 0 .904-4.975 1.158-6.64c.005-.033-.5-5.516-.495-5.549l1.55-6.817a1.827 1.827 0 0 0-.019-.698l-1.536-6.913a1.829 1.829 0 0 1 1.341-2.172l1.642-.41a1.83 1.83 0 0 0 1.02-.677l2.244-2.993c.238-.316.366-.701.366-1.097v-.11c0-1.17-1.115-1.144-2.258-.89l-6.19.487c-.36.08-.735.05-1.077-.087l-4.36-1.745a1.819 1.819 0 0 0-.236-.076l-7.362-1.84a1.828 1.828 0 0 0-1.022.039l-5.372 1.79c-.082.028-.162.06-.24.1l-3.41 1.705a1.83 1.83 0 0 1-1 .184l-7.462-.746A1.83 1.83 0 0 0 15 12.022Z"/><path fill="#8d8d8d" d="m65.182 16.575l-3.566.242c-.13.009-.26.035-.383.077l-7.08 2.42a1.518 1.518 0 0 0-.128.05l-2.64 1.18a1.44 1.44 0 0 1-.361.11c-1.374.226-10.173 1.887-10.02 7.265c0 0-.464 3.6 1.951 6.148c1.88 1.982 2.99 4.647 2.52 7.34c-.31 1.776-1.252 3.53-3.47 4.593l2.91 1.022c.43.15.767.489.917.918l1.476 4.22l1.662-1.772c1.114-1.194 1.969-5.874 1.969-5.874a40.135 40.135 0 0 0-.039-11.157s1.26-.965 1.26-.965c.162-.124.346-.213.542-.263l5.563-1.415c.172-.043.334-.117.48-.217l4.302-2.961a1.5 1.5 0 0 0 .443-.478l2.601-4.446a1.5 1.5 0 0 0 .193-.566l.485-3.787a1.497 1.497 0 0 0-1.587-1.684m-58.315 0l3.566.242c.13.009.259.035.383.077l7.08 2.42c.044.015.086.031.127.05l2.641 1.18c.117.053.234.089.361.11c1.374.226 10.173 1.887 10.02 7.265c0 0 .464 3.6-1.952 6.148c-1.88 1.982-2.988 4.647-2.519 7.34c.31 1.776 1.252 3.53 3.47 4.593l-2.91 1.022c-.43.15-.767.489-.917.918l-1.477 4.22l-1.661-1.772c-1.114-1.194-2.041-6.908-2.041-6.908a29.648 29.648 0 0 1 .507-9.482a1.497 1.497 0 0 0-.553-1.507l-.466-.357a1.499 1.499 0 0 0-.632-.283l-6.06-1.144a1.502 1.502 0 0 1-.57-.238l-4.262-2.933a1.498 1.498 0 0 1-.444-.478l-2.6-4.446a1.498 1.498 0 0 1-.193-.566L5.28 18.26a1.497 1.497 0 0 1 1.587-1.684"/><path fill="#bababa" d="m27.32 47.995l-.66 1.131a15.722 15.722 0 0 0-.703 6.741a2.229 2.229 0 0 0 2.01 1.968l.082.007l6.496-.515a19.891 19.891 0 0 1 3.75.058l5.926.654a2.554 2.554 0 0 0 2.064-.712a2.58 2.58 0 0 0 .775-1.723l.048-1.02a13.7 13.7 0 0 0-1.491-6.896a2.602 2.602 0 0 0-2.234-1.415L34.754 46h-3.963c-1.43 0-2.751.76-3.471 1.994"/><path d="M26.162 31.06s-3.048-.22-3.829-1a2 2 0 0 1 2.829-2.829c.78.781 1 3.828 1 3.828"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19.62 26.235l2.037-9.248s-7.68-.627-6.505-7.445c0 0 9.953 3.292 12.775.47c0 0 6.237-6.664 16.195-.043c3.323 2.21 12.775-.47 12.775-.47c1.176 6.818-6.505 7.445-6.505 7.445l2.038 9.248M28.483 46h15.726c.272 0 .532.114.708.321c.847 1 3.144 4.347 2.094 10.297a1.895 1.895 0 0 1-2.203 1.55c-3.476-.64-11.324-1.79-16.76-.326a1.87 1.87 0 0 1-2.343-1.591c-.302-2.511-.315-6.628 2.01-9.868a.945.945 0 0 1 .768-.383"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M29.867 50.277s-.686 2.855 3.154 2.926m-3.893 8.263s6.348 7.916 13.793.314M17.518 20.154c-3.064-1.957-7.38-4.587-12.436-3.342c0 0-1.489 14.029 15.362 15.518l1.213.88s-2.29 8.918 1.262 16.102"/><path d="M45.887 31.014s3.047-.22 3.828-1a2 2 0 1 0-2.828-2.828c-.78.78-1 3.828-1 3.828"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M43.182 50.234s.686 2.855-3.154 2.926m14.746-33.201c3.048-1.888 7.269-4.402 12.192-3.19c0 0 1.49 14.029-15.36 15.518l-1.214.88s2.538 7.978-1.014 15.162"/></svg>',
  "Pasture area":
    '<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 512 512"><path fill="currentColor" d="M166.83 19.52c-28.898.023-61.718 16.366-86.002 55.16c70.773-24.38 69.905 19.077 130.02 36.95c12.785 18.24 21.513 41.086 27.45 72.214c1.056 9.14 1.425 18.935 1.495 29.078c.16 23.53-1.74 48.726-3.072 69.72v.008c-.405 6.982 2.976 17.98 9.282 29.364c2.745 4.956 6.048 9.978 9.584 14.9c2.945-59.286 1.044-113.128 11.27-161.432c7.12-19.412 16.723-35.71 28.833-49.156c67.6-14.804 59.14-58.506 140.966-33.137c-32.607-39-72.186-55.092-104.357-54.516c-43.914.786-74.014 32.628-53.743 79.654c-11.398 13.628-20.738 29.502-27.87 47.6c-5.473-19.157-12.575-35.512-21.55-49.703c14.37-51.287-19.7-86.736-62.307-86.704zm35.234 169.918l-75.488 1.767l-69.416 94.99l72.125 67.22l89.992-8.677l-89.04 36.268l-57.38-54.893l37.702 84.155l110.41 28.816l-99.382-4.197l5.566 12.425L294.17 494.85L422 423.97v-.01l-31.676-45.116l-94.816 42.367l99.135-72.116l28.097 41.947l1.78-79.19l-66.54-78.248l-55.644-12.608l-24.406 36.445l6.95 26.154l-9.353 14.8c-.525 15.73-1.216 31.995-2.38 48.768l23.2 32.524l-36.1 41.71l15.515 31.862l-37.116-35.465l33.95-39.223l-11.094-15.55l-4.88-5.268c-10.016-10.814-19.717-23.594-26.968-36.682c-4.9-8.843-8.81-17.798-10.6-26.716l-18.118-36.536L216.27 217.8l.554-.048z"/></svg>',
  "Rural population":
    '<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 72 72"><path fill="currentColor" d="M54.97 59.042s2-13.993-10-13.993c-3.192 2.128-5.926 3.599-9 3.593h.125c-3.073.006-5.808-1.465-9-3.593c-12 0-10 13.993-10 13.993"/><path fill="currentColor" d="m27.033 45.049l5.803 8.887l3.197-5.294m9-3.593l-5.804 8.887l-3.196-5.294"/><path fill="#7f7f7f" d="M57.912 39.453h5.48v4.245h-5.48z"/><path fill="#8d8d8d" d="M62.652 54.839v-11.1h-4v15.303h4.203v-4.203z"/><path fill="#b2b2b2" d="M22.162 45.09h4.288v13.971h-4.288z"/><path fill="#b2b2b2" d="m49.653 58.205l-27.491-.17v.978h27.491z"/><path fill="#b2b2b2" d="M48.92 45.09h-4.289v13.942h4.289z"/><path fill="#bababa" d="M27.185 16.27V8.068l8.785 1.418l8.785-1.418v8.202"/><path fill="#a6a6a6" d="M27.185 12.854h17.446v2.659H27.185z"/><path fill="#c9c9c9" d="M24.724 24.994a17.756 17.756 0 0 0-.169 5.69l-.473-.523s-4.653-6.851 2.553-13.89h18.213c7.206 7.039 2.554 13.89 2.554 13.89l-5.66-12.625s-1.478 3.806-5.654 3.493c0 0 1.064-4.759-.284-4.759c0 0-5.183 6.217-11.073 8.725"/><path fill="#bfbfbf" d="M41.742 17.536s-1.478 3.806-5.654 3.493c0 0 1.064-4.759-.284-4.759c0 0-5.18 6.212-11.066 8.722c-.015.075-.032.147-.046.222c-.062.344-.11.695-.152 1.048c-.02.167-.046.331-.06.5a17.81 17.81 0 0 0-.077 1.594c0 .45.021.893.054 1.331c.01.14.027.276.04.414c.69 7.003 5.456 12.428 11.245 12.428c5.992 0 10.887-5.815 11.298-13.175z"/><path d="M41.97 26.995a2 2 0 1 1-4.001-.001a2 2 0 0 1 4.001.001m-8 0a2 2 0 1 1-4.001-.001a2 2 0 0 1 4.001.001m2 10.003c-1.152 0-2.304-.287-3.447-.858a1 1 0 1 1 .894-1.79c1.718.86 3.388.86 5.106 0a1 1 0 0 1 .894 1.79c-1.143.571-2.295.858-3.447.858"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="m27.033 45.049l5.803 8.887l3.197-5.294m9-3.593l-5.804 8.887l-3.196-5.294M53.48 23.795s-2.376 15.416 7.085 15.658V23.795m7.085 0s2.376 15.416-7.085 15.658V23.795m-2.653 15.658h5.48v4.245h-5.48zm4.74 18.616v-14.33h-4v14.32"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M54.97 58.05s2-13-10-13c-3.192 2.127-5.926 3.598-9 3.592h.125c-3.073.006-5.808-1.465-9-3.593c-12 0-10 13-10 13m5.067-12.048v12.034m27.491-12.034v12.063"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M27.301 45.305v12.73l17.448-.014V45.284"/><path fill="none" stroke="#000" stroke-miterlimit="10" d="M24.724 24.994a17.756 17.756 0 0 0-.169 5.69l-.473-.523s-4.653-6.851 2.553-13.89h18.213c7.206 7.039 2.554 13.89 2.554 13.89l-5.66-12.625s-1.478 3.806-5.654 3.493c0 0 1.064-4.759-.284-4.759c0 0-5.183 6.217-11.073 8.725"/><path fill="none" stroke="#000" stroke-miterlimit="10" stroke-width="2" d="M24.953 24.994a17.608 17.608 0 0 0-.321 3.362c0 7.828 5.076 14.173 11.338 14.173c5.97 0 10.862-5.767 11.306-13.087"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M45.077 16.27c7.206 7.04 2.553 13.89 2.553 13.89l-5.66-12.624s-1.478 3.806-5.654 3.493c0 0 1.065-4.759-.283-4.759c0 0-5.184 6.217-11.073 8.725"/><path fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" stroke-width="2" d="M24.31 30.16s-4.652-6.85 2.553-13.89m.322 0V8.068l8.785 1.418l8.785-1.418v8.202m-17.57-3.505h17.57M19.513 16.27h32.568"/></svg>',
  "Value of production":
    '<svg xmlns="http://www.w3.org/2000/svg" width="1.25em" height="1em" viewBox="0 0 640 512"><path fill="black" d="M621.16 54.46C582.37 38.19 543.55 32 504.75 32c-123.17-.01-246.33 62.34-369.5 62.34c-30.89 0-61.76-3.92-92.65-13.72c-3.47-1.1-6.95-1.62-10.35-1.62C15.04 79 0 92.32 0 110.81v317.26c0 12.63 7.23 24.6 18.84 29.46C57.63 473.81 96.45 480 135.25 480c123.17 0 246.34-62.35 369.51-62.35c30.89 0 61.76 3.92 92.65 13.72c3.47 1.1 6.95 1.62 10.35 1.62c17.21 0 32.25-13.32 32.25-31.81V83.93c-.01-12.64-7.24-24.6-18.85-29.47M48 132.22c20.12 5.04 41.12 7.57 62.72 8.93C104.84 170.54 79 192.69 48 192.69zm0 285v-47.78c34.37 0 62.18 27.27 63.71 61.4c-22.53-1.81-43.59-6.31-63.71-13.62M320 352c-44.19 0-80-42.99-80-96c0-53.02 35.82-96 80-96s80 42.98 80 96c0 53.03-35.83 96-80 96m272 27.78c-17.52-4.39-35.71-6.85-54.32-8.44c5.87-26.08 27.5-45.88 54.32-49.28zm0-236.11c-30.89-3.91-54.86-29.7-55.81-61.55c19.54 2.17 38.09 6.23 55.81 12.66z"/></svg>',
});

md`### Data`;

data_categories = FileAttachment(
  "adaptation-mitigation-categories-subsahara.csv",
).csv();

hazards = await FileAttachment("country_emissions_hazards-2(1).csv").csv();

emissions = FileAttachment("emissions_per_animals_subsahara.csv").csv();

climate = FileAttachment(
  "2_climate_hazards_per_adapatation_areas_subshara(1).csv",
).csv();

md`### Map`;

d3_geoProj = require("d3-geo-projection");

function map_legend(colorBlind) {
  const legendWidth = 270;
  const legendHeight = 80;
  const padding = 5;

  const legendScale = d3
    .scaleLinear()
    .domain([0.2, 1])
    .range([0, legendWidth - 60]);

  const legendSvg = d3
    .create("svg")
    .attr("width", legendWidth)
    .attr("height", legendHeight)
    .attr("font-size", "10")
    .attr("font-family", "system-ui, sans-serif")
    .attr("font-weight", "bold");

  const gradient = legendSvg
    .append("defs")
    .append("linearGradient")
    .attr("id", "gradient")
    .attr("x1", "0%")
    .attr("y1", "0%")
    .attr("x2", "100%")
    .attr("y2", "0%");

  const text = {
    title: _lang(nbText.sections.leversOfChange.chart.map.legend.title),
    lo: _lang(nbText.sections.leversOfChange.chart.map.legend.lo),
    md: _lang(nbText.sections.leversOfChange.chart.map.legend.md),
    hi: _lang(nbText.sections.leversOfChange.chart.map.legend.hi),
  };

  gradient
    .append("stop")
    .attr("offset", "0%")
    .attr("stop-color", getColorBlindRGB(colorBlind, "#F4BB21"));

  gradient
    .append("stop")
    .attr("offset", "100%")
    .attr("stop-color", getColorBlindRGB(colorBlind, "#EC5A47"));

  legendSvg
    .append("rect")
    .attr("width", legendWidth - 60)
    .attr("height", 10)
    .attr("transform", "translate(30,30)")
    .style("fill", "url(#gradient)");

  legendSvg
    .append("line")
    .attr("x1", 30)
    .attr("y1", 30)
    .attr("x2", 30)
    .attr("y2", 45)
    .style("stroke", "#000")
    .style("stroke-width", 1);

  legendSvg
    .append("text")
    .attr("x", 20)
    .attr("y", legendHeight - 15)
    .text(text.lo);

  legendSvg
    .append("line")
    .attr("x1", legendWidth / 2)
    .attr("y1", 30)
    .attr("x2", legendWidth / 2)
    .attr("y2", 45)
    .style("stroke", "#000")
    .style("stroke-width", 1);

  legendSvg
    .append("text")
    .attr("x", legendWidth / 2)
    .attr("y", legendHeight - 15)
    .attr("text-anchor", "middle")
    .text(text.md);

  legendSvg
    .append("line")
    .attr("x1", legendWidth - 30)
    .attr("y1", 30)
    .attr("x2", legendWidth - 30)
    .attr("y2", 45)
    .style("stroke", "#000")
    .style("stroke-width", 1);

  legendSvg
    .append("text")
    .attr("x", legendWidth - 40)
    .attr("y", legendHeight - 15)
    .text(text.hi);

  legendSvg
    .append("text")
    .attr("x", legendWidth / 2)
    .attr("y", 25)
    .attr("text-anchor", "middle")
    .text(text.title);

  return legendSvg.node();
}

world = FileAttachment("africa_50m-1.json").json();

initial_data ={
  if( map_configuration === "adaptation_mitigation"){
    d3.select("#per_adap").html(`50%`)
    d3.select("#per_miti").html(`50%`)
   return [
  {
    percent: 50,
    color: "#C51617",
    name: "Adaptation"
  },
  {
    percent: 50,
    color: "#5651FF",
    name: "Mitigation",
    last: true
  }
]
  } else if (map_configuration === "adaptation"){
    d3.select("#per_adap").html(`100%`)
    d3.select("#per_miti").html(`0%`)
    return [
  {
    percent: 100,
    color: "#C51617",
    name: "Adaptation"
  },
  {
    percent: 0,
    color: "#5651FF",
    name: "Mitigation",
    last: true
  }
]
  } else {
    d3.select("#per_adap").html(`0%`)
    d3.select("#per_miti").html(`100%`)
    return [
  {
    percent: 0,
    color: "#C51617",
    name: "Adaptation"
  },
  {
    percent: 100,
    color: "#5651FF",
    name: "Mitigation",
    last: true
  }
]
  }
}

filterCountries1 = (mode, combined, composite, count, name) => {
  if (mode)
    return data_categories
      .filter((d) => {
        return composite.adaptation === "" || composite.mitigation === ""
          ? true
          : d.adaptation_cat === composite.adaptation &&
              d.mitigation_cat === composite.mitigation;
      })
      .map((d) => {
        return d.ISO3;
      });
  else {
    return data_categories
      .sort((a, b) => {
        if (combined[0].percent === 0) {
          return b.mitigation_index - a.mitigation_index;
        } else if (combined[0].percent === 100) {
          return b.adaptation_index - a.adaptation_index;
        } else {
          const prop = `${combined[0].percent}ada-${combined[1].percent}mit`;
          return b[prop] - a[prop];
        }
      })
      .map((d) => {
        return name ? d.country : d.ISO3;
      })
      .slice(0, count || -1);
  }
};

getTrafficLight = (name) => {
  const countryData = data_categories.find((d) => d.ISO3 === name);
  return countryData ? parseInt(countryData.traffic_light) : 0;
};

colors = [
  //low mitigation / low adaptation, middle mitigation / low adaptation, high mitigation / low adaptation
  "#B22222",
  "#FF0000",
  "#FFE800",
  //low mitigation / middle adaptation, middle mitigation / middle adaptation, high mitigation / middle adaptation
  "#FF0000",
  "#FFE800",
  "#3CB371",
  //low mitigation / high adaptation, middle mitigation / high adaptation, high mitigation / high adaptation
  "#FFE800",
  "#3CB371",
  "#008000",
];

color1 = {
  return (value, select, mode) => {
    //Makes features with null values black
    if (!value || !mode ) return "#EFEFEF";
    //Defines color's relationship to the variables
    return getColorBlind(select, colors[value - 1]);
  };
}

getTooltipContents = (d, colorBlind) => {
  function showAttributes(group, data) {
    var atributos = "";
    for (var atributo in group) {
      let unidad;

      switch (atributo) {
        case "Rural population":
          unidad = _lang(
            nbText.sections.leversOfChange.chart.map.tooltip.data.hazards
              .popRural.unit,
          );
          break;
        case "Value of production":
          unidad = _lang(
            nbText.sections.leversOfChange.chart.map.tooltip.data.hazards.vop
              .unit,
          );
          break;
        case "Tropical livestock units":
          unidad = _lang(
            nbText.sections.leversOfChange.chart.map.tooltip.data.hazards.tlu
              .unit,
          );
          break;
        case "Pasture area":
          unidad = _lang(
            nbText.sections.leversOfChange.chart.map.tooltip.data.hazards
              .pastureArea.unit,
          );
          break;
        default:
          unidad = _lang(
            nbText.sections.leversOfChange.chart.map.tooltip.data.emissions
              .unit,
          );
      }

      const filterData = data.find(
        (country) => country.ISO3 === d.properties.iso_a3,
      );
      const perc = filterData[atributo + "_perc"]
        ? filterData[atributo + "_perc"]
        : 0;
      const value = filterData[atributo] ? filterData[atributo] : 0;
      const deg = perc * 3.6 + "deg";
      //atributo[0].toUpperCase() + atributo.slice(1)
      atributos += `<div class="icon-item">
          <div style="position: relative;">
            <div class="progress" style="--p:${deg}"></div>
            ${group[atributo]}
          </div>
          <span>${td.leversChangeMap?.[atributo]}: <br/>${value}
            <span style="font-size: 9px;">(${unidad})</span>
          </span>
        </div>`;
    }
    return atributos;
  }

  const headers = {
    hazards: _lang(
      nbText.sections.leversOfChange.chart.map.tooltip.headers.hazards,
    ),
    emissions: _lang(
      nbText.sections.leversOfChange.chart.map.tooltip.headers.emissions,
    ),
  };
  console.log("attrData:", d);
  return html`<div>
      <h3 style="padding-top: 4px;">${_lang(nbText.general.admin0_ISO3[d.properties.iso_a3])}</h3>
      <div class="content-wrapper-adaptation">
        <div class="icons-emissions">
          <label>${headers.hazards}:</label>
          ${showAttributes(icons1, hazards)}
        </div>
        <div class="icons-emissions">
          <label>${headers.emissions}:</label>
          ${showAttributes(icons, emissions)}
        </div>
      </div>
    </div>`;
};

countriesFiltered = filterCountries1(false, initial_data, NaN, num_priorities);

function create_map(colorBlind) {
  const width = 1000;
  const height = 700;
  const padding = 10;

  // Projection & path
  const projection = d3.geoMercator();
  const path = d3.geoPath().projection(projection);

  projection.fitExtent(
    [
      [padding, padding],
      [width - padding, height - padding],
    ],
    world,
  );

  // Root container
  const root = d3.create("div").style("position", "relative");

  const figure = root.append("figure").attr("id", "svg_contain");

  // Legend
  figure
    .append(() => map_legend(colorBlind))
    .attr("transform", "translate(10,0)");

  // SVG map
  const svg = figure
    .append("svg")
    .attr("viewBox", [0, 0, width, height])
    .attr("id", "svg_map");

  // Tooltip
  const tooltip = root
    .append("div")
    .attr("class", "cooltip")
    .style("position", "absolute")
    .style("pointer-events", "none")
    .style("display", "none");

  // Countries
  svg
    .append("g")
    .attr("stroke", "white")
    .attr("stroke-linejoin", "round")
    .selectAll("path")
    .data(world.features)
    .join("path")
    .attr("d", path)
    .attr("fill", (d) => {
      const index = countriesFiltered.indexOf(d.properties.iso_a3);
      if (index === -1) {
        return getColorBlindRGB(colorBlind, "#EFEFEF");
      }

      const fillScale = d3
        .scaleLinear()
        .domain([0, countriesFiltered.length])
        .range(["#EC5A47", "#F4BB21"]);

      return getColorBlindRGB(colorBlind, fillScale(index));
    })

    // ─────────────────────────────
    // Mouse events (D3 v6+)
    // ─────────────────────────────
    .on("mouseover", function (event, d) {
      if (!countriesFiltered.includes(d.properties.iso_a3)) return;

      tooltip.style("display", "block").html("");
      tooltip.node().appendChild(getTooltipContents(d, colorBlind));

      d3.select(this).attr("stroke", "black").raise();
    })

    .on("mousemove", function (event, d) {
      if (!countriesFiltered.includes(d.properties.iso_a3)) return;

      const [x, y] = d3.pointer(event, root.node());

      const tooltipWidth = tooltip.node().offsetWidth;
      const screenWidth = window.innerWidth;
      const isSmallScreen = screenWidth <= 600;

      const left = isSmallScreen
        ? 20
        : x + tooltipWidth > screenWidth
          ? x - tooltipWidth - 20
          : x + 20;

      tooltip.style("left", `${left}px`).style("top", `${y + 20}px`);
    })

    .on("mouseout", function () {
      tooltip.style("display", "none");

      d3.select(this).attr("stroke", null).lower();
    });

  console.log("root node:", root.node());

  return root.node();
}

md`### Dynamic Insight and Table`;

data_climate_hazards = FileAttachment(
  "2_climate_hazards_per_adapatation_areas_subshara(2).csv",
).csv();

data_ghg = FileAttachment("country_emissions_hazards-4.csv").csv();

data_lps_top = FileAttachment("3_quickinsights_sort_lps_country.csv").csv();

data_lps_hazards = FileAttachment("3_country_lps_hazards.csv").csv();

data_lps_emissions = FileAttachment("3_country_lps_emissions-1(1).csv").csv();

data_lps = FileAttachment("LPS-2.csv").csv();

insight_object = {
  const totalEmissions = 566.1;
  const totalVop = 22785.2;
  const dataIni = data_ghg.map(obj => ({ ...obj }));
  let dataTable = dataIni
  const countryFilter = countriesFiltered
  const selectedValue = country_select !== ""? dataIni.filter((d) => d.ISO3 === country_select)[0].country : undefined
  
  let totalData = {
      country: 'Total',
      "direct_emissions (Mt C02e)": 0,
      "indirect_emission(Mt C02e)": 0,
      "total_emissions(Mt C02e)": 0,
      "rural_pop (Millions)": 0,
      "VOP(Millons usd)": 0,
      "TLU(Millons)": 0,
      "Pasture_area(Millions Ha)": 0
  };
  
  if(countryFilter.length > 0){
    dataTable = []
    countryFilter.forEach(name => {
      const filteredData = dataIni.filter(ghg => ghg.ISO3 === name);
      dataTable = dataTable.concat(filteredData);
    });
  }
  
  dataTable.forEach(entry => {
    delete entry.ISO2;
    // delete entry.ISO3;

    for (const key in entry) {
        if (key !== 'country' && entry[key] && entry[key] !== "-") {
            totalData[key] += parseFloat(entry[key]);
        }
    }
   });

  dataTable.push(totalData);
  
  const countrySelect = selectedValue ? dataTable.find(country => country.country === selectedValue) : dataTable[0]

  const hazardTop = getTopHazards(dataTable[0])
  const top_country = hazardTop.country
  console.log(hazardTop)
  const top_hazard = _lang(nbText.sections.leversOfChange.insights.hazard_defs[hazardTop.climate_hazards])
  const top_haz_vop = parseFloat(hazardTop.value).toFixed(1) //USD Billion VoP`

  const LPStop = getTopLPS(countrySelect)

  const lps1 = LPStop[0].lps
  const lps2 = LPStop[1].lps || ""
  const lps3 = LPStop[2].lps || ""

  const vop_text = (totalData["VOP(Millons usd)"] / 1000 ).toFixed(1) // billion USD
  const people = totalData["rural_pop (Millions)"].toFixed(0) // million
  const emissions = totalData["total_emissions(Mt C02e)"].toFixed(0) //MT CO2e
  const country_selected = countrySelect.country
  const iso_selected = countrySelect.ISO3
  const per_vop = ((countrySelect["VOP(Millons usd)"]/totalVop)*100).toFixed(0) //%
  const per_emi = ((countrySelect["total_emissions(Mt C02e)"]/totalEmissions)*100).toFixed(0) // %

  return {
    top_country: top_country,
top_hazard: top_hazard,
top_haz_vop: top_haz_vop,
lps1: lps1,
lps2: lps2,
lps3: lps3,
vop_text: vop_text,
people: people,
emissions: emissions,
country_selected: country_selected,
iso_selected: iso_selected,
per_vop: per_vop,
per_emi: per_emi
  }
}

dataTable_dev = {
    const totalEmissions = 566.1;
  const totalVop = 22785.2;
  const dataIni = data_ghg.map(obj => ({ ...obj }));
  let dataTable = dataIni
  const countryFilter = countriesFiltered
  const selectedValue = country_select !== ""? dataIni.filter((d) => d.ISO3 === country_select)[0].country : undefined
  
  let totalData = {
      country: 'Total',
      ISO3: "TOTAL",
      "direct_emissions (Mt C02e)": 0,
      "indirect_emission(Mt C02e)": 0,
      "total_emissions(Mt C02e)": 0,
      "rural_pop (Millions)": 0,
      "VOP(Millons usd)": 0,
      "TLU(Millons)": 0,
      "Pasture_area(Millions Ha)": 0
  };
  
  if(countryFilter.length > 0){
    dataTable = []
    countryFilter.forEach(name => {
      const filteredData = dataIni.filter(ghg => ghg.ISO3 === name);
      dataTable = dataTable.concat(filteredData);
    });
  }
  
  dataTable.forEach(entry => {
    delete entry.ISO2;
    // delete entry.country;

    for (const key in entry) {
        if (key !== 'country' && key !== 'ISO3' && entry[key] && entry[key] !== "-") {
            totalData[key] += parseFloat(entry[key]);
        }
    }
   });

  dataTable.push(totalData);
  return dataTable
}

render_country_table = () => {
  const selectedValue =
    country_select !== ""
      ? data_ghg.filter((d) => d.ISO3 === country_select)[0].country
      : undefined;
  let table;
  if (!selectedValue) {
    table = doble_tittle_table(dataTable_dev);
  } else {
    const countrySelect = selectedValue
      ? dataTable_dev.find((country) => country.country === selectedValue)
      : dataTable_dev[0];

    const lps_hazards = data_lps_hazards.filter(
      (d) => d.country === countrySelect.country,
    );
    const lps_emissions = data_lps_emissions.filter(
      (d) => d.country === countrySelect.country,
    );
    table = doble_tittle_table1(lps_emissions, lps_hazards);
  }
  table.classList.add(".table");

  //   const style = document.createElement("style");
  // style.innerHTML = `
  //     thead {
  //       color: green !important;
  //     }
  //   `;

  //   table.appendChild(style);

  return table;
};

getTopHazards = (country) => {
  const dataFilter = data_climate_hazards.filter(
    (lps) => lps.country == country.country && lps.variable == "Value",
  );

  let maxIndex = 0;
  let maxValueProp = parseFloat(dataFilter[0].value_prop);
  for (let i = 1; i < dataFilter.length; i++) {
    const currentValueProp = parseFloat(dataFilter[i].value_prop);
    if (currentValueProp > maxValueProp) {
      maxIndex = i;
      maxValueProp = currentValueProp;
    }
  }
  const hazardTop = dataFilter[maxIndex];

  return hazardTop;
};

getTopLPS = (country) => {
  const dataFilter = data_lps_top.filter(
    (lps) => lps.country == country.country,
  );

  return dataFilter;
};

hazards_descrip = new Object({
  Thi: "Livestock heat stress",
  RF: "Extreme or high rainfall variability",
  D: "Drought",
  F: "Flooding",
  CV: "Rainfall variability",
  ExCV: "Extremely high rainfall variability",
  HCV: "High rainfall variability",
  "CV+D": "Rainfall variability and drought",
  "CV+D+F": "Rainfall variability, drought and flooding",
  "CV+F": "Rainfall variability and flooding",
  "CV+Thi": "Rainfall variability and livestock heat stress",
  "CV+Thi+D": "Rainfall variability, livestock heat stress and drought",
  "CV+Thi+D+F":
    "Rainfall variability, livestock heat stress, drought and flooding",
  "CV+Thi+F": "Rainfall variability, livestock heat stress and flooding",
  "D+F": "Drought and flooding",
  "Thi+D": "Livestock heat stress and drought",
  "Thi+D+F": "Livestock heat stress, drought and flooding",
  "Thi+F": "Livestock heat stress and flooding",
});

lps_descrip = new Object({
  MIA: "Mixed irrigated arid",
  MIH: "Mixed irrigated humid",
  MIT: "Mixed irrigated temperate",
  MIY: "Mixed irrigated hyperarid",
  MRA: "Mixed rainfed arid",
  MRH: "Mixed rainfed humid",
  MRT: "Mixed rainfed temperate",
  MRY: "Mixed rainfed hyperarid",
  LGA: "Rangelands arid",
  LGH: "Rangelands humid",
  LGT: "Rangelands temperate",
  LGY: "Rangelands hyperarid",
});

mapping_lps = new Object({
  "Mixed irrigated": ["MIA", "MIH", "MIT", "MIY"],
  "Mixed rainfed": ["MRA", "MRH", "MRT", "MRY"],
  Rangelands: ["LGA", "LGH", "LGT", "LGY", "Other"],
});

table_titles = [
  _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .emissionsDirect,
  ),
  _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .emissionsIndirect,
  ),
  _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .emissionsTotal,
  ),
  _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .popRural,
  ),
  _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers.vop,
  ),
  _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers.tlu,
  ),
  _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .pastureArea,
  ),
];

createHtmlTable = (title) => {
  const tableContainer = d3
    .create("div")
    .attr("id", "table_container")
    .style("overflow", "auto")
    .style("max-height", "900px")
    .style("margin-top", "10px");

  const headerGhg = _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .ghgEmissions,
  );
  const headerExposure = _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .climateExposure,
  );

  tableContainer.html(`<table id="main_table">
    <thead style="position: sticky;top: 0;z-index: 1;">
      <tr id="first_head">
        <th rowspan="2" style="width: 150px;"><h3>${title}</h3></th>
        <th colspan="3"><h3>${headerGhg}</h3></th>
        <th colspan="4"><h3>${headerExposure}</h3></th>
      </tr>
      <tr id="second_head">
      </tr>
    </thead>
    <tbody class="body">
    </tbody>
  </table>`);

  const tabla = tableContainer.select("#main_table");

  tabla
    .select("#second_head")
    .selectAll("th")
    .data(table_titles)
    .enter()
    .append("th")
    .append("h4")
    .text((d) => d);

  return tableContainer.node();
};

doble_tittle_table = (data) => {
  const tableName = _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .country,
  );

  createHtmlTable(tableName);

  const tableNode = createHtmlTable(tableName);

  // const tabla = d3.select("#main_table");
  const tabla = d3.select(tableNode);

  // const tabla = d3.select("#main_table");

  if (data.length > 0) {
    const tooltip = d3
      .select("body")
      .append("div")
      .style("opacity", 0)
      .style("position", "absolute")
      .style("background-color", "white")
      .style("padding", "10px 15px")
      .style("box-shadow", "rgba(149, 157, 165, 0.2) 0px 8px 24px")
      .style("border-radius", "12px")
      .style("z-index", 100)
      .style("font-size", "16px");

    tabla
      .select(".body")
      .selectAll("tr")
      .data(data)
      .enter()
      .append("tr")
      .on("mouseover", function (event, d) {
        const country = d.country;
        if (country !== "Total") {
          const filteredData = data_lps.filter(
            (obj) => obj.country === country,
          );

          tooltip
            .style("opacity", 1)
            .style("display", "block")

            .style("position", "fixed")
            .style("left", `${event.pageX + 10}px`)
            .style("top", `${event.pageY}px`)
            .style("box-shadow", "rgba(149, 157, 165, 0.2) 0px 8px 24px");

          if (filteredData.length > 0) {
            const lps_data = filteredData[0].LSP.split(",")
              .map((v) => _lang(nbText.general.lps[v]))
              .join(", ");
            const constraints =
              `<strong>${_lang(nbText.general.admin0_ISO3[d.ISO3])}</strong><br><strong>${_lang(nbText.sections.leversOfChange.livestockProductionSystems.table.headers.livestockSystem)}</strong><br>` +
              `${lps_data}<br>`;

            tooltip.html(constraints);
          }
        }
      })
      .on("mouseout", function () {
        tooltip
          .style("opacity", 0)
          .style("display", "none")
          .style("box-shadow", "0")
          .html("");
      })
      .on("mousemove", function (event, d) {
        tooltip
          .style("left", `${event.pageX + 10}px`) // Adjust tooltip position
          .style("top", `${event.pageY}px`);
      })
      .selectAll("td")
      .data((d) => Object.values(d).slice(1, 9))
      .enter()
      .append("td")
      .text((d) =>
        !isNaN(parseFloat(d))
          ? parseFloat(d).toFixed(1)
          : _lang(nbText.general.admin0_ISO3[d]) || "-",
      );
  }

  return tableNode;
};

doble_tittle_table1 = (lps_emissions, lps_hazards) => {
  const tableName = _lang(
    nbText.sections.leversOfChange.livestockProductionSystems.table.headers
      .livestockSystem,
  );
  const tableNode = createHtmlTable(tableName);

  // const tabla = d3.select("#main_table");
  const tabla = d3.select(tableNode);
  // const tabla = d3.select("#main_table");

  const body = tabla.select(".body");
  const tooltip = d3
    .select("body")
    .append("div")
    .style("opacity", 0)
    .style("position", "absolute")
    .style("background-color", "white")
    .style("padding", "10px 15px")
    .style("box-shadow", "rgba(149, 157, 165, 0.2) 0px 8px 24px")
    .style("border-radius", "12px")
    .style("z-index", 100)
    .style("font-size", "16px");

  function format(str) {
    if (str !== "0" && str.trim() !== "") {
      let numero = parseFloat(str);
      if (!isNaN(numero)) {
        if (numero < 0.05) {
          return "< 0.05";
        } else {
          return numero.toFixed(2);
        }
      } else {
        return "NaN";
      }
    } else {
      return "0";
    }
  }

  let tableBody = "";

  for (const key in mapping_lps) {
    tableBody += `<tr><td colspan="8"><strong>${_lang(nbText.general.lps[key])}</strong></td></tr>`;

    mapping_lps[key].forEach((code) => {
      const emissions = lps_emissions.find((item) => item.lps === code) || {};
      const hazards = lps_hazards.find((item) => item.lps === code) || {};

      tableBody += `<tr id=${code}><td>${_lang(nbText.general.lps[code])}</td>`;
      tableBody += `<td>${
        emissions.direct_emissions ? format(emissions.direct_emissions) : "-"
      }</td>`;
      tableBody += `<td>${
        emissions.indirect_emissions
          ? format(emissions.indirect_emissions)
          : "-"
      }</td>`;
      tableBody += `<td>${
        emissions.total_emissions ? format(emissions.total_emissions) : "-"
      }</td>`;
      tableBody += `<td>${
        hazards["rural_pop (millons)"]
          ? format(hazards["rural_pop (millons)"])
          : "-"
      }</td>`;
      tableBody += `<td>${
        hazards["VOP (millos usd)"] ? format(hazards["VOP (millos usd)"]) : "-"
      }</td>`;
      tableBody += `<td>${
        hazards["TLU (millons))"] ? format(hazards["TLU (millons))"]) : "-"
      }</td>`;
      tableBody += `<td>${
        hazards["pasture_area (millons)"]
          ? format(hazards["pasture_area (millons)"])
          : "-"
      }</td></tr>`;
    });
  }

  body.html(tableBody);

  body
    .selectAll("tr")
    .on("mouseover", function (event) {
      const id = d3.select(this).attr("id");
      if (id && id !== "Other") {
        tooltip
          .style("opacity", 1)
          .style("display", "block")
          .style("left", `${event.pageX + 10}px`)
          .style("top", `${event.pageY}px`);
        tooltip.html(`<strong>${_lang(nbText.general.lps[id])}</strong>`);
      }
    })
    .on("mouseout", function () {
      tooltip.style("opacity", 0).style("display", "none");
    })
    .on("mousemove", function (event) {
      tooltip
        .style("left", `${event.pageX + 10}px`) // Adjust tooltip position
        .style("top", `${event.pageY}px`);
    });

  return tableNode;
};

md`## Solution Table`;

dataOption = {
  if (language.key === "en"){  
    return FileAttachment("4_livestock_prod_system_priority_countries-5.csv").csv()
} else if (language.key === "fr"){  
    return FileAttachment("french_livestock_prod_system_priority_countries.csv").csv()}
}

filterSolutions = {
   let  select_species_notebook = solution_Selectors[1]
   let  select_system_notebook = solution_Selectors[0]
  let filteredData = dataOption;

  // Verificar si al menos una opción está seleccionada en select_species_notebook
  const speciesSelected = select_species_notebook && select_species_notebook.length > 0;

    console.log(speciesSelected)
  // Verificar si al menos una opción está seleccionada en select_system_notebook
  const systemsSelected = select_system_notebook && select_system_notebook.length > 0;

    console.log(systemsSelected)
  // Filtrar los datos solo si al menos una opción está seleccionada en uno de los select
  if (speciesSelected && systemsSelected) {
    if (systemsSelected) {
      filteredData = filteredData.filter(d => {
        return select_system_notebook.every(s => d[_lang(solution_table_columns_translations.system)].includes(s));
      });
    }

    if (speciesSelected) {
      filteredData = filteredData.filter(d => {
        return select_species_notebook.every(s => d[_lang(solution_table_columns_translations.species)].includes(s));
      });
    }
  } else {
    // Si no hay opciones seleccionadas, mantener los datos sin filtrar
    filteredData ={};
  }
    return filteredData
}

getLivestockSystem = () => {
  let livestockSystemArray = [];
  dataOption.forEach((d) => {
    const systems = d[_lang(solution_table_columns_translations.system)]
      .split(",")
      .map((s) => s.trim()); // Divide por comas y quita espacios en blanco
    livestockSystemArray.push(...systems); // Agrega todos los sistemas al arreglo
  });
  livestockSystemArray = Array.from(new Set(livestockSystemArray)); // Elimina duplicados
  livestockSystemArray = livestockSystemArray.filter((item) => item !== "");

  return livestockSystemArray;
};

getSpecies = () => {
  let speciesArray = [];
  dataOption.forEach((d) => {
    const species = d[_lang(solution_table_columns_translations.species)]
      .split(",")
      .map((s) => s.trim()); // Divide por comas y quita espacios en blanco
    speciesArray.push(...species); // Agrega todos los sistemas al arreglo
  });
  speciesArray = Array.from(new Set(speciesArray)); // Elimina duplicados
  speciesArray = speciesArray.filter((item) => item !== "");

  return speciesArray;
};

createSolutionTable = (filteredData) => {
  // Seleccionar el contenedor de tabla
  const tableContainer = d3
    .create("div")
    .attr("id", "table_container")
    // .style("overflow", "auto")
    // .style("max-height", "727px")
    .style("margin-top", "10px"); //.select("#table_container_options");

  // Si el contenedor no existe, crear uno nuevo
  if (tableContainer.empty()) {
    tableContainer = d3
      .select("#table_options")
      .append("div")
      .attr("id", "table_container_options");
  } else {
    // Vaciar el contenido anterior del contenedor
    tableContainer.html("");
  }

  // Crear la tabla dentro del contenedor
  const table = tableContainer.append("table");

  // Encabezados de la tabla
  const headers = [
    _lang(nbText.sections.scalableSolutions.table.headers.option),
    _lang(nbText.sections.scalableSolutions.table.headers.priority),
    _lang(nbText.sections.scalableSolutions.table.headers.description),
  ];
  table
    .append("thead")
    .append("tr")
    .selectAll("th")
    .data(headers)
    .enter()
    .append("th")
    .text((d) => d);
  // Verificar si filteredData está vacío
  if (Object.keys(filteredData).length === 0) {
    const noDataMessage = table
      .append("tbody")
      .append("tr")
      .append("td")
      .attr("colspan", 3) // Colspan para ocupar todas las columnas
      .text(
        "We could not find information for the values you selected. Please try with other parameters",
      );
    return; // Terminar la función si no hay datos
  }
  // Filas de la tabla
  const rows = table
    .append("tbody")
    .selectAll("tr")
    .data(filteredData)
    .enter()
    .append("tr");

  // Celdas de la tabla
  rows
    .selectAll("td")
    .data((d) => [
      d.Option,
      d[_lang(solution_table_columns_translations.priority)],
      d[_lang(solution_table_columns_translations.description)],
    ])
    .enter()
    .append("td")
    .html(function (d) {
      // Verificar si la descripción contiene un hipervínculo
      if (/<a\s+(?:[^>]*?\s+)?href=(["'])(.*?)\1/i.test(d)) {
        return d; // Si contiene un hipervínculo, mantenerlo como está
      } else {
        // Si no contiene un hipervínculo, agregar etiqueta <a> si es necesario
        return d.replace(
          /\b(https?:\/\/\S+)/gi,
          '<a href="$1" target="_blank">$1</a>',
        );
      }
    });
  return tableContainer.node();
};

solutionData = FileAttachment(
  "adaptation-mitigation-options-with-constraints-4.csv",
).csv();

solution_table_columns_translations = new Object({
  species: { en: "Species for which suitable", fr: "Espèces appropriées" },
  system: { en: "Systems where suitable", fr: "Systèmes appropriés" },
  priority: { en: "Priority addressed", fr: "Priorité abordée" },
  description: {
    en: "Description and implementation constraints",
    fr: "Description et contraintes de mise en œuvre",
  },
});

md`## Summary`;

summary_object = {
  const countryOptions = countriesFiltered
        const countryArray = [];
        
        countryOptions.forEach(option => {
            if (option !== "") { // Asegurarse de no incluir la opción vacía
                countryArray.push(option);
            }
        });
      
        const dataFiltered = dataSummary.filter(d => countryArray.includes(d.ISO3));

        const sumPopulationMillion = dataFiltered.reduce((acc, obj) => acc + parseFloat(obj['rural_pop (Millions)']), 0);
        const sumPopulationBillion = sumPopulationMillion/1000;
      const sumVOPMillion = dataFiltered.reduce((acc, obj) => acc + parseFloat(obj['VOP(Millons usd)']), 0);
        const sumVOPBillion = sumVOPMillion/1000;
      const sumGHG = dataFiltered.reduce((acc, obj) => acc + parseFloat(obj['total_emissions(Mt C02e)']), 0);
      
        const firstCountry = countryArray.shift();
  return {
    firstCountry: firstCountry,
    sumPopulationMillion: sumPopulationMillion,
    sumPopulationBillion: sumPopulationBillion,
    sumVOPMillion: sumVOPMillion,
    sumVOPBillion: sumVOPBillion,
    sumGHG: sumGHG,
    countryArray: countryArray
  }
}

md`## Styling and imports`;

styling = { 
  return htl.html`<style>
  /*------------Estilo multi dropdown*/
  span.dropdown-form button {
          padding: 0;
          border: 0 !important;
          border-radius: 0 !important;
      }
      
      form.oi-3a86ea.dropdown-action-buttons button:hover {
          background: #EFEFEF !important;
      }

      form.oi-3a86ea dropdown-button {
          max-width: none !important;
      }
      
      span.dropdown-form .button-inner {
          padding: 8px 0;
      }

      span.dropdown-form form {
          // width: calc(var(--input-width) + var(--label-width) - 10px) !important;
          width: 24vw !important;
      }
      
      .dropdown-action-buttons button {
          width: 49%  !important;
      }
      
      span.dropdown-form label {
          padding: 8px 0;
          display: flex;
          border-bottom: 1px solid black;
          font-size: 12px !important;
          font-weight: 400 !important;
          text-transform: uppercase;
          width: 100%;
      }
      
      .dropdown-inner {
          border: 1px #333 solid !important;
          border-radius: 0 !important;
          margin-top: 12px !important;
      }
  
  /*------------------------ Estilos propios -----------------------------------*/

  /*-------------- Estilo todo el notebook*/
  p {
   /* min-width: 100%;*/
    text-wrap: pretty;
  }

  /* ------------- Estilos Radio buttom */

  .hidden-radio{
    accent-color: #216729;
  }

/* Create a custom radio button */

  
  /*-------------- Estilos select */
  #type_container {
    --label-width: 120px;
    --input-width: 240px;
    flex-wrap: wrap;
    display: flex;
    align-items: center;
    min-height: 25.5px;
    width: calc(var(--input-width) + var(--label-width));
    max-width: 100%;
  }
  
  #type_container>label {
    padding: 8px 0;
    font-family: "IBM Plex Sans";
    font-size: 12px;
    text-transform: uppercase;
    border-bottom: 1px solid #333;
    width: 100%;
  }
  
  #type_container>select {
    border: 0;
    height: 40px;
    font-family: "IBM Plex Sans";
    font-size: 14px;
    display: flex;
    align-items: center;
    width: 100%;
  }
  
  #country_container {
    --label-width: 120px;
    --input-width: 240px;
    flex-wrap: wrap;
    display: flex !important;
    align-items: center;
    min-height: 25.5px;
    width: calc(var(--input-width) + var(--label-width));
    max-width: 100%;
  }
  
  #country_container>label {
    padding: 8px 0;
    font-family: "IBM Plex Sans";
    font-size: 12px;
    text-transform: uppercase;
    border-bottom: 1px solid #333;
    width: 100%;
  }
  
  #country_container>select {
    border: 0;
    height: 40px;
    font-family: "IBM Plex Sans";
    font-size: 14px;
    display: flex;
    align-items: center;
    width: 100%;
  }

  /*------------------------ Estilos botones */
  .button_container{
    margin-bottom: 1%;
  }

  .button_container_ghg{
    display: flex;
    gap: 20px;
  }
  
  .download_data_am {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 10px 0;
  }
  
  /*.button_download_data {
    background-color: ${getColorBlindRGB(colorblindData.key, "#216729")};
  }

  .button_download_data:hover {
    background-color: ${getColorBlindRGB(colorblindData.key, "#194d1f")};
  }

  .button_download_lps_hazards {
    background-color: ${getColorBlindRGB(colorblindData.key, "#216729")};
  }

  .button_download_lps_hazards:hover {
    background-color: ${getColorBlindRGB(colorblindData.key, "#194d1f")};
  }

  .button_download_lps_emissions {
    background-color: ${getColorBlindRGB(colorblindData.key, "#216729")};
  }

  .button_download_lps_emissions:hover {
    background-color: ${getColorBlindRGB(colorblindData.key, "#194d1f")};
  }

  .button_download_ghg {
    background-color: ${getColorBlindRGB(colorblindData.key, "#216729")};
  }

  .button_download_ghg:hover {
    background-color: ${getColorBlindRGB(colorblindData.key, "#194d1f")};
  }

  .clasetatata {
    background-color: ${getColorBlindRGB(colorblindData.key, "#216729")};
  }

  .clasetatata:hover {
    background-color: ${getColorBlindRGB(colorblindData.key, "#194d1f")};
  }

  .button_download_area {
    background-color: ${getColorBlindRGB(colorblindData.key, "#216729")};
  }

  .button_download_area:hover {
    background-color: ${getColorBlindRGB(colorblindData.key, "#194d1f")};
  }*/

  .button_download_data, .button_download_lps_hazards, .button_download_lps_emissions, .button_download_ghg, .clasetatata, .button_download_area{
    background: #FFFFFF;
    border: 1px solid black;
    padding: 10px 20px;
  }

  .button_download_data:hover, .button_download_lps_hazards:hover, .button_download_lps_emissions:hover, .button_download_ghg:hover, .clasetatata:hover, .button_download_area:hover{
    background: #EFEFEF;
  }

  .button_download_data:active, .button_download_lps_hazards:active, .button_download_lps_emissions:active, .button_download_ghg:active, .clasetatata:active, .button_download_area:active{
    background: #DCDCDC;
  }

  /*-------------------- Estilos scroll*/
  *::-webkit-scrollbar {
    width: 5px;
  }

  *::-webkit-scrollbar-track {
    background: rgb(245, 245, 245);
  }

  *::-webkit-scrollbar-thumb {
    background: #216729;
    border-radius: 20px;
  }

  /*------------ Estilo tablas*/
  .content_table a {
    cursor: pointer;
  }

  table .head{
    background-color: "#216729";
  }

  th h3 {
    color: white !important;
    padding: 0;
  }

  th h4 {
    color: white !important;
  }
  
  #main{
    margin-bottom: 1%;
  }
  
  #main_table{
    margin: 0;
  }

  .head {
    display: grid;
    grid-template-columns: repeat(9,1fr);
    grid-template-rows: repeat(2,1fr);
  }

  .first_head {
    grid-column: 1/10;
    grid-row: 1/3;
    display: grid;
    grid-template-columns: repeat(9,1fr);
  }

  .first_head_one{
    grid-column: 1 / 3;
    grid-row: 1 / 3;
  }

  .first_head_two{
    grid-column: 3 / 6;
    grid-row: 1 / 2;
  }
Base Layer
Layer Opacity

  .first_head_three{
    grid-column: 6 / 10;
    grid-row: 1 / 2;
  }

  .second_head{
    grid-row: 2/3;
    grid-column: 3/10;
    display: grid;
    grid-template-columns: repeat(7,1fr);
  }

  .body_row{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(9,1fr);width: 100%;
    display: grid;
    grid-template-columns: repeat(9,1fr);
  }

  .body_row > :first-child{
    grid-column: 1/3;
  }

  table {
    font-family: "IBM Plex Sans", "Source Serif Pro";
    border-collapse: collapse;
    width: 100%;
    max-width:100%;
    font-size: 16px;
  }
  
  table td, table th {
    border: 1px solid #ddd!important;
    padding: 8px;
  }
  
  table tr:nth-child(even){background-color: #f2f2f2 !important;}
  
  #main_table > tbody tr:hover {background-color: #ddd !important;}
  
  table th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: ${getColorBlindRGB(colorblindData.key, "#216729")} !important;
    color: white;
    text-align: center;
    vertical-align: middle;
  }

  /*-------- Estilos tooltip*/
   #tooltip_contraint{
    background-color: white;
    padding: 10px 15px;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    border-radius: 12px;
    z-index:100;
    font-size:16px
  }
  
  #tooltip_contraint > hr{
    margin: 10px 0;
    padding: 0;
  }

  #tooltip_contraint_ghg{
    border: 2px solid currentColor; 
    background-color: white;
    padding: 10px 15px;
    z-index:100;
  }
  
  #tooltip_contraint_ghg > hr{
    margin: 10px 0;
    padding: 0;
  }

   .oportunity_level_high{
    background: ${getColorBlindRGB(colorblindData.key, "#39ff0033")};
    color: ${getColorBlind(colorblindData.key, "#094200")};
  }
  .oportunity_level_medium{
    background:  ${getColorBlindRGB(colorblindData.key, "#faea5d3b")};
    color: ${getColorBlind(colorblindData.key, "#807305")};
  }  

  /*------- Estilos lista*/
   /*td > ul{
    display: flex;
    flex-wrap: wrap;
    column-gap:30px;
  }

  td > ul > li::marker{
    content: '• '
  }
  li {
    position: relative;
    color: #000;
    text-decoration: none;
    max-width:fit-content;
  }
  */
  /*li:hover {
    color: #000;
  }
  
  li::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #000;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
  }
  
  li:hover::before {
    transform: scaleX(1);
  }*/

  /*------------ Estilos  checkbox*/
  .container_checkbox{
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 0px;
  }
  
  .label_checkbox{
    display:flex;
  }
  
  .label_checkbox input[type="checkbox"] {
    display: none;
    visibility: hidden;
  }

  .label_checkbox label {
    display: inline-block;
  }

  .label_checkbox .cbx {
    position: relative;
    top: 1px;
    width: 17px;
    height: 17px;
    border: 1px solid #c8ccd4;
    border-radius: 3px;
    vertical-align: middle;
    transition: background 0.1s ease;
    cursor: pointer;
    margin-right:5px;
  }
  .label_checkbox .cbx:after {
    content: '';
    position: absolute;
    top: 1px;
    left: 5px;
    width: 5px;
    height: 11px;
    opacity: 0;
    transform: rotate(45deg) scale(0);
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transition: all 0.3s ease;
    transition-delay: 0.15s;
  }
  .label_checkbox .lbl {
    margin-left: 5px;
    vertical-align: middle;
    cursor: pointer;
  }
  .label_checkbox input[type="checkbox"]:checked ~ .cbx {
    border-color: transparent;
    background:  ${getColorBlindRGB(colorblindData.key, "#216729")};
    animation: jelly-42 0.6s ease;
  }
  .label_checkbox input[type="checkbox"]:checked ~ .cbx:after {
    opacity: 1;
    transform: rotate(45deg) scale(1);
  }
  .label_checkbox .cntr {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
  }

  /*------- Animacion checkbox*/
   @-moz-keyframes jelly-42 {
    from {
      transform: scale(1, 1);
    }
    30% {
      transform: scale(1.25, 0.75);
    }
    40% {
      transform: scale(0.75, 1.25);
    }
    50% {
      transform: scale(1.15, 0.85);
    }
    65% {
      transform: scale(0.95, 1.05);
    }
    75% {
      transform: scale(1.05, 0.95);
    }
    to {
      transform: scale(1, 1);
    }
  }
  @-webkit-keyframes jelly-42 {
    from {
      transform: scale(1, 1);
    }
    30% {
      transform: scale(1.25, 0.75);
    }
    40% {
      transform: scale(0.75, 1.25);
    }
    50% {
      transform: scale(1.15, 0.85);
    }
    65% {
      transform: scale(0.95, 1.05);
    }
    75% {
      transform: scale(1.05, 0.95);
    }
    to {
      transform: scale(1, 1);
    }
  }
  @-o-keyframes jelly-42 {
    from {
      transform: scale(1, 1);
    }
    30% {
      transform: scale(1.25, 0.75);
    }
    40% {
      transform: scale(0.75, 1.25);
    }
    50% {
      transform: scale(1.15, 0.85);
    }
    65% {
      transform: scale(0.95, 1.05);
    }
    75% {
      transform: scale(1.05, 0.95);
    }
    to {
      transform: scale(1, 1);
    }
  }
  @keyframes jelly-42 {
    from {
      transform: scale(1, 1);
    }
    30% {
      transform: scale(1.25, 0.75);
    }
    40% {
      transform: scale(0.75, 1.25);
    }
    50% {
      transform: scale(1.15, 0.85);
    }
    65% {
      transform: scale(0.95, 1.05);
    }
    75% {
      transform: scale(1.05, 0.95);
    }
    to {
      transform: scale(1, 1);
    }
  }
  /*---------- CSS Victor*/
  .cooltip {
    background: white;    
    border: 2px solid currentColor; 
    padding: 10px;
    position: absolute;
    display: none;
    max-width: 500px;
    font-family: "IBM Plex Sans", "Source Serif Pro";
    z-index:10000
  }
  
  .content-wrapper-adaptation {
    display: flex;
    flex-wrap: wrap;
    gap: 16px
  }
  
  .chart-adaptation {
    flex: 1; /* Para que ocupe el espacio restante */
    margin-top: 30px;
  }
  
  .icons-emissions {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 10px;
    max-width: 200px;
    flex: 1
  }
  
  .icon-item {
    display: flex;
    align-items: center;
    font-size: small;
  }
  
  .icon-item svg {
    width: 31px;
    height: 31px;
    margin: 7px 12px 0 7px;
  }
  
  @media (max-width: 600px) {
    .content-wrapper-adaptation {
      flex-direction: column;
    }
  
    .chart-adaptation {
      flex-basis: 60%; /* Tamaño inicial del gráfico */
      margin-right: 20px; /* Espacio entre el gráfico y los iconos */
      margin-top: 10px;
    }
  
    .icons-emissions {
      flex-basis: 40%; /* Tamaño inicial de los iconos */
    }
  }

  .Adaptation {
    fill:  ${getColorBlindRGB(colorblindData.key, "rgb(197, 22, 23)")} !important;
  }

  .Mitigation {
    fill:  ${getColorBlindRGB(colorblindData.key, "rgb(86, 81, 255)")} !important;
  }

  .color-box {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 5px;
    vertical-align: sub;
  }
  .custom-slider {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    background: linear-gradient(to right, ${getColorBlindRGB(colorblindData.key, "#C51617")}, ${getColorBlindRGB(colorblindData.key, "#C51617")} 50%, ${getColorBlindRGB(colorblindData.key, "#5651FF")} 50%, ${getColorBlindRGB(colorblindData.key, "#5651FF")});
    border-radius: 5px;
    outline: none;
    margin: 20px 0;
  }
  
  .custom-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 25px;
    height: 25px;
    background: grey;
    border-radius: 50%;
    cursor: pointer;
  }
  
  .progress {
    height: 45px;
    width: 45px;
    border-radius: 50%;
    -webkit-mask: radial-gradient(#0000 59%,#000 60% 70%,#0000 71%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }
  
  .progress::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background: conic-gradient(${getColorBlindRGB(colorblindData.key, "#40C70D")} var(--angle),lightgrey 0);
    animation: 2s animate linear forwards;
  }
  
  @keyframes animate {
    from {
        --angle: 0deg;
    }
    to {
        --angle: var(--p);
    }
    
  }
  
  @property --angle {
    syntax: "<angle>"; /* this can be angle or percentage */
    initial-value: 0deg;
    inherits: false;
  }

  #checkbox_adapatation input{
    accent-color: ${getColorBlindRGB(colorblindData.key, "#6871f1")};
  }

  @media only screen and (max-width: 768px) {

    #main_table{
      font-size: 10px;
    }
    
  }

  .laber_input {
    padding: 8px 0;
    font-family: "IBM Plex Sans";
    font-size: 12px;
    text-transform: uppercase;
    border-bottom: 1px solid #333;
    width: 100%;
    display: block;
  }

  figure svg {
    font-size: 10px;
  }
</style>`
}

html`${styling}`;

notebookTitle = _lang({
  en: "Prioritize Livestock Investments",
  fr: "Prioriser les investissements dans le bétail",
});

import { dropdownInput, dropdownCSS } from "@tashapiro/dropdown-input";

dropdownCSS;

debounce = (delay, input) => {
  class DelayedEvent extends Event {}
  let id;
  input.addEventListener("input", (e) => {
    if (e instanceof DelayedEvent) return;
    e.stopImmediatePropagation();
    clearTimeout(id);
    id = setTimeout(
      () => input.dispatchEvent(new DelayedEvent("input", { bubbles: true })),
      delay,
    );
  });
  return input;
};

// admin multi-select: countries
viewof select_species = {
  const data = getSpecies().map((d) => ({
    value: d,
    label: d
  }));
  const input = dropdownInput({
    inputLabel: _lang(nbText.sections.scalableSolutions.table.inputs.selectSpecies.label),
    inputId: "positionsTest",
    placeholderText: _lang(nbText.sections.scalableSolutions.table.inputs.selectSpecies.placeholder),
    options: data,
    selected: [data[0].value]
  });
  return debounce(500, input);
}

// admin multi-select: countries
viewof select_system = {
  const data = getLivestockSystem().map((d) => ({
    value: d,
    label: d
  }));
  const input = dropdownInput({
    inputLabel: _lang(nbText.sections.scalableSolutions.table.inputs.selectLivestock.label),
    inputId: "positionsTest",
    placeholderText: _lang(nbText.sections.scalableSolutions.table.inputs.selectLivestock.placeholder),
    options: data,
    selected: [data[0].value]
  });
  return debounce(500, input);
}

dataStock = FileAttachment("1_FAO_stocks_years.csv").csv();

dataVOP = FileAttachment("1_FAO_vop_year.csv").csv();

dataGHG = FileAttachment("1_FAO_ghg_years.csv").csv();

dataSummary = FileAttachment("country_emissions_hazards.csv").csv();

md`## Translation`;

import { Lang } from "7d46679f7d0d917e";

languages = [
  { key: "en", label: "English", locale: "en-US" },
  { key: "fr", label: "Français", locale: "fr-FR" },
];

// get the default language key from parameter, or use default
defaultLangKey = {
  const name = "lang";
  const list = languages.map((d) => d.key);
  const defaultKey = "en";

  const queryParam = await Lang.getParamFromList({ name, list });

  return queryParam ?? defaultKey;
}

// helper shorthand for Lang text-getting
_lang = Lang.lg(language.key);

// main toggle of language key
viewof language = Inputs.radio(languages, {
  label: "Main language toggle",
  format: (d) => d.key,
  value: languages.find((x) => x.key === defaultLangKey),
})

nbText = {
  return {
    legends: {
      language: {
        en: "language",
        fr: "langue"
      },
      toc: {
        en: "in this notebook",
        fr: "dans ce notebook"
      },
      ssa: {
        en: "Sub-Saharan Africa",
        fr: "d'Afrique subsaharienne"
      },
      colorblind: {
        label: {
          en: "Do you see colors clearly or have trouble distinguishing them?",
          fr: "Voyez-vous clairement les couleurs ou avez-vous du mal à les distinguer?"
        },
        values: {
          non: {
            en: "None",
            fr: "Aucun"
          },
          deu: {
            en: "Deuteranopia",
            fr: "Deutéranopie"
          },
          pro: {
            en: "Protanopia",
            fr: "Protanopie"
          },
          tri: {
            en: "Tritanopia",
            fr: "Tritanopie"
          }
        }
      }
    },
    sections: {
      quickInsightsGeneral: {
        header: {
          en: ({ selection } = {}) => md`Quick Insights for ${selection}`,
          fr: ({ selection } = {}) => md`Aperçu Rapide pour ${selection}`
        }
      },
      overview: {
        title: {
          en: `Overview`,
          fr: `Vue d’Ensemble`
        },
        intro: {
          en: md`No conceivable Global Future can neglect livestock production. Livestock production systems are the main source of income and livelihood for 300 million people in sub-Saharan Africa. Animals generate revenue through milk and meat production, provide draught power for on-farm activities, and act as insurance when everything else fails. Livestock are at risk from a plethora of climate hazards, and they also generate greenhouse gas emissions that warm the planet. Given livestock are both at risk from and a source of climate change, where should investment be directed for impact?`,
          fr: md`Aucun avenir mondial imaginable ne peut négliger la production de bétail. Les systèmes de production de bétail constituent la principale source de revenus et de subsistance pour 300 millions de personnes en Afrique subsaharienne. Les animaux génèrent des revenus grâce à la production de lait et de viande, fournissent de la puissance de traction pour les activités agricoles sur place, et servent d'assurance lorsque tout le reste échoue. Les animaux sont menacés par une multitude de risques climatiques, et ils produisent également des émissions de gaz à effet de serre qui réchauffent la planète. Étant donné que le bétail est à la fois en danger par et une source de changement climatique, où les investissements doivent-ils être dirigés pour avoir un impact?`
        },
        inspiration: {
          en: md`This spotlight is inspired by the Nature Sustainability Publication <a href="https://nature.com/articles/s41893-023-01161-1">Priority areas for investment in more sustainable and climate-resilient livestock systems</a>.`,
          fr: md`Ce *spotlight* est inspiré par la publication de Nature Sustainability sur <a href="https://nature.com/articles/s41893-023-01161-1">les zones prioritaires pour l'investissement dans des systèmes de bétail plus durables et résilients au climat.</a>.`
        }
      },
      livestockExplosion: {
        title: {
          en: `The Livestock Explosion`,
          fr: `L’explosion du Bétail`
        },
        intro: {
          en: `The visualization below helps you explore historical **(2010 - 2021)** trends in livestock population, value of production (VoP), and greenhouse gas (GHG) emissions. These trends give a measure of the rapid pace of growth of the sector, and therefore its importance for people and the environment.`,
          fr: `La visualisation ci-dessous vous aide à explorer les tendances historiques **(2010 - 2021)** de la population de bétail, de la valeur de la production (VDP) et des émissions de gaz à effet de serre (GES). Ces tendances donnent une mesure de la rapidité de croissance du secteur, et donc de son importance pour les personnes et l'environnement.`
        },
        chart: {
          legend: {
            "breedinganimals": {en: 'Breeding animals', fr: "Animaux d'élevage"},
            "marketanimals": {en: 'Market animals', fr: "Animaux de marché"},
            "grazinganimals": {en: 'Grazing animals', fr: "Animaux de pâturage"},
            "poultry": {en: 'Poultry', fr: "Volaille"},
            "workinganimals": {en: 'Working animals', fr: "Animaux de travail"}
          },
          labels: {
            year: {
              en: "Year",
              fr: "Année"
            },
            category: {
              en: "Category",
              fr: "Catégorie"
            }
          },
          inputLabel: {
            en: "Variable",
            fr: "Variable"
          },
          variables: {
            stock: {
              label: {
                en: "Stock",
                fr: "Stock"
              },
              tip: {
                en: "Stock (million)",
                fr: "Stock (millions)"
              }
            },
            ghg: {
              label: {
                en: "GHG Emissions",
                fr: "Émissions de GES"
              },
              tip: {
                en: "Emissions (MtCo2e)",
                fr: "Émissions (MtCo2e)"
              }
            },
            vop: {
              label: {
                en: "Value of production",
                fr: "Valeur de la production"
              },
              tip: {
                en: "VOP (billion usd)",
                fr: "VDP (milliard de dollars)"
              }
            }
          }
        },
        download: {
          labelFunc: {
            en: (d) => `Download ${d} Data`,
            fr: (d) => `Télécharger les Données ${d}`
          }
        },
        insights: {
          livestock: {
            en: ({ selection, year, population, percent, yearSince } = {}) =>
              htl.html`<b>${selection}</b>’s livestock population in <b>${year}</b> is <b>${population} billion</b>, and has grown by <b>${percent}%</b> since <b>${yearSince}</b>.`,
            fr: ({ selection, year, population, percent, yearSince } = {}) =>
              htl.html`Le bétail de <b>${selection}</b> au <b>${year}</b> s’élève à <b>${population} milliards</b> et a augmenté de <b>${percent}%</b> depuis <b>${yearSince}</b>.`
          },
          vop: {
            en: ({ selection, year, population, percent, yearSince } = {}) =>
              htl.html`<b>${selection}</b>’s value of production in <b>${year}</b> is <b>${population} billion</b>, and has grown by <b>${percent}%</b> since <b>${yearSince}</b>.`,
            fr: ({ selection, year, population, percent, yearSince } = {}) =>
              htl.html`La valeur de la production de <b>${selection}</b> en <b>${year}</b> est de <b>${population} milliards de dollars</b> et a augmenté de <b>${percent}%</b> depuis <b>${yearSince}</b>.`
          },
          ghg: {
            en: ({ mult } = {}) =>
              htl.html`The explosion in livestock numbers comes at the expense of a growth in <b>GHG emissions</b> of <b>${mult}</b> times in the same period.`,
            fr: ({ mult } = {}) =>
              htl.html`L’explosion du bétail se fait au détriment d’une croissance des <b>émissions de GES</b> de <b>${mult}</b> fois sur la même période.`
          }
        }
      },
      leversOfChange: {
        title: {
          en: "Countries As Levers Of Change",
          fr: "Les Pays Comme Leviers de Changement"
        },
        intro: {
          en: `Livestock’s exposure to climate hazards and GHG emissions totals imply that climate actions need to address both adaptation and mitigation outcomes. Investing in actions begs the question of where those investments should be targeted. This section explores geographic priorities for investment in climate action for livestock systems. Hover over the selected priorities to get an overview of emissions totals and hazard exposure.`,
          fr: `L'exposition du bétail aux aléas climatiques et le total des émissions de GES impliquent que les actions climatiques doivent aborder à la fois les résultats d'adaptation et d'atténuation. Investir dans des actions soulève la question de savoir où ces investissements devraient être ciblés. Cette section explore les priorités géographiques pour l'investissement dans l'action climatique pour les systèmes de bétail. Survolez les priorités sélectionnées pour obtenir un aperçu du total des émissions et de l'exposition aux risques.`
        },
        inputs: {
          radio: {
            label: {
              en: "Configuration",
              fr: "Configuration"
            },
            values: {
              adap: {
                en: "Adaptation only",
                fr: "Adaptation uniquement"
              },
              adap_mit: {
                en: "Adaptation and mitigation equally",
                fr: "Adaptation et atténuation à parts égales"
              },
              mit: {
                en: "Mitigation only",
                fr: "Atténuation uniquement"
              }
            }
          },
          num: {
            label: {
              en: "Maximum number of priorities",
              fr: "Nombre maximum de priorités"
            }
          }
        },
        chart: {
          map: {
            legend: {
              title: {
                en: "Prioritization",
                fr: "Priorisation"
              },
              lo: {
                en: "Low",
                fr: "Faible"
              },
              md: {
                en: "Medium",
                fr: "Moyen"
              },
              hi: {
                en: "High",
                fr: "Élevé"
              }
            },
            tooltip: {
              headers: {
                hazards: {
                  en: "Hazards",
                  fr: "Dangers"
                },
                emissions: {
                  en: "Emissions",
                  fr: "Émissions"
                }
              },
              data: {
                hazards: {
                  tlu: {
                    name: {
                      en: "Tropical livestock units",
                      fr: "Unités de bétail tropicales"
                    },
                    unit: {
                      en: "Million",
                      fr: "Millions"
                    }
                  },
                  pastureArea: {
                    name: {
                      en: "Pasture area",
                      fr: "Superficie de pâturage"
                    },
                    unit: {
                      en: "Million ha",
                      fr: "Millions ha"
                    }
                  },
                  popRural: {
                    name: {
                      en: "Rural population",
                      fr: "Population rurale"
                    },
                    unit: {
                      en: "Million people",
                      fr: "Millions de personnes"
                    }
                  },
                  vop: {
                    name: {
                      en: "Value of production",
                      fr: "Valeur de la production"
                    },
                    unit: {
                      en: "Million USD",
                      fr: "Millions de dollars"
                    }
                  }
                },
                emissions: {
                  unit: {
                    en: "Mt CO2e",
                    fr: "Mt CO2e"
                  },
                  values: {
                    bovine: {
                      en: "Bovine",
                      fr: "Bovine"
                    },
                    pig: {
                      en: "Pig",
                      fr: "Cochon"
                    },
                    poultry: {
                      en: "Poultry",
                      fr: "Volaille"
                    },
                    shoat: {
                      en: "Shoat",
                      fr: "Shoat"
                    },
                    flPasture: {
                      en: "Forest loss to pasture",
                      fr: "Perte de forêt au profit des pâturages"
                    },
                    flSoy: {
                      en: "Forest loss to soy",
                      fr: "Perte de forêt à cause du soja"
                    }
                  }
                }
              }
            }
          },
          download: {
            categories: {
              en: "Download Data Categories",
              fr: "Télécharger Données sur les Catégories"
            },
            climate: {
              en: "Download Data Climate Hazard",
              fr: "Télécharger les Données sur les Aléas Climatiques"
            },
            emissions: {
              en: "Download Data Emissions",
              fr: "Télécharger les Données sur les Émissions"
            }
          }
        },
        insights: {
          title: {
            en: "Quick Insights For The Identified Priority Countries",
            fr: "Aperçus rapides pour les pays prioritaires identifiés"
          },
          investmentPriorities: {
            en: ({
              percAdaptation,
              percMitigation,
              countryCount,
              livestockProd,
              peopleExposed,
              ggEmissions
            } = {}) =>
              `The selected weighting of **${percAdaptation}%** adaptation, **${percMitigation}%** mitigation, and number of geographies selected, result in investment priorities that span **${countryCount}** countries and encompass **${livestockProd} billion USD** in livestock production. Climate actions in these countries can benefit **${peopleExposed} million** people exposed to hazards, and contribute to reducing some of the **${ggEmissions} MT CO2e** in greenhouse gas emissions.`,
            fr: ({
              percAdaptation,
              percMitigation,
              countryCount,
              livestockProd,
              peopleExposed,
              ggEmissions
            } = {}) =>
              `La pondération sélectionnée de **${percAdaptation}%** d'adaptation, **${percMitigation}%** d'atténuation et le nombre de zones géographiques sélectionnées aboutissent à des priorités d'investissement qui couvrent **${countryCount}** pays et englobent **${livestockProd} milliards de dollars** dans la production animale. Les actions climatiques dans ces pays peuvent bénéficier à **${peopleExposed} millions** de personnes exposées à des aléas et contribuer à réduire une partie des **${ggEmissions} MT CO2e** des émissions de gaz à effet de serre.`
          },
          mostCritical: {
            en: ({ lever, percVop, percEmissions } = {}) =>
              `The most critical lever of change in the priority list is **${lever}**, which constitutes **${percVop}%** of exposed value of production and **${percEmissions}%** of emissions in relation to the overall sub-Saharan Africa total.`,
            fr: ({ lever, percVop, percEmissions } = {}) =>
              `Le levier de changement le plus critique dans la liste des priorités est **${lever}**, qui constitue **${percVop}%** de la valeur exposée de la production et **${percEmissions}%** des émissions par rapport au total global de l’Afrique subsaharienne.`
          },
          countrySystems: {
            en: ({ first, second, third } = {}) =>
              `In this country, the systems that have the greatest exposure and emissions, and should therefore be the highest priorities are **${first}**, followed by **${second}**, and **${third}**.`,
            fr: ({ first, second, third } = {}) =>
              `Dans ce pays, les systèmes les plus exposés et les plus émetteurs, et qui devraient donc être les plus prioritaires, sont **${first}**, suivis de **${second}** et **${third}**.`
          },
          sigHazard: {
            en: ({ location, hazard, vop } = {}) =>
              `The most significant hazard(s) in **${location}** is **${hazard}** potentially impacting **${vop} USD billion VoP**.`,
            fr: ({ location, hazard, vop } = {}) =>
              `Le(s) danger(s) le plus important(s) **${location}** est **${hazard}**, avec un impact potentiel de **${vop} milliard de dollars de VDP**.`
          },
            hazard_defs: {
              "Thi": { en: "Livestock heat stress", 
                       fr: "Le stress thermique du bétail" 
                     },
              "RF": { en: "Extreme or high rainfall variability", 
                      fr: "La variabilité extrême ou élevée des précipitations" 
                     },
              "D": { en: "Drought", 
                     fr: "La sécheresse" 
                   },
              "F": { en: "Flooding", 
                     fr: "L'inondation" 
                   },
              "CV": { en: "Rainfall variability", 
                      fr: "La variabilité des précipitations" 
                     },
              "ExCV": { en: "Extremely high rainfall variability", 
                        fr: "La variabilité extrêmement élevée des précipitations" 
                       },
              "HCV": { en: "High rainfall variability", 
                       fr: "La variabilité élevée des précipitations" 
                     },
              "CV+D": { en: "Rainfall variability and drought", 
                        fr: "La variabilité des précipitations et la sécheresse" 
                       },
              "CV+D+F": { en: "Rainfall variability, drought and flooding", 
                          fr: "La variabilité des précipitations, la sécheresse et l'inondation" 
                         },
              "CV+F": { en: "Rainfall variability and flooding", 
                        fr: "La variabilité des précipitations et l'inondation" 
                       },
              "CV+Thi": { en: "Rainfall variability and livestock heat stress", 
                          fr: "La variabilité des précipitations et le stress thermique du bétail" 
                         },
              "CV+Thi+D": { en: "Rainfall variability, livestock heat stress and drought", 
                            fr: "La variabilité des précipitations, le stress thermique du bétail et la sécheresse" 
                           },
              "CV+Thi+D+F": { en: "Rainfall variability, livestock heat stress, drought and flooding", 
                              fr: "La variabilité des précipitations, le stress thermique du bétail, la sécheresse et l'inondation" 
                           },
              "CV+Thi+F": { en: "Rainfall variability, livestock heat stress and flooding", 
                            fr: "La variabilité des précipitations, le stress thermique du bétail et l'inondation" 
                         },
              "D+F": { en: "Drought and flooding", 
                       fr: "La sécheresse et l'inondation" 
                     },
              "Thi+D": { en: "Livestock heat stress and drought", 
                         fr: "Le stress thermique du bétail et la sécheresse" 
                       },
              "Thi+D+F": { en: "Livestock heat stress, drought and flooding", 
                           fr: "Le stress thermique du bétail, la sécheresse et l'inondation" 
                         },
              "Thi+F": { en: "Livestock heat stress and flooding", 
                         fr: "Le stress thermique du bétail et l'inondation"
                       }
          }
        },
        livestockProductionSystems: {
          header: {
            en: `Livestock Production Systems Within Priority Countries`,
            fr: `Systèmes de Production Animale Dans les Pays Prioritaires`
          },
          tableIntro: {
            en: `Explore the overall country ranking and their livestock production systems using the table below.`,
            fr: `Explorez le classement général des pays et leurs systèmes de production animale à l’aide du tableau ci-dessous.`
          },
          countryInput: {
            label: {
              en: "Country",
              fr: "Pays"
            }
          },
          table: {
            headers: {
              country: {
                en: "Country",
                fr: "Pays"
              },
              ghgEmissions: {
                en: "GHG Emissions",
                fr: "Émissions de GES"
              },
              livestockSystem: {
                en: "Livestock production system",
                fr: "Système de production animale"
              },
              climateExposure: {
                en: "Climate Hazard Exposure",
                fr: "Exposition aux Aléas Climatiques"
              },
              emissionsDirect: {
                en: "Direct emissions (Mt CO2e)",
                fr: "Émissions directes (Mt CO2e)"
              },
              emissionsIndirect: {
                en: "Indirect emissions (Mt CO2e)",
                fr: "Émissions indirectes (Mt CO2e)"
              },
              emissionsTotal: {
                en: "Total emissions (Mt CO2e)",
                fr: "Émissions totales (Mt CO2e)"
              },
              popRural: {
                en: "Rural population (Million people)",
                fr: "Population rurale (Millions de personnes)"
              },
              vop: {
                en: "Value of production (Million USD)",
                fr: "Valeur de la production (Millions de dollars)"
              },
              tlu: {
                en: "Tropical livestock units (Million)",
                fr: "Unités de bétail tropicales (Millions)"
              },
              pastureArea: {
                en: "Pasture area (Million ha)",
                fr: "Superficie de pâturage (Millions ha)"
              }
            }
          },
          download: {
            ghg: {
              en: "Download GHG Data",
              fr: "Télécharger les Données sur les GES"
            },
            lps_hazards: {
              en: "Download LPS Hazards Data",
              fr: "Télécharger les Données sur les Dangers du LPS"
            },
            lps_emissions: {
              en: "Download LPS Emissions Data",
              fr: "Télécharger les Données sur les Émissions LPS"
            }
          }
        }
      },
      scalableSolutions: {
        title: {
          en: `Scalable Solutions`,
          fr: `Solutions Évolutives`
        },
        intro: {
          en: `Many actions exist that would be no-regret investments, delivering benefits for both adaptation and mitigation. However, why are they not yet reaching scale? This section helps explore some key adaptation and mitigation actions and their typical adoption constraints.`,
          fr: `Il existe de nombreuses actions qui constitueraient des investissements sans regret, apportant des bénéfices tant pour l'adaptation que pour l'atténuation. Cependant, pourquoi ne sont-elles pas encore déployées à grande échelle ? Cette section permet d'explorer certaines actions clés d'adaptation et d'atténuation ainsi que les contraintes habituelles à leur adoption.`
        },
        table: {
          title: {
            en: "Hazard Selectors (One of each must be selected)",
            fr: "Sélecteurs de danger (un de chaque doit être sélectionné)"
          },
          inputs: {
            selectLivestock: {
              label: {
                en: "Livestock System",
                fr: "Système d'Élevage"
              },
              placeholder: {
                en: "Select Livestock System...",
                fr: "Sélectionnez le système d'élevage..."
              }
            },
            selectSpecies: {
              label: {
                en: "Species",
                fr: "Espèces"
              },
              placeholder: {
                en: "Select species...",
                fr: "Sélectionner une espèce..."
              }
            }
          },
          headers: {
            option: {
              en: "Option",
              fr: "Option"
            },
            priority: {
              en: "Priority",
              fr: "Priorité"
            },
            description: {
              en: "Description",
              fr: "Description"
            }
          }
        },
        download: {
          en: "Download Data",
          fr: "Télécharger les Données"
        }
      },
      summary: {
        title: {
          en: `Summary`,
          fr: `Résumé`
        },
        intro: {
          en: `The livestock sector must transform in sub-Saharan Africa, if the region is to meet Sustainable Development Goals (SDGs). Critically, the livestock sector affects 10 of 17 SDGs.`,
          fr: `Le secteur de l’élevage doit se transformer en Afrique subsaharienne si la région veut atteindre les objectifs de développement durable (ODD). De manière cruciale, le secteur de l’élevage affecte 10 des 17 ODD.`
        },
        countryListFunc: {
          en: ({
            num,
            multiCountryString,
            topCountryString,
            multiString,
            severalOthersString
          } = {}) =>
            `Based on the analysis above, ${multiCountryString} ${topCountryString}${multiString}${severalOthersString}.`,
          fr: ({
            num,
            multiCountryString,
            topCountryString,
            multiString,
            severalOthersString
          } = {}) =>
            `Sur la base de l'analyse ci-dessus, ${multiCountryString} ${topCountryString}${multiString}${severalOthersString}.`
        },
        countryListSupport: {
          topStringFunc: {
            en: ({ num } = {}) => `of the top **${num}** countries,`,
            fr: ({ num } = {}) => `parmi les **${num}** principaux pays`
          },
          topCountryFunc: {
            en: ({ top } = {}) =>
              `**${top}** is the most critical lever of change in the region`,
            fr: ({ top } = {}) =>
              `**${top}** est le levier de changement le plus critique dans la région`
          },
          followedBy: {
            en: `, followed by`,
            fr: `, suivi par`
          },
          severalOthers: {
            en: ` **and several others**`,
            fr: ` **et plusieurs autres**`
          }
        },
        outroFunc: {
          en: ({ people, livestock, footprint } = {}) =>
            `Catalyzing climate action in these countries could help address adaptation for **${people} million** people, avoid devastating impacts that could affect some of the **${livestock} billion** in livestock production, while contributing to reducing livestock’s carbon footprint of **${footprint} MT CO2e**.`,
          fr: ({ people, livestock, footprint } = {}) =>
            `Catalyser l’action climatique dans ces pays pourrait contribuer à l’adaptation pour **${people} millions** de personnes, éviter les impacts dévastateurs qui pourraient affecter une partie des **${livestock} milliards** de production animale, tout en contribuant à réduire l’empreinte carbone de l’élevage de **${footprint} MT CO2e**.`
        }
      },
      methods: {
        title: {
          en: htl.html`Methods & Sources`,
          fr: htl.html`Méthodes & Sources`
        },
        sections: {
          datasets: {
            title: {
              en: htl.html`Datasets`,
              fr: htl.html`Ensembles de Données`
            },
            body: {
              en: htl.html`The data and methods used here are all documented by <a href="https://www.nature.com/articles/s41893-023-01161-1">Bonilla-Cedrez et al. (2023)</a>. Here we provide a summarized version, and encourage the readers to read the original study. The data and code for the analysis of the original study is available in <a href="https://github.com/CIAT/livestock_prioritization/tree/main">GitHub</a>. The original study and this Spotlight were conducted in collaboration with the <a href="https://www.cgiar.org/initiative/livestock-and-climate/">CGIAR Livestock & Climate Initiative</a>.`,
              fr: htl.html`Les données et méthodes utilisées ici sont toutes documentées par <a href="https://www.nature.com/articles/s41893-023-01161-1">Bonilla-Cedrez et al. (2023)</a>. Nous fournissons ici une version résumée et encourageons les lecteurs à lire l’étude originale. Les données et le code pour l'analyse de l'étude originale sont disponibles sur <a href="https://github.com/CIAT/livestock_prioritization/tree/main">GitHub</a>. L'étude originale et ce Spotlight ont été menés en collaboration avec <a href="https://www.cgiar.org/initiative/livestock-and-climate/">l'Initiative CGIAR Livestock & Climate</a>.`
            }
          },
          livestockProdSystems: {
            title: {
              en: htl.html`Livestock production systems`,
              fr: htl.html`Systèmes de production animale`
            },
            body: {
              en: htl.html`We used the livestock production system classification from the Food and Agriculture Organization of the United Nations (FAO) (Robinson et al., 2011). This classification divides livestock production systems into landless, rangeland, mixed irrigated, and mixed rainfed systems. Rangelands, and the mixed systems are each divided by agroecology into arid, hyperarid, temperate, and humid. This gives rise to twelve categories (the category landless is not considered for the analysis) for analysis.`,
              fr: htl.html`Nous avons utilisé la classification des systèmes de production animale de l'Organisation des Nations Unies pour l'alimentation et l'agriculture (FAO) (Robinson et al., 2011). Cette classification divise les systèmes de production animale en systèmes sans terre, en parcours, irrigués mixtes et pluviaux mixtes. Les parcours et les systèmes mixtes sont chacun divisés par l'agroécologie en arides, hyperarides, tempérés et humides. Cela donne lieu à douze catégories (la catégorie sans terre n'est pas prise en compte pour l'analyse).`
            }
          },
          exposureData: {
            title: {
              en: htl.html`Exposure data`,
              fr: htl.html`Données d'exposition`
            },
            body: {
              en: htl.html`Exposure was represented by the <a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/exposure_catalog/GLW3_livestock/GLW3_livestock_vop/GLW3_livestock_vop.json">total value of production</a>, <a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/population/worldpop_2020/collection.json">total rural population</a>, <a href="http://www.earthstat.org/cropland-pasture-area-2000/">pasture area</a>, and Total Livestock Units (TLUs). TLU values were computed using data from the Gridded Livestock of the World database (<a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/exposure_catalog/GLW3_livestock/GLW3_livestock_no/GLW3_livestock_no.json">GLW version 3</a>).`,
              fr: htl.html`L'exposition était représentée par la <a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/exposure_catalog/GLW3_livestock/GLW3_livestock_vop/GLW3_livestock_vop.json">valeur totale de la production</a>, <a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/population/worldpop_2020/collection.json">la population rurale totale</a>, <a href="http://www.earthstat.org/cropland-pasture-area-2000/">la superficie des pâturages</a> et le nombre total d'unités de bétail (UBT). Les valeurs TLU ont été calculées à l'aide des données de la base de données Gridded Livestock of the World (<a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/exposure_catalog/GLW3_livestock/GLW3_livestock_no/GLW3_livestock_no.json">GLW version 3</a>).`
            }
          },
          hazardData: {
            title: {
              en: htl.html`Hazard data`,
              fr: htl.html`Données sur les aléas`
            },
            body: {
              en: htl.html`This notebook uses six climate hazard data layers, namely, rainfall variability, heat stress, flooding risk, and risk of drought. Rainfall variability is represented by the coefficient of variation of annual mean rainfall (15–30% = highly variable; >30% = extremely variable) computed using rainfall data from the Climate Hazards Group InfraRed Precipitation with Stations (CHIRPS) <a href="https://doi.org/10.1038/sdata.2015.66">dataset</a>. Areas of heat stress were defined as having thermal stress with a Thermal Humidity Index (THI) of ≥79, with THI data derived from <a href="https://doi.org/10.1111/gcb.15825">Thornton et al. (2021)</a>. To define areas at risk of flooding, we used the UN Environment Programme–Division of Early Warning and Assessment–GRID-Europe <a href="https://unepgrid.ch/en/activity/1BDE1705">dataset</a>, in which flooding risk
is ranked from 0 (no risk) to 5 (extreme). Areas at risk of drought were defined as having more than 25 days without rain per month on average based on historical rainfall records from CHIRPS.`,
              fr: htl.html`Ce <i>notebook</i> utilise six couches de données sur les risques climatiques, à savoir la variabilité des précipitations, le stress thermique, le risque d'inondation et le risque de sécheresse. La variabilité des précipitations est représentée par le coefficient de variation des précipitations moyennes annuelles (15 à 30 % = très variable ; > 30 % = extrêmement variable) calculé à l'aide des données pluviométriques de <a href="https://doi.org/10.1038/sdata.2015.66">l'ensemble de données</a> sur les précipitations infrarouges avec stations du Climate Hazards Group (CHIRPS). Les zones de stress thermique ont été définies comme présentant un stress thermique avec un indice d'humidité thermique (THI) ≥79, les données THI étant dérivées de <a href="https://doi.org/10.1111/gcb.15825">Thornton et al. (2021)</a>. Pour définir les zones à risque d'inondation, nous avons utilisé <a href="https://unepgrid.ch/en/activity/1BDE1705">l'ensemble de données</a> GRID-Europe du Programme des Nations Unies pour l'environnement – Division de l'alerte précoce et de l'évaluation – dans lequel le risque d'inondation est classé de 0 (aucun risque) à 5 (extrême). Les zones à risque de sécheresse ont été définies comme ayant plus de 25 jours sans pluie par mois en moyenne sur la base des enregistrements de précipitations historiques du CHIRPS.`
            }
          },
          povertyData: {
            title: {
              en: htl.html`Poverty data`,
              fr: htl.html`Données sur la pauvreté`
            },
            body: {
              en: htl.html`National-level poverty headcount ratios at US$1.90 per day at 2021 international prices were gathered from The World Bank indicators database (<a href="https://maps.worldbank.org/projects">World Bank Maps</a>).`,
              fr: htl.html`Les ratios de pauvreté au niveau national, à 1,90 USD par jour aux prix internationaux de 2021, ont été collectés à partir de la base de données d'indicateurs de la Banque mondiale (<a href="https://maps.worldbank.org/projects">World Bank Maps</a>).`
            }
          },
          greenhouseEmissionsData: {
            title: {
              en: htl.html`Greenhouse gas emissions data`,
              fr: htl.html`Données sur les émissions de gaz à effet de serre`
            },
            body: {
              en: htl.html`Greenhouse gas emissions, totals of livestock, and value of production per year for the period 2010-2021 were all gathered from FAOSTAT, and used to produce the stacked line plot in the first section of this notebook. For the remaining sections, total livestock emissions by geography were computed as the sum of direct and estimated emissions from deforestation. Direct emissions data come from <a href="https://doi.org/10.1073/pnas.130814911">Herrero et al. (2013)</a> and are for the year 2010, updated to 2019 using FAOSTAT. Emissions linked to deforestation combined above- and below-ground carbon biomass data from <a href="https://doi.org/10.1098/rstb.2019.0128">Soto-Navarro et al. (2020)</a>, tree cover data (<a href="https://doi.org/10.1126/science.1244693">Hansen et al., 2013</a>), and commodity-linked deforestation data (for soybean and pasture) from <a href="https://www.wri.org/research/estimating-role-seven-commodities-agriculture-linked-deforestation-oil-palm-soy-cattle"Goldman et al. (2020)</a>. We included deforestation due to soybeans given that a substantial portion of soybean production is used for livestock feed.`,
              fr: htl.html`Les émissions de gaz à effet de serre, le total du bétail et la valeur de la production annuelle pour la période 2010-2021 ont tous été collectés à partir de FAOSTAT et utilisés pour produire le graphique linéaire empilé dans la première section de ce cahier. Pour les sections restantes, les émissions totales du bétail par géographie ont été calculées comme la somme des émissions directes et estimées dues à la déforestation. Les données sur les émissions directes proviennent de <a href="https://doi.org/10.1073/pnas.130814911">Herrero et al. (2013)</a> et concernent l’année 2010, mis à jour jusqu’en 2019 à l’aide de FAOSTAT. Les émissions liées à la déforestation combinaient les données sur la biomasse de carbone aérienne et souterraine de <a href="https://doi.org/10.1098/rstb.2019.0128">Soto-Navarro et al. (2020)</a>, les données sur la couverture arborée (<a href="https://doi.org/10.1126/science.1244693">Hansen et al., 2013</a>), et les données sur la déforestation liée aux produits de base (pour le soja et les pâturages) de <a href="https://www.wri.org/research/estimating-role-seven-commodities-agriculture-linked-deforestation-oil-palm-soy-cattle">Goldman et al. (2020)</a>. Nous avons inclus la déforestation due au soja étant donné qu'une part substantielle de la production de soja est utilisée pour l'alimentation du bétail.`
            }
          },
          boundaries: {
            title: {
              en: htl.html`Boundaries`,
              fr: htl.html`Délimitations`
            },
            body: {
              en: htl.html`<a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/boundary_catalog/geoBoundaries_SSA/collection.json">Administrative areas</a> used in this notebook come from <a href="https://github.com/wmgeolab/geoBoundaries">geoBoundaries 6.0.0</a>. The gbHumanitarian boundaries are used and if not available then the gbOpen boundaries are substituted.`,
              fr: htl.html`<a href="https://radiantearth.github.io/stac-browser/#/external/digital-atlas.s3.amazonaws.com/stac/public_stac/boundary_catalog/geoBoundaries_SSA/collection.json">Les zones administratives</a> utilisées dans ce bloc-notes proviennent de <a href="https://github.com/wmgeolab/geoBoundaries">geoBoundaries 6.0.0</a>. Les limites gbHumanitarian sont utilisées et si elles ne sont pas disponibles, les limites gbOpen sont remplacées.`
            }
          },
          adaptationOptions: {
            title: {
              en: htl.html`Adaptation and mitigation options`,
              fr: htl.html`Options d’adaptation et d’atténuation`
            },
            body: {
              en: htl.html`Adaptation and mitigation options were compiled through literature review and expert input.`,
              fr: htl.html`Les options d'adaptation et d'atténuation ont été compilées grâce à une revue de la littérature et à la contribution d'experts.`
            }
          },
          methods: {
            title: {
              en: htl.html`Methods`,
              fr: htl.html`Méthodologie`
            }
          },
          prioritizationAnalysis: {
            title: {
              en: htl.html`Prioritization analysis`,
              fr: htl.html`Analyse de priorisation`
            },
            body: {
              en: htl.html`All indicators were normalized by dividing the value of each indicator per country by the maximum value across all considered countries to rank countries and visualize adaptation and mitigation indicators. Each normalized exposure indicator was then weighted and summed, creating a unique adaptation index. Adaptation indicators were four: (i) TLUs exposed to climate hazards, (ii) rural population exposed to climate hazards, (iii) value of production exposed to climate hazards, and (iv) pasture area exposed to climate hazards. For the case of mitigation, each indicator corresponding to emissions was normalized by dividing by the maximum value across geographies. A total of six individual indicators were considered, namely, emissions from bovine, pigs, poultry, shoats, forest loss to pasture, and forest loss to soybean. In the prioritization analysis, a weight factor is considered that shifts the relative importance of adaptation and mitigation.`,
              fr: htl.html`Tous les indicateurs ont été normalisés en divisant la valeur de chaque indicateur par pays par la valeur maximale pour tous les pays considérés afin de classer les pays et de visualiser les indicateurs d'adaptation et d'atténuation. Chaque indicateur d'exposition normalisé a ensuite été pondéré et additionné, créant ainsi un indice d'adaptation unique. Les indicateurs d'adaptation étaient au nombre de quatre : (i) les UGT exposées aux aléas climatiques, (ii) la population rurale exposée aux aléas climatiques, (iii) la valeur de la production exposée aux aléas climatiques et (iv) la superficie des pâturages exposée aux aléas climatiques. Dans le cas de l’atténuation, chaque indicateur correspondant aux émissions a été normalisé en divisant par la valeur maximale selon les zones géographiques. Au total, six indicateurs individuels ont été pris en compte, à savoir les émissions provenant des bovins, des porcs, de la volaille, des chevreuils, la perte de forêt au profit des pâturages et la perte de forêt au profit du soja. Dans l’analyse de priorisation, un facteur de pondération est pris en compte, qui modifie l’importance relative de l’adaptation et de l’atténuation.`
            }
          },
          references: {
            title: {
              en: htl.html`References`,
              fr: htl.html`Les références`
            },
            body: {
              en: htl.html`
<ul>
  <li>Bonilla-Cedrez, C., Steward, P., Rosenstock, T.S., Thornton, P.K., Arango, J., Kropff, M., and Ramirez-Villegas, J. 2023. Priority areas for investment in more sustainable and climate-resilient livestock systems. Nature Sustainability, 6, 1279–1286. <a href="https://doi.org/10.1038/s41893-023-01161-1">https://doi.org/10.1038/s41893-023-01161-1</a></li>
  <li>Goldman, E., Weisse, M. J., Harris, N. & Schneider, M. (2020) Estimating the Role of Seven Commodities in Agriculture-Linked Deforestation: Oil Palm, Soy, Cattle, Wood Fiber, Cocoa, Coffee, and Rubber. World Resources Institute.</li>
  <li>Hansen, M. C. et al. (2013) High-resolution global maps of 21st-century forest cover change. Science 342, 850–853. <a href="https://doi.org/10.1126/science.1244693">https://doi.org/10.1126/science.1244693</a></li>
  <li>Herrero, M. et al. (2013) Biomass use, production, feed efficiencies, and greenhouse gas emissions from global livestock systems. Proc. Natl Acad. Sci. USA 110, 20888–20893. <a href="https://doi.org/10.1073/pnas.1308149110">https://doi.org/10.1073/pnas.1308149110</a></li>
  <li>Robinson TP, Thornton PK, Franceschini G, Kruska RL, Chiozza F, et al. (2011) Global livestock production systems. Rome: Food and Agriculture Organization of the United Nations (FAO) and International Livestock Research Institute (ILRI). pp. 152.</li>
  <li>Soto-Navarro, C. et al. (2020) Mapping co-benefits for carbon storage and biodiversity to inform conservation policy and action. Phil. Trans. R. Soc. B Biol. Sci. 375, 20190128. <a href="https://doi.org/10.1098/rstb.2019.0128">https://doi.org/10.1098/rstb.2019.0128</a></li>
  <li>Thornton, P., Nelson, G., Mayberry, D. & Herrero, M. (2021) Increases in extreme heat stress in domesticated livestock species during the twenty‐first century. Glob. Change Biol. 27, 5762–5772. <a href="https://doi.org/10.1111/gcb.15825">https://doi.org/10.1111/gcb.15825</a></li>
</ul>`,
              fr: htl.html`
<ul>
  <li>Bonilla-Cedrez, C., Steward, P., Rosenstock, T.S., Thornton, P.K., Arango, J., Kropff, M., and Ramirez-Villegas, J. 2023. Priority areas for investment in more sustainable and climate-resilient livestock systems. Nature Sustainability, 6, 1279–1286. <a href="https://doi.org/10.1038/s41893-023-01161-1">https://doi.org/10.1038/s41893-023-01161-1</a></li>
  <li>Goldman, E., Weisse, M. J., Harris, N. & Schneider, M. (2020) Estimating the Role of Seven Commodities in Agriculture-Linked Deforestation: Oil Palm, Soy, Cattle, Wood Fiber, Cocoa, Coffee, and Rubber. World Resources Institute.</li>
  <li>Hansen, M. C. et al. (2013) High-resolution global maps of 21st-century forest cover change. Science 342, 850–853. <a href="https://doi.org/10.1126/science.1244693">https://doi.org/10.1126/science.1244693</a></li>
  <li>Herrero, M. et al. (2013) Biomass use, production, feed efficiencies, and greenhouse gas emissions from global livestock systems. Proc. Natl Acad. Sci. USA 110, 20888–20893. <a href="https://doi.org/10.1073/pnas.1308149110">https://doi.org/10.1073/pnas.1308149110</a></li>
  <li>Robinson TP, Thornton PK, Franceschini G, Kruska RL, Chiozza F, et al. (2011) Global livestock production systems. Rome: Food and Agriculture Organization of the United Nations (FAO) and International Livestock Research Institute (ILRI). pp. 152.</li>
  <li>Soto-Navarro, C. et al. (2020) Mapping co-benefits for carbon storage and biodiversity to inform conservation policy and action. Phil. Trans. R. Soc. B Biol. Sci. 375, 20190128. <a href="https://doi.org/10.1098/rstb.2019.0128">https://doi.org/10.1098/rstb.2019.0128</a></li>
  <li>Thornton, P., Nelson, G., Mayberry, D. & Herrero, M. (2021) Increases in extreme heat stress in domesticated livestock species during the twenty‐first century. Glob. Change Biol. 27, 5762–5772. <a href="https://doi.org/10.1111/gcb.15825">https://doi.org/10.1111/gcb.15825</a></li>
</ul>`
            }
          }
        }
      }
    },
    general : {
      "admin0_ISO3": {
        "AGO": {
          "en": "Angola",
          "fr": "Angola"
        },
        "BEN": {
          "en": "Benin",
          "fr": "Bénin"
        },
        "BWA": {
          "en": "Botswana",
          "fr": "Botswana"
        },
        "BFA": {
          "en": "Burkina Faso",
          "fr": "Burkina Faso"
        },
        "BDI": {
          "en": "Burundi",
          "fr": "Burundi"
        },
        "CMR": {
          "en": "Cameroon",
          "fr": "Cameroun"
        },
        "CAF": {
          "en": "Central African Republic",
          "fr": "République Centrafricaine"
        },
        "TCD": {
          "en": "Chad",
          "fr": "Tchad"
        },
        "COG": {
          "en": "Congo - Brazzaville",
          "fr": "Congo - Brazzaville"
        },
        "COD": {
          "en": "Congo - Kinshasa",
          "fr": "Congo - Kinshasa"
        },
        "CIV": {
          "en": "Côte d’Ivoire",
          "fr": "Côte d’Ivoire"
        },
        "DJI": {
          "en": "Djibouti",
          "fr": "Djibouti"
        },
        "GNQ": {
          "en": "Equatorial Guinea",
          "fr": "Guinée Équatoriale"
        },
        "ERI": {
          "en": "Eritrea",
          "fr": "Érythrée"
        },
        "SWZ": {
          "en": "Eswatini",
          "fr": "Eswatini"
        },
        "ETH": {
          "en": "Ethiopia",
          "fr": "Éthiopie"
        },
        "GAB": {
          "en": "Gabon",
          "fr": "Gabon"
        },
        "GMB": {
          "en": "Gambia",
          "fr": "Gambie"
        },
        "GHA": {
          "en": "Ghana",
          "fr": "Ghana"
        },
        "GIN": {
          "en": "Guinea",
          "fr": "Guinée"
        },
        "GNB": {
          "en": "Guinea-Bissau",
          "fr": "Guinée-Bissau"
        },
        "KEN": {
          "en": "Kenya",
          "fr": "Kenya"
        },
        "LSO": {
          "en": "Lesotho",
          "fr": "Lesotho"
        },
        "LBR": {
          "en": "Liberia",
          "fr": "Libéria"
        },
        "MDG": {
          "en": "Madagascar",
          "fr": "Madagascar"
        },
        "MWI": {
          "en": "Malawi",
          "fr": "Malawi"
        },
        "MLI": {
          "en": "Mali",
          "fr": "Mali"
        },
        "MRT": {
          "en": "Mauritania",
          "fr": "Mauritanie"
        },
        "MOZ": {
          "en": "Mozambique",
          "fr": "Mozambique"
        },
        "NAM": {
          "en": "Namibia",
          "fr": "Namibie"
        },
        "NER": {
          "en": "Niger",
          "fr": "Niger"
        },
        "NGA": {
          "en": "Nigeria",
          "fr": "Nigéria"
        },
        "RWA": {
          "en": "Rwanda",
          "fr": "Rwanda"
        },
        "SEN": {
          "en": "Senegal",
          "fr": "Sénégal"
        },
        "SLE": {
          "en": "Sierra Leone",
          "fr": "Sierra Leone"
        },
        "SOM": {
          "en": "Somalia",
          "fr": "Somalie"
        },
        "ZAF": {
          "en": "South Africa",
          "fr": "Afrique du Sud"
        },
        "SSD": {
          "en": "South Sudan",
          "fr": "Soudan du Sud"
        },
        "SDN": {
          "en": "Sudan",
          "fr": "Soudan"
        },
        "TZA": {
          "en": "Tanzania",
          "fr": "Tanzanie"
        },
        "TGO": {
          "en": "Togo",
          "fr": "Togo"
        },
        "UGA": {
          "en": "Uganda",
          "fr": "Ouganda"
        },
        "ZMB": {
          "en": "Zambia",
          "fr": "Zambie"
        },
        "ZWE": {
          "en": "Zimbabwe",
          "fr": "Zimbabwe"
        },
        "TOTAL" : {
          "en": "Total",
          "fr": "Total"
        },
      },
      country_article1: {
          "AGO": {"en": "Angola", "fr": "L’Angola"},
          "BEN": {"en": "Benin", "fr": "Le Bénin"},
          "BWA": {"en": "Botswana", "fr": "Le Botswana"},
          "BFA": {"en": "Burkina Faso", "fr": "Le Burkina Faso"},
          "BDI": {"en": "Burundi", "fr": "Le Burundi"},
          "CMR": {"en": "Cameroon", "fr": "Le Cameroun"},
          "CAF": {"en": "Central African Republic", "fr": "La République Centrafricaine"},
          "TCD": {"en": "Chad", "fr": "Le Tchad"},
          "COG": {"en": "Congo - Brazzaville", "fr": "Le Congo - Brazzaville"},
          "COD": {"en": "Congo - Kinshasa", "fr": "Le Congo - Kinshasa"},
          "CIV": {"en": "Côte d'Ivoire", "fr": "La Côte d'Ivoire"},
          "DJI": {"en": "Djibouti", "fr": "Djibouti"},
          "GNQ": {"en": "Equatorial Guinea", "fr": "La Guinée Équatoriale"},
          "ERI": {"en": "Eritrea", "fr": "L’Érythrée"},
          "SWZ": {"en": "Eswatini", "fr": "L’Eswatini"},
          "ETH": {"en": "Ethiopia", "fr": "L’Éthiopie"},
          "GAB": {"en": "Gabon", "fr": "Le Gabon"},
          "GMB": {"en": "Gambia", "fr": "La Gambie"},
          "GHA": {"en": "Ghana", "fr": "Le Ghana"},
          "GIN": {"en": "Guinea", "fr": "La Guinée"},
          "GNB": {"en": "Guinea-Bissau", "fr": "La Guinée-Bissau"},
          "KEN": {"en": "Kenya", "fr": "Le Kenya"},
          "LSO": {"en": "Lesotho", "fr": "Le Lesotho"},
          "LBR": {"en": "Liberia", "fr": "Le Libéria"},
          "MDG": {"en": "Madagascar", "fr": "Madagascar"},
          "MWI": {"en": "Malawi", "fr": "Le Malawi"},
          "MLI": {"en": "Mali", "fr": "Le Mali"},
          "MRT": {"en": "Mauritania", "fr": "La Mauritanie"},
          "MOZ": {"en": "Mozambique", "fr": "Le Mozambique"},
          "NAM": {"en": "Namibia", "fr": "La Namibie"},
          "NER": {"en": "Niger", "fr": "Le Niger"},
          "NGA": {"en": "Nigeria", "fr": "Le Nigéria"},
          "RWA": {"en": "Rwanda", "fr": "Le Rwanda"},
          "SEN": {"en": "Senegal", "fr": "Le Sénégal"},
          "SLE": {"en": "Sierra Leone", "fr": "Sierra Leone"},
          "SOM": {"en": "Somalia", "fr": "La Somalie"},
          "ZAF": {"en": "South Africa", "fr": "L’Afrique du Sud"},
          "SSD": {"en": "South Sudan", "fr": "Le Soudan du Sud"},
          "SDN": {"en": "Sudan", "fr": "Le Soudan"},
          "TZA": {"en": "Tanzania", "fr": "La Tanzanie"},
          "TGO": {"en": "Togo", "fr": "Le Togo"},
          "UGA": {"en": "Uganda", "fr": "L’Ouganda"},
          "ZMB": {"en": "Zambia", "fr": "La Zambie"},
          "ZWE": {"en": "Zimbabwe", "fr": "Le Zimbabwe"}
      },    
      country_article2: {
          "AGO": {"en": "Angola", "fr": "En Angola"},
          "BEN": {"en": "Benin", "fr": "Au Bénin"},
          "BWA": {"en": "Botswana", "fr": "Au Botswana"},
          "BFA": {"en": "Burkina Faso", "fr": "Au Burkina Faso"},
          "BDI": {"en": "Burundi", "fr": "Au Burundi"},
          "CMR": {"en": "Cameroon", "fr": "Au Cameroun"},
          "CAF": {"en": "Central African Republic", "fr": "En République Centrafricaine"},
          "TCD": {"en": "Chad", "fr": "Au Tchad"},
          "COG": {"en": "Congo - Brazzaville", "fr": "Au Congo - Brazzaville"},
          "COD": {"en": "Congo - Kinshasa", "fr": "Au Congo - Kinshasa"},
          "CIV": {"en": "Côte d'Ivoire", "fr": "En Côte d'Ivoire"},
          "DJI": {"en": "Djibouti", "fr": "A Djibouti"},
          "GNQ": {"en": "Equatorial Guinea", "fr": "En Guinée Équatoriale"},
          "ERI": {"en": "Eritrea", "fr": "En Érythrée"},
          "SWZ": {"en": "Eswatini", "fr": "En Eswatini"},
          "ETH": {"en": "Ethiopia", "fr": "En Éthiopie"},
          "GAB": {"en": "Gabon", "fr": "Au Gabon"},
          "GMB": {"en": "Gambia", "fr": "En Gambie"},
          "GHA": {"en": "Ghana", "fr": "Au Ghana"},
          "GIN": {"en": "Guinea", "fr": "En Guinée"},
          "GNB": {"en": "Guinea-Bissau", "fr": "En Guinée-Bissau"},
          "KEN": {"en": "Kenya", "fr": "Au Kenya"},
          "LSO": {"en": "Lesotho", "fr": "Au Lesotho"},
          "LBR": {"en": "Liberia", "fr": "Au Libéria"},
          "MDG": {"en": "Madagascar", "fr": "À Madagascar"},
          "MWI": {"en": "Malawi", "fr": "Au Malawi"},
          "MLI": {"en": "Mali", "fr": "Au Mali"},
          "MRT": {"en": "Mauritania", "fr": "En Mauritanie"},
          "MOZ": {"en": "Mozambique", "fr": "Au Mozambique"},
          "NAM": {"en": "Namibia", "fr": "En Namibie"},
          "NER": {"en": "Niger", "fr": "Au Niger"},
          "NGA": {"en": "Nigeria", "fr": "Au Nigéria"},
          "RWA": {"en": "Rwanda", "fr": "Au Rwanda"},
          "SEN": {"en": "Senegal", "fr": "Au Sénégal"},
          "SLE": {"en": "Sierra Leone", "fr": "À Sierra Leone"},
          "SOM": {"en": "Somalia", "fr": "En Somalie"},
          "ZAF": {"en": "South Africa", "fr": "En Afrique du Sud"},
          "SSD": {"en": "South Sudan", "fr": "Au Soudan du Sud"},
          "SDN": {"en": "Sudan", "fr": "Au Soudan"},
          "TZA": {"en": "Tanzania", "fr": "En Tanzanie"},
          "TGO": {"en": "Togo", "fr": "Au Togo"},
          "UGA": {"en": "Uganda", "fr": "En Ouganda"},
          "ZMB": {"en": "Zambia", "fr": "En Zambie"},
          "ZWE": {"en": "Zimbabwe", "fr": "Au Zimbabwe"}
      },
      lps :{
          "Mixed irrigated": {en: "Mixed Irrigated", fr: "Mixte Irrigué"},
          "Mixed rainfed": {en: "Mixed Rainfed", fr: "Mixte Pluvial"},
          "Rangelands": {en: "Rangelands", fr: "Pâturages"},
          "Other": {en: "Other", fr: "Autre"},
          MIA: {en: "Mixed irrigated arid",  fr: "Mixte irrigué aride"},
          MIH: {en: "Mixed irrigated humid",  fr: "Mixte irrigué humide"},
          MIT: {en: "Mixed irrigated temperate", fr: "Mixte irrigué tempéré"},
          MIY: {en: "Mixed irrigated hyperarid", fr: "Mixte irrigué hyperaride"},
          MRA: {en: "Mixed rainfed arid", fr: "Mixte pluvial aride"},
          MRH: {en: "Mixed rainfed humid", fr: "Mixte pluvial humide"},
          MRT: {en: "Mixed rainfed temperate", fr: "Mixte pluvial tempéré"},
          MRY: {en: "Mixed rainfed hyperarid", fr: "Mixte pluvial hyperaride"},
          LGA: {en: "Rangelands arid", fr: "Pâturages arides"},
          LGH: {en: "Rangelands humid", fr: "Pâturages humides"},
          LGT: {en: "Rangelands temperate", fr: "Pâturages tempérés"},
          LGY: {en: "Rangelands hyperarid", fr: "Pâturages hyperarides"}
      }
    }
  }
}

td = {
  // translation data
  return {
    leversChangeMap: {
      // uses data values from map data (hazards/emissions)
      "Tropical livestock units": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.hazards.tlu.name
      ),
      "Pasture area": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.hazards.pastureArea.name
      ),
      "Rural population": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.hazards.popRural.name
      ),
      "Value of production": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.hazards.vop.name
      ),
      "bovine": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.emissions.values.bovine
      ),
      "pig": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.emissions.values.pig
      ),
      "poultry": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.emissions.values.poultry
      ),
      "shoat": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.emissions.values.shoat
      ),
      "forest loss to pasture": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.emissions.values.flPasture
      ),
      "forest loss to soy": _lang(
        nbText.sections.leversOfChange.chart.map.tooltip.data.emissions.values.flSoy
      ),
    }
  };
}