/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/* NOOTROHOLIC CHILD THEME: Typography and heading font styling controlled by GeneratePress Customizer. */

body.single-post .entry-content {
  --nh-g: #ddeb9d;
  --nh-h: #4a245e;
  --nh-l: #04c;
  --nh-n: #213448;
  --nh-i: #263544;
  --nh-m: #596775;
  --nh-d: #e2e8ed;
  --nh-s: #f5f8fa;
  --nh-r: 14px;
  overflow-wrap: break-word;
}

.single-post .entry-content :where(p,ul,ol,dl) {
  margin-block: 0 1.4em;
}

.single-post .entry-content :where(ul,ol) {
  padding-inline-start: 1.4em;
  margin-inline-start: 0;
}

.single-post .entry-content li {
  padding-inline-start: .25em;
  margin-block: .5em;
}

.single-post .entry-content li::marker {
  color: var(--nh-n);
}

.single-post .entry-content li>:where(ul,ol) {
  margin-block: .5em;
}

.single-post .entry-content h2 {
  display: block;
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
  margin: 2.2em 0 .8em;
  padding: 0 0 .3em;
  border: 0;
  border-bottom: 4px solid var(--nh-g);
  scroll-margin-top: 130px;
}

.single-post .entry-content h3 {
  margin: 1.8em 0 .65em;
  scroll-margin-top: 130px;
}

.single-post .entry-content h4 {
  margin: 1.6em 0 .6em;
  scroll-margin-top: 130px;
}

.single-post .entry-content>:first-child {
  margin-block-start: 0;
}

.single-post .entry-content :where(p,li,dt,dd,td,th,figcaption,blockquote) a:not(.btn-primary,.button,.wp-element-button,.wp-block-button__link,[role=button]):not(:has(img,picture,svg)) {
  color: var(--nh-l);
  border-bottom: 0;
  padding-bottom: 0;
  text-decoration-line: underline;
  text-decoration-color: rgba(0,68,204,.4);
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  text-decoration-skip-ink: auto;
  transition: color .18s ease,text-decoration-color .18s ease;
}

.single-post .entry-content :where(p,li,dt,dd,td,th,figcaption,blockquote) a:not(.btn-primary,.button,.wp-element-button,.wp-block-button__link,[role=button]):not(:has(img,picture,svg)):hover {
  color: var(--nh-h);
  text-decoration-color: currentColor;
}

.single-post .entry-content a[rel~=sponsored]:not(.btn-primary,.button,.wp-element-button,.wp-block-button__link,[role=button]):not(:has(img,picture,svg))::after {
  content: "↗";
  display: inline-block;
  margin-inline-start: .18em;
  color: currentColor;
}

.single-post .entry-content a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
  border-radius: 2px;
}

.single-post .entry-content table {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 2rem 0;
  overflow-x: auto;
  border: 1px solid var(--nh-d);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--nh-r);
  background: #fff;
  box-shadow: 0 12px 30px -18px rgba(25,47,69,.28),0 2px 6px rgba(25,47,69,.035);
  scrollbar-width: thin;
  scrollbar-color: #a8b8c6 #edf2f5;
}

.single-post .entry-content .wp-block-table {
  max-width: 100%;
  margin: 2rem 0;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #a8b8c6 #edf2f5;
}

.single-post .entry-content .wp-block-table table {
  display: table;
  margin: 0;
}

.single-post .entry-content .wp-block-table table.has-fixed-layout {
  table-layout: auto;
}

.single-post .entry-content table th {
  box-sizing: border-box;
  min-width: 145px;
  padding: 19px 22px;
  border: 0;
  border-bottom: 3px solid var(--nh-g);
  background: var(--nh-n);
  background-image: linear-gradient(135deg,rgba(255,255,255,.055),transparent 70%);
  color: #fff;
  text-align: start;
  vertical-align: middle;
  white-space: normal;
}

.single-post .entry-content table thead {
  border: 0;
}

.single-post .entry-content table th+th {
  border-inline-start: 1px solid rgba(255,255,255,.12);
}

.single-post .entry-content table th a:not(.button,.btn-primary,.wp-block-button__link) {
  color: inherit;
  text-decoration-color: rgba(255,255,255,.6);
}

.single-post .entry-content table th a:not(.button,.btn-primary,.wp-block-button__link):hover {
  color: var(--nh-g);
  text-decoration-color: currentColor;
}

.single-post .entry-content table td {
  box-sizing: border-box;
  min-width: 145px;
  padding: 18px 22px;
  border: 0;
  border-bottom: 1px solid var(--nh-d);
  background: #fff;
  color: var(--nh-i);
  text-align: start;
  vertical-align: top;
  transition: background-color .18s ease;
}

.single-post .entry-content table td+td {
  border-inline-start: 1px solid #edf1f4;
}

.single-post .entry-content table tbody tr:nth-child(even)>td {
  background: #f7f9fb;
}

.single-post .entry-content table tbody tr>td:first-child {
  min-width: 155px;
  color: var(--nh-n);
}

.single-post .entry-content table tbody th[scope=row] {
  border-bottom: 1px solid var(--nh-d);
  background: #eef3f6;
  color: var(--nh-n);
  vertical-align: top;
}

.single-post .entry-content table tbody:last-child tr:last-child>:is(td,th[scope=row]) {
  border-bottom: 0;
}

.single-post .entry-content table :is(td,th)>:last-child {
  margin-bottom: 0;
}

.single-post .entry-content table :is(td,th) :where(p,ul,ol) {
  margin-bottom: .7em;
}

@media (hover:hover) and (pointer:fine) {
  .single-post .entry-content table tbody tr:hover>td {
    background: #eef4f8;
  }
}

.single-post .entry-content table tbody tr:focus-within>td {
  background: #eef4f8;
}

.single-post .entry-content table caption {
  padding: 0 2px 12px;
  color: var(--nh-m);
  text-align: start;
}

.single-post .entry-content .wp-block-table>figcaption {
  margin-top: 12px;
  padding-inline: 2px;
  color: var(--nh-m);
  text-align: start;
}

.single-post .entry-content table tfoot td {
  background: #edf3f6;
  color: var(--nh-n);
  border-bottom: 0;
}

.single-post .entry-content blockquote {
  position: relative;
  margin: 2rem 0;
  padding: 24px 28px;
  border: 1px solid var(--nh-d);
  border-inline-start: 4px solid var(--nh-g);
  border-radius: 0 var(--nh-r) var(--nh-r) 0;
  background: var(--nh-s);
  color: var(--nh-n);
}

.single-post .entry-content blockquote p:last-of-type {
  margin-bottom: 0;
}

.single-post .entry-content blockquote cite {
  display: block;
  margin-top: 14px;
  color: var(--nh-m);
}

.single-post .entry-content :where(.wp-block-image,.wp-caption) img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

.single-post .entry-content :where(.wp-block-image figcaption,.wp-caption-text) {
  margin-top: 10px;
  color: var(--nh-m);
  text-align: center;
}

.single-post .entry-content hr {
  height: 1px;
  margin-block: 2.5rem;
  border: 0;
  background: var(--nh-d);
}

@media (max-width:768px) {
  .single-post .entry-content h2 {
    margin-top: 1.8em;
    border-bottom-width: 3px;
  }

  .single-post .entry-content table {
    border-radius: 12px;
  }

  .single-post .entry-content table :is(th,td) {
    min-width: 145px;
    padding: 15px 16px;
  }

  .single-post .entry-content blockquote {
    padding: 20px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .single-post .entry-content :is(a,td) {
    transition: none;
  }
}

#site-navigation,#sticky-navigation,#mobile-header {
  box-sizing: border-box;
  width: calc(100% - 32px);
  max-width: 1247px;
  margin: 16px auto;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 20px;
  background-image: linear-gradient(115deg,rgba(255,255,255,.075),transparent 48%,rgba(0,0,0,.065));
  box-shadow: 0 12px 32px -16px rgba(15,30,48,.45),inset 0 1px 0 rgba(255,255,255,.12);
  overflow: visible;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .inside-navigation {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  max-width: 1247px;
  min-height: 78px;
  margin-inline: auto;
  padding: 12px 22px;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .navigation-branding {
  display: flex;
  align-items: center;
  flex: 0 1 auto;
  gap: 10px;
  min-width: 0;
  margin: 0 auto 0 0;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .navigation-branding .site-logo {
  flex-shrink: 0;
  margin: 0;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .navigation-branding img,#mobile-header .mobile-header-logo img {
  display: block;
  width: auto;
  height: 42px;
  max-width: 150px;
  padding: 0;
  object-fit: contain;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .navigation-branding .main-title {
  margin: 0;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .navigation-branding .main-title a {
  display: block;
  text-decoration: none;
  overflow-wrap: anywhere;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav {
  margin-inline-start: auto;
  min-width: 0;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul {
  gap: 4px;
  align-items: center;
  flex-wrap: wrap;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul>li>a {
  position: relative;
  box-sizing: border-box;
  padding: 0 13px;
  border: 1px solid transparent;
  border-radius: 10px;
  text-decoration: none;
  transition: background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul>li:is(:hover,.sfHover)>a {
  background-image: linear-gradient(rgba(255,255,255,.045),rgba(255,255,255,.045));
  border-color: rgba(255,255,255,.14);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul>:is(.current-menu-item,.current-menu-ancestor,.current-menu-parent)>a {
  background-image: linear-gradient(rgba(255,255,255,.09),rgba(255,255,255,.045));
  border-color: rgba(255,255,255,.12);
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul>:is(.current-menu-item,.current-menu-ancestor,.current-menu-parent)>a::after {
  content: "";
  position: absolute;
  inset-inline: 13px;
  bottom: 5px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  opacity: .65;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul>li>a[href*="/peptide-finder"] {
  border-color: currentColor;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul>li>a[href*="/peptide-finder"]:hover {
  box-shadow: inset 0 0 0 1px currentColor,0 4px 12px rgba(0,0,0,.10);
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .menu-bar-items {
  flex-shrink: 0;
  gap: 6px;
  margin: 0;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .menu-bar-item>a,:is(#site-navigation,#sticky-navigation,#mobile-header) .menu-toggle {
  box-sizing: border-box;
  min-width: 44px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.19);
  border-radius: 12px;
  transition: background-color .18s ease,border-color .18s ease,box-shadow .18s ease;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .menu-bar-item>a:hover,:is(#site-navigation,#sticky-navigation,#mobile-header) .menu-toggle:hover {
  border-color: currentColor;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav ul ul {
  box-sizing: border-box;
  width: 240px;
  padding: 8px;
  border: 1px solid rgba(20,35,50,.10);
  border-radius: 14px;
  box-shadow: 0 20px 48px -14px rgba(15,30,48,.25),0 3px 8px rgba(15,30,48,.04);
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav ul ul li a {
  padding: 12px 14px;
  border-radius: 8px;
  overflow-wrap: anywhere;
  transition: background-color .18s ease,color .18s ease;
}

:is(#site-navigation,#sticky-navigation,#mobile-header) .dropdown-menu-toggle {
  padding-inline: 9px 0;
}

@media (min-width:769px) and (max-width:1100px) {
  :is(#site-navigation,#sticky-navigation) .inside-navigation {
    gap: 10px;
    padding: 14px 18px;
  }

  :is(#site-navigation,#sticky-navigation) .main-nav {
    order: 3;
    flex: 1 0 100%;
    margin: 0;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,.13);
  }

  :is(#site-navigation,#sticky-navigation) .main-nav>ul {
    justify-content: center;
  }

  :is(#site-navigation,#sticky-navigation) .main-nav>ul>li>a {
    padding-inline: 14px;
  }
}

@media (max-width:768px) {
  :is(#site-navigation,#sticky-navigation,#mobile-header) {
    width: calc(100% - 20px);
    margin-block: 10px;
    border-radius: 16px;
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header) .inside-navigation {
    min-height: 66px;
    gap: 6px;
    padding: 10px;
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header) .navigation-branding {
    flex: 1 1 0;
    gap: 7px;
    margin: 0 auto 0 0;
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header) .navigation-branding img,#mobile-header .mobile-header-logo img {
    height: 32px;
    max-width: 100px;
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header) .menu-toggle {
    flex-shrink: 0;
    margin: 0;
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header).toggled .main-nav {
    flex-basis: 100%;
    margin: 8px 0 0;
    padding-top: 8px;
    border-top: 1px solid rgba(255,255,255,.14);
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header).toggled .main-nav>ul {
    border-radius: 12px;
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav>ul>li>a {
    margin-block: 3px;
    padding: 12px 14px;
  }

  :is(#site-navigation,#sticky-navigation,#mobile-header) .main-nav ul ul {
    width: 100%;
    box-shadow: none;
  }
}

#generate-slideout-menu .main-nav>ul>li>a {
  margin: 5px 12px;
  padding: 15px 18px;
  border: 1px solid transparent;
  border-radius: 12px;
}

#generate-slideout-menu .main-nav>ul>li:is(:hover,.current-menu-item)>a {
  border-color: rgba(255,255,255,.17);
  background-image: linear-gradient(rgba(255,255,255,.07),rgba(255,255,255,.07));
}

#generate-slideout-menu .main-nav>ul>li>a[href*="/peptide-finder"] {
  border-color: currentColor;
}

#generate-slideout-menu .slideout-exit {
  min-width: 48px;
  min-height: 48px;
  border-radius: 12px;
}

:is(#site-navigation,#sticky-navigation,#mobile-header):is(.navigation-stick,.is_stuck) {
  width: 100%;
  max-width: none;
  margin: 0;
  border-radius: 0;
  border-inline: 0;
  box-shadow: 0 8px 24px -12px rgba(15,30,48,.35),inset 0 -1px 0 rgba(255,255,255,.10);
}

:is(#site-navigation,#sticky-navigation,#mobile-header,#generate-slideout-menu) :is(a,button):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

@media (prefers-reduced-motion:reduce) {
  :is(#site-navigation,#sticky-navigation,#mobile-header,#generate-slideout-menu) :is(a,button) {
    transition: none;
  }
}