@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Recursive:wght@300..1000&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@tailwind base;
@tailwind components;
@tailwind utilities;

/* Global Variables */
:root {
  --color-of-black: #1E1E1E;
  --color-of-orange: #EE6001;
  --color-blue-link: #0088CC;
  --color-blue-link-dark: #38BDF8;
  --color-ghost-accent: #0066CC;
}

body {
  font-family: 'Inter', 'sans-serif';
}

@layer components {
  .btn, .kg-btn, .kg-header-card-button, .kg-product-card-button {
    @apply h-fit w-fit min-w-28 px-6 py-2 rounded font-inter font-bold
    transition-all hover:brightness-[1.02] hover:shadow-sm focus:brightness-[0.98];
  }

  .text-large {
    @apply text-xl tracking-[-0.5px] leading-[135%] md:text-2xl md:tracking-[-1px];
  }

  .text-regular {
    @apply text-base leading-[175%];
  }

  .text-small {
    @apply text-sm leading-[170%];
  }

  .text-tiny {
    @apply text-xs leading-[135%];
  }
  
  .heading-huge {
    @apply font-semibold text-[2rem] tracking-[-1px] leading-[120%] md:text-5xl
    md:tracking-[-2px] md:leading-[110%];
  }

  .heading-xlarge {
    @apply font-semibold text-[1.75rem] tracking-[-1px] leading-[120%] md:text-[2rem];
  }

  .heading-large {
    @apply font-semibold text-[1.5rem] tracking-[-1px] leading-[120%];
  }

  .heading-medium {
    @apply text-xl tracking-[-0.5px] font-semibold leading-[130%];
  }

  .heading-small {
    @apply text-base font-bold leading-[140%];
  }

  .heading-tiny {
    @apply text-sm leading-[140%] font-bold;
  }


  /*******************************************************************************
    COMPONENTS
  *******************************************************************************/   

  /* Cards */
  .cards_container {
    @apply w-full h-full min-h-56 max-w-[34.375rem] text-left
    rounded-xl p-7 lg:rounded-[1.25rem] xl:min-h-[15.625rem] xl:p-[3.125rem];
  }

  /* Tiles */
  .tile {
    @apply flex flex-col bg-zinc-50 border border-neutral-200 rounded-2xl;
  }

  .tile-footer {
    @apply p-6 flex flex-wrap gap-1 items-center;
  }


  /*******************************************************************************
    FORMS
  *******************************************************************************/   
  .remove_button {
    @apply w-fit px-4 py-2 cursor-pointer rounded bg-gray-200
    transition-colors hover:bg-red-100;
  }

  .add_button {
    @apply w-fit px-4 py-2 cursor-pointer rounded transition-colors
    bg-gray-200 hover:bg-green-100;
  }

  .form-input {
    @apply w-full rounded-md px-4 py-2 bg-white border text-zinc-800;
  }

  .add_tile {
    @apply w-full h-full p-7 flex justify-center items-center rounded-xl border-2 
    border-dashed border-gray-400 bg-green-100 text-gray-800 text-xl font-semibold cursor-pointer
    lg:rounded-[1.25rem] xl:h-[15.625rem] xl:p-[3.125rem] transition-colors hover:bg-green-200;
  }

  /* Form Component: Cards */
  .card_inputs_container {
    @apply h-full w-full max-w-96 mx-auto flex flex-col justify-between;
  }
}


/*******************************************************************************
  FORMS
*******************************************************************************/   

textarea.form-input {
  field-sizing: content;
}

select.form-input {
  cursor: pointer;
}

.form-label {
  display: block;
  font-weight: 600;
  margin-bottom: 0.125rem;
}

.required::after {
  content: ' *';
  color: red;
}

.toggle-parent {
  position: relative;
  display: inline-block;
}

.toggle-parent input {
  opacity: 0;
  width: 0;
  height: 0;
}

.toggle {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  border-radius: 9999px;
  -webkit-transition: .2s;
  transition: .2s;
}

.toggle:before {
  position: absolute;
  content: "";
  height: 1.75rem;
  width: 1.75rem;
  left: 5%;
  bottom: 2px;
  background-color: white;
  border-radius: 50%;
  -webkit-transition: .2s;
  transition: .2s;
}

input:checked + .toggle {
  background-color: var(--color-blue-link);
}

input:focus + .toggle {
  box-shadow: 0 0 1px var(--color-blue-link);
}

input:checked + .toggle:before {
  left: 50%;
}


/*******************************************************************************
  FROM GHOST
*******************************************************************************/

.kg-card { width: 100%; }

.kg-align-center {
  justify-content: center;
  align-items: center;
}

/* Button */
.kg-button-card {
  margin: 0.75rem 0;
  display: flex;
}

a.kg-btn {
  color: white;
  background-color: var(--color-ghost-accent);
  text-decoration-line: none;
}

/* Call to Action */
.kg-cta-card {
  display: flex;
  flex-direction: column;
  margin-top: 3rem;
  padding: 0 1.375rem;
  border-radius: .5rem;
  color: var(--color-of-black);
  font-size: 1rem;
  letter-spacing: -0.17px;
  line-height: 1.6;

  &, & * {
    box-sizing: border-box;
  }

  @media (width >= 40rem) {
    padding: 0 1.6rem;
  }
}

.kg-cta-sponsor-label-wrapper {
  padding: .55rem 0;
  border-bottom: solid 1px rgba(124, 139, 154, 0.2);
  text-transform: uppercase;
  font-size: .75rem;
  font-weight: 600;

  @media (width >= 40rem) {
    padding: .75rem 0;
  }
}

.kg-cta-sponsor-label {
  color: color-mix(in srgb,currentColor 45%,transparent);
}

.kg-cta-content {
  padding: 1.375rem 0;

  @media (width >= 40rem) {
    padding: 1.6rem 0;
  }
}

.kg-cta-content-inner {
  display: flex;
  flex-direction: column;
  row-gap: 1.375rem;

  @media (width >= 40rem) {
    row-gap: 1.6rem;
  }
}

.kg-cta-text {
  p {
    margin: 0;
  }
}

.kg-cta-immersive.kg-cta-centered .kg-cta-text {
  text-align:center;
}

.kg-cta-immersive.kg-cta-centered .kg-cta-content-inner,
a.kg-cta-button {
  align-items:center;
}

.kg-cta-immersive.kg-cta-has-img a.kg-cta-button {
  width:100%
}

.kg-cta-image-container {
  flex-shrink:0;
}

.kg-cta-image-container img {
  width:100%;
  height:auto;
  margin:0;
  object-fit:cover;
  border-radius:6px;
}

.kg-cta-minimal .kg-cta-image-container img {
  width:4rem;
  height:4rem;
}

.kg-cta-button {
  width: max-content;
  height: 2.5rem;
  padding: 0 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: .375rem;
  font-weight: 400;
  line-height: 1.65;
  text-decoration: none;
}

.kg-cta-bg-grey {
  background-color: rgba(151, 163, 175, 0.14);
}

.kg-cta-bg-white {
  background:0 0;
  box-shadow:inset 0 0 0 1px rgba(124,139,154,.2)
}

.kg-cta-bg-blue {
  background:rgba(33,172,232,.12)
}

.kg-cta-bg-green {
  background:rgba(52,183,67,.12)
}

.kg-cta-bg-yellow {
  background:rgba(240,165,15,.13)
}

.kg-cta-bg-red {
  background:rgba(209,46,46,.11)
}

.kg-cta-bg-pink {
  background:rgba(225,71,174,.11)
}

.kg-cta-bg-purple {
  background:rgba(135,85,236,.12)
}

/* Callout */
.kg-callout-card {
  display: flex;
  padding: 1.25rem 1.75rem;
  margin: 3rem 0;
  border-radius: 0.375rem;
}

.kg-callout-emoji {
  padding: 0 0.5rem;
  margin-right: 0.5rem;
  font-family: Inter, sans-serif;
}

.kg-callout-text, .kg-callout-emoji {
  font-size: 1rem;
  line-height: 175%;
}

.kg-callout-text {
  a {
    color: blue;

    &:hover {
      text-decoration: underline;
    }
  }
}

.kg-callout-card-grey {
  background-color: rgba(171, 180, 190, 0.1);
}

.kg-callout-card-blue {
  background-color: rgba(20, 184, 255, 0.1);
}

.kg-callout-card-green {
  background-color: rgba(48, 207, 67, 0.1);
}

.kg-callout-card-yellow {
  background-color: rgba(255, 180, 31, 0.1);
}

.kg-callout-card-red {
  background-color: rgba(245, 11, 35, 0.1);
}

.kg-callout-card-pink {
  background-color: rgba(251, 45, 141, 0.1);
}

.kg-callout-card-purple {
  background-color: rgba(142, 66, 255, 0.1);
}

.kg-callout-card-accent, .kg-style-accent, .kg-product-card-btn-accent {
  background-color: var(--color-ghost-accent);
  color: white;
}

/* Product */
.kg-product-card-container {
  width: 100%;
  max-width: 34.375rem;
  margin: 1rem auto;
  display: flex;
  flex-direction: column;
  padding: 1.25rem;
  border-width: 1px;
  border-color: rgba(171, 180, 190, 0.4);
  border-radius: 0.375rem;
}

.kg-product-card-container > * {
  margin: 0;
}

.kg-product-card-title-container {
  display: inline-block;
}

.kg-product-card-title {
  font-size: 1.5rem;
  font-weight: 700;
}

.kg-product-card-rating {
  display: inline-flex;
}

.kg-product-card-rating-star > svg {
  width: 1rem;
  height: 1rem;
  fill: rgb(235, 238, 240);
}

.kg-product-card-rating-active > svg {
  fill: black;
}

.kg-product-card-description {
  color: rgb(124, 139, 154);
}

.kg-product-card-description > * {
  margin: 0.5rem 0 0;
}

.kg-product-card-button {
  margin-top: 1.5rem;
  width: 100%;
  font-weight: 500;
  letter-spacing: .1px;
  text-align: center;
  text-decoration-line: none;
}

/* Header Card */
.kg-header-card {
  position: relative;
  border-radius: 1rem;
}

.kg-header-card-content {
  padding: 5rem 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.kg-header-card-text {
  display: flex;
  flex-direction: column;
}

.kg-header-card-heading {
  margin: 0;
  font-size: 3.75rem;
  font-weight: 700;
  height: fit-content;
}

.kg-header-card-subheading {
  margin: 1.2rem 0 0 0;
  font-size: 1.5rem;
  font-weight: 500;
  display: block;
  height: fit-content;
}

.kg-header-card-button {
  margin-top: 1.2rem;
  text-decoration-line: none;
  display: block;
}

/* File Card */
.kg-file-card { width: 100%; margin: 2rem 0; }

.kg-file-card-container {
  padding: 0.5rem;
  display: flex;
  border-radius: 0.375rem;
  border-width: 1px;
  border-color: rgba(171, 180, 190, 0.3);
  text-decoration-line: none;
}

.kg-file-card-contents {
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0 0.5rem;
}

.kg-file-card-title {
  height: 1.875rem;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -.025rem;
  line-height: 1;
}

.kg-file-card-caption {
  height: 1.625rem;
  font-weight: 400;
  line-height: 1;
  padding-bottom: 0.25rem;
  color: rgb(124, 139, 154);
}

.kg-file-card-metadata {
  display: flex;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.1px;
  line-height: 1.65;
  margin-top: auto;
  color: rgb(57, 64, 71);
}

.kg-file-card-filesize {
  display: list-item;
  list-style-position: inside;
  margin-left: .25rem;
  color: rgb(124, 139, 154);
}

.kg-file-card-filesize::marker {
  content: '• '
}

.kg-file-card-icon {
  width: 100%;
  max-width: 6rem;
  height: 6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(235, 238, 240);
  border-radius: 0.375rem;
}

.kg-file-card-icon > svg {
  width: 1.5rem;
  height: 1.5rem;
  color: rgb(48, 207, 67);
}


/*******************************************************************************
  HIGHCHARTS
*******************************************************************************/

g.highcharts-annotation-label a {
  text-decoration: underline;
}


/*******************************************************************************
  BLOGS
*******************************************************************************/

#blog-body {
  .iframe-wrapper {
    position: relative;
    overflow: hidden;
  }

  .iframe-item {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
  }

  @media (width >= 40rem) {
    .iframe-item {
      height: 37.5rem;
    }
  }
}


/*******************************************************************************
  MISCELLANEOUS
*******************************************************************************/

.accordion-item {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

/***********************************************************************************************************************
  Author: Anthony Macali
  Date: 18th January 2023
 **********************************************************************************************************************/

  /* fonts */
  body { background-color:#fafafa; }
  .dash dl a { background-size:64px; background-repeat:no-repeat; background-position:right 20px center; }

/*******************************************************************************
  ARROWS
*******************************************************************************/   
  table tr td.RANK, table tr td.RANK span { font-weight:500; }
  table tr .RANK span { background-position:right 1rem center; padding-left:0; padding-right:1.5rem; } 

  table .NET { width:90px; padding-right:10px; font-size:0.95em; }
  table th.NET { text-indent:-9999px; }  

  table th.VAR { width:30px; font-size:0em; }  
  table .VAR span { margin:auto; display:block; background-position:center center; background-repeat:no-repeat; background-size:8px; }

  table th.VAR2 { width:30px; font-size:0em; }  
  table .VAR2 span { margin:auto; display:block; background-position:center center; background-repeat:no-repeat; background-size:8px; }
  
  /* image */
  table span { width:100%; display:block; background-repeat:no-repeat; background-position:5% 50%; background-size:8px; font-size:0.95em; }
  table span { padding-left:1rem; } 

  table span.red-up { color:#B00020; background-image:url(/images/arrows/red-up.svg); }
  table span.red-down { color:#B00020; background-image:url(/images/arrows/red-down.svg); }
  table span.green-up { color:#01894c;background-image:url(/images/arrows/green-up.svg); }
  table span.green-down { color:#01894c; background-image:url(/images/arrows/green-down.svg); }
  table span.zero { background-image:url(/images/arrows/circle.svg); background-size:6px; }
  table span.orange-down { color:#ef4444; background-image:url(/images/arrows/orange-down.svg); }
  table span.grey-up { color:#9ca3af;background-image:url(/images/arrows/black-up.svg); }
  table span.grey-down { color:#9ca3af; background-image:url(/images/arrows/black-down.svg); }

  span.red, dd span.red { color:#df000f; }
  span.green, dd span.green { color:#01894c; }
  span.grey, dd span.grey { color:#9ca3af; }
  span.zero, dd span.zero { color:#000; }
  span.na { font-size:0.85em; }

/*******************************************************************************
  TABLE
*******************************************************************************/   
  table tr td a { color:#006fb0; }
  table tr td a:hover { text-decoration:underline; }

  table tr th { text-align:center; }  
  table tr th:first-child { text-align:left; }
  table tr td { text-align:center; }  
  table tr td:first-child { text-align:left; overflow:hidden; text-overflow:ellipsis; }  

  tr .RANK { text-align:center; width:1px; }

  /* caption */
  .caption { padding:0.6rem 1rem; }
  .caption a { color:#006fb0; }
  .caption a:hover { text-decoration:underline; }

  /* report styles */
  table tr th:nth-child(odd) { background-color:#dadcdd; }
  table tr th:nth-child(even) { background-color:#eaeaea; }

  table tr th:first-child { width:auto; }

  table tr th, table tr td { border-right:1px solid #eaeaea; }
  table tr th:last-child, table tr td:last-child { border-right:0; }
  table  { border-bottom:1px solid #eaeaea; }

  /* last updated */
  [class^="WEB-LAST-UPDATED"] .DATE { text-align:center; width:50px; }
  [class^="WEB-LAST-UPDATED"] td.NOTE { width:100%; text-align:left; }
  
  .WEB-COLOR-PALETTE-CONFIG tr th:first-child { width:50px; }
  .WEB-COLOR-PALETTE-CONFIG tr :last-child { width:auto; text-align:left; }

  .WEB-SITEMAP tr td { width:25%; }

  /* LGA Classification */
  .inner-regional-australia { color:#854d0e; }
  .outer-regional-australia { color:#854d0e; }
  .remote-australia { color:#854d0e; }
  .very-remote-australia, .electricity { color:#854d0e; }
  .unknown { color:#000; }

/*******************************************************************************
  RESIZEABLE
*******************************************************************************/  
  /* scrollable */
  .TABLE-CONTAINER { overflow-x:auto; }  
  .TABLE-CONTAINER tr:nth-child(even), .TABLE-CONTAINER tr td:nth-child(even) .COL1 { background-color:#fff; }
  .TABLE-CONTAINER tr:nth-child(odd), .TABLE-CONTAINER tr td:nth-child(odd) .COL1 { background-color:#f8fafc; }
  
  /* expand */
  table tr td[colspan] { padding:0; border-top:1px solid #eaeaea; }
  table tr.EXPAND td[colspan] a { display:block; padding:5px 0 4px 0; }
  table tr.EXPAND td[colspan] a { background-image:url(/images/expand-button.svg); background-position:center center; background-size:14px; background-repeat:no-repeat; }  
  table tr.EXPAND td[colspan] a:hover { background-image:url(/images/expand-button.hover.svg); text-decoration:none; }

  /* country */
  td.COUNTRY, th.COUNTRY { width: 100%; text-align: left; }
  table td.COUNTRY a { padding-left:26px; background-size:16px; background-repeat:no-repeat; background-position:0 2px; }
  table td.RETAILER a { padding-left:26px; background-size:16px; background-repeat:no-repeat; background-position:0 2px; }
  table td.VERIFIED img { height:16px; margin:auto; }

  /* weather */  
  .WEATHER tr th, .WEATHER tr td { width:100px; min-width:100px; }
  .WEATHER tr .STATION { width:100%; }

  .WEATHER-MEAN tr th, .WEATHER-MEAN tr td { width:80px; min-width:80px; }
  .WEATHER-MEAN tr .MEAN { width:100%; }
  .WEATHER-TEMP tr th, .WEATHER-TEMP tr td { width:80px; min-width:80px; }
  .WEATHER-TEMP tr .TEMP { width:100%; }
  .WEATHER-RECORD tr th, .WEATHER-RECORD tr td { width:80px; min-width:80px; }
  .WEATHER-RECORD tr .METRIC { width:100%; }
  .WEATHER-RECORD-MONTHLY tr th, .WEATHER-RECORD-MONTHLY tr td { width:80px; min-width:80px; }
  .WEATHER-RECORD-MONTHLY tr .METRIC { width:100%; }
  .WEATHER-RECORD-HISTORY tr .MEASURE { width:80px; min-width:80px; }  
  .WEATHER-RECORD-HISTORY tr .METRIC { width:100%; text-align:left; }

  .TRANSPORT-REGISTRATION-POSTCODE tr .RANK { text-align:center; width:1px; }
  .TRANSPORT-REGISTRATION-POSTCODE tr :nth-child(2) { width:auto; text-align:left; }  

  .TRANSPORT-REGISTRATION-LGA tr .RANK { text-align:center; width:1px; }
  .TRANSPORT-REGISTRATION-LGA tr :nth-child(2) { width:auto; text-align:left; }  

  #page-index .ENERGY-INSTALLATIONS-POSTCODE tr .RANK { display:none; }
  .ENERGY-INSTALLATIONS-POSTCODE tr .RANK { text-align:center; width:1px; }
  .ENERGY-INSTALLATIONS-POSTCODE tr :nth-child(2) { width:auto; text-align:left; }
  .EMISSIONS-CORPORATE tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-CORPORATE tr :nth-child(2) { width:auto; text-align:left; }
  .EMISSIONS-CORPORATE-INDUSTRY tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-CORPORATE-INDUSTRY tr :nth-child(2) { width:auto; text-align:left; }    
  .EMISSIONS-CORPORATE-INDUSTRY-COMPANY tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-CORPORATE-INDUSTRY-COMPANY tr :nth-child(2) { width:auto; text-align:left; }

  .EMISSIONS-SAFEGUARD tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD tr :nth-child(2) { width:auto; text-align:left; }  
  .EMISSIONS-SAFEGUARD-BASELINE tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD-BASELINE tr :nth-child(2) { width:auto; text-align:left; }    
  .EMISSIONS-SAFEGUARD-ACCU tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD-ACCU tr :nth-child(2) { width:auto; text-align:left; } 

  .EMISSIONS-SAFEGUARD-FACILITY tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD-FACILITY tr :nth-child(2) { width:auto; text-align:left; }
  .EMISSIONS-SAFEGUARD-FACILITY-BASELINE tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD-FACILITY-BASELINE tr :nth-child(2) { width:auto; text-align:left; }
  .EMISSIONS-SAFEGUARD-FACILITY-ACCU tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD-FACILITY-ACCU tr :nth-child(2) { width:auto; text-align:left; }       

  .EMISSIONS-SAFEGUARD-INDUSTRY tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD-INDUSTRY tr :nth-child(2) { width:auto; text-align:left; }    
  .EMISSIONS-SAFEGUARD-INDUSTRY-FACILITY tr .RANK { text-align:center; width:1px; }
  .EMISSIONS-SAFEGUARD-INDUSTRY-FACILITY tr :nth-child(2) { width:auto; text-align:left; }

/*******************************************************************************
  BANNERS
*******************************************************************************/    
  .banner { background-size:24px; background-repeat:no-repeat; background-position:right 5px center; }  

  /* report debugger */
  table .TILE { width:60px; text-align:center; }
  table td.VIEW { text-align:left; }
  table .CREATED { width:150px !important; text-align:center; }
  table .UPDATED { width:150px !important; text-align:center; }

  th.SORT { cursor:pointer; background-position:right 5px center; background-size:16px; background-repeat:no-repeat; }
  th.SORT:hover { background-image:url(/images/arrows/sort-up.png); } 
  th.SORT-ASC, th.SORT-ASC:hover { background-image:url(/images/arrows/sort-up.png); }
  th.SORT-DESC, th.SORT-DESC:hover { background-image:url(/images/arrows/sort-down.png); }

/*******************************************************************************
  CHART
*******************************************************************************/   
  section.CHART div#chart { padding:0; }
  section.CHART line { stroke:#E8E8E8 !important; }
  section.CHART p.note { z-index:5; padding-right:10px; }
  section.CHART ul li { font-size:1em; margin-left:0; }

  g.y g text { font-size:0.6em; font-family:'Recursive',sans-serif; }
  g.x g text { font-size:0.6em; font-family:'Recursive',sans-serif; }
  g.chart-legend text { font-size:0.8em; font-family:'Recursive',sans-serif; }

  div.graph-svg-tip span { font-size:0.9em; font-family:'Recursive',sans-serif; }
  div.graph-svg-tip ul { font-family:'Recursive',sans-serif; }
  div.graph-svg-tip ul li { font-size:1em; }
  div.graph-svg-tip ul li strong { font-size:1.1em; }

  g.line-chart g.y-regions g text.chart-label { font-family:'Recursive',sans-serif; fill:#ef4444 !important; font-size:0.7em; }
  g.line-chart g.y-regions rect.bar { fill:#fef2f2 !important; stroke:#fecaca !important; }

/*******************************************************************************
  MENU
*******************************************************************************/     
  #menu { display:none; }

  @media screen and (max-width:768px) {  
    .EMISSIONS-CORPORATE-HISTORY .COL1 { box-shadow:2px 1px 2px rgba(0,0,0,0.05); }
    .EMISSIONS-ELECTRICITY .COL1 { box-shadow:2px 1px 2px rgba(0,0,0,0.05); }
  }

/*******************************************************************************
  EXPLAINERS
*******************************************************************************/  
  .woff {
    > ul { 
      list-style-type: disc;
      list-style-position: outside;
      padding-left: 1em;

      li { line-height: 1.8 }
    }

    a {
      color: #006fb0;


      &:hover {
        text-decoration: underline;
        text-underline-offset: 2px;
      }
    }
  }

  .DARK-CHART { background-color: #1E293B;}

/*******************************************************************************
  BLOGS
*******************************************************************************/

.prose > *:not(.prose > p:has(> iframe)) {
  max-width:850px; margin-left:auto; margin-right:auto;
}

.prose > p:has(> iframe)  {
  margin-bottom: 2rem;
}

/*******************************************************************************
  TILE
*******************************************************************************/

.tooltip { position:relative; display:inline-block; }

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

.tooltip:hover .tooltiptext { visibility:visible; }

/*******************************************************************************
  STATS
*******************************************************************************/

span.red { color:#B00020; }
span.green { color:#01894c; }

/*******************************************************************************
  ANIMATIONS
*******************************************************************************/

/* To work as intended, the following things need to be added to the element:
  - Borders width
  - Border top and the rest need to have the same width
  - Border colors (top border and the rest need different colors)
  - Width and height of the element
*/
.loader {
  margin: auto;
  border: solid #EAF0F6;
  border-radius: 50%;
  border-top: solid;
  animation: spinner 2s linear infinite;
}

@keyframes spinner {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.fade-in {
  animation: create 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes create {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.fade-out {
  animation: destroy 1s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes destroy {
  0% { opacity: 1; }
  100% { opacity: 0; }
}


/*******************************************************************************
  TEXT
*******************************************************************************/

.highlight {
  background-color: #F4C705;
  color: black;
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *



 */
/* line 19, app/assets/stylesheets/application.scss */
.sib-form button[type='submit'] .show-when-enabled {
  visibility: initial;
}

/* line 20, app/assets/stylesheets/application.scss */
.sib-form button[type='submit'] .show-when-disabled {
  display: none;
}

/* line 22, app/assets/stylesheets/application.scss */
.sib-form button[type='submit'][disabled] {
  cursor: not-allowed;
}

/* line 24, app/assets/stylesheets/application.scss */
.sib-form button[type='submit'][disabled] .show-when-enabled {
  visibility: hidden;
}

/* line 25, app/assets/stylesheets/application.scss */
.sib-form button[type='submit'][disabled] .show-when-disabled {
  display: initial;
}

/* line 28, app/assets/stylesheets/application.scss */
.sib-form button[type='submit'] .progress-indicator__icon {
  -webkit-animation: indicator-spin 1.3s cubic-bezier(0.46, 0.35, 0.39, 0.85) infinite;
  animation: indicator-spin 1.3s cubic-bezier(0.46, 0.35, 0.39, 0.85) infinite;
}

@-webkit-keyframes indicator-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}

@keyframes indicator-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn);
  }
}