/*fern-site-stylesheet*/@font-face {
    font-family: 'Inter';
    src: url('/_fern-files/kota.docs.buildwithfern.com/77677cd3d62f53fce403b743c6ab0dfacf6109cfa5f2c511a57b0779222c76de/assets/fonts/Inter-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('/_fern-files/kota.docs.buildwithfern.com/a3878d7a4119b2c2112f6cf5bb937b5ba10644b615e0ffe8bd202d68f04b5bab/assets/fonts/Inter-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('/_fern-files/kota.docs.buildwithfern.com/9ec71c55b4bd7b5c818d2bbd55fb11402b58b1bfb0e724a5d8acb03023c9cf38/assets/fonts/NeueFaktum-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

:root {
  --header-height: 64px;
  --header-height-real: 64px;
  --mobile-header-height-real: 64px;
  --content-width: 1000px;
  --sidebar-width: 288px;
  --page-width: 100vw;
  --logo-height: 20px;
  --font-body: 'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-heading: 'Inter', 'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
  --font-code: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
}

:root {
  --typography-body-font-family: var(--font-body);
  --typography-heading-font-family: var(--font-heading);
  --typography-code-font-family: var(--font-code);
}


.light, :root {
  --accent-1: #f4f4f6;
  --accent-2: #efeff8;
  --accent-3: #e8e6f9;
  --accent-4: #dddaff;
  --accent-5: #d2cdff;
  --accent-6: #c4bdff;
  --accent-7: #b2a7fe;
  --accent-8: #9a87f9;
  --accent-9: #6629de;
  --accent-10: #5720c1;
  --accent-11: #602fcc;
  --accent-12: #331c6f;

  --accent-a1: #3838b804;
  --accent-a2: #b8b8ff20;
  --accent-a3: #bcb4ff40;
  --accent-a4: #dddaff;
  --accent-a5: #d2cdff;
  --accent-a6: #c4bdff;
  --accent-a7: #a99cffe0;
  --accent-a8: #0000ff40;
  --accent-a9: #4900d9d5;
  --accent-a10: #3f00b9de;
  --accent-a11: #3d01c3cf;
  --accent-a12: #1b015ee3;

  --accent-contrast: #fff;
  --accent-surface: #eeeef9cc;
  --accent-indicator: #6629de;
  --accent-track: #6629de;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .light, :root {
      --accent-1: oklch(96.7% 0.0038 289);
      --accent-2: oklch(95.5% 0.0124 289);
      --accent-3: oklch(93.3% 0.0256 289);
      --accent-4: oklch(90.2% 0.0528 289);
      --accent-5: oklch(87% 0.0772 289);
      --accent-6: oklch(82.9% 0.0989 289);
      --accent-7: oklch(77% 0.1236 289);
      --accent-8: oklch(69.1% 0.1633 289);
      --accent-9: oklch(48.9% 0.2456 289);
      --accent-10: oklch(43.8% 0.2224 289);
      --accent-11: oklch(47.1% 0.2224 289);
      --accent-12: oklch(31.3% 0.1344 289);

      --accent-a1: color(display-p3 0.0667 0.0667 0.6706 / 0.013);
      --accent-a2: color(display-p3 0.0196 0.0196 0.9725 / 0.033);
      --accent-a3: color(display-p3 0.1176 0.0039 0.9686 / 0.069);
      --accent-a4: color(display-p3 0.8 0.7882 1 / 0.625);
      --accent-a5: color(display-p3 0.6706 0.6392 0.9961 / 0.5);
      --accent-a6: color(display-p3 0.4275 0.3647 1 / 0.375);
      --accent-a7: color(display-p3 0 0 1 / 0.125);
      --accent-a8: color(display-p3 0.1333 0.0039 0.9255 / 0.45);
      --accent-a9: color(display-p3 0.2392 0 0.8118 / 0.818);
      --accent-a10: color(display-p3 0.2039 0 0.6902 / 0.859);
      --accent-a11: color(display-p3 0.1961 0 0.7176 / 0.798);
      --accent-a12: color(display-p3 0.0863 0 0.3451 / 0.883);

      --accent-contrast: #fff;
      --accent-surface: color(display-p3 0.9333 0.9333 0.9725 / 0.8);
      --accent-indicator: oklch(48.9% 0.2456 289);
      --accent-track: oklch(48.9% 0.2456 289);
    }
  }
}


.light, :root {
  --grayscale-1: #fcfcfc;
  --grayscale-2: #f9f9f9;
  --grayscale-3: #f0f0f0;
  --grayscale-4: #e8e8e8;
  --grayscale-5: #e0e0e0;
  --grayscale-6: #d9d9d9;
  --grayscale-7: #cecece;
  --grayscale-8: #bbbbbb;
  --grayscale-9: #8d8d8d;
  --grayscale-10: #838383;
  --grayscale-11: #646464;
  --grayscale-12: #202020;

  --grayscale-a1: #00000003;
  --grayscale-a2: #00000006;
  --grayscale-a3: #0000000f;
  --grayscale-a4: #00000017;
  --grayscale-a5: #0000001f;
  --grayscale-a6: #00000026;
  --grayscale-a7: #00000031;
  --grayscale-a8: #00000044;
  --grayscale-a9: #00000072;
  --grayscale-a10: #0000007c;
  --grayscale-a11: #0000009b;
  --grayscale-a12: #000000df;

  --grayscale-contrast: #000;
  --grayscale-surface: #ffffffcc;
  --grayscale-indicator: #8d8d8d;
  --grayscale-track: #8d8d8d;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .light, :root {
      --grayscale-1: color(display-p3 0.988 0.988 0.988);
      --grayscale-2: color(display-p3 0.975 0.975 0.975);
      --grayscale-3: color(display-p3 0.939 0.939 0.939);
      --grayscale-4: color(display-p3 0.908 0.908 0.908);
      --grayscale-5: color(display-p3 0.88 0.88 0.88);
      --grayscale-6: color(display-p3 0.849 0.849 0.849);
      --grayscale-7: color(display-p3 0.807 0.807 0.807);
      --grayscale-8: color(display-p3 0.732 0.732 0.732);
      --grayscale-9: color(display-p3 0.553 0.553 0.553);
      --grayscale-10: color(display-p3 0.512 0.512 0.512);
      --grayscale-11: color(display-p3 0.392 0.392 0.392);
      --grayscale-12: color(display-p3 0.125 0.125 0.125);

      --grayscale-a1: #00000003;
      --grayscale-a2: #00000006;
      --grayscale-a3: #0000000f;
      --grayscale-a4: #00000017;
      --grayscale-a5: #0000001f;
      --grayscale-a6: #00000026;
      --grayscale-a7: #00000031;
      --grayscale-a8: #00000044;
      --grayscale-a9: #00000072;
      --grayscale-a10: #0000007c;
      --grayscale-a11: #0000009b;
      --grayscale-a12: #000000df;

      --grayscale-contrast: #000;
      --grayscale-surface: color(display-p3 1 1 1 / 80%);
      --grayscale-indicator: color(display-p3 0.553 0.553 0.553);
      --grayscale-track: color(display-p3 0.553 0.553 0.553);
    }
  }
}


.dark {
  --accent-1: #252131;
  --accent-2: #292337;
  --accent-3: #392a57;
  --accent-4: #452d6f;
  --accent-5: #4d347b;
  --accent-6: #573d88;
  --accent-7: #66489c;
  --accent-8: #7a56bd;
  --accent-9: #ae89fa;
  --accent-10: #a37ded;
  --accent-11: #c4a2ff;
  --accent-12: #e5dbff;

  --accent-a1: #7e00f90b;
  --accent-a2: #9316fd12;
  --accent-a3: #8f40ff38;
  --accent-a4: #8d3ffd55;
  --accent-a5: #934efe63;
  --accent-a6: #9a5cff72;
  --accent-a7: #a166ff8a;
  --accent-a8: #a26cffb1;
  --accent-a9: #b08bfefa;
  --accent-a10: #ae85ffea;
  --accent-a11: #c4a2ff;
  --accent-a12: #e5dbff;

  --accent-contrast: #fff;
  --accent-surface: #31234680;
  --accent-indicator: #ae89fa;
  --accent-track: #ae89fa;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .dark {
      --accent-1: oklch(25.9% 0.0311 297.2);
      --accent-2: oklch(27.3% 0.0376 297.2);
      --accent-3: oklch(32.6% 0.0792 297.2);
      --accent-4: oklch(36.1% 0.1107 297.2);
      --accent-5: oklch(39.1% 0.1176 297.2);
      --accent-6: oklch(42.6% 0.1217 297.2);
      --accent-7: oklch(47.5% 0.1323 297.2);
      --accent-8: oklch(54.1% 0.1557 297.2);
      --accent-9: oklch(71.2% 0.1629 297.2);
      --accent-10: oklch(67.5% 0.1629 297.2);
      --accent-11: oklch(78.4% 0.1629 297.2);
      --accent-12: oklch(91.2% 0.0539 297.2);

      --accent-a1: color(display-p3 0.3412 0 0.9843 / 0.038);
      --accent-a2: color(display-p3 0.4902 0.0824 0.9922 / 0.066);
      --accent-a3: color(display-p3 0.5373 0.2745 1 / 0.205);
      --accent-a4: color(display-p3 0.5255 0.2667 0.9961 / 0.312);
      --accent-a5: color(display-p3 0.549 0.3216 1 / 0.368);
      --accent-a6: color(display-p3 0.5843 0.3765 1 / 0.428);
      --accent-a7: color(display-p3 0.6118 0.4235 1 / 0.517);
      --accent-a8: color(display-p3 0.6235 0.4431 1 / 0.666);
      --accent-a9: color(display-p3 0.6902 0.5647 1 / 0.945);
      --accent-a10: color(display-p3 0.6784 0.5412 1 / 0.884);
      --accent-a11: color(display-p3 0.7647 0.6549 1 / 0.973);
      --accent-a12: color(display-p3 0.902 0.8706 0.9961 / 0.987);

      --accent-contrast: #fff;
      --accent-surface: color(display-p3 0.1804 0.1333 0.2667 / 0.5);
      --accent-indicator: oklch(71.2% 0.1629 297.2);
      --accent-track: oklch(71.2% 0.1629 297.2);
    }
  }
}


.dark {
  --grayscale-1: #111113;
  --grayscale-2: #18191b;
  --grayscale-3: #212225;
  --grayscale-4: #272a2d;
  --grayscale-5: #2e3135;
  --grayscale-6: #363a3f;
  --grayscale-7: #43484e;
  --grayscale-8: #5a6169;
  --grayscale-9: #696e77;
  --grayscale-10: #777b84;
  --grayscale-11: #b0b4ba;
  --grayscale-12: #edeef0;

  --grayscale-a1: #00000000;
  --grayscale-a2: #d8f4f609;
  --grayscale-a3: #ddeaf814;
  --grayscale-a4: #d3edf81d;
  --grayscale-a5: #d9edfe25;
  --grayscale-a6: #d6ebfd30;
  --grayscale-a7: #d9edff40;
  --grayscale-a8: #d9edff5d;
  --grayscale-a9: #dfebfd6d;
  --grayscale-a10: #e5edfd7b;
  --grayscale-a11: #f1f7feb5;
  --grayscale-a12: #fcfdffef;

  --grayscale-contrast: #fff;
  --grayscale-surface: rgba(0, 0, 0, 0.05);
  --grayscale-indicator: #696e77;
  --grayscale-track: #696e77;
}

@supports (color: color(display-p3 1 1 1)) {
  @media (color-gamut: p3) {
    .dark {
      --grayscale-1: color(display-p3 0.067 0.067 0.074);
      --grayscale-2: color(display-p3 0.095 0.098 0.105);
      --grayscale-3: color(display-p3 0.13 0.135 0.145);
      --grayscale-4: color(display-p3 0.156 0.163 0.176);
      --grayscale-5: color(display-p3 0.183 0.191 0.206);
      --grayscale-6: color(display-p3 0.215 0.226 0.244);
      --grayscale-7: color(display-p3 0.265 0.28 0.302);
      --grayscale-8: color(display-p3 0.357 0.381 0.409);
      --grayscale-9: color(display-p3 0.415 0.431 0.463);
      --grayscale-10: color(display-p3 0.469 0.483 0.514);
      --grayscale-11: color(display-p3 0.692 0.704 0.728);
      --grayscale-12: color(display-p3 0.93 0.933 0.94);

      --grayscale-a1: #00000000;
      --grayscale-a2: #d8f4f609;
      --grayscale-a3: #ddeaf814;
      --grayscale-a4: #d3edf81d;
      --grayscale-a5: #d9edfe25;
      --grayscale-a6: #d6ebfd30;
      --grayscale-a7: #d9edff40;
      --grayscale-a8: #d9edff5d;
      --grayscale-a9: #dfebfd6d;
      --grayscale-a10: #e5edfd7b;
      --grayscale-a11: #f1f7feb5;
      --grayscale-a12: #fcfdffef;

      --grayscale-contrast: #fff;
      --grayscale-surface: color(display-p3 0 0 0 / 5%);
      --grayscale-indicator: color(display-p3 0.415 0.431 0.463);
      --grayscale-track: color(display-p3 0.415 0.431 0.463);
    }
  }
}

.light, :root {
  color-scheme: light;
  --accent: rgba(102, 41, 222, 1);
  --background: rgba(247, 247, 247, 1);
  --border: initial;
  --sidebar-background: rgba(247, 247, 247, 1);
  --header-background: rgba(247, 247, 247, 1);
  --card-background: rgba(255, 255, 255, 1);
  --theme-color: #f7f7f7;
}

.dark {
  color-scheme: dark;
  --accent: rgba(174, 137, 250, 1);
  --background: rgba(33, 36, 40, 1);
  --border: initial;
  --sidebar-background: rgba(33, 36, 40, 1);
  --header-background: rgba(33, 36, 40, 1);
  --card-background: rgba(23, 25, 28, 1);
  --theme-color: #212428;
}

/* Canvas Body Theme */
:root [data-body-theme="canvas"] .canvas-wrapper {
  display: flex;
  width: 100%;
  overflow: auto;
  height: 100%;
  border-radius: 16px 16px 16px 16px;
  justify-content: center;
  align-items: flex-start;
  margin-right: 12px;
  margin-bottom: 12px;
  height: calc(100vh - var(--header-height-real) - 12px);
  border: 1px solid var(--border);
  background-color: var(--card-background);
}

:root [data-body-theme="canvas"] body {
  overflow: hidden;
}


:root [data-body-theme="canvas"] #fern-toc {
  position: sticky;
  max-height: calc(100vh - var(--header-height-real) - 12px);
  overflow-y: auto;
  overflow-x: hidden;
  top: 0;
}

:root [data-body-theme="canvas"] #fern-toc:has(> *) {
  margin-right: 12px;
}

:root [data-body-theme="canvas"] .fern-layout-guide,
:root [data-body-theme="canvas"] .fern-layout-overview {
  width: 100%;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

:root [data-body-theme="canvas"] .fern-layout-reference {
  width: 100%;
  border: none;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  position: relative;
}

/* The sticky changelog day label offsets its top by the header height by default
   (window scroll). On canvas the scroll container already starts below the fixed
   header, so zero the offset to keep the date from pinning too early. */
:root [data-body-theme="canvas"] {
  --fern-changelog-sticky-top: 0px;
}

/* Bubble Tabs Theme */
:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item]::after {
  display: none;
}

:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item] {
  position: relative;
  isolation: isolate;
  transition: color 0.15s ease-in-out;
}

:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item]::before {
  content: "";
  position: absolute;
  inset: 6px 0;
  border-radius: 9999px;
  z-index: -1;
  transition: background-color 0.15s ease-in-out;
}

:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="active"] {
  color: var(--accent-a11);
}

:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="active"]::before {
  background-color: var(--accent-a3);
}

:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="active"] > span {
  -webkit-text-stroke: 0.5px currentcolor;
}

:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="inactive"]:hover::before {
  background-color: var(--grayscale-a3);
}
:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="inactive"]:focus-visible::before {
  background-color: var(--grayscale-a3);
}

.dark [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="active"] {
  color: var(--accent-a11);
}

.dark [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="active"]::before {
  background-color: var(--accent-a3);
}

.dark [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="inactive"]:hover::before {
  background-color: var(--grayscale-a3);
}
.dark [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="inactive"]:focus-visible::before {
  background-color: var(--grayscale-a3);
}

/* Bubble theme: reset parent bg on active+focus-visible to avoid stacked alpha with the ::before pill */
:root [data-tabs-theme="bubble"] #fern-header [data-radix-collection-item][data-state="active"]:focus-visible {
  background: transparent;
}

button[class^="Sidebar-link-buttonWrapper"] {
    display: none !important;
}

/* Remove header bottom border and sidebar right border to merge seamlessly */
header {
    border-bottom: none !important;
}

aside, nav[class*="sidebar"], [class*="Sidebar"] {
    border-right: none !important;
}

/* Center and size tab icons */
.fern-file-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Remove background and shadow from tab icon wrapper (only when inactive) */
[data-state="inactive"] span:has(> .fern-file-icon) {
    background: none !important;
    box-shadow: none !important;
}

/* Main tabs hover - dark mode: white, light mode: black */
/* Dark mode */
.dark [data-state="inactive"]:hover,
[data-theme="dark"] [data-state="inactive"]:hover {
    color: #FFFFFF !important;
}
.dark [data-state="inactive"]:focus-visible,
[data-theme="dark"] [data-state="inactive"]:focus-visible {
    color: #FFFFFF !important; outline: none;
}

.dark [data-state="inactive"]:hover .fern-file-icon,
.dark [data-state="inactive"]:hover .fern-file-icon svg,
[data-theme="dark"] [data-state="inactive"]:hover .fern-file-icon,
[data-theme="dark"] [data-state="inactive"]:hover .fern-file-icon svg {
    color: #FFFFFF !important;
    stroke: #FFFFFF !important;
}
.dark [data-state="inactive"]:focus-within .fern-file-icon,
.dark [data-state="inactive"]:focus-within .fern-file-icon svg,
[data-theme="dark"] [data-state="inactive"]:focus-within .fern-file-icon,
[data-theme="dark"] [data-state="inactive"]:focus-within .fern-file-icon svg {
    color: #FFFFFF !important;
    stroke: #FFFFFF !important; outline: none;
}

.dark [data-state="inactive"]:hover span:has(> .fern-file-icon),
[data-theme="dark"] [data-state="inactive"]:hover span:has(> .fern-file-icon) {
    border-color: #FFFFFF !important;
}
.dark [data-state="inactive"]:focus-within span:has(> .fern-file-icon),
[data-theme="dark"] [data-state="inactive"]:focus-within span:has(> .fern-file-icon) {
    border-color: #FFFFFF !important; outline: none;
}

/* Light mode */
.light [data-state="inactive"]:hover,
[data-theme="light"] [data-state="inactive"]:hover,
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:hover {
    color: #000000 !important;
}
.light [data-state="inactive"]:focus-visible,
[data-theme="light"] [data-state="inactive"]:focus-visible,
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:focus-visible {
    color: #000000 !important; outline: none;
}

.light [data-state="inactive"]:hover .fern-file-icon,
.light [data-state="inactive"]:hover .fern-file-icon svg,
[data-theme="light"] [data-state="inactive"]:hover .fern-file-icon,
[data-theme="light"] [data-state="inactive"]:hover .fern-file-icon svg,
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:hover .fern-file-icon,
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:hover .fern-file-icon svg {
    color: #000000 !important;
    stroke: #000000 !important;
}
.light [data-state="inactive"]:focus-within .fern-file-icon,
.light [data-state="inactive"]:focus-within .fern-file-icon svg,
[data-theme="light"] [data-state="inactive"]:focus-within .fern-file-icon,
[data-theme="light"] [data-state="inactive"]:focus-within .fern-file-icon svg,
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:focus-within .fern-file-icon,
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:focus-within .fern-file-icon svg {
    color: #000000 !important;
    stroke: #000000 !important; outline: none;
}

.light [data-state="inactive"]:hover span:has(> .fern-file-icon),
[data-theme="light"] [data-state="inactive"]:hover span:has(> .fern-file-icon),
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:hover span:has(> .fern-file-icon) {
    border-color: #000000 !important;
    background: none !important;
}
.light [data-state="inactive"]:focus-within span:has(> .fern-file-icon),
[data-theme="light"] [data-state="inactive"]:focus-within span:has(> .fern-file-icon),
:root:not(.dark):not([data-theme="dark"]) [data-state="inactive"]:focus-within span:has(> .fern-file-icon) {
    border-color: #000000 !important;
    background: none !important; outline: none;
}

.fern-file-icon svg {
    width: 0.9rem !important;
    height: 0.9rem !important;
}

/* Make search bar wider */
.fern-header-search-bar {
    max-width: none !important;
}

div:has(> .fern-header-search-bar) {
    max-width: 800px !important;
}

/* Fix API Reference double-bold issue */
.fern-sidebar-link.font-semibold[data-state="active"] {
    font-weight: 50 !important;
}

.fern-layout-footer {
    margin-top: 0 !important;
}

.http-status-row>td:first-child {
    font-weight: 600;
}

.http-status-row>td {
    padding: 0.75rem;
    border: none;
}

.code-block>div>div:first-child span {
    font-size: 12px;
}

.reference-row {
    display: flex;
    gap: 2.5rem;
}

.kota-table {
    background-color: var(--mauve-3);
    border-color: var(--grayscale-a5);
    border-radius: 0 0 .375rem .375rem;
    padding: 0.75rem;
}

table caption {
    font-size: 12px;
    font-weight: 600;
    caption-side: top;
    text-align: left;
    padding: 0.75rem;
    border-bottom-width: 1px;
    border-color: var(--grayscale-a5);
    background-color: var(--mauve-4);
    border-radius: .375rem .375rem 0 0;
}

.kota-table tr>td>span {
    background-color: var(--reference-badge-background-color);
    color: var(--reference-badge-text-color);
    border: 1px solid var(--reference-badge-border-color);
    border-radius: 6px;
    padding: 2px 6px;
    font-size: 14px;
}

.kota-table tr td:first-child,
.kota-table tr th:first-child {
    padding-left: 0.75rem;
}

.kota-table thead tr th {
    border-bottom: 0px;
    border-color: var(--grayscale-a5);
    background-color: var(--mauve-3);
}

.kota-table td,
.fern-table th {
    border-bottom-width: 1px;
    height: 2.25rem;
    padding: .5rem;
    text-align: left;
}
/* Hero background image used on the landing page */
.hero {
  padding: 0px;
  background-color: #fbf7f2;
}

:is(.dark) .hero {
  background-color: var(--card-background, #0D0D0D);
}

.hero-content {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}

.hero-content-image {
  padding: 10px 0px 10px 0px;
  width: 40%;
  height: 200px;
}

.hero-content-text {
  padding: 50px 70px;
}

.hero-eyebrow {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 500;
  color: #6b7280;
}

:is(.dark) .hero-eyebrow {
  color: var(--grayscale-10, #9ca3af);
}

.hero-title {
  margin: 0 0 16px;
  font-size: 48px;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--grayscale-12, #000000);
}

:is(.dark) .hero-title {
  color: var(--grayscale-12, #ffffff);
}

.hero-subtitle {
  margin: 0;
  font-size: 16px;
  color: #4b5563;
}

:is(.dark) .hero-subtitle {
  color: var(--grayscale-10, #9ca3af);
}

.kota-card {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 32px 24px;
    border-radius: 24px;
    background: #f5efe8;
    transition: transform 150ms ease, box-shadow 150ms ease, background-color 150ms ease;
    min-height: 160px;
  }
  
  :is(.dark) .kota-card {
    background: var(--card-background, #0D0D0D);
  }
  
  .kota-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.09);
    background: #fbf7f2;
  }
.kota-card:focus-visible {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.09);
    background: #fbf7f2; outline: none;
}
  
  :is(.dark) .kota-card:hover {
    background: var(--card-background, #1a1a1a);
  }
:is(.dark) .kota-card:focus-visible {
    background: var(--card-background, #1a1a1a); outline: none;
}
  
  .kota-card-title {
    font-size: 16px;
    font-weight: 500;
    margin: 0;
    color: var(--grayscale-12, #000000);
  }
  
  :is(.dark) .kota-card-title {
    color: var(--grayscale-12, #ffffff);
  }
  
  .kota-card-description {
    font-size: 14px;
    color: #4b5563;
    margin-top: 8px;
  }
  
  :is(.dark) .kota-card-description {
    color: var(--grayscale-10, #9ca3af);
  }
  
  .kota-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
  }
  
  .kota-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-top: 40px;
  }
  
  @media (max-width: 900px) {

    .kota-card-grid {
      grid-template-columns: minmax(0, 1fr);
    }
  
}
  
  /* Start Here Cards Styling */
  .start-here-heading {
    font-size: 32px;
    font-weight: 700;
    color: var(--grayscale-12, #000000);
    margin-top: 48px;
    margin-bottom: 24px;
  }
  
  :is(.dark) .start-here-heading {
    color: var(--grayscale-12, #ffffff);
  }
  
  .start-here-cards-wrapper {
    margin-top: 24px;
    margin-bottom: 48px;
    padding: 35px;
  }
  
  /* Style Fern Card components within start-here-cards-wrapper */
  .start-here-cards-wrapper :global([class*="card-group"]) {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
  }
  
  .start-here-cards-wrapper :global(a),
  .start-here-cards-wrapper :global([class*="card"]) {
    border-radius: 12px !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    background: var(--card-background, #f9f5f0) !important;
    padding: 24px !important;
    transition: border-color 150ms ease, box-shadow 150ms ease !important;
    text-decoration: none !important;
    color: inherit !important;
    display: block !important;
  }
  
  :is(.dark) .start-here-cards-wrapper :global(a),
  :is(.dark) .start-here-cards-wrapper :global([class*="card"]) {
    background: var(--card-background, #0D0D0D) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
  }
  
  /* Hover state - highlight with accent color */
  .start-here-cards-wrapper :global(a:hover),
  .start-here-cards-wrapper :global([class*="card"]:hover) {
    border-color: var(--accentPrimary, #6434c4) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
  }
  
  :is(.dark) .start-here-cards-wrapper :global(a:hover),
  :is(.dark) .start-here-cards-wrapper :global([class*="card"]:hover) {
    border-color: var(--accentPrimary, #AE89FA) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
  }
  
  /* Card title styling */
  .start-here-cards-wrapper :global(h3),
  .start-here-cards-wrapper :global([class*="title"]) {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--grayscale-12, #000000) !important;
    margin-top: 16px !important;
    margin-bottom: 8px !important;
  }
  
  :is(.dark) .start-here-cards-wrapper :global(h3),
  :is(.dark) .start-here-cards-wrapper :global([class*="title"]) {
    color: var(--grayscale-12, #ffffff) !important;
  }
  
  /* Card content/description styling */
  .start-here-cards-wrapper :global(p),
  .start-here-cards-wrapper :global([class*="content"]) {
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: var(--grayscale-10, #6b7280) !important;
    margin: 0 !important;
  }
  
  :is(.dark) .start-here-cards-wrapper :global(p),
  :is(.dark) .start-here-cards-wrapper :global([class*="content"]) {
    color: var(--grayscale-10, #9ca3af) !important;
  }
  
  /* Icon styling */
  .start-here-cards-wrapper :global([class*="icon"]) {
    margin-bottom: 0 !important;
  }
  
  @media (max-width: 900px) {

    .start-here-cards-wrapper :global([class*="card-group"]) {
      grid-template-columns: minmax(0, 1fr) !important;
    }
  
}