/* stylelint-disable no-descending-specificity */
@layer tokens, overrides;

/* --------------------------------------------------------------------------
   Global Color Tokens
   -------------------------------------------------------------------------- */

:root {
  /* neutral colors */
  --ashby-colors-neutral1: hsl(210deg 20.0% 99.0%);
  --ashby-colors-neutral2: hsl(210deg 20.0% 97.0%);
  --ashby-colors-neutral3: hsl(210deg 15.7% 95.3%);
  --ashby-colors-neutral4: hsl(225deg 15.7% 93.3%);
  --ashby-colors-neutral5: hsl(225deg 15.7% 90.3%);
  --ashby-colors-neutral6: hsl(225deg 15.1% 87.3%);
  --ashby-colors-neutral7: hsl(235deg 15.9% 84.3%);
  --ashby-colors-neutral8: hsl(235deg 10% 78.8%);
  --ashby-colors-neutral9: hsl(245deg 10% 57.3%);
  --ashby-colors-neutral10: hsl(245deg 10% 53.5%);
  --ashby-colors-neutral11: hsl(250deg 5% 44.8%);
  --ashby-colors-neutral12: hsl(250deg 5% 27.9%);
  --ashby-colors-neutral13: hsl(250deg 5% 11.0%);

  /* neutral alpha colors */
  --ashby-colors-neutral-a1: hsl(210deg 20.0% 99.0% / 1%);
  --ashby-colors-neutral-a2: hsl(210deg 20.0% 97.0% / 4%);
  --ashby-colors-neutral-a3: hsl(210deg 15.7% 95.3% / 5%);
  --ashby-colors-neutral-a4: hsl(225deg 15.7% 93.3% / 9%);
  --ashby-colors-neutral-a5: hsl(225deg 15.7% 90.3% / 11%);
  --ashby-colors-neutral-a6: hsl(225deg 15.1% 87.3% / 15%);
  --ashby-colors-neutral-a7: hsl(235deg 15.9% 84.3% / 18%);
  --ashby-colors-neutral-a8: hsl(235deg 10% 78.8% / 23%);
  --ashby-colors-neutral-a9: hsl(245deg 10% 57.3% / 47%);
  --ashby-colors-neutral-a10: hsl(245deg 10% 53.5% / 51%);
  --ashby-colors-neutral-a11: hsl(250deg 5% 44.8% / 57%);
  --ashby-colors-neutral-a12: hsl(250deg 5% 27.9% / 73%);
  --ashby-colors-neutral-a13: hsl(250deg 5% 11.0% / 90%);


  /* primary colors */
  --ashby-colors-primary1: hsl(240deg 65.0% 99.4%);
  --ashby-colors-primary2: hsl(240deg 100% 98.7%);
  --ashby-colors-primary3: hsl(240deg 96.9% 97.4%);
  --ashby-colors-primary4: hsl(240deg 91.5% 95.5%);
  --ashby-colors-primary5: hsl(242deg 85.1% 93.0%);
  --ashby-colors-primary6: hsl(242deg 77.8% 89.4%);
  --ashby-colors-primary7: hsl(242deg 71.0% 83.7%);
  --ashby-colors-primary8: hsl(242deg 68.6% 76.3%);
  --ashby-colors-primary9: hsl(245deg 56.0% 57.5%);
  --ashby-colors-primary10: hsl(245deg 48.1% 53.5%);
  --ashby-colors-primary11: hsl(245deg 43.0% 48.0%);
  --ashby-colors-primary12: hsl(247deg 51.5% 33.25%);
  --ashby-colors-primary13: hsl(247deg 60.0% 18.5%);

  /* primary alpha colors */
  --ashby-colors-primary-a1: hsl(240deg 65.0% 99.4% / 1%);
  --ashby-colors-primary-a2: hsl(240deg 100% 98.7% / 3%);
  --ashby-colors-primary-a3: hsl(240deg 96.9% 97.4% / 5%);
  --ashby-colors-primary-a4: hsl(240deg 91.5% 95.5% / 9%);
  --ashby-colors-primary-a5: hsl(242deg 85.1% 93.0% / 13%);
  --ashby-colors-primary-a6: hsl(242deg 77.8% 89.4% / 19%);
  --ashby-colors-primary-a7: hsl(242deg 71.0% 83.7% / 28%);
  --ashby-colors-primary-a8: hsl(242deg 68.6% 76.3% / 40%);
  --ashby-colors-primary-a9: hsl(245deg 56.0% 57.5% / 66%);
  --ashby-colors-primary-a10: hsl(245deg 48.1% 53.5% / 69%);
  --ashby-colors-primary-a11: hsl(245deg 43.0% 48.0% / 73%);
  --ashby-colors-primary-a12: hsl(247deg 51.5% 33.25% / 84%);
  --ashby-colors-primary-a13: hsl(247deg 60.0% 18.5% / 93%);

  /* warning colors */
  --ashby-colors-warning1: hsl(24deg 70.0% 99.0%);
  --ashby-colors-warning2: hsl(24deg 83.3% 97.6%);
  --ashby-colors-warning3: hsl(24deg 100% 95.3%);
  --ashby-colors-warning4: hsl(25deg 100% 92.2%);
  --ashby-colors-warning5: hsl(25deg 100% 88.2%);
  --ashby-colors-warning6: hsl(25deg 100% 82.8%);
  --ashby-colors-warning7: hsl(24deg 100% 75.3%);
  --ashby-colors-warning8: hsl(24deg 94.5% 64.3%);
  --ashby-colors-warning9: hsl(24deg 94.0% 50.0%);
  --ashby-colors-warning10: hsl(24deg 100% 46.5%);
  --ashby-colors-warning11: hsl(24deg 100% 37.0%);
  --ashby-colors-warning12: hsl(15deg 80.0% 27.0%);
  --ashby-colors-warning13: hsl(15deg 60.0% 17.0%);

  /* positive colors */
  
  --ashby-colors-positive1: hsl(136deg 50.0% 98.9%);
  --ashby-colors-positive2: hsl(138deg 62.5% 96.9%);
  --ashby-colors-positive3: hsl(139deg 55.2% 94.5%);
  --ashby-colors-positive4: hsl(140deg 48.7% 91.0%);
  --ashby-colors-positive5: hsl(141deg 43.7% 86.0%);
  --ashby-colors-positive6: hsl(143deg 40.3% 79.0%);
  --ashby-colors-positive7: hsl(146deg 38.5% 69.0%);
  --ashby-colors-positive8: hsl(151deg 40.2% 54.1%);
  --ashby-colors-positive9: hsl(151deg 55.0% 41.5%);
  --ashby-colors-positive10: hsl(152deg 57.5% 37.6%);
  --ashby-colors-positive11: hsl(153deg 67.0% 28.5%);
  --ashby-colors-positive12: hsl(155deg 53.5% 21.25%);
  --ashby-colors-positive13: hsl(155deg 40.0% 14.0%);

  /* negative colors */
  
  --ashby-colors-negative1: hsl(359deg 100% 99.4%);
  --ashby-colors-negative2: hsl(359deg 100% 98.6%);
  --ashby-colors-negative3: hsl(360deg 100% 96.8%);
  --ashby-colors-negative4: hsl(360deg 97.9% 94.8%);
  --ashby-colors-negative5: hsl(360deg 90.2% 91.9%);
  --ashby-colors-negative6: hsl(360deg 81.7% 87.8%);
  --ashby-colors-negative7: hsl(359deg 74.2% 81.7%);
  --ashby-colors-negative8: hsl(359deg 69.5% 74.3%);
  --ashby-colors-negative9: hsl(358deg 75.0% 59.0%);
  --ashby-colors-negative10: hsl(358deg 69.4% 55.2%);
  --ashby-colors-negative11: hsl(358deg 65.0% 48.7%);
  --ashby-colors-negative12: hsl(354deg 57.5% 31.65%);
  --ashby-colors-negative13: hsl(354deg 50.0% 14.6%);

  /* Border colors */
  --ashby-colors-border-muted: var(--ashby-colors-neutral5);
  --ashby-colors-border-normal: var(--ashby-colors-neutral6);
  --ashby-colors-border-strong: var(--ashby-colors-neutral7);

  /* Text colors */
  --ashby-colors-content-muted: var(--ashby-colors-neutral11);
  --ashby-colors-content-normal: var(--ashby-colors-neutral12);
  --ashby-colors-content-strong: var(--ashby-colors-neutral13);

  /* Background colors */
  --ashby-colors-bg-primary: #fff;
  --ashby-colors-bg-secondary: var(--ashby-colors-neutral1);
  --ashby-colors-bg-tertiary: var(--ashby-colors-neutral2);


  /* Shadows */
  --ashby-shadow-none: none;
  --ashby-shadow-sm: 0 1px 3px -1px hsl(250deg 15% 11% / 12%);
  --ashby-shadow-normal: 0px 3px 4px -3px hsl(250deg 15% 11% / 25%);
  --ashby-shadow-md: 0px 1px 2px -1px hsl(250deg 15% 11% / 12%), 0px 4px 7px -4px hsl(250deg 15% 11% / 30%);
  --ashby-shadow-lg: 0px 3px 4px -3px hsl(250deg 15% 11% / 12%), 0px 9px 14px -6px hsl(250deg 15% 11% / 25%);
  --ashby-shadow-xl: 0px 4px 6px -4px hsl(250deg 15% 11% / 15%), 0px 18px 28px -10px hsl(250deg 15% 11% / 35%);
  --ashby-shadow-inner: inset 0 1px 2px 0 rgb(0 0 0 / 5%);
  --ashby-shadow-normal-outlined: 0 0 1px hsl(250deg 15% 11% / 20%), 0px 3px 4px -3px hsl(250deg 15% 11% / 25%);
  --ashby-shadow-md-outlined: 0 0 1px hsl(250deg 15% 11% / 20%), 0px 1px 2px -1px hsl(250deg 15% 11% / 12%), 0px 4px 7px -4px hsl(250deg 15% 11% / 30%);
  --ashby-shadow-lg-outlined: 0 0 1px hsl(250deg 15% 11% / 20%), 0px 3px 4px -3px hsl(250deg 15% 11% / 12%), 0px 9px 14px -6px hsl(250deg 15% 11% / 25%);
  --ashby-shadow-xl-outlined: 0 0 1px hsl(250deg 15% 11% / 20%), 0px 4px 6px -4px hsl(250deg 15% 11% / 15%), 0px 18px 28px -10px hsl(250deg 15% 11% / 35%);

  /* Components */
  --ashby-callout-info-bg: var(--ashby-colors-neutral2);
  --ashby-callout-info-border: var(--ashby-colors-border-muted);
  --ashby-callout-warning-bg: var(--ashby-colors-warning2);
  --ashby-callout-warning-border: var(--ashby-colors-warning6);
  --ashby-callout-success-bg: var(--ashby-colors-positive2);
  --ashby-callout-success-border: var(--ashby-colors-positive6);
  --ashby-tree-nav-link-color: var(--ashby-colors-content-muted);
  --ashby-tree-nav-link-color-active: var(--ashby-colors-content-strong);
  --ashby-tree-nav-link-color-hover: var(--ashby-colors-content-strong);
  --ashby-tree-nav-link-bg-active: hsl(0deg 0% 0% / 5%);
  --ashby-link-decoration-color: var(--ashby-colors-neutral7);
  --ashby-link-decoration-color-hover: var(--ashby-colors-neutral9);
  --ashby-link-decoration-color-active: var(--ashby-colors-neutral11);
}

/* --------------------------------------------------------------------------
   Global Color Tokens · Dark Mode Overrides
   -------------------------------------------------------------------------- */

:root:is(.dark) {
  --ashby-colors-content-strong: var(--ashby-colors-neutral1);
  --ashby-colors-content-normal: var(--ashby-colors-neutral2);
  --ashby-colors-content-muted: var(--ashby-colors-neutral3);
  --ashby-colors-bg-primary: var(--ashby-colors-neutral13);
  --ashby-colors-bg-secondary: var(--ashby-colors-neutral12);
  --ashby-colors-bg-tertiary: var(--ashby-colors-neutral11);
  --ashby-colors-border-muted: var(--ashby-colors-neutral10);
  --ashby-colors-border-normal: var(--ashby-colors-neutral9);
  --ashby-colors-border-strong: var(--ashby-colors-neutral8);

  /* Components */
  --ashby-callout-info-bg: var(--ashby-colors-neutral13);
  --ashby-callout-info-border: transparent;
  --ashby-callout-warning-bg: var(--ashby-colors-warning13);
  --ashby-callout-warning-border: transparent;
  --ashby-callout-success-bg: var(--ashby-colors-positive13);
  --ashby-callout-success-border: transparent;
  --ashby-callout-danger-bg: var(--ashby-colors-negative13);
  --ashby-callout-danger-border: transparent;
  --ashby-tree-nav-link-color: var(--ashby-colors-neutral8);
  --ashby-tree-nav-link-color-active: var(--ashby-colors-neutral1);
  --ashby-tree-nav-link-color-hover: var(--ashby-colors-neutral1);
  --ashby-tree-nav-link-bg-active: hsl(0deg 0% 100% / 7%);
  --ashby-link-decoration-color: hsl(0deg 0% 100% / 25%);
  --ashby-link-decoration-color-hover: hsl(0deg 0% 100% / 50%);
  --ashby-link-decoration-color-active: hsl(0deg 0% 100% / 75%);
}

/* ==========================================================================
   Archbee Custom Palette Overrides
   ========================================================================== */

.ab-custom-palette:not(.dark) {
  --ab-gray-50: 210 20.0% 97.0% !important; /* --ashby-colors-neutral2 */
  --ab-gray-100: 225 15.7% 90.3% !important; /* --ashby-colors-neutral5 */
  --ab-gray-400: 245 10% 53.5% !important; /* --ashby-colors-neutral9 */
  --ab-gray-500: 250 5% 44.8% !important; /* --ashby-colors-neutral11 */
  --ab-gray-600: 250 5% 27.9% !important; /* --ashby-colors-neutral12 */
  --ab-gray-800: 250 5% 11.0% !important; /* --ashby-colors-neutral12 */
  --ab-gray-900: 250 5% 11.0% !important; /* --ashby-colors-neutral13 */

  /* primary colors */
  --ab-primary-500: 245 56.0% 57.5% !important; /* --ashby-colors-primary9 */
}

.ab-custom-palette:is(.dark) {
  --ab-gray-600: 250 5% 17% !important;
  --ab-gray-700: 240 4% 16% !important; 
  --ab-gray-800: 250 5% 13% !important; /* custom primary color */
  --ab-primary-500: 245 84.91% 68.49% !important; /* custom primary color */
}

/* ==========================================================================
   Typography
   ========================================================================== */

body {
  font-size: 13px;
  font-feature-settings: "cv01","ss03";
}

.ab-doc-name.h1 {
  font-size: 36px;
  line-height: 1.2;
  letter-spacing: -0.022em;
}

.ab-doc-name, .ab-h1, .ab-h2, .ab-h3, .ab-h4 {
  font-weight: 590;
}

.ab-h2 {
  font-size: 24px;
}

.ab-h3 {
  font-size: 20px;
}

.text-lg {
  font-size: 15px;
}

.font-bold {
  font-weight: 590;
}

.tracking-tighter {
  letter-spacing: -0.015em; /* applies to headings */
}

.leading-8 {
  line-height: 1.75rem; /* applies to to paragraphs */
}

/* ==========================================================================
   Content Layout & Lists
   ========================================================================== */

.ab-slate-block-wrapper {
  margin-block-end: 1rem;
}

.ab-plugin-wrapper:has(h3, h2) {
  margin-block: 3rem 1rem;
}

button :is(.ab-slate-block-wrapper, .ab-plugin-wrapper) {
  margin: 0;
}

.ab-ul-list {
  padding-inline-start: 1.5rem;
}

.ab-list-item {
  padding: 0;
  letter-spacing: -0.01em;
}

.ab-list-item + .ab-list-item {
  margin-block-start: 0.5rem;
}

div:has(> .ab-right-column) {
  width: 300px;
}

/* ==========================================================================
   Tables
   ========================================================================== */

.ab-table :is(th, td)  {
  font-size: 14px;
  padding-inline: 8px;
  padding-block: 4px;
}

.ab-table th {
  font-weight: 590;
}

/* ==========================================================================
   Links
   ========================================================================== */

.ab-link {
  text-decoration: underline;
  text-decoration-thickness: 1px !important;
  text-decoration-color: var(--ashby-link-decoration-color) !important;
}

.ab-link:hover {
  text-decoration-color: var(--ashby-link-decoration-color-hover) !important;
  text-decoration-thickness: 1px !important;
}

.ab-link:active {
  text-decoration-color: var(--ashby-link-decoration-color-active) !important;
  text-decoration-thickness: 1px !important;
}

/* ==========================================================================
   Media & Embeds
   ========================================================================== */

.ab-image, .ab-loom-embed {
  border-radius: 12px;
  box-shadow: var(--ashby-shadow-sm), 0 0 0 4px var(--ashby-colors-neutral-a8);
  margin-block: 2rem;
}

.ab-loom-embed div[data-sentry-component="EmbedFrameSettings"] {
  display: none;
}

/* ==========================================================================
   Callouts
   ========================================================================== */

.ab-callout > div:first-child {
  display: none;
}

.ab-callout .ab-slate-block-wrapper:last-child {
  margin-block: 0;
}

.ab-callout {
  border-radius: 8px;
  border: 1px solid;
  margin-block-end: 1.5rem;
  padding-block: 4px;
}

.ab-callout.ab-callout-info {
  background-color: var(--ashby-callout-info-bg);
  border-color: var(--ashby-callout-info-border);
}

.ab-callout.ab-callout-warning {
  border-color: var(--ashby-callout-warning-border);
  background-color: var(--ashby-callout-warning-bg);
}

.ab-callout.ab-callout-success {
  border-color: var(--ashby-callout-success-border);
  background-color: var(--ashby-callout-success-bg);
}

.ab-callout.ab-callout-danger {
  border-color: var(--ashby-callout-danger-border);
  background-color: var(--ashby-callout-danger-bg);
}

/* ==========================================================================
   Tabs
   ========================================================================== */

/* Targets the container div within each tab item */
.ab-tabs div:has(> [data-cy="tab-label"]) {
  min-width: auto;
  padding-inline: 16px;
}

/* ==========================================================================
   Navigation
   ========================================================================== */

/* Left navigation */
.ab-left-nav-public-header {
  padding-block: 1.5rem 1.75rem;
}

.ab-left-nav-public {
  padding-inline: 16px;
}

a.ab-tree-navigation-link {
  font-weight: 500;
  font-size: 14px;
  color: var(--ashby-tree-nav-link-color) !important;
  letter-spacing: -0.01em;
  margin: 0;
  padding: 8px;
  position: relative;
}

a.ab-tree-navigation-link:hover {
  color: var(--ashby-tree-nav-link-color-hover) !important;
}

a.ab-tree-navigation-link-active {
  color: var(--ashby-tree-nav-link-color-active) !important;
  font-weight: 590;
}

.ab-tree-navigation-link-active::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 6px;
  background-color: var(--ashby-tree-nav-link-bg-active);
  z-index: -1;
}

/* Table of contents */
.ab-toc-wrapper-root [data-cy="third-column-table-of-content-header-container"] {
  display: none; /* Hide ToC header as it's self-explanatory */
}

.ab-toc-wrapper {
  margin-block: 10px;
}

.ab-toc-item:hover {
  color: var(--ashby-colors-content-normal);
}

.ab-toc-item-active {
  color: var(--ashby-colors-content-strong);
}

.ab-toc-item-active > a {
  color: inherit !important;
}

/* Top navigation bar */
.ab-top-navbar div[data-sentry-component] > div:last-child {
  display: none;
}

.ab-top-navbar div[data-sentry-component="LogoMenuLanguage"] {
  padding-block: 12px;
}

/* ==========================================================================
   Search & Misc
   ========================================================================== */

.ab-public-search {
  padding-inline: 15px;
}

div[data-sentry-component="BredcrumbSeparator"] {
  padding: 0;
}

.ab-public-logo {
  margin-block-start: 1px; /* perfect alignment within top navbar */
  height: 32px;
}
