@import url("colors.css");
@import url("typography.css");

body {
  font-family: var(--ff-primary);
}

em {
  font-style: italic;
}

strong {
  font-weight: 700;
}

small {
  font-size: 0.75em;
}

.button {
	display: inline-block;
	padding-block: 0.5em;
	padding-inline: 1.2em;
	border: 2px solid var(--bg-util-color, var(--clr-accent));
	border-radius: 5px;
	background-color: var(--bg-util-color, var(--clr-accent));
	color: var(--text-util-color, var(--clr-white));
	font-family: var(--ff-primary);
	font-size: 1.125rem !important;
	font-weight: 500;
	line-height: 1 !important;
	text-transform: uppercase !important;
	text-decoration: none;
	cursor: pointer;
	transition: color 100ms ease-in-out, background-color 100ms ease-in-out, border-color 100ms ease-in-out;
}

.button:is(:hover, :focus-visible) {
  border-color: var(--clr-white);
  background-color: var(--clr-white);
  color: var(--bg-util-color, var(--clr-accent));
}

.button[data-outline] {
  background-color: transparent;
  color: var(--bg-util-color, var(--clr-accent));
}

.button[data-outline]:is(:hover, :focus-visible) {
  border-color: var(--bg-util-color, var(--clr-accent));
  background-color: var(--bg-util-color, var(--clr-accent));
  color: var(--text-util-color, var(--clr-white));
}

.button[data-outline][data-hoverblack]:is(:hover, :focus-visible) {
  color: var(--clr-black);
}

.button[data-subtle] {
  border-color: var(--clr-neutral-100);
  background-color: transparent;
  color: var(--clr-white);
}

.button[data-subtle]:is(:hover, :focus-visible) {
  border-color: var(--bg-util-color, var(--clr-accent));
  background-color: var(--bg-util-color, var(--clr-accent));
  color: var(--text-util-color, var(--clr-white));
}

.button[data-ghost] {
  border-color: transparent;
  background-color: transparent;
  color: var(--clr-white);
}

.button[data-ghost]:is(:hover, :focus-visible) {
  border-color: transparent;
  background-color: transparent;
  color: var(--clr-neutral-50);
}

.docbase-button, .docbase-link {
  --_color: hsl(var(--hue-primary) var(--sat-primary) 50);
  --_color-hover: hsl(var(--hue-primary) var(--sat-primary) 65);
}

.logo img {
  max-height: inherit;
}

@media (min-width: 961px) {
  #nav-button {
    display: none;
  }
}

.nav-end {
  position: static;
}

#primary-navigation {
  z-index: 100;
  top: 100%;
  left: calc(-1 * var(--content-padding));
  right: calc(-1 * var(--content-padding));
  height: calc(100vh - 8rem);
  padding: 1rem;
  background-color: rgb(243 244 246);
  overflow: auto;
}

#primary-navigation[data-state="open"] {
  pointer-events: all;
}

.bam-toolbar {
  position: relative;
  display: flex;
  justify-content: space-between;
  padding: 0.5rem 0.75rem;
  margin-bottom: 1rem;
  background-color: var(--clr-neutral-300);
  color: var(--clr-white);
}

.mod-breadcrumbs {
  list-style: none;
  display: flex;
  visibility: hidden;
}

@media (min-width: 961px) {
  .mod-breadcrumbs {
    visibility: visible;
  }
}

.mod-breadcrumbs a {
  color: currentColor;
  text-decoration: none;
}

.mod-breadcrumbs a:is(:hover, :focus-visible) {
  color: var(--clr-neutral-50);
}

.mod-breadcrumbs__item:not(:last-of-type)::after {
  content: "\f054";
  margin: 0 1ch;
  font-family: "Font Awesome 6 Pro";
  font-size: 0.675em;
  font-weight: 900;
}

.mod-breadcrumbs__item:last-of-type {
  font-weight: 600;
}

.bam-toolbar .mod-finder {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
}

@media (min-width: 961px) {
  .bam-toolbar .mod-finder {
    left: unset;
  }
}

.mod-finder__search {
  position: relative;
  display: flex;
  flex-direction: row-reverse;
  height: 100%;
  background-color: var(--clr-neutral-300);
}

.mod-finder__search input {
  flex-grow: 1;
  height: 100%;
  border: none;
  background-color: transparent;
  color: var(--clr-white);
}

.mod-finder__search button {
  padding: 0 1ch;
  border: none;
  background-color: transparent;
  color: currentColor;
}

.leftbody {
  display: none;
}

@media (min-width: 961px) {
  :is(.leftbody, .rightbody) {
    display: block;
    width: 18rem;
  }
}

.category-sidebar > li > span,
.category-sidebar > li > a {
  text-transform: uppercase;
}

.category-sidebar > li:has(li.current) > span {
  color: rgb(17 24 39);
  font-weight: 700;
}

.com-content-article h1[itemprop="headline"] {
  margin-top: 0.5rem;
  font-size: var(--fs-heading-1);
  font-weight: 700;
  line-height: 1.2;
}

.com-content-article .modified,
.com-content-category-blog__item .modified {
  margin-bottom: 1em;
  color: var(--clr-neutral-100);
  font-size: 0.75rem;
}

.com-content-article__body {
  line-height: 1.75;
}

.com-content-article__body h2 {
  padding-bottom: 0.25rem;
  margin-top: 2.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--clr-neutral-50);
  font-size: var(--fs-heading-2);
  font-weight: 600;
}

.com-content-article__body h3 {
  margin-top: 2rem;
  font-size: var(--fs-heading-3);
  font-weight: 600;
}

.docbase-subcategory__heading {
  margin: 0 !important;
  font-size: unset !important;
  font-weight: unset !important;
}

.com-content-article__body a {
  color: var(--clr-primary);
  text-decoration: underline;
}

.com-content-article__body :where(p, ol, ul) {
  margin-bottom: 1.5em;
}

.com-content-article__body :where(ol, ul) {
  padding-left: 2ch;
}

.com-content-article__body li {
  margin: 0.5em 0;
}

.com-content-article__body img {
  display: inline-block;
}

.com-content-article__body table:not([class]) {
  width: 100%;
  border-collapse: collapse;
}

.com-content-article__body table:not([class]) th,
.com-content-article__body table:not([class]) td {
  padding: 0.5em 1em;
  border: 1px solid;
}

.com-content-category-blog__item .item-content {
  padding: 1em 0;
  border-bottom: 1px solid var(--clr-neutral-50);
}

.com-content-category-blog__item h2[itemprop="name"],
.com-content-category .cat-children .item-title {
  font-size: 1.5rem;
  font-weight: 600;
}

.com-content-category-blog__item h2[itemprop="name"] a,
.com-content-category .cat-children .item-title a {
  color: var(--clr-primary);
}

.com-content-category .cat-children > h3 {
  padding-bottom: 0.25rem;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--clr-neutral-50);
  font-size: var(--fs-heading-2);
  font-weight: 600;
}

.com-content-category .cat-children .com-content-category__children {
  margin: 1em 0;
}

.com-content-article ~ div[data-module]:not(:last-child) {
  margin-bottom: 2rem;
}

.belowbody {
  margin-bottom: 3rem;
}