/* Give the chart identical geometry before and during Chrome's print layout. */
html.modo-impressao.print-preparing #extensao .boxGrafico {
  width: 320px !important;
  min-width: 320px !important;
  max-width: 320px !important;
  padding-left: 32px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  position: relative !important;
  transform: none !important;
}
html.modo-impressao.print-preparing #extensao .boxGrafico :is(.grafico-container, .grafico, #chart-container, #chart) {
  width: 100% !important;
  max-width: 100% !important;
}
html.modo-impressao.print-preparing #extensao .boxGrafico :is(#chart-container, #chart) {
  height: 140px !important;
}

/* Isolate the periodic table from the rest of the page when printing. */
@media print {
  @page { size: A4 landscape; margin: 5mm; }

  html.modo-impressao,
  html.modo-impressao body {
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: #fff !important;
    color-scheme: light !important;
  }

  html.modo-impressao body > :not(main),
  html.modo-impressao main > :not(.caixaDaTabela),
  html.modo-impressao .caixaDaTabela > :not(.tabelaCompleta),
  html.modo-impressao .tabelaCompleta > :not(#campo-minado-container) {
    display: none !important;
  }

  html.modo-impressao body > .boxSetaPontoFusao {
    display: none !important;
  }

  html.modo-impressao :is(main, .caixaDaTabela, .tabelaCompleta, #campo-minado-container, #extensao) {
    display: block !important;
    position: static !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  html.modo-impressao #extensao {
    display: grid !important;
    grid-template-columns: repeat(var(--grupos), minmax(0, 1fr)) !important;
    grid-auto-rows: auto !important;
    max-width: 100% !important;
    break-inside: avoid !important;
    page-break-inside: avoid !important;
    background: #fff !important;
  }

  /* Keep the element tiles square as the grid adapts to A4 width. */
  html.modo-impressao #extensao > li.elemento {
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
    height: auto !important;
    width: 100% !important;
    align-self: start !important;
    box-sizing: border-box !important;
  }

  html.modo-impressao #extensao > * {
    min-width: 0 !important;
  }

  html.modo-impressao #extensao > li.elemento > * {
    max-width: 100% !important;
  }

  html.modo-impressao #extensao,
  html.modo-impressao #extensao * {
    visibility: visible !important;
  }

  html.modo-impressao #extensao .no-print,
  html.modo-impressao #extensao .no-print * {
    display: none !important;
  }

  /* Dark screen colors can turn into white text on white paper. */
  html[data-theme="dark"].modo-impressao #extensao,
  html[data-theme="dark"].modo-impressao #extensao :is(li, strong, em, data, abbr, b, span, div, h2),
  html.modo-impressao:is(.modo-eco, .modo-pb) #extensao,
  html.modo-impressao:is(.modo-eco, .modo-pb) #extensao :is(li, strong, em, data, abbr, b, span, div, h2) {
    color: #111 !important;
    text-shadow: none !important;
  }

  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao .elemento,
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao .seriesQuimicasCentral > li {
    background-image: none !important;
    background-color: #eee !important;
    opacity: 1 !important;
    filter: none !important;
  }

  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.metaisAlcalinos, .alc) { background-color: var(--metaisAlcalinos) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.metaisAlcalinosTerrosos, .ter) { background-color: var(--metaisAlcalinosTerrosos) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.lantanideos, .lan) { background-color: var(--lantanideos) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.actinideos, .act) { background-color: var(--actinideos) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.transicaoExterna, .ext) { background-color: var(--transicaoExterna) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.representativos, .rep) { background-color: var(--representativos) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.semiMetais, .sem) { background-color: var(--semiMetais) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.naoMetais, .h, .nao) { background-color: var(--naoMetais) !important; }
  html[data-theme="dark"].modo-impressao:not(.modo-eco):not(.modo-pb) #extensao :is(.gasesNobres, .gas) { background-color: var(--gasesNobres) !important; }

  /* A selected property supplies its own color scale, including in dark mode. */
  html.modo-impressao.print-propriedade:not(.modo-eco):not(.modo-pb) #extensao > li.elemento {
    background: var(--print-property-bg, #fff) !important;
    opacity: 1 !important;
    filter: none !important;
  }
  html.modo-impressao.print-propriedade:not(.modo-eco):not(.modo-pb) #extensao > li.elemento :is(span, strong, em, data, abbr, b, div) {
    color: var(--print-property-text, #111) !important;
    text-shadow: none !important;
  }

  /* Let the chart use its print width; beforeprint redraws its pixel geometry. */
  html.modo-impressao #extensao .boxGrafico {
    width: 320px !important;
    min-width: 320px !important;
    max-width: 320px !important;
    height: auto !important;
    margin: 0 !important;
    padding-left: 32px !important;
    box-sizing: border-box !important;
    position: relative !important;
    transform: none !important;
    break-inside: avoid !important;
  }
  html.modo-impressao #extensao .boxGrafico :is(.grafico-container, .grafico, #chart-container, #chart) {
    width: 100% !important;
    max-width: 100% !important;
  }
  html.modo-impressao #extensao .boxGrafico :is(#chart-container, #chart) {
    height: 140px !important;
  }

  html[data-theme="dark"].modo-impressao #extensao #mostradorid {
    background: #f5f5f5 !important;
    color: #111 !important;
  }

  html.modo-impressao.modo-pb #extensao,
  html.modo-impressao.modo-pb #extensao :is(li, div, strong, em, data, abbr, span, b),
  html.modo-impressao.modo-eco #extensao .elemento {
    background-color: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
  }

  html.modo-impressao.modo-pb #extensao > li.elemento {
    border: 1px solid #666 !important;
  }

  /* Print can capture an in-progress color transition instead of its final ink. */
  html.modo-impressao.modo-pb #extensao,
  html.modo-impressao.modo-pb #extensao * {
    animation: none !important;
    transition: none !important;
  }
  html.modo-impressao.modo-pb #extensao * {
    color: #111 !important;
    text-shadow: none !important;
  }
  html.modo-impressao.modo-pb #extensao .phase-exception::after,
  html.modo-impressao.modo-pb #extensao .legendaExcecaoFaseAmostra,
  html.modo-impressao.modo-pb #extensao .legendaExcecoesTabelaAmostra {
    border-color: #111 !important;
  }
  html.modo-impressao.modo-pb #extensao .dot.phase-exception-chart {
    outline-color: #111 !important;
  }

  html.modo-impressao.modo-pb #extensao .estadoeseries .boxGrafico .dot,
  html.modo-impressao.modo-pb #extensao .estadoeseries .miniTabelaDinamicaCelula:not(.miniTabelaDinamicaCelulaSemDado) {
    background-color: #111 !important;
    background-image: none !important;
  }

  html.modo-impressao.modo-pb #extensao .estadoeseries .miniTabelaDinamicaCelulaSemDado {
    background-color: #fff !important;
    border-color: #aaa !important;
  }

  html.modo-impressao.modo-pb #extensao .seriesQuimicasCentral > li {
    border: 1px solid #555 !important;
    outline: none !important;
  }

  html.modo-impressao.modo-pb #extensao .estadoeseries .btnCor {
    background: #fff !important;
    color: #111 !important;
    border: 1px solid #555 !important;
  }
  html.modo-impressao.modo-pb #extensao .estadoeseries .btnCorMax {
    border-style: dashed !important;
  }
  html.modo-impressao.modo-pb #extensao .estadoeseries .slider-track {
    background: #888 !important;
    background-image: none !important;
  }
  html.modo-impressao.modo-pb #extensao .estadoeseries input[type="range"]::-webkit-slider-thumb {
    background: #fff !important;
    border: 1px solid #333 !important;
  }

  html.modo-impressao.modo-pb #extensao .estadoeseries .bloco1s {
    border-color: #555 !important;
  }
  html.modo-impressao.modo-pb #extensao .estadoeseries .boxConfiguracaoEletronica {
    filter: grayscale(1) !important;
  }
  html.modo-impressao.modo-pb #extensao .estadoeseries .bloco1s::before,
  html.modo-impressao.modo-pb #extensao .estadoeseries .bloco1s::after {
    filter: grayscale(1) contrast(2) !important;
  }

  /* Reserve space for the outer border of group 18 on A4. */
  html.modo-impressao.modo-pb #extensao {
    width: calc(100% - 8mm) !important;
    margin-right: 8mm !important;
  }

  /* The element state color is already stored inline by the table script. */
  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="194, 13, 0"],
  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="#C20D00" i] {
    color: #c20d00 !important;
  }

  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="0, 60, 224"],
  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="#003CE0" i] {
    color: #003ce0 !important;
  }

  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="54, 54, 54"],
  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="#363636" i] {
    color: #363636 !important;
  }

  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="138, 140, 0"],
  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="#8A8C00" i] {
    color: #777900 !important;
  }

  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="88, 59, 209"],
  html.modo-impressao.modo-eco #extensao .simboloQuimico[style*="#583BD1" i] {
    color: #583bd1 !important;
  }

  html.modo-impressao.modo-eco #extensao .legendaEsquerda .divLegendaGasoso strong {
    color: #b00000 !important;
  }

  html.modo-impressao.modo-eco #extensao .legendaEsquerda .divLegendaLiquido strong {
    color: #0057b8 !important;
  }

  /* Use the table's physical-state images instead of series glyph codes. */
  html.modo-impressao.modo-pb #extensao li::after {
    content: none !important;
    display: none !important;
  }

  html.modo-impressao.modo-pb #extensao > li.elemento .simboloestadoFisico,
  html.modo-impressao.modo-pb #extensao > li.elemento .simboloestadoFisico img {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  html.modo-impressao.modo-pb #extensao > li.elemento .simboloestadoFisico img {
    display: block !important;
    width: 1em !important;
    height: 1em !important;
    filter: grayscale(1) contrast(1.8) !important;
  }

  html.modo-impressao.modo-pb #extensao img,
  html.modo-impressao.modo-pb #extensao svg {
    filter: grayscale(1) !important;
  }
}