/* CUSTOM CSS FOR POSTGIS */


body
{
  font-family: Arial;
}

h1, h2, h3, h4
{
  font-family: Arial Black;
  color: var(--header-font-color);
}

/* Slightly narrow the maximum content width */
main.container,
div.container
{
  max-width: 70rem;
  padding-left: 2.0rem;
  padding-right: 2.5rem;
}

header.gdoc-header {
  border-bottom: 0.2em solid var(--header-font-color);
}

/* Layout the header size */
header.gdoc-header > div.container {
  height: 140px;
  padding-right: 40px;
  padding-left: 3rem;
  padding-top: 20px;
  padding-bottom: 20px;
}

/* Search for "14rem" to makes changes to the width */
/* of the side navigation tree. Appears here and */
/* also in the @media query to handle all the reponsive */
/* details. */
aside.gdoc-nav {
/*  background-color: red;*/
  flex: 0 0 14rem;
}

aside.gdoc-nav nav {
/*  background-color: red;*/
  width: 14rem;
}


/* Place the PostGIS logo inside the Title element */
span.gdoc-brand__title {
  display:none;
}

/* Hide the default logo/icon */
img.gdoc-brand__img {
  content:var(--header-logo);
  width: 252px;
  height: 114px;
/*  background-color: yellow;*/
}

/* color of all menu icons */
svg.gdoc_home, 
svg.gdoc_menu,
svg.gdoc_arrow_back,
svg.gdoc_keyboard_arrow_right,
svg.gdoc_keyboard_arrow_left,
svg.gdoc_brightness_light,
svg.gdoc_brightness_dark,
svg.gdoc_brightness_auto
{
  color: var(--control-icons);
}

/* size of the menu icons */
.gdoc-header svg.gdoc-icon {
  width:2.3rem;
  height:2.3rem;
}

#gdoc-search-input,
div.gdoc-page__header 
{
  border-radius: 1rem;
}

article.postgis_home {
  font-size: 110%;
}

h1.postgis_home {
  margin-top: 0;
}

.postgis_event img.postgis_event_logo,
.gdoc-post img.postgis_event_logo {
  float: right;
  padding-left: 0.2rem;
  margin-right: 1.9rem;
}

div.postgis_event {
  border-bottom: solid grey 1px;
}

div.postgis_event:last-child {
  border-bottom: none;
}


.postgis_readmore {
  text-align: right;
  padding-top: 0;
  margin-top: 0;
  color: var(--link-color);
}

div.postgis_front_matter {
  font-size: 110%;
}

article.gdoc-post {
  padding: 1rem 0;
  border-top: solid grey 1px;
}

article.gdoc-post:nth-child(2) {
  border: none;
}


h1.gdoc-post__title {
  font-size: 1.6rem;
}

div.gdoc-post__readmore {
  margin-top: 1rem;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
}

div.gdoc-post__meta {
    justify-content: end;
}

div.gdoc-post__meta span {
  margin-left: 0.5rem;
}

.gdoc-markdown blockquote {
  padding-top: 0.1em;
  padding-bottom: 0.1em;
}

.donate_button {
  background-color: var(--accent-color);
  padding: 0.5em 1em;
  width: 14em;
  text-align: center;
  font-weight: bold;
  border-radius: 1em;
  border-color: var(--header-font-color);
  border-style: solid;
}

img.postgis_sponsor_logo {
  margin-right: 2em;
  margin-bottom: 1em;
}


/* Left Tree, main headers */
.gdoc-nav--main > ul > li > label a {
/*  color: red;*/
/*  background-color: red;*/
  font-size: 110%;
}

@media (max-width: 41rem) {

  img.gdoc-brand__img {
    display: inline;
  }

  .gdoc-nav{
    margin-left:-14rem;
  }

  #menu-control:checked~main .gdoc-nav nav,
  #menu-control:checked~main .gdoc-page {
    transform:translateX(14rem);
  }

}





/* Global customization */

:root {
  --code-max-height: 60rem;
}

:root,
:root[color-theme="light"] {
  --header-background: white;
  --header-font-color: #5b7b9f;
  --header-logo: url("postgis-logo-horizontal.png");

  --body-background: #ffffff;
  --body-font-color: #343a40;

  --mark-color: #ffab00;

  --button-background: #62cb97;
  --button-border-color: #4ec58a;

  --link-color: #5b7bbf;
  --link-color-visited: #5b7b9f;

  --code-background: #f5f6f8;
  --code-accent-color: #e3e7eb;
  --code-accent-color-lite: #eff1f3;
  --code-font-color: #5f5f5f;

  --code-copy-background: #f5f6f8;
  --code-copy-font-color: #6b7784;
  --code-copy-border-color: #adb4bc;
  --code-copy-success-color: #00c853;

  --accent-color: #e9ecef;
  --accent-color-lite: #f8f9fa;

  --control-icons: #5b7b9f;

  --footer-background: #5b7b9f;
  --footer-font-color: #ffffff;
  --footer-link-color: #ffcc5c;
  --footer-link-color-visited: #ffcc5c;
}
@media (prefers-color-scheme: light) {
  :root {
    --header-background: white;
    --header-font-color: #5b7b9f;
    --header-logo: url("postgis-logo-horizontal.png");

    --body-background: #ffffff;
    --body-font-color: #343a40;

    --mark-color: #ffab00;

    --button-background: #62cb97;
    --button-border-color: #4ec58a;

    --link-color: #518169;
    --link-color-visited: #c54e8a;

    --code-background: #f5f6f8;
    --code-accent-color: #e3e7eb;
    --code-accent-color-lite: #eff1f3;
    --code-font-color: #5f5f5f;

    --code-copy-background: #f5f6f8;
    --code-copy-font-color: #6b7784;
    --code-copy-border-color: #adb4bc;
    --code-copy-success-color: #00c853;

    --accent-color: #e9ecef;
    --accent-color-lite: #f8f9fa;

    --control-icons: #5b7b9f;

    --footer-background: #5b7b9f;
    --footer-font-color: #ffffff;
    --footer-link-color: #ffcc5c;
    --footer-link-color-visited: #ffcc5c;
  }
}

:root[color-theme="dark"] {
  --header-background: #112b3c;
  --header-font-color: lightgrey;
  --header-logo: url("postgis-logo-horizontal-dark.png");

  --body-background: #343a40;
  --body-font-color: #ced3d8;

  --mark-color: #ffab00;

  --button-background: #62cb97;
  --button-border-color: #4ec58a;

  --link-color: #7ac29e;
  --link-color-visited: #c27a9e;

  --code-background: #2f353a;
  --code-accent-color: #262b2f;
  --code-accent-color-lite: #2b3035;
  --code-font-color: #b9b9b9;

  --code-copy-background: #343a40;
  --code-copy-font-color: #6b7784;
  --code-copy-border-color: #6b7784;
  --code-copy-success-color: #37905c;

  --accent-color: #2b3035;
  --accent-color-lite: #2f353a;

  --control-icons: lightgrey;

  --footer-background: #112b3c;
  --footer-font-color: #ffffff;
  --footer-link-color: #ffcc5c;
  --footer-link-color-visited: #ffcc5c;
}
@media (prefers-color-scheme: dark) {
  :root {
    --header-background: #112b3c;
    --header-font-color: lightgrey;
    --header-logo: url("postgis-logo-horizontal-dark.png");
    
    --body-background: #343a40;
    --body-font-color: #ced3d8;

    --mark-color: #ffab00;

    --button-background: #62cb97;
    --button-border-color: #4ec58a;

    --link-color: #7ac29e;
    --link-color-visited: #c27a9e;

    --code-background: #2f353a;
    --code-accent-color: #262b2f;
    --code-accent-color-lite: #2b3035;
    --code-font-color: #b9b9b9;

    --code-copy-background: #343a40;
    --code-copy-font-color: #6b7784;
    --code-copy-border-color: #6b7784;
    --code-copy-success-color: #37905c;

    --accent-color: #2b3035;
    --accent-color-lite: #2f353a;

    --control-icons: lightgray;

    --footer-background: #112b3c;
    --footer-font-color: #ffffff;
    --footer-link-color: #ffcc5c;
    --footer-link-color-visited: #ffcc5c;
  }
}