/* GE4: left-aligned layout, modest logo size, hide Ctrl+K hint */

*, *::before, *::after {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  text-align: left;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.Layout,
.VPNav,
.VPNavBar,
.VPNavBar .wrapper,
.VPNavBar .container,
.VPLocalNav,
.VPLocalNav .container,
.VPSidebar,
.VPContent,
.VPDoc,
.VPDoc .container,
.VPDoc .content,
.VPDoc .content-container,
main,
.vp-doc,
.vp-doc p,
.vp-doc h1,
.vp-doc h2,
.vp-doc h3,
.vp-doc blockquote,
.vp-doc li {
  text-align: left !important;
}

.VPNavBar .wrapper {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.VPNavBar .container {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  justify-content: space-between !important;
}

.VPDoc .container,
.VPLocalNav .container {
  margin-left: 0 !important;
  margin-right: auto !important;
  max-width: 980px !important;
  justify-content: flex-start !important;
}

.VPDoc .content,
.VPDoc .content-container {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.VPSidebar {
  text-align: left !important;
}

/* TecEco-style: Column B is a dropdown of Column A, inset when open */
.VPSidebarItem.level-1.collapsible.collapsed > .items {
  display: none !important;
}

.VPSidebarItem.level-1.collapsible:hover > .items,
.VPSidebarItem.level-1.collapsible:focus-within > .items,
.VPSidebarItem.level-1.collapsible:not(.collapsed) > .items {
  display: block !important;
}

.VPSidebarItem.level-2 {
  padding-left: 14px !important;
}

.VPSidebarItem.level-2 .text {
  font-size: 15px !important;
}

/* Menu type +2px for easier reading */
.VPSidebar .text,
.VPSidebarItem .text {
  font-size: 17px !important;
  line-height: 1.45 !important;
}

/* Logo +10% on current size (was 58px / 240px) */
.VPImage.logo,
.VPNavBarTitle img.logo,
.VPNavBarTitle .logo {
  width: auto !important;
  height: 64px !important;
  max-width: 264px !important;
  object-fit: contain !important;
  object-position: left center !important;
  border-radius: 0 !important;
  transform: none !important;
  display: block;
}

.VPNavBarTitle,
.VPNavBarTitle .title {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* Show magnifying glass + "Search" only — hide Ctrl+K */
.DocSearch-Button-Keys {
  display: none !important;
}

/* Search: right-aligned in the header, clear of the logo column */
.VPNavBar .content {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.VPNavBar .content-body {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  width: 100% !important;
}

.VPNavBarSearch,
.VPNavBarSearch.search {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  padding-left: 0 !important;
  margin-left: auto !important;
}

/* Empty top overlay: this site has no header links, so hide it.
   The three-line button now opens the left-hand page menu instead. */
.VPNavScreen {
  display: none !important;
}

.vp-doc img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 1em 0;
}

.vp-doc table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  margin: 1em 0;
}

.vp-doc td,
.vp-doc th {
  border: 1px solid #d0d0d0;
  padding: 6px 8px;
  vertical-align: top;
}

/* Desktop: shift left; line Home up with the coin */
@media (min-width: 960px) {
  .VPNavBar.has-sidebar .wrapper {
    padding-left: 0 !important;
  }

  .VPNavBar.has-sidebar .title {
    padding-left: 8px !important;
    width: 220px !important;
    max-width: 220px !important;
  }

  .VPSidebar,
  .VPSidebar[data-v-319d5ca6] {
    left: 0 !important;
    width: 220px !important;
    max-width: 220px !important;
    padding-left: 12px !important; /* ~coin left edge */
    padding-right: 12px !important;
  }

  .VPContent.has-sidebar {
    padding-left: 220px !important;
    padding-right: 0 !important;
  }

  .VPNavBar.has-sidebar .divider {
    padding-left: 220px !important;
  }

  .VPNavBar {
    min-height: 80px !important;
  }

  .VPNavBar.has-sidebar .content {
    padding-left: 220px !important;
    padding-right: 16px !important;
  }
}

/* Stop wide screens pushing the menu inward */
@media (min-width: 1440px) {
  .VPNavBar.has-sidebar .title {
    padding-left: 8px !important;
    width: 220px !important;
    max-width: 220px !important;
  }

  .VPSidebar,
  .VPSidebar[data-v-319d5ca6] {
    left: 0 !important;
    width: 220px !important;
    max-width: 220px !important;
    padding-left: 12px !important;
  }

  .VPContent.has-sidebar {
    padding-left: 220px !important;
    padding-right: 0 !important;
  }

  .VPNavBar.has-sidebar .content {
    padding-left: 220px !important;
    padding-right: 16px !important;
  }

  .VPNavBar.has-sidebar .divider {
    padding-left: 220px !important;
  }
}

/* Home page: no section framing lines */
.vp-doc._ blockquote,
.vp-doc._ h2 {
  border: none !important;
  border-top: none !important;
  padding-top: 0.35em !important;
}

.vp-doc._ blockquote {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

.vp-doc._problems {
  overflow-x: auto;
}

/* Fit every Problems table row to the text, not to a stretched cell */
.vp-doc._problems table {
  display: table;
  width: auto;
  max-width: 100%;
  height: auto !important;
  border-collapse: collapse;
}

.vp-doc._problems table table {
  margin: 0 !important;
  height: auto !important;
}

.vp-doc._problems tr,
.vp-doc._problems td,
.vp-doc._problems th {
  height: 1px !important;
  line-height: 1.3 !important;
  padding: 2px 6px !important;
  vertical-align: middle !important;
}

.vp-doc._problems td p,
.vp-doc._problems th p {
  margin: 0 !important;
  line-height: 1.3 !important;
}

.vp-doc._problems td > p:has(> br):not(:has(img)) {
  display: none;
}

/*
  Enlarge the graph and its faint cell-border together.
  Scaling only the image left the box behind.
*/
.vp-doc._problems td:has(img[src$=".webp"]:not([width])) {
  zoom: 1.15;
  padding: 3px !important;
  vertical-align: top !important;
}

.vp-doc._problems td:has(img[src$=".webp"]:not([width])) img {
  width: 100%;
  max-width: 100%;
  height: auto !important;
  margin: 0;
}

/* Past Mass Extinctions: wider Primary Causes (col 4), then tighter rows */
.vp-doc._problems table.mass-extinctions,
.vp-doc._problems table[width="642"] {
  width: auto !important;
  max-width: 100%;
}

.vp-doc._problems table.mass-extinctions td:nth-child(4),
.vp-doc._problems table[width="642"] td:nth-child(4) {
  width: 230px !important;
  min-width: 210px !important;
}

.vp-doc._problems table.mass-extinctions td,
.vp-doc._problems table[width="642"] td {
  padding: 2px 5px !important;
  line-height: 1.2 !important;
  height: 1px !important;
  vertical-align: top !important;
}

/* Vertebrate populations relative to 1970: shorter, not just smaller */
.vp-doc._problems img[src*="html_2a04f112"] {
  width: 360px !important;
  height: 245px !important;
  max-width: 100%;
  object-fit: fill;
}

/* Insects in the protein food chain */
.vp-doc._problems img[src*="html_e789fa47"] {
  width: 360px !important;
  max-width: 100%;
  height: auto !important;
}

/* Soil cover, health and moisture retention */
.vp-doc._problems img[src*="html_ff4ae1e1"] {
  width: 450px !important;
  max-width: 100%;
  height: auto !important;
}

/* Figures 6, 8, 13, 17: graphs a little larger */
.vp-doc._problems td:has(img[src*="html_2dd2a89d"]),
.vp-doc._problems td:has(img[src*="html_921c49a8"]),
.vp-doc._problems td:has(img[src*="html_ecf8a60b"]),
.vp-doc._problems td:has(img[src*="html_3da1a9c5"]) {
  zoom: 1.28;
}

/* Figures 12, 21: a little more height */
.vp-doc._problems td:has(img[src*="html_3ac35b85"]),
.vp-doc._problems td:has(img[src*="html_f65a66f2"]) {
  zoom: 1.15;
  transform: scaleY(1.2);
  transform-origin: top left;
}

/* Figure 11: widen the graph column and scale with it */
.vp-doc._problems td:has(img[src*="html_6892bddc"]) {
  width: 470px !important;
  min-width: 470px !important;
  zoom: 1.28;
}

/* Tighter bullet lists (helps on a phone) */
.vp-doc._problems li {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.vp-doc._problems li + li {
  margin-top: 0.12em !important;
}

/* VitePress puts a rule above every H2; drop it on Problems section 13 */
.vp-doc._problems h2.pdf-no-rule,
.vp-doc._problems h2[data-no-top-rule="1"] {
  border-top: none !important;
  padding-top: 0.35em !important;
}

.VPDocFooter {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
}

.page-end-actions {
  width: 100%;
  margin: 0 0 1.2em;
  padding: 0;
}

.page-end-actions .donate-appeal {
  margin: 0 0 0.9em;
}

.pdf-download {
  margin: 0 0 0.4em;
  padding: 12px 14px;
  border-top: 1px solid #d0d0d0;
  font-size: 15px;
  line-height: 1.45;
}

.pdf-download a {
  font-weight: 600;
  text-decoration: underline;
}

.pdf-download .pdf-note {
  display: block;
  margin-top: 4px;
  color: #555;
  font-size: 13px;
  font-weight: 400;
}

@media (max-width: 600px) {
  .VPImage.logo,
  .VPNavBarTitle img.logo {
    height: 53px !important;
    max-width: 211px !important;
  }

  .VPDoc .content,
  .VPDoc .content-container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .vp-doc._problems li + li {
    margin-top: 0.06em !important;
  }

  .vp-doc._problems li p {
    margin: 0.05em 0 !important;
    line-height: 1.3 !important;
  }
}


.donate-appeal {
  background: #fff4d6;
  border: 1px solid #e0b84a;
  padding: 12px 14px;
  margin: 1em 0 1.3em;
  font-size: 17px;
  line-height: 1.45;
}

.donate-appeal strong {
  display: inline;
}