for sidebar callouts and notes
Features: Light background, alert-style borders, dark mode support
Purpose: Highlight important sidebar information or tips */
.sidebar-box {
background-color: var(--vdd-bg-box);
border: none;
border-radius: var(--vdd-radius);
margin: 2rem 2rem 2rem .7rem;
padding: var(--vdd-pad);
}
/* ============================================================
FIND THE RIGHT API — product card layout
============================================================
Used by the product cards and the Report-vs-Sales comparison on
docs/APIs/product-mapping.mdx. These are page layout styles, not styles for
the finder widget on that page — the widget's own styles live in
src/components/FinderFlow/FinderFlow.css.
============================================================ */
/* Uses content width instead of viewport width, since the docs sidebars can leave
a narrow article column even on large screens. */
.product-api-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr));
gap: var(--vdd-card-gap);
margin: 2rem 0;
}
.product-api-grid > .grid-container-flex-cell {
min-width: 0;
padding: var(--vdd-pad-xl); /* roomier 32px for these large product cards (outer cell only) */
}
.product-api-grid > .grid-container-flex-cell > .grid-container-flex-cell {
display: flex;
max-width: none;
border: 0;
padding: 0;
background-color: transparent;
}
.product-api-grid .custom-grid-with-image-container {
max-width: none;
margin-top: 1.25rem;
}
.product-api-grid .custom-grid-with-image-container > :first-child {
min-width: 0;
}
.product-api-grid .large-image-cell-centered-hidden-for-small img {
max-width: 150px;
}
.product-api-button {
align-self: flex-start;
max-width: 100%;
width: fit-content;
white-space: nowrap;
}
.product-api-button .cta-arrow {
flex-shrink: 0;
}
.reporting-api-overview {
margin-top: 2rem;
}
/* PRINT MODE */
@media print {
/* Adjust the width of the content to fit within the printable area */
.main-wrapper {
max-width: 100%;
padding: 20px;
}
/* Hide elements that are not necessary for print */
.navbar, .footer, .theme-doc-toc-desktop, .theme-doc-footer, .theme-edit-this-page, .theme-last-updated {
display: none;
}
/* Ensure images fit within the page */
img {
max-width: 100% !important;
}
/* Adjust font sizes for better readability */
body {
font-size: 10pt;
}
/* Prevent orphaned headings */
h1, h2, h3, h4, h5, h6 {
page-break-after: avoid;
}
/* Avoid breaking across note boxes */
div[class^="alert"] {
page-break-inside: avoid !important;
break-inside: avoid !important;
}
/* Avoid breaking across tabs */
div[class^="tabs-container"] {
page-break-inside: avoid !important;
break-inside: avoid !important;
}
/* Show all the tabs */
[role="tabpanel"] {
display: block;
border: 1px solid #2563eb ; /* Add this line */
margin-bottom: 5px; /* Optional: adds space between panels */
padding: 9px;
border-radius: 10px;
}
/* Expand every
disclosure, for the same reason as the tabs above: a
printed page cannot be clicked, so collapsed content would simply be missing.
Two selectors are needed — the browser's own rule for a closed , and
Docusaurus's Collapsible wrapper, which sets height and overflow inline. Inline
styles are why these need !important. */
details:not([open]) > *:not(summary),
details > div[class*="collapsibleContent"] {
display: block !important;
height: auto !important;
overflow: visible !important;
visibility: visible !important;
}
details {
page-break-inside: avoid;
break-inside: avoid;
}
/* The summary is a heading for the content now printed below it, so drop the
disclosure triangle that implies something still needs opening. */
details > summary {
list-style: none;
font-weight: 600;
}
details > summary::marker,
details > summary::-webkit-details-marker {
display: none;
}
/* Prevent splitting of pre and code blocks across pages */
pre {
border: 1px solid #ddd !important;
page-break-inside: avoid;
}
/* Remove the border around every keyword or in-line code (not the code blocks though) */
code {
border: none;
page-break-inside: avoid;
}
/* Adjust link colors for better visibility in print */
a {
color: var(--vdd-blue) !important;
}
a[href]:after {
content: none;
}
/* Ensure text is black on white background.
Card shadows go too: they are screen-only depth cues that print as grey
smudges. The card outlines stay — those still delimit each card on paper. */
* {
color: #000 !important;
background: #fff !important;
box-shadow: none !important;
}
/* Reset button styles to preserve their original appearance */
button,
.button,
[type="button"],
[role="button"],
.btn {
color: initial !important;
background: initial !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
/* Only apply to images inside .plugin-image-card-box when printing */
.plugin-image-card-box img.dark\:hidden {
display: inline !important;
}
.plugin-image-card-box img.hidden.dark\:inline-block {
display: none !important;
}
/* Table specific styles */
table {
width: 100% !important;
max-width: 100% !important;
border-width: 0.5px !important;
border-color: var(--vdd-border-card);
table-layout: fixed;
page-break-inside: auto;
font-size: 9pt; /* Adjust as needed */
}
th, td {
border-width: 0.5px !important;
border-color: var(--vdd-border-card);
word-wrap: break-word;
overflow-wrap: break-word;
padding: 4px !important; /* Reduce padding if necessary */
}
/* If the table is still too wide, you can try scaling it */
.table-container {
overflow-x: visible;
max-width: 100%;
}
.table-container table {
transform: scale(0.9); /* Adjust scale factor as needed */
transform-origin: left top;
}
}
.docusaurus-highlight-code-line {
background-color: rgb(72, 77, 91);
display: block;
margin: 0 calc(-1 * var(--ifm-pre-padding));
padding: 0 var(--ifm-pre-padding);
}
/* Loading icon */
.redocusaurus > div:first-child > svg {
margin-top: 10px;
max-width: 4rem;
max-height: 4rem;
}
/* Table row color override to match your Docusaurus CSS */
.redocusaurus table > tbody > tr {
background-color: var(--ifm-table-cell-color) !important;
}
@layer docusaurus.core {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
#__docusaurus-base-url-issue-banner-container {
display: none;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.skipToContent_fXgn {
position: fixed;
top: 1rem;
left: 100%;
z-index: calc(var(--ifm-z-index-fixed) + 1);
padding: calc(var(--ifm-global-spacing) / 2) var(--ifm-global-spacing);
color: var(--ifm-color-emphasis-900);
background-color: var(--ifm-background-surface-color);
}
.skipToContent_fXgn:focus {
left: 1rem;
box-shadow: var(--ifm-global-shadow-md);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.closeButton_CVFx {
padding: 0;
line-height: 0;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.content_knG7 {
font-size: 85%;
text-align: center;
padding: 5px 0;
}
.content_knG7 a {
color: inherit;
-webkit-text-decoration: underline;
text-decoration: underline;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
:root {
--docusaurus-announcement-bar-height: auto;
}
.announcementBar_mb4j {
display: flex;
align-items: center;
height: var(--docusaurus-announcement-bar-height);
background-color: var(--ifm-color-white);
color: var(--ifm-color-black);
/*
Unfortunately we can't make announcement bar render above the navbar
IE need to use border-bottom instead of shadow
See https://github.com/facebookincubator/infima/issues/275
box-shadow: var(--ifm-global-shadow-lw);
z-index: calc(var(--ifm-z-index-fixed) + 1);
*/
border-bottom: 1px solid var(--ifm-color-emphasis-100);
}
html[data-announcement-bar-initially-dismissed='true'] .announcementBar_mb4j {
display: none;
}
.announcementBarPlaceholder_vyr4 {
flex: 0 0 10px;
}
.announcementBarClose_gvF7 {
flex: 0 0 30px;
align-self: stretch;
}
.announcementBarContent_xLdY {
flex: 1 1 auto;
}
@media print {
.announcementBar_mb4j {
display: none;
}
}
@media (min-width: 997px) {
:root {
--docusaurus-announcement-bar-height: 30px;
}
.announcementBarPlaceholder_vyr4,
.announcementBarClose_gvF7 {
flex-basis: 50px;
}
}
}
.toggle_MW0i {
width: 2rem;
height: 2rem;
}
.toggleButton_yw5v {
-webkit-tap-highlight-color: transparent;
align-items: center;
display: flex;
justify-content: center;
width: 100%;
height: 100%;
border-radius: 50%;
transition: background var(--ifm-transition-fast);
}
/* CUSTOM START - Fixes color contrast in the toggle button that switches from light to dark mode */
html[data-theme="light"] .toggleButton_yw5v {
color: white;
}
html[data-theme="light"] .toggleButton_yw5v:hover {
background: var(--ifm-color-emphasis-800);
}
/* CUSTOM END */
.toggleButton_yw5v:hover {
background: var(--ifm-color-emphasis-200);
}
.toggleIcon_oIOL {
display: none;
}
[data-theme-choice='system'] .systemToggleIcon_yi_a,
[data-theme-choice='light'] .lightToggleIcon_SFTY,
[data-theme-choice='dark'] .darkToggleIcon_ekgs {
display: initial;
}
.toggleButtonDisabled_BJd7 {
cursor: not-allowed;
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.darkNavbarColorModeToggle_X3D1:hover {
background: var(--ifm-color-gray-800);
}
}
/* The brand is a flex row: the "Developer docs" wordmark (wide screens) plus
the app icons. flex-shrink: 0 stops the brand being squeezed; margin-right
keeps a gap before the first menu item. */
.navbar-logo-link {
display: flex;
align-items: center;
gap: 0.5rem;
align-self: center;
flex-shrink: 0;
margin-right: 1.5rem;
}
/* App icons — always visible. Fixed 2rem height; max-width: none overrides the
global img max-width:100% so the container can't scale it down. */
.navbar-logo {
display: block;
height: 2rem;
width: auto;
max-width: none;
flex-shrink: 0;
}
/* "Developer docs" wordmark: live, hinted text (crisp — unlike the outlined-path
SVG it replaces). Sized and weighted to match the old wordmark. Shown only
when there's room for it beside the desktop menu. */
.navbar-logo-text {
display: none;
color: #ffffff;
font-family: var(--font-family-header);
font-size: 1.375rem; /* ~22px, matching the old SVG wordmark */
font-weight: var(--font-weight-medium); /* 500 */
line-height: 1;
white-space: nowrap;
}
@media (min-width: 1400px) {
.navbar-logo-text {
display: inline;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.iconExternalLink_nPIU {
margin-left: 0.3rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.dropdownNavbarItemMobile_J0Sd {
cursor: pointer;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.iconLanguage_nlXk {
vertical-align: text-bottom;
margin-right: 5px;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/*
Workaround to avoid rendering empty search container
See https://github.com/facebook/docusaurus/pull/9385
*/
.navbarSearchContainer_Bca1:empty {
display: none;
}
@media (max-width: 996px) {
.navbarSearchContainer_Bca1 {
position: absolute;
right: var(--ifm-navbar-padding-horizontal);
}
}
@media (min-width: 997px) {
.navbarSearchContainer_Bca1 {
padding: 0 var(--ifm-navbar-item-padding-horizontal);
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.navbarHideable_m1mJ {
transition: transform var(--ifm-transition-fast) ease;
}
.navbarHidden_jGov {
transform: translate3d(0, calc(-100% - 2px), 0);
}
}
@layer docusaurus.theme-common {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.errorBoundaryError_a6uf {
white-space: pre-wrap;
color: red;
}
.errorBoundaryFallback_VBag {
color: red;
padding: 0.55rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/*
Hide color mode toggle in small viewports
*/
@media (max-width: 996px) {
.colorModeToggle_DEke {
display: none;
}
}
/*
Restore some Infima style that broke with CSS Cascade Layers
See https://github.com/facebook/docusaurus/pull/11142
*/
.navbar__items--right > :last-child {
padding-right: 0;
}
}
.row_BTqR {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
max-width: 280px;
margin-right: 8rem;
margin-bottom: 4rem;
margin-left: 1rem;
font-family: var(--font-family-header);
font-size: 1.5rem;
font-weight: var(--typography-heading-font-weight);
}
.appLogo_epdq {
height: 50px;
margin-top: 20px;
margin-right: 6px;
}
@layer docusaurus.theme-common {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.themedComponent_mlkZ {
display: none;
}
[data-theme='light'] .themedComponent--light_NVdE {
display: initial;
}
[data-theme='dark'] .themedComponent--dark_xIcU {
display: initial;
}
/*
JS disabled??? Show light version by default => better than showing nothing
TODO bad, but we currently always show light mode when there's no data-theme
*/
html:not([data-theme]) .themedComponent--light_NVdE {
display: initial;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.footerLogoLink_BH7S {
opacity: 0.5;
transition: opacity var(--ifm-transition-fast)
var(--ifm-transition-timing-default);
}
.footerLogoLink_BH7S:hover {
opacity: 1;
}
}
@layer docusaurus.theme-common {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.anchorTargetStickyNavbar_Vzrq {
scroll-margin-top: calc(var(--ifm-navbar-height) + 0.5rem);
}
.anchorTargetHideOnScrollNavbar_vjPI {
scroll-margin-top: 0.5rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.hash-link {
opacity: 0;
padding-left: 0.5rem;
transition: opacity var(--ifm-transition-fast);
-webkit-user-select: none;
user-select: none;
}
.hash-link::before {
content: '#';
}
.hash-link:focus,
*:hover > .hash-link {
opacity: 1;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
html,
body {
height: 100%;
}
.mainWrapper_z2l0 {
flex: 1 0 auto;
display: flex;
flex-direction: column;
}
/* Docusaurus-specific utility class */
.docusaurus-mt-lg {
margin-top: 3rem;
}
#__docusaurus {
min-height: 100%;
display: flex;
flex-direction: column;
}
}
/* Homepage-only page background.
*
* Off-white background so the white cards/panels read as clean floating cut-outs
* (matching vippsmobilepay.com). Applied to the Docusaurus layout wrapper via
* in src/pages/index.tsx.
* Light mode only — dark mode keeps its default dark background. Scoped to the
* homepage so the tint does not appear behind the bordered cards on doc pages. */
html:not([data-theme='dark']) .homepage-offwhite {
background-color: var(--vdd-off-white); /* #F5F5F2 */
}
/* Decorative blobs — the orange dot on the bottom left and the blue swirl on the
* right, bleeding off either edge of the page. Purely ornamental, so they are
* background images on rather than ![]()
elements: nothing for a screen
* reader to announce, and nothing for the raw-Markdown generator to pick up.
*
* The shapes are the full-saturation brand colors straight out of the SVGs
* (#FF5B24, #5A78FF), the same as on vippsmobilepay.com. No veil layer and no
* `opacity`: they are meant to read as solid brand color, in both themes.
*
* Scale uniformly or not at all — always set one axis and leave the other `auto`.
* Forcing both axes distorts the curve, which reads obviously wrong. Each shape is
* scaled down from its Figma size, and each offset is scaled by the same factor so
* the visible fraction of the shape stays put. The two factors differ because the
* swirl was toned down one step further than the dot:
*
* - Swirl at 9/16: Figma X=1063 in a 1440 frame with an 888-wide bounding box, so
* 377px of 1440 showed. `blue_swirl.svg` is that whole shape at 888x621; here it
* is 500 wide, offset 290 to show 500 - 290 = 210px. Note Figma reports it as
* W 621 x H 888 at Rotation -90, so its on-page box is the transpose, 888 wide x
* 621 tall — do not read those numbers off the panel directly.
* - Dot at 3/4: the whole 388x388 circle in `red_dot.svg`, here 291. Offset by half
* its width so a clean half circle shows: 291 / 2 = 145px in, 146px visible.
* (Figma puts it at X=-264, proportionally further out, but half reads better
* against our shorter page.)
*
* Watch contrast when retuning any of this. Dark blue link text on #5A78FF is well
* under the 4.5:1 body-text minimum, and axe-core cannot catch it because it reports
* "incomplete" rather than a violation for text over a background image — so nothing
* in CI will fail if a shape creeps under the bottom link row.
*
* The homepage content column is capped at 896px (`max-w-[896px]` in
* ProductOverview.tsx and index.tsx) and centered, so the empty gutter beside it is
* (100vw - 896px) / 2. The swirl is the wider shape at 210px visible, so it clears
* the column completely only at 896 + 2 * 210 = 1316px and up. The 900px breakpoint
* here is narrower than that on purpose: it keeps the shapes on screen for common
* laptop widths, accepting that between 900px and ~1320px they encroach on the
* gutter. What keeps that readable is how small the shapes now are — at those widths
* only the outer curve reaches in, short of the link text. Check it by eye at 1024px
* and 1280px after changing a size, offset, or the content max-width.
*
* The bottom link row is the only bare text out this far. To make the overlap safe by
* construction rather than by eye, give that row an opaque card background like the
* API cards above it — text over an opaque surface is safe at any width, and that is
* what the Figma design does, running the swirl behind the white cards.
*
* Vertically both hang off the top of rather than being centered in it. Our
* is much shorter than the tall Figma page, so `center` drifts the shapes down
* past the cards they are meant to flank. In the design the swirl sits level with the
* card grid and the dot starts roughly two thirds of the way down it, which is what
* these offsets reproduce. */
@media (min-width: 900px) {
.homepage-blobs {
background-image:
url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODg4IiBoZWlnaHQ9IjYyMSIgdmlld0JveD0iMCAwIDg4OCA2MjEiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgcm9sZT0icHJlc2VudGF0aW9uIj4KPHBhdGggZD0iTS0xLjMzMzU3ZS0wNiAzMC41MDg1TC0yLjE0NTQ5ZS0wNSA0OTAuODMxQy0yLjIzMDkyZS0wNSA1MTAuMzc2IDguODc5OTIgNTI0LjU5OCAyOC40MTU5IDUzMS42OTVDMzU2Ljk3NiA2NTAuNzY4IDUzMS4wMjQgNjUwLjc2OCA4NTkuNTg0IDUzMS42OTVDODc5LjEyIDUyNC41OTggODg4IDUxMC4zNzYgODg4IDQ5MC44MzFMODg4IDMwLjUwODVDODg4IDUuNjQwNDggODcyLjAxNiAtNi44MDc0IDg0Ny4xNTIgMy44Mzg0NkM1MzIuOCAxMTUuODE0IDM1NS4yIDExNS44MTQgNDAuODQ3OSAzLjgzODQyQzE1Ljk4MzkgLTYuODM1MTYgLTIuNDUzNDFlLTA3IDUuNjEyNzIgLTEuMzMzNTdlLTA2IDMwLjUwODVaIiBmaWxsPSIjNUE3OEZGIi8+Cjwvc3ZnPgo=),
url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzg4IiBoZWlnaHQ9IjM4OCIgdmlld0JveD0iLTE4MyAwIDM4OCAzODgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgcm9sZT0icHJlc2VudGF0aW9uIj4KPGcgc3R5bGU9Im1peC1ibGVuZC1tb2RlOnNjcmVlbiI+CjxwYXRoIGQ9Ik0tMTgzIDE5NEMtMTgzIDg2Ljg1MDIgLTk2LjE1MTQgMCAxMS4wMjg1IDBDMTE4LjIwOCAwIDIwNSA4Ni44NTAyIDIwNSAxOTRDMjA1IDMwMS4xNSAxMTguMTUxIDM4OCAxMS4wMjg1IDM4OEMtOTYuMDk0NCAzODggLTE4MyAzMDEuMTUgLTE4MyAxOTRaIiBmaWxsPSIjRkY1QjI0Ii8+CjwvZz4KPC9zdmc+Cg==);
background-size: 500px auto, 291px auto;
background-position: right -290px top 40px, left -145px top 260px;
background-repeat: no-repeat;
}
}
/* Fourth large card on the homepage — the "Not sure which API you need?" panel.
* Matches the three API cards above it (ProductBox.module.css) so all four read
* as the same kind of raised link target. */
.homepage-link-panel {
border: var(--vdd-border-width) solid var(--vdd-border-card);
box-shadow: var(--vdd-shadow-card);
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.homepage-link-panel:hover {
border-color: var(--vdd-border-card-hover);
box-shadow: var(--vdd-shadow-card-hover);
}
.redocusaurus-styles {
display: none;
}
.redocusaurus .redoc-wrap {
border-bottom: 1px solid var(--ifm-toc-border-color);
}
/* ------ Headings Overrides ------- */
.redocusaurus h2,
.redocusaurus h3,
.redocusaurus h4 {
color: var(--ifm-font-color-base);
}
.redocusaurus h5 {
color: var(--ifm-font-color-secondary) !important;
}
.redocusaurus h5 > span {
color: var(--ifm-font-color-secondary) !important;
}
/* Fixes https://github.com/rohit-gohri/redocusaurus/issues/18 */
html[data-theme='dark'] .redocusaurus h1 > a:nth-child(1)::before {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjUxMiIgaGVpZ2h0PSI1MTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CgogPGcgY2xhc3M9ImxheWVyIj4KICA8dGl0bGU+TGF5ZXIgMTwvdGl0bGU+CiAgPHBhdGggZD0ibTQ1OS43LDIzMy40bC05MC41LDkwLjVjLTUwLDUwIC0xMzEsNTAgLTE4MSwwYy03LjksLTcuOCAtMTQsLTE2LjcgLTE5LjQsLTI1LjhsNDIuMSwtNDIuMWMyLC0yIDQuNSwtMy4yIDYuOCwtNC41YzIuOSw5LjkgOCwxOS4zIDE1LjgsMjcuMmMyNSwyNSA2NS42LDI0LjkgOTAuNSwwbDkwLjUsLTkwLjVjMjUsLTI1IDI1LC02NS42IDAsLTkwLjVjLTI0LjksLTI1IC02NS41LC0yNSAtOTAuNSwwbC0zMi4yLDMyLjJjLTI2LjEsLTEwLjIgLTU0LjIsLTEyLjkgLTgxLjYsLTguOWw2OC42LC02OC42YzUwLC01MCAxMzEsLTUwIDE4MSwwYzQ5LjgsNDkuOSA0OS44LDEzMSAtMC4xLDE4MXptLTIzOS40LDE0OC44bC0zMi4yLDMyLjJjLTI1LDI0LjkgLTY1LjYsMjQuOSAtOTAuNSwwYy0yNSwtMjUgLTI1LC02NS42IDAsLTkwLjVsOTAuNSwtOTAuNWMyNSwtMjUgNjUuNSwtMjUgOTAuNSwwYzcuOCw3LjggMTIuOSwxNy4yIDE1LjgsMjcuMWMyLjQsLTEuNCA0LjgsLTIuNSA2LjgsLTQuNWw0Mi4xLC00MmMtNS40LC05LjIgLTExLjYsLTE4IC0xOS40LC0yNS44Yy01MCwtNTAgLTEzMSwtNTAgLTE4MSwwbC05MC41LDkwLjVjLTUwLDUwIC01MCwxMzEgMCwxODFjNTAsNTAgMTMxLDUwIDE4MSwwbDY4LjYsLTY4LjZjLTI3LjQsNCAtNTUuNiwxLjIgLTgxLjcsLTguOXoiIGZpbGw9IiNmZmZmZmYiIGlkPSJzdmdfMSIvPgogPC9nPgo8L3N2Zz4=');
}
html[data-theme='dark'] .redocusaurus h2 > a:nth-child(1)::before {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjUxMiIgaGVpZ2h0PSI1MTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CgogPGcgY2xhc3M9ImxheWVyIj4KICA8dGl0bGU+TGF5ZXIgMTwvdGl0bGU+CiAgPHBhdGggZD0ibTQ1OS43LDIzMy40bC05MC41LDkwLjVjLTUwLDUwIC0xMzEsNTAgLTE4MSwwYy03LjksLTcuOCAtMTQsLTE2LjcgLTE5LjQsLTI1LjhsNDIuMSwtNDIuMWMyLC0yIDQuNSwtMy4yIDYuOCwtNC41YzIuOSw5LjkgOCwxOS4zIDE1LjgsMjcuMmMyNSwyNSA2NS42LDI0LjkgOTAuNSwwbDkwLjUsLTkwLjVjMjUsLTI1IDI1LC02NS42IDAsLTkwLjVjLTI0LjksLTI1IC02NS41LC0yNSAtOTAuNSwwbC0zMi4yLDMyLjJjLTI2LjEsLTEwLjIgLTU0LjIsLTEyLjkgLTgxLjYsLTguOWw2OC42LC02OC42YzUwLC01MCAxMzEsLTUwIDE4MSwwYzQ5LjgsNDkuOSA0OS44LDEzMSAtMC4xLDE4MXptLTIzOS40LDE0OC44bC0zMi4yLDMyLjJjLTI1LDI0LjkgLTY1LjYsMjQuOSAtOTAuNSwwYy0yNSwtMjUgLTI1LC02NS42IDAsLTkwLjVsOTAuNSwtOTAuNWMyNSwtMjUgNjUuNSwtMjUgOTAuNSwwYzcuOCw3LjggMTIuOSwxNy4yIDE1LjgsMjcuMWMyLjQsLTEuNCA0LjgsLTIuNSA2LjgsLTQuNWw0Mi4xLC00MmMtNS40LC05LjIgLTExLjYsLTE4IC0xOS40LC0yNS44Yy01MCwtNTAgLTEzMSwtNTAgLTE4MSwwbC05MC41LDkwLjVjLTUwLDUwIC01MCwxMzEgMCwxODFjNTAsNTAgMTMxLDUwIDE4MSwwbDY4LjYsLTY4LjZjLTI3LjQsNCAtNTUuNiwxLjIgLTgxLjcsLTguOXoiIGZpbGw9IiNmZmZmZmYiIGlkPSJzdmdfMSIvPgogPC9nPgo8L3N2Zz4=');
}
/* ------- Sidebar Overrides (Left Panel) ------- */
.redocusaurus .menu-content {
border-right: 1px solid var(--ifm-toc-border-color);
}
/**
* Hide Logo as already in navbar
* @see https://github.com/rohit-gohri/redocusaurus/issues/123
*/
.redocusaurus-has-logo .menu-content > div:first-child {
display: none;
}
.redocusaurus .operation-type {
margin-top: 6px;
font-size: 8px;
}
/* ------- Right Panel Overrides ------- */
.redocusaurus code {
padding: 0px;
/* Fix weird overlay on curly braces */
background-color: transparent;
}
.redocusaurus
ul
> li.react-tabs__tab--selected:not(.tab-error):not(.tab-success) {
color: #303846 !important;
}
/** Fixes https://github.com/rohit-gohri/redocusaurus/issues/65 */
html:not([data-theme='dark'])
.redocusaurus
.redoc-wrap
.api-content
> div
> div:nth-child(1)
> div:nth-child(2)
h3 {
color: var(--ifm-font-color-base-inverse);
}
/* Background of server selection dropdown */
html[data-theme='dark']
.redocusaurus
div[id^='operation']
> div
> div:nth-child(2)
> div:nth-child(1)
> div:nth-child(2) {
background-color: rgb(27, 32, 40);
color: var(--ifm-font-color-secondary);
}
html[data-theme='dark']
.redocusaurus
div[id^='operation']
> div
> div:nth-child(2)
> div:nth-child(1)
> div:nth-child(2)
> div
> div:nth-child(2)
> div {
background-color: var(--ifm-background-color);
}
/* Fixes https://github.com/rohit-gohri/redocusaurus/issues/8 */
html[data-theme='dark']
.redocusaurus
div[id^='tag']
> div
> div:nth-child(2)
> div:nth-child(1)
> div:nth-child(2) {
background-color: rgb(27, 32, 40);
color: var(--ifm-font-color-secondary);
}
html[data-theme='dark']
.redocusaurus
div[id^='tag']
> div
> div:nth-child(2)
> div:nth-child(1)
> div:nth-child(2)
> div
> div:nth-child(2)
> div {
background-color: var(--ifm-background-color);
}
/* Fixes https://github.com/rohit-gohri/redocusaurus/issues/306 */
html[data-theme='dark']
.redocusaurus
div[id^='tag']
button:has(span):has(.operation-type) {
background-color: var(--ifm-color-gray-800);
}
html[data-theme='dark']
.redocusaurus
div[id^='tag']
button + div {
background-color: var(--ifm-color-emphasis-0);
}
/* Padding above Response Samples heading */
.redocusaurus .react-tabs__tab-panel--selected {
margin-bottom: 10px;
}
/*
* Code Samples
* @see https://github.com/rohit-gohri/redocusaurus/issues/217
*/
html:not([data-theme='dark'])
.redocusaurus
[role='tabpanel']
pre {
background-color: transparent;
}
/** https://github.com/rohit-gohri/redocusaurus/issues/45 */
html:not([data-theme='dark'])
.redocusaurus
[role='tabpanel']
code {
color: var(--ifm-color-emphasis-0);
}
/* ------ Schema Styling Overrides ------- */
.redocusaurus table th {
border: none;
}
.redocusaurus table td {
border-top: none;
border-right: none;
}
.redocusaurus table td:nth-child(1) {
border-bottom: none;
}
.redocusaurus table td:nth-child(2) {
border-left: none;
}
.redocusaurus table tr {
background-color: var(--ifm-background-color);
}
.redocusaurus table > tbody > tr {
color: var(--ifm-font-color-base);
}
.redocusaurus table tbody tr table {
background-color: var(--ifm-background-surface-color);
}
.redocusaurus table tbody tr table tbody tr {
background-color: var(--ifm-background-surface-color);
}
.redocusaurus tr.last + tr > td > div {
background-color: var(--ifm-background-color) !important;
}
.redocusaurus span.dropdown-selector-value {
color: var(--ifm-font-color-secondary);
}
/* Authentication tables */
.redocusaurus table.security-details tr:nth-child(2n + 1) {
background-color: var(--ifm-background-surface-color);
}
[data-theme='dark'] .redocusaurus .api-content div h5 + svg polygon {
filter: invert(1);
}
[data-theme='dark'] .redocusaurus .api-content div:has(> span > span > i + code) {
background: var(--ifm-color-emphasis-0);
}
.redocusaurus-schema.hide-example > div > div > div:nth-child(2) {
display: none;
}
.redocusaurus-schema.hide-example > div > div > div:nth-child(1) {
width: 100%;
}
.redocusaurus-schema > div:last-child {
min-height: 0;
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.sidebar_re4s {
max-height: calc(100vh - (var(--ifm-navbar-height) + 2rem));
overflow-y: auto;
position: sticky;
top: calc(var(--ifm-navbar-height) + 2rem);
}
.sidebarItemTitle_pO2u {
font-size: var(--ifm-h3-font-size);
font-weight: var(--ifm-font-weight-bold);
}
.sidebarItemList_Yudw {
font-size: 0.9rem;
}
.sidebarItem__DBe {
margin-top: 0.7rem;
}
.sidebarItemLink_mo7H {
color: var(--ifm-font-color-base);
display: block;
}
.sidebarItemLink_mo7H:hover {
-webkit-text-decoration: none;
text-decoration: none;
}
.sidebarItemLinkActive_I1ZP {
color: var(--ifm-color-primary) !important;
}
@media (max-width: 996px) {
.sidebar_re4s {
display: none;
}
}
.yearGroupHeading_rMGB {
margin-top: 1.6rem;
margin-bottom: 0.4rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.yearGroupHeading_QT03 {
margin: 1rem 0.75rem 0.5rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.title_f1Hy {
font-size: 3rem;
}
/**
Blog post title should be smaller on smaller devices
**/
@media (max-width: 576px) {
.title_f1Hy {
font-size: 2rem;
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.container_mt6G {
font-size: 0.9rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
[data-theme='dark'] .githubSvg_Uu4N {
fill: var(--light);
}
[data-theme='light'] .githubSvg_Uu4N {
fill: var(--dark);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
[data-theme='dark'] .xSvg_y3PF {
fill: var(--light);
}
[data-theme='light'] .xSvg_y3PF {
fill: var(--dark);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
[data-theme='dark'] .linkedinSvg_FCgI {
fill: var(--light);
}
[data-theme='light'] .linkedinSvg_FCgI {
fill: var(--dark);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
[data-theme='dark'] .blueskySvg_AzZw {
fill: var(--light);
}
[data-theme='light'] .blueskySvg_AzZw {
fill: var(--dark);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
[data-theme='dark'] .instagramSvg_YC40 {
fill: var(--light);
}
[data-theme='light'] .instagramSvg_YC40 {
fill: var(--dark);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
[data-theme='dark'] .threadsSvg_PTXY {
fill: var(--light);
}
[data-theme='light'] .threadsSvg_PTXY {
fill: var(--dark);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
:root {
--docusaurus-blog-social-icon-size: 1rem;
}
.authorSocials_rSDt {
/*
This ensures that container takes height even if there's no social link
This keeps author names aligned even if only some have socials
*/
height: var(--docusaurus-blog-social-icon-size);
display: flex;
flex-wrap: wrap;
align-items: center;
line-height: 0;
overflow: hidden;
line-clamp: 1;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.authorSocialLink_owbf {
height: var(--docusaurus-blog-social-icon-size);
width: var(--docusaurus-blog-social-icon-size);
line-height: 0;
margin-right: 0.4rem;
}
.authorSocialIcon_XYv3 {
width: var(--docusaurus-blog-social-icon-size);
height: var(--docusaurus-blog-social-icon-size);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.authorImage_XqGP {
--ifm-avatar-photo-size: 3.6rem;
}
.author-as-h1_n9oJ .authorImage_XqGP {
--ifm-avatar-photo-size: 7rem;
}
.author-as-h2_gXvM .authorImage_XqGP {
--ifm-avatar-photo-size: 5.4rem;
}
.authorDetails_lV9A {
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: space-around;
}
.authorName_yefp {
font-size: 1.1rem;
line-height: 1.1rem;
display: flex;
flex-direction: row;
}
.author-as-h1_n9oJ .authorName_yefp {
font-size: 2.4rem;
line-height: 2.4rem;
display: inline;
}
.author-as-h2_gXvM .authorName_yefp {
font-size: 1.4rem;
line-height: 1.4rem;
display: inline;
}
.authorTitle_nd0D {
font-size: 0.8rem;
line-height: 1rem;
display: -webkit-box;
overflow: hidden;
line-clamp: 1;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
}
.author-as-h1_n9oJ .authorTitle_nd0D {
font-size: 1.2rem;
line-height: 1.6rem;
}
.author-as-h2_gXvM .authorTitle_nd0D {
font-size: 1rem;
line-height: 1.3rem;
}
.authorBlogPostCount_iiJ5 {
background: var(--ifm-color-secondary);
color: var(--ifm-color-black);
font-size: 0.8rem;
line-height: 1.2;
border-radius: var(--ifm-global-radius);
padding: 0.1rem 0.4rem;
margin-left: 0.3rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.authorCol_Hf19 {
max-width: inherit !important;
}
.imageOnlyAuthorRow_pa_O {
display: flex;
flex-flow: row wrap;
}
.imageOnlyAuthorCol_G86a {
margin-left: 0.3rem;
margin-right: 0.3rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.backToTopButton_sjWU {
position: fixed;
right: 1.3rem;
bottom: 1.3rem;
border-radius: 50%;
background-color: var(--ifm-color-emphasis-200);
width: 3rem;
height: 3rem;
z-index: calc(var(--ifm-z-index-fixed) - 1);
box-shadow: var(--ifm-global-shadow-lw);
transition: all var(--ifm-transition-fast)
var(--ifm-transition-timing-default);
opacity: 0;
transform: scale(0);
visibility: hidden;
}
.backToTopButton_sjWU::after {
content: ' ';
display: inline-block;
-webkit-mask: var(--ifm-menu-link-sublist-icon) 50% / 2rem 2rem no-repeat;
mask: var(--ifm-menu-link-sublist-icon) 50% / 2rem 2rem no-repeat;
background-color: var(--ifm-color-emphasis-1000);
width: 100%;
height: 100%;
}
@media (hover: hover) {
.backToTopButton_sjWU:hover {
background-color: var(--ifm-color-emphasis-300);
}
}
.backToTopButtonShow_xfvO {
opacity: 1;
transform: scale(1);
visibility: visible;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
:root {
--docusaurus-collapse-button-bg: transparent;
--docusaurus-collapse-button-bg-hover: rgb(0 0 0 / 10%);
}
[data-theme='dark']:root {
--docusaurus-collapse-button-bg: rgb(255 255 255 / 5%);
--docusaurus-collapse-button-bg-hover: rgb(255 255 255 / 10%);
}
@media (min-width: 997px) {
.collapseSidebarButton_PEFL {
display: block !important;
background-color: var(--docusaurus-collapse-button-bg);
height: 40px;
position: sticky;
bottom: 0;
border-radius: 0;
border: 1px solid var(--ifm-toc-border-color);
}
.collapseSidebarButtonIcon_kv0_ {
transform: rotate(180deg);
margin-top: 4px;
}
[dir='rtl'] .collapseSidebarButtonIcon_kv0_ {
transform: rotate(0);
}
.collapseSidebarButton_PEFL:hover,
.collapseSidebarButton_PEFL:focus {
background-color: var(--docusaurus-collapse-button-bg-hover);
}
}
.collapseSidebarButton_PEFL {
display: none;
margin: 0;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.menuExternalLink_NmtK {
align-items: center;
}
.linkLabel_WmDU {
overflow: hidden;
display: -webkit-box;
line-clamp: 2;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.categoryLink_byQd {
overflow: hidden;
}
/*
TODO merge this logic back in Infima?
*/
.menu__link--sublist-caret::after {
margin-left: var(--ifm-menu-link-padding-vertical);
}
.categoryLinkLabel_W154 {
flex: 1;
overflow: hidden;
display: -webkit-box;
line-clamp: 2;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
@media (min-width: 997px) {
.menuHtmlItem_M9Kj {
padding: var(--ifm-menu-link-padding-vertical)
var(--ifm-menu-link-padding-horizontal);
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
@media (min-width: 997px) {
.menu_SIkG {
flex-grow: 1;
padding: 0.5rem;
}
@supports (scrollbar-gutter: stable) {
.menu_SIkG {
padding: 0.5rem 0 0.5rem 0.5rem;
scrollbar-gutter: stable;
}
}
.menuWithAnnouncementBar_GW3s {
margin-bottom: var(--docusaurus-announcement-bar-height);
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
@media (min-width: 997px) {
.sidebar_njMd {
display: flex;
flex-direction: column;
height: 100%;
padding-top: var(--ifm-navbar-height);
width: var(--doc-sidebar-width);
}
.sidebarWithHideableNavbar_wUlq {
padding-top: 0;
}
.sidebarHidden_VK0M {
opacity: 0;
visibility: hidden;
}
.sidebarLogo_isFc {
display: flex !important;
align-items: center;
margin: 0 var(--ifm-navbar-padding-horizontal);
min-height: var(--ifm-navbar-height);
max-height: var(--ifm-navbar-height);
color: inherit !important;
-webkit-text-decoration: none !important;
text-decoration: none !important;
}
.sidebarLogo_isFc img {
margin-right: 0.5rem;
height: 2rem;
}
}
.sidebarLogo_isFc {
display: none;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
@media (min-width: 997px) {
.expandButton_TmdG {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
transition: background-color var(--ifm-transition-fast) ease;
background-color: var(--docusaurus-collapse-button-bg);
}
.expandButton_TmdG:hover,
.expandButton_TmdG:focus {
background-color: var(--docusaurus-collapse-button-bg-hover);
}
.expandButtonIcon_i1dp {
transform: rotate(0);
}
[dir='rtl'] .expandButtonIcon_i1dp {
transform: rotate(180deg);
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
:root {
--doc-sidebar-width: 300px;
--doc-sidebar-hidden-width: 30px;
}
.docSidebarContainer_YfHR {
display: none;
}
@media (min-width: 997px) {
.docSidebarContainer_YfHR {
display: block;
width: var(--doc-sidebar-width);
margin-top: calc(-1 * var(--ifm-navbar-height));
border-right: 1px solid var(--ifm-toc-border-color);
will-change: width;
transition: width var(--ifm-transition-fast) ease;
clip-path: inset(0);
}
.docSidebarContainerHidden_DPk8 {
width: var(--doc-sidebar-hidden-width);
cursor: pointer;
}
.sidebarViewport_aRkj {
top: 0;
position: sticky;
height: 100%;
max-height: 100vh;
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.docMainContainer_TBSr {
display: flex;
width: 100%;
}
@media (min-width: 997px) {
.docMainContainer_TBSr {
flex-grow: 1;
max-width: calc(100% - var(--doc-sidebar-width));
}
.docMainContainerEnhanced_lQrH {
max-width: calc(100% - var(--doc-sidebar-hidden-width));
}
.docItemWrapperEnhanced_JWYK {
max-width: calc(
var(--ifm-container-width) + var(--doc-sidebar-width)
) !important;
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.docRoot_UBD9 {
display: flex;
width: 100%;
}
.docsWrapper_hBAB {
display: flex;
flex: 1 0 auto;
}
}
@layer docusaurus.theme-search-algolia.docsearch{/*! @docsearch/css 4.6.2 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */
:root{--docsearch-primary-color:#003dff;--docsearch-soft-primary-color:rgba(0,61,255,.1);--docsearch-subtle-color:#d6d6e7;--docsearch-text-color:#36395a;--docsearch-error-color:#ef5350;--docsearch-success-color:#e8f5e9;--docsearch-secondary-text-color:#5a5e9a;--docsearch-background-color:#f5f5fa;--docsearch-spacing:12px;--docsearch-icon-stroke-width:1.4;--docsearch-focus-color:#005fcc;--docsearch-highlight-color:#003dff;--docsearch-muted-color:#9698c3;--docsearch-muted-color-darker:rgba(120,122,165,.25);--docsearch-icon-color:#5a5e9a;--docsearch-container-background:rgba(101,108,133,.8);--docsearch-logo-color:#003dff;--docsearch-border-radius:4px;--docsearch-search-button-background:#fff;--docsearch-search-button-text-color:var(--docsearch-secondary-text-color);--docsearch-modal-width:800px;--docsearch-modal-height:600px;--docsearch-modal-variable-height:60dvh;--docsearch-modal-background:#f5f6f7;--docsearch-modal-shadow:rgba(0,0,0,.2) 0px 12px 28px 0px,rgba(0,0,0,.1) 0px 2px 4px 0px,hsla(0,0%,100%,.05) 0px 0px 0px 1px inset;--docsearch-searchbox-height:56px;--docsearch-searchbox-initial-height:56px;--docsearch-searchbox-background:#ffffffa6;--docsearch-searchbox-focus-background:#ffffffa6;--docsearch-actions-width:99px;--docsearch-actions-height:44px;--docsearch-hit-height:56px;--docsearch-hit-color:#444950;--docsearch-hit-highlight-color:rgba(0,61,255,.1);--docsearch-hit-background:#fff;--docsearch-key-background:#f5f5fa;--docsearch-key-color:#5a5e9a;--docsearch-key-pressed-shadow:inset 0 2px 4px rgba(120,122,165,.25);--docsearch-footer-height:52px;--docsearch-footer-background:#ffffffa6;--docsearch-footer-shadow:0 -1px 0 0 #e0e3e8,0 -3px 6px 0 rgba(69,98,155,.12);--fav-out-dur:160ms;--del-dur:150ms;--ease-smooth:cubic-bezier(0.25,0.8,0.4,1);--ease-fast:cubic-bezier(0.45,0.15,0.6,0.9);--shadow-pop:0 4px 12px rgba(0,0,0,.06);--shimmer-bg:linear-gradient(90deg,#e0e3e8 0%,var(--docsearch-muted-color) 20%,var(--docsearch-muted-color) 60%,#e0e3e8 95%);--docsearch-dropdown-menu-background:var(--docsearch-hit-background);--docsearch-dropdown-menu-item-hover-background:var(--docsearch-modal-background)}html[data-theme=dark]{--docsearch-text-color:#c4c7dc;--docsearch-secondary-text-color:#b6b7d5;--docsearch-subtle-color:#212139;--docsearch-error-color:#ef5350;--docsearch-success-color:rgba(67,160,71,.2);--docsearch-highlight-color:#457aff;--docsearch-focus-color:#9ac8ff;--docsearch-background-color:#36395a;--docsearch-icon-color:#b6b7d5;--docsearch-container-background:rgba(9,10,17,.8);--docsearch-modal-background:#15172a;--docsearch-modal-shadow:inset 1px 1px 0 0 #2c2e40,0 3px 8px 0 #000309;--docsearch-searchbox-background:#000000a6;--docsearch-searchbox-focus-background:#000000a6;--docsearch-hit-color:#bec3c9;--docsearch-hit-shadow:none;--docsearch-hit-background:#090a11;--docsearch-key-background:#36395a;--docsearch-key-color:#b6b7d5;--docsearch-key-pressed-shadow:inset 0 2px 4px rgba(12,13,20,.4);--docsearch-footer-background:#000000a6;--docsearch-footer-shadow:inset 0 1px 0 0 rgba(73,76,106,.5),0 -4px 8px 0 rgba(0,0,0,.2);--docsearch-logo-color:#fff;--docsearch-muted-color:#7f8497;--shimmer-bg:linear-gradient(90deg,#e0e3e8 0%,var(--docsearch-muted-color) 20%,var(--docsearch-muted-color) 60%,#e0e3e8 95%);--docsearch-dropdown-menu-background:var(--docsearch-hit-background);--docsearch-dropdown-menu-item-hover-background:var(--docsearch-modal-background);--docsearch-search-button-background:var(--docsearch-modal-background);--docsearch-search-button-text-color:var(--docsearch-text-color)}.DocSearch-Button{all:unset;align-items:center;background-color:var(--docsearch-search-button-background);border:1px solid var(--docsearch-subtle-color);border-radius:.5rem;color:var(--docsearch-search-button-text-color);cursor:pointer;display:flex;height:36px;justify-content:space-between;padding:0 8px;-webkit-user-select:none;user-select:none}.DocSearch-Button-Container{align-items:center;display:flex;height:100%}.DocSearch-Button-Container svg{color:currentColor}.DocSearch-Back-Icon,.DocSearch-Search-Icon{color:var(--docsearch-highlight-color);stroke-width:1.6}.DocSearch-Button-Placeholder{color:currentColor;display:inline-block;font-size:1rem;line-height:normal;padding-block:0;padding-inline:8px 12px}.DocSearch-Button-Keys{display:flex;min-width:calc(40px + .8em)}.DocSearch-Button-Key{align-items:center;background:var(--docsearch-key-background);border:0;border-radius:4px;box-shadow:none!important;color:var(--docsearch-key-color);display:flex;font-family:system-ui,-apple-system,sans-serif;font-size:14px;height:24px;justify-content:center;position:relative;transition-duration:.1s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:24px}
@supports (color: color-mix(in lch, red, blue)){
.DocSearch-Button-Key{border:1px solid color-mix(in srgb,var(--docsearch-subtle-color) 20%,transparent)}
}.DocSearch-Button-Key--ctrl{width:33px}.DocSearch-Button-Key:first-child{margin-inline-end:.4em}@media (prefers-reduced-motion){.DocSearch-Button-Key{transition:none}}.DocSearch-Button-Key--pressed{box-shadow:var(--docsearch-key-pressed-shadow)!important;transform:translateY(1px)}@media (max-width:768px){.DocSearch-Button{width:auto}.DocSearch-Button-Keys,.DocSearch-Button-Placeholder{display:none}}.DocSearch--active{overflow:hidden!important}.DocSearch-Container,.DocSearch-Container *{box-sizing:border-box}.DocSearch-Container{backdrop-filter:blur(4px);background-color:var(--docsearch-container-background);height:100vh;inset-block-start:0;inset-inline-start:0;position:fixed;width:100vw;z-index:400}.DocSearch-Container a{-webkit-text-decoration:none;text-decoration:none}.DocSearch-Link{appearance:none;background:none;border:0;color:var(--docsearch-highlight-color);cursor:pointer;font:inherit;margin:0;padding:0}.DocSearch-Modal{background:var(--docsearch-modal-background);border-radius:4px;box-shadow:var(--docsearch-modal-shadow);display:flex;flex-direction:column;margin:60px auto auto;max-width:var(--docsearch-modal-width);position:relative}.DocSearch-SearchBar{display:flex}.DocSearch-SearchBar-Magnifier{color:var(--docsearch-highlight-color)}.DocSearch-Form{align-items:center;background:var(--docsearch-searchbox-focus-background);border-block-end:1px solid var(--docsearch-subtle-color);border-radius:4px 4px 0 0;display:flex;height:var(
--docsearch-searchbox-height,var(--docsearch-searchbox-initial-height)
);margin:0;min-height:var(--docsearch-searchbox-initial-height);padding-block:var(--docsearch-spacing);padding-inline:16px;position:relative;width:100%}.DocSearch-Input,.DocSearch-Modal-heading{appearance:none;background:transparent;border:0;color:var(--docsearch-text-color);flex:1;font:inherit;font-size:1.2em;font-weight:300;height:100%;line-height:1.4;outline:none;overflow-y:hidden;padding-block-start:0;padding-inline-start:8px;resize:none;width:80%}.DocSearch-Input::placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input::-webkit-search-cancel-button,.DocSearch-Input::-webkit-search-decoration,.DocSearch-Input::-webkit-search-results-button,.DocSearch-Input::-webkit-search-results-decoration{display:none}.DocSearch-Actions{align-items:center;display:flex;gap:8px;height:var(--docsearch-actions-height);justify-content:flex-end;padding:0 2px;width:var(--docsearch-actions-width)}.DocSearch-Divider{border-inline-start:1px solid var(--docsearch-subtle-color);height:16px}.DocSearch-Action{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center;min-height:24px;min-width:24px}.DocSearch-Action,.DocSearch-AskAi-Return,.DocSearch-LoadingIndicator,.DocSearch-MagnifierLabel{margin:0;padding:0}.DocSearch-AskAi-Return{cursor:pointer}.DocSearch-AskAi-Return,.DocSearch-LoadingIndicator,.DocSearch-MagnifierLabel{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Action{animation:none;appearance:none;background:none;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;inset-inline-end:0;stroke-width:var(--docsearch-icon-stroke-width)}}.DocSearch-Action,.DocSearch-AskAi-Return{animation:fade-in .1s ease-in forwards;appearance:none;background:none;border:none;border-radius:var(--docsearch-border-radius);color:var(--docsearch-icon-color);cursor:pointer;inset-inline-end:0;padding:2px;stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-AskAi-Return[hidden],.DocSearch-Close[hidden],.DocSearch-Input[hidden],.DocSearch-StreamingIndicator[hidden]{display:none}.DocSearch-Action:hover,.DocSearch-AskAi-Return:hover{background:var(--docsearch-soft-primary-color);color:var(--docsearch-highlight-color)}.DocSearch-LoadingIndicator svg,.DocSearch-MagnifierLabel svg{color:var(--docsearch-icon-color);height:24px;width:24px}.DocSearch-Form:focus-within .DocSearch-MagnifierLabel svg{color:var(--docsearch-highlight-color)}.DocSearch-Clear{appearance:none;background:none;border:0;color:var(--docsearch-highlight-color);cursor:pointer;flex:none;font:inherit;font-size:.9em;font-weight:300;height:28px;margin-inline-start:var(--docsearch-spacing);outline:none;overflow:hidden;padding:0;-webkit-user-select:none;user-select:none;white-space:nowrap}.DocSearch-Clear:focus-visible,.DocSearch-Close:focus-visible{border-radius:4px;outline:2px solid var(--docsearch-focus-color);outline-offset:1px}.DocSearch-Dropdown{height:var(--docsearch-modal-variable-height);max-height:calc(var(--docsearch-modal-height) - var(--docsearch-spacing) - var(--docsearch-footer-height));min-height:var(--docsearch-spacing);overflow-y:auto;overflow-y:overlay;padding:0 var(--docsearch-spacing);scrollbar-color:var(--docsearch-muted-color) var(--docsearch-modal-background);scrollbar-width:thin}.DocSearch-Dropdown::-webkit-scrollbar{width:12px}.DocSearch-Dropdown::-webkit-scrollbar-track{background:transparent}.DocSearch-Dropdown::-webkit-scrollbar-thumb{background-color:var(--docsearch-muted-color);border:3px solid var(--docsearch-modal-background);border-radius:20px}.DocSearch-Dropdown-Container ul{list-style:none;margin:0;padding:0}.DocSearch-Label{color:var(--docsearch-secondary-text-color);font-size:.875em;font-weight:400;line-height:1.6em}.DocSearch-Help,.DocSearch-NoResults-Help{color:var(--docsearch-secondary-text-color);font-size:.8em;font-weight:300;line-height:1.5em;margin:0;-webkit-user-select:none;user-select:none}.DocSearch-Title{color:var(--docsearch-text-color);font-size:1.1em;font-weight:300;line-height:.5em;vertical-align:middle}.DocSearch-Title strong{font-weight:500}.DocSearch-Logo a{display:flex}.DocSearch-Logo svg{color:var(--docsearch-logo-color);margin-inline-start:8px}.DocSearch-Hits:last-of-type{margin-block-end:24px}.DocSearch-Hits mark{background:none;color:var(--docsearch-highlight-color)}.DocSearch-HitsFooter{color:var(--docsearch-muted-color);display:flex;font-size:.85em;justify-content:center;margin-block-end:var(--docsearch-spacing);padding:var(--docsearch-spacing)}.DocSearch-HitsFooter a{border-block-end:1px solid;color:inherit}.DocSearch-Hit{border-radius:4px;display:flex;padding-block-end:4px;position:relative;scroll-margin-block-start:40px}.DocSearch-Hit:first-of-type{margin-block-start:4px}.DocSearch-Hit a,.DocSearch-Hit--AskAI{background:var(--docsearch-hit-background);border-radius:4px;cursor:pointer;display:block;padding-inline-start:var(--docsearch-spacing);width:100%}.DocSearch-Hit-source{background:var(--docsearch-modal-background);color:var(--docsearch-text-color);font-size:.9em;font-weight:600;inset-block-start:0;line-height:32px;margin:0 -4px;padding:8px 4px 4px;position:sticky;z-index:10}.DocSearch-Hit-Tree{color:var(--docsearch-muted-color);height:var(--docsearch-hit-height);opacity:.5;stroke-width:var(--docsearch-icon-stroke-width);width:24px}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit--AskAI,.DocSearch-Hit[aria-selected=true] a{background-color:var(--docsearch-hit-highlight-color)}.DocSearch-Conversation-History .DocSearch-Hit[aria-selected=true] a{background-color:var(--docsearch-hit-background)}.DocSearch-Hit mark{color:var(--docsearch-highlight-color);-webkit-text-decoration:underline;text-decoration:underline;text-underline-offset:.3em}.DocSearch-Hit-Container{align-items:center;color:var(--docsearch-text-color);display:flex;flex-direction:row;height:var(--docsearch-hit-height);padding:0 var(--docsearch-spacing) 0 0}.DocSearch-Hit-icon{color:var(--docsearch-secondary-text-color);height:20px;width:20px}.DocSearch-Hit-action,.DocSearch-Hit-icon{stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Hit-action{align-items:center;color:var(--docsearch-muted-color);display:flex;height:22px;width:22px}.DocSearch-Hit-action svg{display:block;height:18px;width:18px}.DocSearch-Hit-action+.DocSearch-Hit-action{margin-inline-start:6px}.DocSearch-Hit-action-button{appearance:none;background:none;border:0;border-radius:50%;color:inherit;cursor:pointer;padding:2px}svg.DocSearch-Hit-Select-Icon{display:none}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Select-Icon{display:block}.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:background-color .1s ease-in}.DocSearch-Hit-action-button:focus path,.DocSearch-Hit-action-button:hover path{fill:#fff}.DocSearch-Hit-content-wrapper{display:flex;flex:1 1 auto;flex-direction:column;font-weight:400;gap:4px;justify-content:center;line-height:1.2em;margin:0 8px;overflow-x:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;width:80%}.DocSearch-Hit-title{font-size:.9em}.DocSearch-Hit-path{color:var(--docsearch-secondary-text-color);font-size:.75em}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Tree,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-text,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-title{color:var(--docsearch-text-color)}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-action,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-icon,.DocSearch-Hit[aria-selected=true] mark{color:var(--docsearch-highlight-color)}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:none}}.DocSearch-AskAiScreen,.DocSearch-ErrorScreen,.DocSearch-NoResults,.DocSearch-StartScreen{align-items:center;color:var(--docsearch-secondary-text-color);display:flex;flex-direction:column;font-size:1.25em;font-weight:400;justify-content:center;margin:0 auto;text-align:center;width:80%}.DocSearch-AskAiScreen,.DocSearch-ErrorScreen,.DocSearch-NoResults{max-height:80%}.DocSearch-StartScreen{height:100%}.DocSearch-NoResults{gap:.8em;margin-block-start:2em}.DocSearch-NoResults--withAskAi{justify-content:flex-start;margin-block-start:0}.DocSearch-AskAiScreen,.DocSearch-ErrorScreen,.DocSearch-StartScreen{gap:24px}.DocSearch-StartScreen-Icon{height:64px;stroke:var(--docsearch-icon-color);width:64px}.DocSearch-Screen-Icon{color:var(--docsearch-icon-color)}.DocSearch-NoResults-Prefill-List{display:flex;flex-direction:column;gap:12px;text-align:center}.DocSearch-NoResults-Prefill-List-Items{display:flex;flex-direction:column;gap:2px}.DocSearch-NoResults-Prefill-List-Items p{align-items:center;display:flex;margin:0;text-align:start}.DocSearch-Prefill{align-items:center;appearance:none;background:none;border:0;border-radius:1em;color:var(--docsearch-highlight-color);cursor:pointer;display:inline-flex;font-size:.8em;font-weight:300;gap:4px;height:40px;padding:0 4px}.DocSearch-Prefill:focus,.DocSearch-Prefill:hover{outline:none;-webkit-text-decoration:underline;text-decoration:underline}.DocSearch-Footer{align-items:center;background:var(--docsearch-footer-background);border-block-start:1px solid var(--docsearch-subtle-color);border-radius:0 0 4px 4px;display:flex;flex-direction:row-reverse;flex-shrink:0;height:var(--docsearch-footer-height);justify-content:space-between;padding:0 var(--docsearch-spacing);position:relative;-webkit-user-select:none;user-select:none;width:100%;z-index:300}.DocSearch-Commands{color:var(--docsearch-muted-color);display:flex;gap:16px;list-style:none;margin:0;padding:0}.DocSearch-Commands li,.DocSearch-Commands-Key{align-items:center;display:flex}.DocSearch-Commands-Key{background-color:var(--docsearch-background-color);border:0;border-radius:2px;box-shadow:none!important;color:var(--docsearch-icon-color);height:24px;justify-content:center;margin-inline-end:4px;width:24px}.DocSearch-Commands-Key:last-of-type{margin-inline-end:8px}.DocSearch-Escape-Key{font-size:10px;font-weight:300;letter-spacing:normal;line-height:16px;text-align:center;text-transform:uppercase}.DocSearch-VisuallyHiddenForAccessibility{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.DocSearch-AskAi-Section{display:flex;flex-direction:column;gap:8px;padding:12px 0}.DocSearch-Hit-AskAIButton{align-items:center;color:var(--docsearch-text-color);display:flex;flex-direction:row}.DocSearch-Hit-AskAIButton-icon{color:var(--docsearch-icon-color);flex-shrink:0;margin-inline-end:12px}.DocSearch-Hit-AskAIButton-title{color:var(--docsearch-hit-color);display:flex;flex:1 1 auto;font-weight:400;gap:4px;overflow-x:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;width:80%}.DocSearch-Hit-AskAIButton-title-query{background:none;margin-inline-start:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.DocSearch-Hit-AskAIButton-title mark{-webkit-text-decoration:none;text-decoration:none}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.DocSearch-AskAiScreen-Container{display:flex;flex-direction:column;gap:0;height:100%;justify-content:flex-start;padding:0;text-align:start;width:100%}.DocSearch-AskAiScreen-Disclaimer{align-self:flex-start;display:flex;font-size:.6em;font-weight:300;margin:0;padding-block:1.5em .5em;padding-inline:0;text-align:start}.DocSearch-AskAiScreen-Body{gap:24px;width:100%}.DocSearch-AskAiScreen-Body,.DocSearch-AskAiScreen-Response,.DocSearch-AskAiScreen-Response-Container{display:flex;flex-direction:column}.DocSearch-AskAiScreen-Response{align-self:flex-start;background:var(--docsearch-hit-background);border-radius:4px;color:var(--docsearch-text-color);font-size:.8em;gap:1em;margin-block-end:8px;padding:24px;width:100%}.DocSearch-AskAiScreen-Query{font-size:1.25em;font-weight:600;line-break:loose;line-height:1.4;margin:0}.DocSearch-AskAiScreen-Answer{line-height:1.5}.DocSearch-AskAiScreen-Answer,.DocSearch-AskAiScreen-ThinkingDots{color:var(--docsearch-secondary-text-color);font-weight:400;margin:0}.DocSearch-AskAiScreen-ThinkingDots{font-size:.8em}.DocSearch-AskAiScreen-Answer-Footer{align-items:center;display:flex;flex-direction:row;gap:8px;justify-content:space-between}.DocSearch-AskAiScreen-Actions{align-items:center;display:flex;flex-direction:row;gap:12px;margin-inline-start:auto}.DocSearch-AskAiScreen-ActionButton{align-items:center;background:none;border:none;border-radius:4px;cursor:pointer;display:flex;justify-content:center;margin:0;padding:4px;transition:background-color .2s ease;width:24px}.DocSearch-AskAiScreen-ActionButton:hover{background:var(--docsearch-hit-highlight-color)}.DocSearch-AskAiScreen-ActionButton svg{color:var(--docsearch-icon-color);height:20px;stroke-width:1.5;width:20px}.DocSearch-AskAiScreen-CopyButton--copied{background-color:var(--docsearch-success-color);cursor:default}.DocSearch-AskAiScreen-MessageContent{display:flex;flex-direction:column;row-gap:1em}.DocSearch-AskAiScreen-Error{background-color:rgba(239,83,80,.1);border-radius:4px;color:var(--docsearch-error-color);flex-direction:row;font-size:1em;font-weight:400;gap:8px;padding:1em}.DocSearch-AskAiScreen-Error svg{margin-top:.25rem}.DocSearch-AskAiScreen-Error svg,.DocSearch-AskAiScreen-MessageContent-Tool svg{flex-shrink:0;height:16px;width:16px}.DocSearch-AskAiScreen-Error p{margin:0}.DocSearch-AskAiScreen-Error-Content{display:flex;flex:1 1 0%;flex-direction:column}.DocSearch-AskAiScreen-Error-Title{font-weight:700;margin-bottom:4px}.DocSearch-AskAiScreen-Error .DocSearch-Markdown-Content{color:var(--docsearch-error-color)}.DocSearch-AskAiScreen-Error--ThreadDepth{animation:slideDown .3s ease-out;border:1px solid #febdc5;color:var(--docsearch-text-color);font-size:12px;margin:12px 0 8px;width:100%}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.DocSearch-ThreadDepthError-Link{background:none;border:none;color:var(--docsearch-highlight-color);cursor:pointer;font-family:inherit;font-size:inherit;padding:0;-webkit-text-decoration:underline;text-decoration:underline}.DocSearch-ThreadDepthError-Link:hover{opacity:.8}.DocSearch-ThreadDepthError-Link:active{color:#991b1b}.DocSearch-AskAiScreen-FeedbackText{color:var(--docsearch-muted-color);font-size:.7em;font-weight:400;margin:0}.DocSearch-AskAiScreen-FeedbackText--visible{animation:fade-in .3s ease-in forwards}.DocSearch-AskAiScreen-RelatedSources{display:flex;flex-direction:column;gap:4px;width:100%}.DocSearch-AskAiScreen-RelatedSources-List{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px;width:100%}.DocSearch-AskAiScreen-RelatedSources-Title{color:var(--docsearch-secondary-text-color);font-size:.7em;font-weight:400;margin:0;padding:6px 0}.DocSearch-AskAiScreen-RelatedSources-NoResults{color:var(--docsearch-text-color);font-size:.8rem;font-weight:400;margin:0}.DocSearch-AskAiScreen-RelatedSources-Error{color:var(--docsearch-error-color);font-size:.8rem;font-weight:400;margin:0}.DocSearch-AskAiScreen-RelatedSources-Item-Link{align-items:center;background:var(--docsearch-hit-background);border-radius:4px;color:var(--docsearch-text-color);display:flex;font-size:.75em;gap:6px;max-width:70%;padding:12px 8px;-webkit-text-decoration:none;text-decoration:none;transition:background-color .2s ease}.DocSearch-AskAiScreen-RelatedSources-Item-Link svg{color:var(--docsearch-icon-color);flex-shrink:0;stroke-width:1.2}.DocSearch-AskAiScreen-RelatedSources-Item-Link span{flex:1 1 0;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.DocSearch-AskAiScreen-ExchangesList{display:flex;flex-direction:column;gap:24px;margin:8px 0}.DocSearch-AskAiScreen-RelatedSources-Item-Link:hover{background:var(--docsearch-hit-highlight-color)}.DocSearch-Markdown-Content{color:var(--docsearch-text-color);font-size:.9355em;line-height:1.6;word-wrap:break-word}.DocSearch-Markdown-Content--streaming{animation:fade-in .3s ease-in-out both}.DocSearch-Markdown-Content p{margin:1em 0}.DocSearch-Markdown-Content p:last-child{margin-block-end:0}.DocSearch-Markdown-Content p:first-child{margin-block-start:0}.DocSearch-Markdown-Content code{border-radius:3px;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace;font-size:.9em;letter-spacing:normal;margin:0;padding:.2em 0}.DocSearch-Markdown-Content code,.DocSearch-Markdown-Content pre{background-color:var(--docsearch-key-background);color:var(--docsearch-text-color)}.DocSearch-Markdown-Content pre{border-radius:6px;margin:1.5em 0;overflow-x:auto;padding:1.2em}.DocSearch-Markdown-Content pre code{background-color:transparent;border-radius:0;color:inherit;font-size:.8em;margin:0;padding:0;white-space:pre-wrap;word-wrap:break-word;line-height:1.5}.DocSearch-Markdown-Content h1,.DocSearch-Markdown-Content h2,.DocSearch-Markdown-Content h3,.DocSearch-Markdown-Content h4,.DocSearch-Markdown-Content h5,.DocSearch-Markdown-Content h6{color:var(--docsearch-text-color);font-weight:600;letter-spacing:-.02em;line-height:1.3;margin:1em 0}.DocSearch-Markdown-Content h1{font-size:1.5em}.DocSearch-Markdown-Content h2{font-size:1.2em}.DocSearch-Markdown-Content h3{font-size:1em}.DocSearch-Markdown-Content h4{font-size:.9em}.DocSearch-Markdown-Content h5,.DocSearch-Markdown-Content h6{font-size:.8em}.DocSearch-Markdown-Content ol,.DocSearch-Markdown-Content ul{color:var(--docsearch-text-color);margin:1.2em 0;padding-inline-start:1.5em}.DocSearch-Markdown-Content ul{list-style-type:disc}.DocSearch-Markdown-Content ol{list-style-type:decimal}.DocSearch-Markdown-Content li{color:var(--docsearch-text-color);line-height:1.6;margin:.8em 0;padding-inline-start:.3em}.DocSearch-Markdown-Content li>ol,.DocSearch-Markdown-Content li>ul{margin:.5em}.DocSearch-Markdown-Content li::marker{color:var(--docsearch-muted-color)}.DocSearch-Markdown-Content a{color:var(--docsearch-highlight-color);-webkit-text-decoration:none;text-decoration:none;transition:all .2s ease}.DocSearch-Markdown-Content a:hover{opacity:.9;-webkit-text-decoration:underline;text-decoration:underline}.DocSearch-Markdown-Content blockquote{border-inline-start:4px solid var(--docsearch-hit-highlight-color);color:var(--docsearch-secondary-text-color);font-style:italic;margin:1.5em 0;padding-block:.5em;padding-inline:1em 0}.DocSearch-Markdown-Content hr{border:none;border-block-start:1px solid var(--docsearch-subtle-color);margin:1em 0}.DocSearch-Markdown-Content table{border-collapse:collapse;margin:1.5em 0;width:100%}.DocSearch-Markdown-Content td,.DocSearch-Markdown-Content th{border:1px solid var(--docsearch-subtle-color);padding:.75em;text-align:start}.DocSearch-Markdown-Content th{background-color:var(--docsearch-hit-background);font-weight:600}.DocSearch-AskAiScreen-MessageContent-Reasoning{align-items:center;color:var(--docsearch-muted-color);display:flex;font-size:1em;gap:4px}.DocSearch-AskAiScreen-MessageContent-Reasoning svg{color:var(--docsearch-icon-color)}.DocSearch-AskAiScreen-MessageContent-Tool{align-items:center;color:var(--docsearch-muted-color);display:flex;line-height:1.2;width:100%}.DocSearch-AskAiScreen-MessageContent-Tool.Tool--Result{padding-block-start:0}.DocSearch-AskAiScreen-MessageContent-Tool>svg{color:var(--docsearch-icon-color);margin-inline-end:8px}.DocSearch-AskAiScreen-MessageContent-Tool-Query{color:var(--docsearch-muted-color);transition:box-shadow .2s ease}.DocSearch-AskAiScreen-MessageContent-Tool-Query svg{color:var(--docsearch-muted-color)}.DocSearch-AskAiScreen-MessageContent-Tool-Query:hover{box-shadow:0 1px 0 0 var(--docsearch-highlight-color);color:var(--docsearch-highlight-color);cursor:pointer}.DocSearch-AskAiScreen-MessageContent-Tool-Query:hover svg{color:var(--docsearch-highlight-color)}.DocSearck-AskAiScreen-MessageContent-Stopped{color:var(--docsearch-muted-color);font-style:italic;margin-block-start:1em}.DocSearch-AskAiScreen-SmallerLoadingIcon{height:16px;width:16px}.shimmer{background:var(--shimmer-bg);background-clip:text;-webkit-background-clip:text;background-size:200% auto;color:transparent;display:flex;-webkit-text-fill-color:transparent;animation:shimmerText 2.5s linear infinite;pointer-events:none}@keyframes shimmerText{0%{background-position:200% 0}to{background-position:-200% 0}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{opacity:.3}50%{opacity:.6}}@media (max-width:768px){:root{--docsearch-spacing:10px;--docsearch-footer-height:48px}.DocSearch-Input{font-size:1rem}.DocSearch-Hit-AskAIButton-icon{margin-inline-end:8px}body:has(.DocSearch-Container){overflow:hidden;position:fixed}.DocSearch-Dropdown{height:100%}.DocSearch-Container{height:calc(var(--docsearch-vh, 1vh)*100);height:100dvh}.DocSearch-Footer{border-radius:0;inset-block-end:0;position:static}.DocSearch-Hit-content-wrapper{display:flex;position:relative;width:80%}.DocSearch-Modal{border-radius:0;box-shadow:none;height:calc(var(--docsearch-vh, 1vh)*100);height:100dvh;margin:0;max-width:100%;width:100%}.DocSearch-Dropdown{max-height:none}.DocSearch-Commands,.DocSearch-Hit-Tree{display:none}.DocSearch-AskAiScreen-Response-Container{flex-direction:column}.DocSearch-AskAiScreen-RelatedSources,.DocSearch-AskAiScreen-Response{width:100%}}.DocSearch-CodeSnippet{position:relative}.DocSearch-CodeSnippet-CopyButton{align-items:center;background:var(--docsearch-key-background);border:none;border-radius:4px;color:var(--docsearch-text-color);cursor:pointer;display:flex;font-size:.75em;inset-block-start:8px;inset-inline-end:8px;padding:.2em .6em;position:absolute;transition:opacity .2s ease}.DocSearch-CodeSnippet-CopyButton:hover{opacity:.8}.DocSearch-CodeSnippet-CopyButton:active{opacity:.6}.DocSearch-CodeSnippet-CopyButton svg{height:16px;margin-inline-end:4px;width:16px}.DocSearch-CodeSnippet-CheckIcon,.DocSearch-CodeSnippet-CopyButton--copied .DocSearch-CodeSnippet-CopyIcon{display:none}.DocSearch-CodeSnippet-CopyButton--copied .DocSearch-CodeSnippet-CheckIcon{display:inline-block}.DocSearch-Markdown-Content--streaming .DocSearch-CodeSnippet-CopyButton{display:none}.DocSearch-NewConversationScreen{padding:3em var(--docsearch-spacing)}.DocSearch-NewConversationScreen-Title{color:var(--docsearch-text-color);font-size:26px;font-weight:600;margin-block-end:.15em}.DocSearch-NewConversationScreen-Description{color:var(--docsearch-muted-color);font-size:14px}.DocSearch-NewConversationScreen-SuggestedQuestions{align-items:start;display:flex;flex-direction:column;gap:var(--docsearch-spacing);margin-block-start:1.5em}.DocSearch-NewConversationScreen-SuggestedQuestion{align-items:center;background-color:var(--docsearch-searchbox-background);border:1px solid var(--docsearch-subtle-color);border-radius:var(--docsearch-border-radius);color:var(--docsearch-text-color);cursor:pointer;display:inline-flex;height:40px;justify-content:center;padding:12px}.DocSearch-Menu{position:relative}.DocSearch-Menu-content{background-color:var(--docsearch-dropdown-menu-background);border-radius:var(--docsearch-border-radius);box-shadow:0 0 0 1px #21243d0d,0 8px 16px -4px #21243d40;display:none;flex-direction:column;inset-block-start:calc(100% + 12px);inset-inline-end:0;min-width:195px;padding:8px 0;position:absolute;z-index:422}.DocSearch-Menu-content.open{display:flex}.DocSearch-Menu-item{align-items:center;background-color:transparent;border:0;color:var(--docsearch-text-color);cursor:pointer;display:flex;font-size:14px;gap:8px;padding:10px 16px;white-space:nowrap}.DocSearch-Menu-item:hover{background-color:var(--docsearch-dropdown-menu-item-hover-background)}}
:root {
--docsearch-primary-color: var(--ifm-color-primary);
--docsearch-text-color: var(--ifm-font-color-base);
}
.DocSearch {
--docsearch-muted-color: rgb(164, 166, 168);
--docsearch-searchbox-background: #1B1B1D;
}
.DocSearch-Button {
margin: 0;
border-color: #212139;
transition: all var(--ifm-transition-fast)
var(--ifm-transition-timing-default);
}
.DocSearch-Button-Key {
padding: 0;
font-size: 11px;
border: none;
color: rgb(182, 183, 213);
}
.DocSearch-Container {
z-index: calc(var(--ifm-z-index-fixed) + 1);
}
[data-theme='light'] .DocSearch {
--docsearch-key-color: rgb(128, 128, 213);
--docsearch-key-background: #36395a;
--docsearch-hit-color: var(--vdd-off-white);
--docsearch-hit-active-color: var(--ifm-color-white);
--docsearch-hit-background: var(--ifm-color-white);
--docsearch-highlight-color: #4961CD;
}
[data-theme='light'] .DocSearch-HitsFooter {
color: #474748;
}
[data-theme='dark'] .DocSearch {
--docsearch-hit-color: var(--ifm-font-color-base);
--docsearch-highlight-color: #4961CD;
/* --docsearch-container-background: rgba(47, 55, 69, 0.7); */
}
[data-theme='dark'] .DocSearch-Hits mark {
color: var(--ifm-link-color);
}
[data-theme='dark'] .DocSearch-Hit-source {
color: var(--ifm-off_white);
font-weight: 400;
}
[data-theme='dark'] .DocSearch-Hit-Select-Icon {
color: var(--ifm-off_white);
font-weight: 400;
}
[data-theme='dark'] .DocSearch-Clear {
color: var(--ifm-link-color);
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.codeBlockContainer_Ckt0 {
background: var(--prism-background-color);
color: var(--prism-color);
margin-bottom: var(--ifm-leading);
box-shadow: var(--ifm-global-shadow-lw);
border-radius: var(--ifm-code-border-radius);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.codeBlock_bY9V {
--ifm-pre-background: var(--prism-background-color);
margin: 0;
padding: 0;
}
.codeBlockStandalone_MEMb {
padding: 0;
}
.codeBlockLines_e6Vv {
font: inherit;
/* rtl:ignore */
float: left;
min-width: 100%;
padding: var(--ifm-pre-padding);
}
.codeBlockLinesWithNumbering_o6Pm {
display: table;
padding: var(--ifm-pre-padding) 0;
}
@media print {
.codeBlockLines_e6Vv {
white-space: pre-wrap;
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/* Intentionally has zero specificity, so that to be able to override
the background in custom CSS file due bug https://github.com/facebook/docusaurus/issues/3678 */
:where(:root) {
--docusaurus-highlighted-code-line-bg: rgb(72 77 91);
}
:where([data-theme='dark']) {
--docusaurus-highlighted-code-line-bg: rgb(100 100 100);
}
.theme-code-block-highlighted-line {
background-color: var(--docusaurus-highlighted-code-line-bg);
display: block;
margin: 0 calc(-1 * var(--ifm-pre-padding));
padding: 0 var(--ifm-pre-padding);
}
.codeLine_lJS_ {
display: table-row;
counter-increment: line-count;
}
.codeLineNumber_Tfdd {
display: table-cell;
text-align: right;
width: 1%;
position: sticky;
left: 0;
padding: 0 var(--ifm-pre-padding);
background: var(--ifm-pre-background);
overflow-wrap: normal;
}
.codeLineNumber_Tfdd::before {
content: counter(line-count);
opacity: 0.4;
}
.theme-code-block-highlighted-line .codeLineNumber_Tfdd::before {
opacity: 0.8;
}
.codeLineContent_feaV {
padding-right: var(--ifm-pre-padding);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.theme-code-block:hover .copyButtonCopied_Vdqa {
opacity: 1 !important;
}
.copyButtonIcons_IEyt {
position: relative;
width: 1.125rem;
height: 1.125rem;
}
.copyButtonIcon_TrPX,
.copyButtonSuccessIcon_cVMy {
position: absolute;
top: 0;
left: 0;
fill: currentColor;
opacity: inherit;
width: inherit;
height: inherit;
transition: all var(--ifm-transition-fast) ease;
}
.copyButtonSuccessIcon_cVMy {
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0.33);
opacity: 0;
color: #00d600;
}
.copyButtonCopied_Vdqa .copyButtonIcon_TrPX {
transform: scale(0.33);
opacity: 0;
}
.copyButtonCopied_Vdqa .copyButtonSuccessIcon_cVMy {
transform: translate(-50%, -50%) scale(1);
opacity: 1;
transition-delay: 0.075s;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.wordWrapButtonIcon_b1P5 {
width: 1.2rem;
height: 1.2rem;
}
.wordWrapButtonEnabled_uzNF .wordWrapButtonIcon_b1P5 {
color: var(--ifm-color-primary);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.buttonGroup_M5ko {
display: flex;
column-gap: 0.2rem;
position: absolute;
/* rtl:ignore */
right: calc(var(--ifm-pre-padding) / 2);
top: calc(var(--ifm-pre-padding) / 2);
}
.buttonGroup_M5ko button {
display: flex;
align-items: center;
background: var(--prism-background-color);
color: var(--prism-color);
border: 1px solid var(--ifm-color-emphasis-300);
border-radius: var(--ifm-global-radius);
padding: 0.4rem;
line-height: 0;
transition: opacity var(--ifm-transition-fast) ease-in-out;
opacity: 0;
}
.buttonGroup_M5ko button:focus-visible,
.buttonGroup_M5ko button:hover {
opacity: 1 !important;
}
.theme-code-block:hover .buttonGroup_M5ko button {
opacity: 0.4;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.codeBlockContent_QJqH {
position: relative;
/* rtl:ignore */
direction: ltr;
border-radius: inherit;
}
.codeBlockTitle_OeMC {
border-bottom: 1px solid var(--ifm-color-emphasis-300);
font-size: var(--ifm-code-font-size);
font-weight: 500;
padding: 0.75rem var(--ifm-pre-padding);
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
.codeBlockTitle_OeMC + .codeBlockContent_QJqH .codeBlock_a8dz {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
}
/*
* Generator components stylesheet
* Contains styles for interactive generator components
*
* Used by:
* - ButtonGenerator component (src/components/ButtonGenerator/index.tsx)
* - OsmGenerator component (src/components/OsmGenerator/index.tsx)
*
* These styles use CSS variables defined in custom.css
*/
/* ============================================================================
BUTTON GENERATOR / OSM GENERATOR CONTAINER
============================================================================
Main container for generator components with responsive styling.
On mobile (<400px): Minimal styling with no border
On desktop (≥400px): Full styled container with border and background
========================================================================= */
/* Generator container - mobile default (minimal styling) */
.button-generator {
grid-template-columns: repeat(1, minmax(0, 1fr));
margin-bottom: 1.5rem;
border: none;
}
/* Generator container - desktop styling (400px+) */
@media (min-width: 400px) {
.button-generator {
border: none;
margin: 0;
margin-bottom: 1.5rem;
padding: var(--vdd-pad-xl);
background-color: var(--vdd-surface-medium);
border-radius: var(--vdd-radius);
max-width: 1000px;
}
/* Dark mode rests on the standard lifted-card surface instead of
--vdd-surface-medium (#3a3b3c). That token is meant for hover states, and it
is too light to carry the link in the sentence above the code output:
--vdd-link-dark (#8095ff) on it is 4.09:1, under the 4.5:1 WCAG 2.1 AA needs
for 16px text. On --vdd-bg-box (#242526) the same link is 5.6:1. */
html[data-theme="dark"] .button-generator {
background-color: var(--vdd-bg-box);
}
.button-generator:hover {
/* Derive hover from the resting surface so they stay in sync. Light mode:
darken slightly for feedback (the old rule reused the resting color, so
hover did nothing). */
background-color: color-mix(in srgb, var(--vdd-surface-medium) 94%, black);
}
html[data-theme="dark"] .button-generator:hover {
/* Dark mode lightens instead (the old #212434 was a darker navy that clashed
with the neutral-gray resting surface). Only by 5%: the link inside stays
above 4.5:1 up to about #343434, and a 10% lift lands on #3a3b3c, which
fails. axe cannot evaluate :hover, so generators.spec.ts asserts this. */
background-color: color-mix(in srgb, var(--vdd-bg-box) 95%, white);
}
}
/* ============================================================================
GENERATOR CONTENT AREAS
============================================================================
Styles for content sections within generators including form fields
and code output areas.
========================================================================= */
/* Content area and code blocks background colors */
.button-generator-content,
.button-generator code {
background-color: var(--vdd-white);
}
/* The container itself is --vdd-bg-box in dark mode, so the form panel drops to the
page background to stay visibly inset. Inline code keeps the lifted-card color,
which reads as a chip on that darker panel. Both tiers carry off-white text, so
neither is near a contrast threshold. */
html[data-theme="dark"] .button-generator-content {
background-color: var(--ifm-background-color);
}
html[data-theme="dark"] .button-generator code {
background-color: var(--vdd-bg-box);
}
/* Code output area with word wrapping */
.button-generator-code code{
background-color: var(--alert-background-color-code);
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-all;
white-space: pre-wrap;
}
/* Text sizing for content and code */
.button-generator-content,
.button-generator code {
font-size: 0.875rem;
line-height: 1.25rem;
border-radius: 0.4rem;
}
/* ============================================================================
GENERATOR FORM CONTROLS
============================================================================
Radio buttons and other form input styling for generator options.
========================================================================= */
/* Radio button fieldset container */
.button-generator-radio-button {
border: none;
padding: 0;
margin: 0;
margin-top: 0.25rem;
}
/* Radio button label styling */
.button-generator-radio-button label {
display: inline-flex;
align-items: flex-start;
margin-left: 0;
margin-right: 0.25rem;
margin-bottom: 0.25rem;
padding-right: 0.75rem;
}
/* Radio button input styling */
.button-generator-radio-button input {
flex-shrink: 0;
width: 1rem;
height: 1rem;
vertical-align: middle;
margin-left: 0;
margin-right: 0.3rem;
margin-top: 0.2rem;
/* Match the light/dark preview toggle so all generator controls share a color. */
accent-color: var(--button-primary-color-background-default);
}
/* ============================================================================
GENERATOR ACTION BUTTONS
============================================================================
Styled buttons for generator actions (e.g., "Copy", "Reset", etc.)
Purple-themed buttons with hover and active states.
========================================================================= */
/* Switch for the light/dark preview background. The native checkbox stays in
the accessibility tree and keyboard focus order, while the track and thumb
provide the visual switch. */
.generator-preview-toggle {
position: relative;
display: inline-flex;
align-items: center;
gap: 0.5rem;
margin: 0.5rem 0;
cursor: pointer;
font-family: inherit;
}
.generator-preview-toggle input {
position: absolute;
width: 1px;
height: 1px;
margin: 0;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.generator-preview-toggle-track {
position: relative;
flex-shrink: 0;
width: 56px;
height: 30px;
border-radius: 15px;
background-color: var(--button-primary-color-background-default);
transition: background-color 0.2s ease;
}
.generator-preview-toggle:hover .generator-preview-toggle-track {
background-color: var(--button-primary-color-background-hover);
}
.generator-preview-toggle input:active + .generator-preview-toggle-track {
background-color: var(--button-primary-color-background-active);
}
.generator-preview-toggle input:focus-visible + .generator-preview-toggle-track {
outline: 2px solid var(--vdd-white);
outline-offset: 2px;
box-shadow: 0 0 0 4px var(--button-primary-color-boxshadow-focus);
}
.generator-preview-toggle-thumb {
position: absolute;
top: 3px;
left: 3px;
width: 24px;
height: 24px;
border-radius: 50%;
background-color: var(--vdd-white);
color: var(--button-primary-color-background-default);
display: flex;
align-items: center;
justify-content: center;
transition: transform 0.2s ease;
}
.generator-preview-toggle input:checked + .generator-preview-toggle-track
.generator-preview-toggle-thumb {
transform: translateX(26px);
}
/* Size the toggle icon consistently regardless of the theme icon's intrinsic size. */
.generator-preview-toggle-thumb svg {
width: 16px;
height: 16px;
}
/* Hover and focus hint. The switch itself is icon-only, so this explains what
it does. It sits outside the layout flow to avoid shifting the row, and is
hidden from assistive tech because the switch already has a name and state.
Uses the Infima emphasis scale, which inverts between light and dark. */
.generator-preview-toggle-tip {
position: absolute;
top: 50%;
left: 100%;
z-index: 2;
margin-left: 0.6rem;
padding: 0.3rem 0.6rem;
border-radius: 0.3rem;
background-color: var(--ifm-color-emphasis-800);
color: var(--ifm-background-color);
font-size: 0.8125rem;
font-style: normal;
font-weight: normal;
line-height: 1.3;
white-space: nowrap;
pointer-events: none;
/* Hidden with visibility as well as opacity, not opacity alone. An element at
opacity 0 is still rendered text, so contrast checkers read its color against
its background, get a transparent foreground, and report 1:1 — WAVE flags this
tooltip that way. visibility:hidden makes it genuinely hidden instead. The fade
survives because visibility flips discretely: on entry at the start of the
transition, on exit at the end. Its visible contrast is unchanged (~15:1). */
opacity: 0;
visibility: hidden;
transform: translateY(-50%);
transition: opacity 0.15s ease, visibility 0.15s ease;
}
.generator-preview-toggle:hover .generator-preview-toggle-tip,
.generator-preview-toggle input:focus-visible ~ .generator-preview-toggle-tip {
opacity: 1;
visibility: visible;
}
@media (prefers-reduced-motion: reduce) {
.generator-preview-toggle-tip {
transition: none;
}
}
@media (prefers-reduced-motion: reduce) {
.generator-preview-toggle-track,
.generator-preview-toggle-thumb {
transition: none;
}
}
@layer docusaurus.theme-common {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/*
CSS variables, meant to be overridden by final theme
*/
.details_lb9f {
--docusaurus-details-summary-arrow-size: 0.38rem;
--docusaurus-details-transition: transform 200ms ease;
--docusaurus-details-decoration-color: grey;
}
.details_lb9f > summary {
position: relative;
cursor: pointer;
list-style: none;
padding-left: 1rem;
}
/* TODO: deprecation, need to remove this after Safari will support `::marker` */
.details_lb9f > summary::-webkit-details-marker {
display: none;
}
.details_lb9f > summary::before {
position: absolute;
top: 0.45rem;
left: 0;
/* CSS-only Arrow */
content: '';
border-width: var(--docusaurus-details-summary-arrow-size);
border-style: solid;
border-color: transparent transparent transparent
var(--docusaurus-details-decoration-color);
/* Arrow rotation anim */
transform: rotate(0deg);
transition: var(--docusaurus-details-transition);
transform-origin: calc(var(--docusaurus-details-summary-arrow-size) / 2) 50%;
}
/* When JS disabled/failed to load: we use the open property for arrow animation: */
.details_lb9f[open]:not(.isBrowser_bmU9) > summary::before,
.details_lb9f[data-collapsed='false'].isBrowser_bmU9 > summary::before {
transform: rotate(90deg);
}
.collapsibleContent_i85q {
margin-top: 1rem;
border-top: 1px solid var(--docusaurus-details-decoration-color);
padding-top: 1rem;
}
.collapsibleContent_i85q p:last-child {
margin-bottom: 0;
}
.details_lb9f > summary > p:last-child {
margin-bottom: 0;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.details_b_Ee {
--docusaurus-details-decoration-color: var(--ifm-alert-border-color);
--docusaurus-details-transition: transform var(--ifm-transition-fast) ease;
margin: 0 0 var(--ifm-spacing-vertical);
border: 1px solid var(--ifm-alert-border-color);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.containsTaskList_mC6p {
list-style: none;
}
:not(.containsTaskList_mC6p > li) > .containsTaskList_mC6p {
padding-left: 0;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.img_ev3q {
height: auto;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.admonition_xJq3 {
margin-bottom: 1em;
}
.admonitionHeading_Gvgb {
font: var(--ifm-heading-font-weight) var(--ifm-h5-font-size) /
var(--ifm-heading-line-height) var(--ifm-heading-font-family);
text-transform: uppercase;
}
/* Heading alone without content (does not handle fragment content) */
.admonitionHeading_Gvgb:not(:last-child) {
margin-bottom: 0.3rem;
}
.admonitionHeading_Gvgb code {
text-transform: none;
}
.admonitionIcon_Rf37 {
display: inline-block;
vertical-align: middle;
margin-right: 0.4em;
}
.admonitionIcon_Rf37 svg {
display: inline-block;
height: 1.6em;
width: 1.6em;
fill: var(--ifm-alert-foreground-color);
}
.admonitionContent_BuS1 > :last-child {
margin-bottom: 0;
}
}
@layer docusaurus.theme-mermaid {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.container_lyt7 {
max-width: 100%;
}
.container_lyt7 > svg {
max-width: 100%;
}
}
.icon_PIZx {
vertical-align: -2px;
}
.icon_PIZx.small_ieU3 {
width: 16px;
height: 16px;
}
.icon_PIZx.medium_L7T_ {
width: 24px;
height: 24px;
}
.icon_PIZx.large_HMAn {
width: 32px;
height: 32px;
}
.icon_PIZx.up_r2ry {
transform: rotate(0deg);
}
.icon_PIZx.right_HOD0 {
transform: rotate(90deg);
}
.icon_PIZx.down_XRe8 {
transform: rotate(180deg);
}
.icon_PIZx.left_mjQE {
transform: rotate(270deg);
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.tabList__CuJ {
margin-bottom: var(--ifm-leading);
}
.tabItem_LNqP {
margin-top: 0 !important;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.tabItem_Ymn6 > *:last-child {
margin-bottom: 0;
}
}
.badge_IEyH {
align-items: center;
border-radius: 4px;
display: inline-flex;
font-size: var(--font-size-small);
line-height: var(--line-height-x-small);
gap: 0.25rem;
padding: 0.25rem 0.5rem;
}
.badge_IEyH svg {
flex-shrink: 0;
}
.badge_IEyH.default_yIJQ {
color: var(--badge-default-color-text-default);
background-color: var(--badge-default-color-background-default);
}
.badge_IEyH.disabled_p7HL {
color: var(--badge-disabled-color-text-default);
background-color: var(--badge-disabled-color-background-default);
}
.badge_IEyH.error_5Esp {
color: var(--badge-error-color-text-default);
background-color: var(--badge-error-color-background-default);
}
.badge_IEyH.id_VbV8 {
color: var(--badge-id-color-text-default);
background-color: var(--badge-id-color-background-default);
border: 1px solid var(--badge-id-color-border-default);
}
.badge_IEyH.primary_KyTG {
color: var(--badge-primary-color-text-default);
background-color: var(--badge-primary-color-background-default);
}
.badge_IEyH.success_wByO {
color: var(--badge-success-color-text-default);
background-color: var(--badge-success-color-background-default);
}
.badge_IEyH.vipps_g5Ez {
color: var(--badge-vipps-color-text-default);
background-color: var(--badge-vipps-color-background-default);
}
.badge_IEyH.warning_XWdC {
color: var(--badge-warning-color-text-default);
background-color: var(--badge-warning-color-background-default);
}
.badge_IEyH.transparent_Zb1p {
border: none;
background-color: transparent;
}
.badge_IEyH.default_yIJQ.transparent_Zb1p {
color: var(--badge-default-color-text-transparent);
}
.badge_IEyH.disabled_p7HL.transparent_Zb1p {
color: var(--badge-disabled-color-text-transparent);
}
.badge_IEyH.error_5Esp.transparent_Zb1p {
color: var(--badge-error-color-text-transparent);
}
.badge_IEyH.id_VbV8.transparent_Zb1p {
color: var(--badge-id-color-text-transparent);
}
.badge_IEyH.primary_KyTG.transparent_Zb1p {
color: var(--badge-primary-color-text-transparent);
}
.badge_IEyH.success_wByO.transparent_Zb1p {
color: var(--badge-success-color-text-transparent);
}
.badge_IEyH.vipps_g5Ez.transparent_Zb1p {
color: var(--badge-vipps-color-text-transparent);
}
.badge_IEyH.warning_XWdC.transparent_Zb1p {
color: var(--badge-warning-color-text-transparent);
}
.baseButton_mNZ1 {
padding: 0;
border: 1px solid transparent;
position: relative;
-webkit-text-decoration: none;
text-decoration: none;
transition: background 100ms ease-in-out, color 100ms ease-in-out, box-shadow 100ms ease-in-out;
display: inline-flex;
justify-content: center;
align-items: center;
gap: 8px;
}
.baseButton_mNZ1:focus,.baseButton_mNZ1:active,.baseButton_mNZ1:focus-visible {
outline: none,
}
@supports selector(:focus-visible) {
.baseButton_mNZ1:focus {
box-shadow: none,
}
}
.baseButton_mNZ1:focus-visible {
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 4px var(--focus-color),
}
.baseButton_mNZ1:hover {
cursor: pointer;
}
.baseButton_mNZ1[aria-disabled="true"]:hover {
cursor: not-allowed;
}
.baseButton_mNZ1:hover [aria-busy="true"] {
cursor: wait;
}
.baseButton_mNZ1.large_X5W0 {
font-family: var(--font-family-default);
font-weight: var(--button-large-font-weight);
font-size: var(--button-large-font-size);
line-height: var(--button-large-line-height);
}
.baseButton_mNZ1.medium_y_0Y {
font-family: var(--font-family-default);
font-weight: var(--button-medium-font-weight);
font-size: var(--button-medium-font-size);
line-height: var(--button-medium-line-height);
}
.baseButton_mNZ1.small_pOx4 {
font-family: var(--font-family-default);
font-weight: var(--button-small-font-weight);
font-size: var(--button-small-font-size);
line-height: var(--button-small-line-height);
}
.backButton_ZP5d {
background: transparent;
color: var(--button-back-color-text-default);
border-radius: 20px;
padding: 2px 8px 2px 0;
gap: 4px;
}
.backButton_ZP5d:hover {
color: var(--button-back-color-text-hover);
}
.backButton_ZP5d:active {
color: var(--button-back-color-text-active);
}
@supports selector(:focus-visible) {
.backButton_ZP5d:focus {
box-shadow: none;
}
}
.backButton_ZP5d:focus-visible {
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 4px var(--button-back-color-boxshadow-focus);
}
.backButton_ZP5d[aria-disabled="true"] {
background: transparent;
color: var(--button-back-color-text-disabled);
box-shadow: none;
}
.iconContainer__OCc {
display: inline-flex;
justify-content: center;
align-items: center;
flex: 0 0 auto;
padding-top: 2px;
}
@keyframes fadeIn_tawO {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes smileySpinner__gQ9 {
0% { transform: rotate(0turn); }
20% { transform: rotate(0turn); }
30.5% { transform: rotate(-0.5turn); }
39.5% { transform: rotate(-1turn); }
48.5% { transform: rotate(-1.5turn); }
57.5% { transform: rotate(-2turn); }
66.5% { transform: rotate(-2.5turn); }
75.5% { transform: rotate(-3turn); }
84.5% { transform: rotate(-3.5turn); }
95% { transform: rotate(-4turn); }
100% { transform: rotate(-4turn); }
}
.animation_HF_j.small_VpWJ {
width: 40px;
}
.animation_HF_j.medium_Ftia {
width: 50px;
}
.animation_HF_j.large_CQc8 {
width: 70px;
}
.animation_HF_j.bouncingBall_R4fq {
animation: fadeIn_tawO 150ms 400ms forwards;
opacity: 0;
}
.animation_HF_j.smiley_gpeJ {
animation: 2.25s linear 0s infinite normal none running smileySpinner__gQ9;
}
@keyframes moveAnimation_Cf4h {
from { transform: translate3D(0, 0, 0); }
to { transform: translate3D(0, 10px, 0); }
}
@keyframes opacityChange_t9y5 {
from { opacity: 1; }
to { opacity: 0.2; }
}
.bouncingBall_i5zF {
animation: moveAnimation_Cf4h 450ms infinite alternate ease-in-out, opacityChange_t9y5 450ms infinite alternate ease-in-out;
opacity: 0;
}
.bouncingBall_i5zF.delay200_Qjyn {
animation-delay: 200ms;
}
.bouncingBall_i5zF.delay400_ngXP {
animation-delay: 400ms;
}
@keyframes mouth_WiVB {
0% { stroke-dashoffset: 800; }
20% { stroke-dashoffset: 800; }
95% { stroke-dashoffset: 800; }
100% { stroke-dashoffset: 800; }
57.5% { stroke-dashoffset: 0; }
}
.spinnerMouth_Eyrl {
animation: 2.25s ease-in-out 0s infinite normal none running mouth_WiVB;
stroke-dashoffset: 800;
stroke-dasharray: 1000;
}
@keyframes eye_qnOS {
0% { transform: scaleY(1); }
5% { transform: scaleY(1); }
6% { transform: scaleY(1.1); }
7% { transform: scaleY(0); }
12% { transform: scaleY(1.1); }
13% { transform: scaleY(1); }
18% { transform: scaleY(1); }
19% { transform: scaleY(1.1); }
20% { transform: scaleY(0); }
95% { transform: scaleY(0); }
100% { transform: scaleY(1.1); }
}
.spinnerEye_qNWa {
animation: 2.25s ease-in-out 0s infinite normal none running eye_qnOS;
}
.button_YR81 {
border-radius: 50px;
}
.button_YR81.destructive_eZx_ {
background: var(--button-destructive-color-background-default);
color: var(--button-destructive-color-text-default);
}
.button_YR81.destructive_eZx_:hover {
background: var(--button-destructive-color-background-hover);
}
.button_YR81.destructive_eZx_:active {
background: var(--button-destructive-color-background-active);
}
.button_YR81.destructive_eZx_[aria-busy="true"] {
background: var(--button-destructive-color-background-default);
}
[aria-busy="true"]:is(.button_YR81.destructive_eZx_:hover,.button_YR81.destructive_eZx_:active) {
background: var(--button-destructive-color-background-default);
}
.button_YR81.destructive_eZx_:focus-visible {
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 4px var(--button-destructive-color-boxshadow-focus);
}
.button_YR81.destructive_eZx_ > [data-spinner] {
left: calc(50% - 15px);
position: absolute;
width: 30px;
}
[aria-hidden="true"]:is(.button_YR81.destructive_eZx_ > [data-spinner]) {
visibility: hidden;
}
.button_YR81.destructive_eZx_ > [data-spinner] {
fill: var(--button-destructive-color-text-default);
stroke: var(--button-destructive-color-text-default);
}
.button_YR81.destructive_eZx_[aria-disabled="true"] {
background: var(--button-destructive-color-background-disabled);
color: var(--button-destructive-color-text-disabled);
box-shadow: none;
}
.button_YR81.orange_epJm {
background: var(--orange-50-color);
color: var(--white-color);
}
.button_YR81.orange_epJm:hover {
background: var(--orange-30-color);
}
.button_YR81.orange_epJm:active {
background: var(--orange-60-color);
}
.button_YR81.orange_epJm[aria-busy="true"] {
background: var(--orange-50-color);
}
[aria-busy="true"]:is(.button_YR81.orange_epJm:hover,.button_YR81.orange_epJm:active) {
background: var(--orange-50-color);
}
.button_YR81.orange_epJm > [data-spinner] {
left: calc(50% - 15px);
position: absolute;
width: 30px;
}
[aria-hidden="true"]:is(.button_YR81.orange_epJm > [data-spinner]) {
visibility: hidden;
}
.button_YR81.orange_epJm > [data-spinner] {
fill: var(--white-color);
stroke: var(--white-color);
}
.button_YR81.orange_epJm[aria-disabled="true"] {
background: var(--gray-30-color);
color: var(--white-color);
box-shadow: none;
}
.button_YR81.primary_gJhU {
background: var(--button-primary-color-background-default);
color: var(--button-primary-color-text-default);
}
.button_YR81.primary_gJhU:hover {
background: var(--button-primary-color-background-hover);
}
.button_YR81.primary_gJhU:active {
background: var(--button-primary-color-background-active);
}
.button_YR81.primary_gJhU[aria-busy="true"] {
background: var(--button-primary-color-background-default);
}
[aria-busy="true"]:is(.button_YR81.primary_gJhU:hover,.button_YR81.primary_gJhU:active) {
background: var(--button-primary-color-background-default);
}
.button_YR81.primary_gJhU:focus-visible {
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 4px var(--button-primary-color-boxshadow-focus);
}
.button_YR81.primary_gJhU > [data-spinner] {
left: calc(50% - 15px);
position: absolute;
width: 30px;
}
[aria-hidden="true"]:is(.button_YR81.primary_gJhU > [data-spinner]) {
visibility: hidden;
}
.button_YR81.primary_gJhU > [data-spinner] {
fill: var(--button-primary-color-text-default);
stroke: var(--button-primary-color-text-default);
}
.button_YR81.primary_gJhU[aria-disabled="true"] {
background: var(--button-primary-color-background-disabled);
color: var(--button-primary-color-text-disabled);
box-shadow: none;
}
.button_YR81.purple_n1zc {
background: var(--purple-60-color);
color: var(--white-color);
}
.button_YR81.purple_n1zc:hover {
background: var(--purple-50-color);
}
.button_YR81.purple_n1zc:active {
background: var(--purple-80-color);
}
.button_YR81.purple_n1zc[aria-busy="true"] {
background: var(--purple-60-color);
}
[aria-busy="true"]:is(.button_YR81.purple_n1zc:hover,.button_YR81.purple_n1zc:active) {
background: var(--purple-60-color);
}
.button_YR81.purple_n1zc > [data-spinner] {
left: calc(50% - 15px);
position: absolute;
width: 30px;
}
[aria-hidden="true"]:is(.button_YR81.purple_n1zc > [data-spinner]) {
visibility: hidden;
}
.button_YR81.purple_n1zc > [data-spinner] {
fill: var(--white-color);
stroke: var(--white-color);
}
.button_YR81.purple_n1zc[aria-disabled="true"] {
background: var(--gray-30-color);
color: var(--white-color);
box-shadow: none;
}
.button_YR81.secondary_Jops {
background: var(--button-secondary-color-background-default);
border: 1px solid var(--button-secondary-color-border-default);
color: var(--button-secondary-color-text-default);
}
.button_YR81.secondary_Jops:hover {
color: var(--button-secondary-color-text-hover);
}
.button_YR81.secondary_Jops:active {
background: var(--button-secondary-color-background-active);
color: var(--button-secondary-color-text-active);
}
.button_YR81.secondary_Jops[aria-busy="true"] {
color: var(--button-secondary-color-text-default);
}
[aria-busy="true"]:is(.button_YR81.secondary_Jops:hover,.button_YR81.secondary_Jops:active) {
background: var(--button-secondary-color-background-default);
color: var(--button-secondary-color-text-default);
}
.button_YR81.secondary_Jops:focus-visible {
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 4px var(--button-secondary-color-boxshadow-focus);
}
.button_YR81.secondary_Jops > [data-spinner] {
left: calc(50% - 15px);
position: absolute;
width: 30px;
}
[aria-hidden="true"]:is(.button_YR81.secondary_Jops > [data-spinner]) {
visibility: hidden;
}
.button_YR81.secondary_Jops > [data-spinner] {
fill: var(--button-secondary-color-text-default);
stroke: var(--button-secondary-color-text-default);
}
.button_YR81.secondary_Jops[aria-disabled="true"] {
background: var(--button-secondary-color-background-disabled);
color: var(--button-secondary-color-text-disabled);
box-shadow: none;
}
.button_YR81.stroked_qHfJ {
background: var(--white-color);
border: 1px solid var(--gray-20-color);
color: var(--purple-60-color);
}
.button_YR81.stroked_qHfJ:hover {
color: var(--purple-50-color);
}
.button_YR81.stroked_qHfJ:active {
background: var(--gray-0-color);
color: var(--purple-80-color);
}
.button_YR81.stroked_qHfJ[aria-busy="true"] {
color: var(--purple-60-color);
}
[aria-busy="true"]:is(.button_YR81.stroked_qHfJ:hover,.button_YR81.stroked_qHfJ:active) {
background: var(--white-color);
color: var(--purple-60-color);
}
.button_YR81.stroked_qHfJ > [data-spinner] {
left: calc(50% - 15px);
position: absolute;
width: 30px;
}
[aria-hidden="true"]:is(.button_YR81.stroked_qHfJ > [data-spinner]) {
visibility: hidden;
}
.button_YR81.stroked_qHfJ > [data-spinner] {
fill: var(--purple-60-color);
stroke: var(--purple-60-color);
}
.button_YR81.stroked_qHfJ[aria-disabled="true"] {
background: var(--white-color);
color: var(--gray-30-color);
box-shadow: none;
}
.button_YR81.white_EZtt {
background: var(--white-color);
color: var(--purple-60-color);
}
.button_YR81.white_EZtt:hover {
color: var(--purple-50-color);
}
.button_YR81.white_EZtt:active {
background: var(--gray-0-color);
color: var(--purple-80-color);
}
.button_YR81.white_EZtt[aria-busy="true"] {
color: var(--purple-60-color);
}
[aria-busy="true"]:is(.button_YR81.white_EZtt:hover,.button_YR81.white_EZtt:active) {
background: var(--white-color);
color: var(--purple-60-color);
}
.button_YR81.white_EZtt > [data-spinner] {
left: calc(50% - 15px);
position: absolute;
width: 30px;
}
[aria-hidden="true"]:is(.button_YR81.white_EZtt > [data-spinner]) {
visibility: hidden;
}
.button_YR81.white_EZtt > [data-spinner] {
fill: var(--purple-60-color);
stroke: var(--purple-60-color);
}
.button_YR81.white_EZtt[aria-disabled="true"] {
background: var(--white-color);
color: var(--gray-30-color);
box-shadow: none;
}
.button_YR81.small_GHrQ {
min-height: 32px;
padding: 0 16px;
}
.button_YR81.medium_dcJ4 {
min-height: 40px;
padding: 0 24px;
}
.button_YR81.large_oT_7 {
min-height: 50px;
padding: 0 24px;
}
.button_YR81.stretched_Qj5t {
width: 100%;
}
.content_Fdcp {
display: inline-flex;
justify-content: center;
align-items: center;
gap: 8px;
}
.content_Fdcp[aria-hidden="true"] {
visibility: hidden;
}
.buttonGroup_vkfP {
display: inline-flex;
gap: 16px;
flex-flow: column wrap;
}
@media screen and (min-width: 720px) {
.buttonGroup_vkfP {
flex-flow: row wrap;
}
}
.buttonGroup_vkfP.default_rQxc {
align-items: stretch;
}
@media screen and (min-width: 720px) {
.buttonGroup_vkfP.default_rQxc {
justify-content: flex-start;
}
}
.buttonGroup_vkfP.start_fsSP {
align-items: flex-start;
}
@media screen and (min-width: 720px) {
.buttonGroup_vkfP.start_fsSP {
justify-content: flex-start;
}
}
.buttonGroup_vkfP.center_aQgy {
align-items: center;
}
@media screen and (min-width: 720px) {
.buttonGroup_vkfP.center_aQgy {
justify-content: center;
}
}
.buttonGroup_vkfP.end_vXH9 {
align-items: flex-end;
}
@media screen and (min-width: 720px) {
.buttonGroup_vkfP.end_vXH9 {
justify-content: flex-end;
}
}
.buttonGroup_vkfP.stretched_CvrR {
width: 100%;
}
.closeButton_tnNf {
background: var(--button-close-color-background-default);
color: var(--button-close-color-text-default);
border-radius: 50%;
height: 32px;
width: 32px;
display: inline-flex;
justify-content: center;
align-items: center;
flex: 0 0 auto;
}
.closeButton_tnNf:hover {
color: var(--button-close-color-text-hover);
}
.closeButton_tnNf:active {
background: var(--button-close-color-background-active);
color: var(--button-close-color-text-active);
}
@supports selector(:focus-visible) {
.closeButton_tnNf:focus {
box-shadow: none;
}
}
.closeButton_tnNf:focus-visible {
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 4px var(--button-close-color-boxshadow-focus);
}
.closeButton_tnNf[aria-disabled="true"] {
background: var(--button-close-color-background-disabled);
color: var(--button-close-color-text-disabled);
box-shadow: none;
}
.moreButton_bFWB {
background: var(--button-more-color-background-default);
color: var(--button-more-color-text-default);
border-radius: 50%;
height: 32px;
width: 32px;
display: inline-flex;
justify-content: center;
align-items: center;
flex: 0 0 auto;
}
.moreButton_bFWB:hover {
background: var(--button-more-color-background-hover);
}
.moreButton_bFWB:active {
background: var(--button-more-color-background-active);
}
@supports selector(:focus-visible) {
.moreButton_bFWB:focus {
box-shadow: none;
}
}
.moreButton_bFWB:focus-visible {
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 4px var(--button-more-color-boxshadow-focus);
}
.moreButton_bFWB[aria-disabled="true"] {
background: var(--button-close-color-background-disabled);
color: var(--button-close-color-text-disabled);
box-shadow: none;
}
.searchInputLabel_HM19 {
display: block;
font-size: var(--ifm-font-size-base);
font-weight: bold;
margin-bottom: 0.4rem;
}
.searchQueryInput_cpyO,
.searchVersionInput_wf2r {
border-radius: var(--ifm-global-radius);
border: 2px solid var(--ifm-toc-border-color);
font: var(--ifm-font-size-base) var(--ifm-font-family-base);
padding: 0.8rem;
width: 100%;
background: var(--docsearch-searchbox-focus-background);
color: var(--docsearch-text-color);
margin-bottom: 0.5rem;
transition: border var(--ifm-transition-fast) ease;
}
.searchQueryInput_cpyO:focus,
.searchVersionInput_wf2r:focus {
border-color: var(--docsearch-primary-color);
outline: none;
}
/* Dark mode: use a subtle gray border instead of blue */
[data-theme='dark'] .searchQueryInput_cpyO:focus,
[data-theme='dark'] .searchVersionInput_wf2r:focus {
border-color: #9ca3af;
}
.searchQueryInput_cpyO::placeholder {
color: var(--docsearch-muted-color);
}
.searchResultsColumn_PLpb {
font-size: 0.9rem;
font-weight: bold;
}
.searchLogoColumn_Mj_0 {
display: flex;
align-items: center;
gap: 0.5rem;
justify-content: flex-end;
}
.searchLogoColumn_Mj_0 a {
display: flex;
}
/* The Algolia attribution logo ships without intrinsic dimensions, so size it
here. Its viewBox is 572x64, giving a height of about 17px. */
.poweredByLogo_jI1Q {
width: 150px;
height: auto;
}
.searchResultItem_AlWU {
padding: 1rem 0;
border-bottom: 1px solid var(--ifm-toc-border-color);
}
.searchResultItemHeading_HJFH {
font-weight: 400;
margin-bottom: 0;
}
.searchResultItemPath_x9Ef {
font-size: 0.8rem;
color: var(--ifm-color-content-secondary);
--ifm-breadcrumb-separator-size-multiplier: 1;
}
.searchResultItemSummary_jej3 {
margin: 0.5rem 0 0;
font-style: italic;
}
@media only screen and (max-width: 996px) {
.searchQueryColumn_hQFc {
max-width: 60% !important;
}
.searchVersionColumn_GkmC {
max-width: 40% !important;
}
.searchResultsColumn_PLpb {
max-width: 60% !important;
}
.searchLogoColumn_Mj_0 {
max-width: 40% !important;
padding-left: 0 !important;
}
}
@media screen and (max-width: 576px) {
.searchQueryColumn_hQFc {
max-width: 100% !important;
}
.searchVersionColumn_GkmC {
max-width: 100% !important;
padding-left: var(--ifm-spacing-horizontal) !important;
}
}
.loadingSpinner_E_zt {
width: 3rem;
height: 3rem;
border: 0.4em solid #eee;
border-top-color: var(--ifm-color-primary);
border-radius: 50%;
animation: loading-spin_hlTL 1s linear infinite;
margin: 0 auto;
}
@keyframes loading-spin_hlTL {
100% {
transform: rotate(360deg);
}
}
.loader_ujSQ {
margin-top: 2rem;
}
.search-result-match {
color: var(--docsearch-hit-color);
background: rgb(255 215 142 / 25%);
padding: 0.09em 0;
}
/* Algolia highlight styling - highlights search terms in results */
.algolia-docsearch-suggestion--highlight {
background: rgb(255 215 142 / 40%);
color: var(--ifm-color-emphasis-900);
font-weight: 600;
padding: 0.1em 0.2em;
border-radius: 2px;
}
/* Dark mode adjustments for highlights */
[data-theme='dark'] .algolia-docsearch-suggestion--highlight {
background: rgb(255 215 142 / 30%);
color: var(--ifm-color-emphasis-100);
}
/* CUSTOM - Search layout grid */
.searchLayout_dMtH {
display: grid;
grid-template-columns: 280px 1fr;
gap: 32px;
}
/* CUSTOM - Results container */
.searchResultsContainer_hwGB {
min-width: 0; /* Prevents overflow issues */
}
/* CUSTOM - Results header (count + logo) */
.searchResultsHeader_bE4O {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
flex-wrap: wrap;
gap: 1rem;
}
.searchResultsCount_Cl6S {
flex: 1;
min-width: 0;
}
/* CUSTOM - Filter accordion for mobile */
.filterAccordion_BBwn {
display: none; /* Hidden on desktop */
}
.filterAccordionButton_DWtP {
width: 100%;
padding: 1rem;
margin-bottom: 0;
background: var(--ifm-background-surface-color);
color: var(--ifm-font-color-base);
border: 1px solid var(--ifm-toc-border-color);
border-radius: var(--ifm-global-radius);
font-size: 1rem;
font-weight: 600;
cursor: pointer;
text-align: left;
display: flex;
justify-content: space-between;
align-items: center;
transition: background 0.2s ease, border-color 0.2s ease;
}
.filterAccordionButton_DWtP:hover {
background: var(--ifm-color-emphasis-100);
border-color: var(--ifm-color-primary);
}
.filterAccordionButton_DWtP:active {
background: var(--ifm-color-emphasis-200);
}
.filterAccordionButton_DWtP[aria-expanded="true"] {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom-color: transparent;
}
.filterAccordionContent_BmkH {
margin-bottom: 1.5rem;
border: 1px solid var(--ifm-toc-border-color);
border-top: none;
border-radius: 0 0 var(--ifm-global-radius) var(--ifm-global-radius);
background: var(--ifm-background-surface-color);
}
.filterAccordionContent_BmkH[hidden] {
display: none;
}
.filterAccordionInner_OJlH {
padding: 1.25rem;
}
/* Facets sidebar styles */
.searchFacetsColumn_Ma9v {
padding: 1rem;
background: var(--ifm-background-surface-color);
border-radius: var(--ifm-global-radius);
border: 1px solid var(--ifm-toc-border-color);
}
/* InstantSearch RefinementList styles */
.searchFacetsColumn_Ma9v .ais-RefinementList,
.filterAccordionInner_OJlH .ais-RefinementList {
font-size: 0.9rem;
}
.searchFacetsColumn_Ma9v .ais-RefinementList-list,
.filterAccordionInner_OJlH .ais-RefinementList-list {
list-style: none;
padding: 0;
margin: 0;
}
.searchFacetsColumn_Ma9v .ais-RefinementList-item,
.filterAccordionInner_OJlH .ais-RefinementList-item {
margin-bottom: 0.5rem;
}
.searchFacetsColumn_Ma9v .ais-RefinementList-label,
.filterAccordionInner_OJlH .ais-RefinementList-label {
display: flex;
align-items: center;
cursor: pointer;
color: var(--ifm-font-color-base);
padding: 0.25rem 0;
transition: color 0.2s ease;
}
.searchFacetsColumn_Ma9v .ais-RefinementList-label:hover,
.filterAccordionInner_OJlH .ais-RefinementList-label:hover {
color: var(--ifm-color-primary);
}
.searchFacetsColumn_Ma9v .ais-RefinementList-checkbox,
.filterAccordionInner_OJlH .ais-RefinementList-checkbox {
margin-right: 0.5rem;
cursor: pointer;
width: 16px;
height: 16px;
/* Match the Clear filters button's blue so the checked state and the button
read as one control group in both themes. */
accent-color: var(--button-primary-color-background-default);
}
.searchFacetsColumn_Ma9v .ais-RefinementList-labelText,
.filterAccordionInner_OJlH .ais-RefinementList-labelText {
flex: 1;
}
.searchFacetsColumn_Ma9v .ais-RefinementList-count,
.filterAccordionInner_OJlH .ais-RefinementList-count {
background: var(--ifm-color-emphasis-200);
color: var(--ifm-color-emphasis-800);
padding: 0.15rem 0.5rem;
border-radius: 10px;
font-size: 0.75rem;
margin-left: 0.5rem;
font-weight: 500;
}
/* Clear filters button. The design system Button supplies the blue pill and its
white label, so only the disabled palette needs overriding: DS disables to
white on light gray (1.7:1). A muted surface with emphasis-700 text keeps the
label at 4.8:1 in light mode and 6.7:1 in dark mode (WCAG AA). */
.clearFiltersButton_x8xm[aria-disabled='true'] {
--button-primary-color-background-disabled: var(--ifm-color-emphasis-200);
--button-primary-color-text-disabled: var(--ifm-color-emphasis-700);
}
/* SearchBox styles */
.ais-SearchBox-form {
position: relative;
}
.ais-SearchBox-input {
width: 100%;
}
.ais-SearchBox-submit,
.ais-SearchBox-reset {
display: none;
}
/* Pagination styles */
.ais-Pagination {
display: flex;
justify-content: center;
gap: 0.5rem;
}
.ais-Pagination-list {
display: flex;
gap: 0.25rem;
list-style: none;
padding: 0;
margin: 0;
}
.ais-Pagination-item {
display: inline-block;
}
.ais-Pagination-link {
display: flex;
align-items: center;
justify-content: center;
min-width: 2rem;
height: 2rem;
padding: 0 0.5rem;
background: var(--ifm-background-surface-color);
border: 1px solid var(--ifm-toc-border-color);
border-radius: var(--ifm-global-radius);
color: var(--ifm-font-color-base);
-webkit-text-decoration: none;
text-decoration: none;
transition: all 0.2s ease;
}
.ais-Pagination-link:hover {
background: var(--ifm-color-emphasis-100);
border-color: var(--ifm-color-primary);
}
.ais-Pagination-item--selected .ais-Pagination-link {
background: var(--ifm-color-primary);
color: white;
border-color: var(--ifm-color-primary);
}
[data-theme='dark'] .ais-Pagination-item--selected .ais-Pagination-link {
background-color: var(--vdd-blue-medium) !important;
border-color: var(--vdd-blue-medium) !important;
color: white !important;
}
.ais-Pagination-item--disabled .ais-Pagination-link {
opacity: 0.5;
cursor: not-allowed;
}
[data-theme='light'] .ais-Pagination-item--disabled .ais-Pagination-link {
color: #767676 !important;
opacity: 1 !important;
}
/* Hits/Results list */
.searchResultsList_Olo3 {
list-style: none;
padding: 0;
margin: 0;
}
.searchResultsListItem_kn3F {
list-style: none;
}
/* CUSTOM - Mobile responsive styles */
@media screen and (max-width: 996px) {
/* Show filter accordion on mobile */
.filterAccordion_BBwn {
display: block;
}
/* Hide desktop sidebar on mobile */
.searchFacetsColumn_Ma9v {
display: none;
}
/* Change layout to single column */
.searchLayout_dMtH {
display: block;
}
/* Stack the results header on smaller screens */
.searchResultsHeader_bE4O {
flex-direction: column;
align-items: flex-start;
}
.searchLogoColumn_Mj_0 {
width: 100%;
justify-content: flex-start;
}
}
/* CUSTOM - Accordion arrow animation */
.filterAccordionButton_DWtP span:last-child {
transition: transform 0.2s ease;
font-size: 0.8em;
}
.filterAccordionButton_DWtP[aria-expanded="true"] span:last-child {
transform: rotate(180deg);
}
/* CUSTOM - Small mobile adjustments */
@media screen and (max-width: 576px) {
.searchFacetsColumn_Ma9v {
padding: 0.75rem;
}
.filterAccordionButton_DWtP {
padding: 0.85rem;
font-size: 0.95rem;
}
.filterAccordionInner_OJlH {
padding: 1rem;
}
.searchResultsHeader_bE4O {
gap: 0.5rem;
}
}
/* Outline plus shadow, same treatment as the clickable cards in cards.css, so the
cards read as raised link targets rather than flat panels on the off-white page bg.
--vdd-border-card and --vdd-shadow-card are theme-aware, so this covers dark mode too. */
.card__JWt {
border: var(--vdd-border-width) solid var(--vdd-border-card);
box-shadow: var(--vdd-shadow-card);
background-color: var(--vdd-white);
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.card__JWt:hover {
background-color: var(--vdd-surface-medium);
border-color: var(--vdd-border-card-hover);
box-shadow: var(--vdd-shadow-card-hover);
}
.card__JWt:active {
background-color: var(--vdd-surface-medium);
box-shadow: var(--vdd-shadow-card);
}
[data-theme='dark'] .card__JWt {
background-color: #242526;
}
[data-theme='dark'] .card__JWt:hover {
background-color: var(--vdd-bg-box-hover);
border-color: var(--vdd-border-card-hover);
}
[data-theme='dark'] .card__JWt:active {
background-color: #242526;
}
.link_wAnw {
color: var(--vdd-text-primary);
font-family: var(--font-family-default);
-webkit-text-decoration: none;
text-decoration: none;
}
.link_wAnw:hover {
color: var(--vdd-text-primary);
-webkit-text-decoration: none;
text-decoration: none;
}
.link_wAnw:focus-visible {
outline: 2px solid var(--vdd-blue);
outline-offset: 2px;
}
/* Dark mode needs the lighter blue: --vdd-blue (#5874ff) is only 3.9:1 against the
#242526 card, and the ring must clear 3:1 as a non-text indicator. --vdd-link-dark
(#8095ff) gives 5.6:1. Light mode keeps --vdd-blue, since #8095ff on white is 2.7:1. */
[data-theme='dark'] .link_wAnw:focus-visible {
outline-color: var(--vdd-link-dark);
}
[data-theme='dark'] .link_wAnw {
color: var(--vdd-text-on-dark);
}
[data-theme='dark'] .link_wAnw:hover {
color: var(--vdd-text-on-dark);
}
.title_FtEo {
text-decoration-color: var(--vdd-blue-medium);
}
.link_wAnw:hover .title_FtEo {
-webkit-text-decoration: underline;
text-decoration: underline;
}
@media (hover: none) {
.title_FtEo {
-webkit-text-decoration: underline;
text-decoration: underline;
}
}
[data-theme='dark'] .title_FtEo {
text-decoration-color: white;
}
/* ============================================================================
FINDER FLOW
============================================================================
Interactive accordion-style decision tree. Shared by the "Find the right API"
widget on docs/APIs/product-mapping.mdx and the "Where do I start?" widget on
docs/README.mdx, via src/components/FinderFlow/index.tsx.
Class names keep the historical .api-finder* prefix so the styling is
unchanged; the widget itself is no longer API-specific.
Supports light and dark modes.
========================================================================= */
.api-finder {
max-width: 720px;
margin-bottom: 2rem;
}
/* Category list — stacks vertically, full width */
.api-finder__categories {
display: flex;
flex-direction: column;
gap: var(--vdd-card-gap);
margin-bottom: 1.25rem;
}
/* Wrapper for each card + its inline options panel */
.api-finder__category-item {
display: flex;
flex-direction: column;
}
/* Individual category card — horizontal layout */
.api-finder__category-btn {
display: flex;
flex-direction: row;
align-items: center;
gap: 1rem;
padding: var(--vdd-pad);
border: var(--vdd-border-width) solid transparent; /* borderless at rest; the --selected state below draws the border */
border-radius: var(--vdd-radius);
background-color: var(--vdd-bg-box);
cursor: pointer;
font-family: inherit;
width: 100%;
text-align: left;
transition: border-color 0.2s ease, background-color 0.2s ease;
}
.api-finder__category-btn:hover {
background-color: var(--vdd-surface-medium); /* hover = background tint only, no border until selected */
}
html[data-theme="dark"] .api-finder__category-btn:hover {
background-color: var(--vdd-bg-box-hover);
}
.api-finder__category-btn--selected {
border-color: var(--vdd-blue-medium);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom: none;
background-color: var(--vdd-bg-box); /* clean white header; the panel below carries the tint */
}
.api-finder__category-btn--selected:hover {
border-color: var(--vdd-blue-medium);
background-color: var(--vdd-bg-box);
}
html[data-theme="dark"] .api-finder__category-btn--selected {
background-color: #1e2a4a; /* darker navy than --vdd-blue-surface for selected category header */
border-color: var(--vdd-link-dark);
}
.api-finder__category-btn:focus-visible {
outline: 3px solid var(--ifm-link-color);
outline-offset: 3px;
}
.api-finder__category-img {
height: 52px;
width: 52px;
object-fit: contain;
flex-shrink: 0;
}
/* Text block in the middle */
.api-finder__category-text {
flex: 1;
min-width: 0;
}
.api-finder__category-label {
display: block;
font-size: 0.975rem;
font-weight: 600;
color: var(--ifm-font-color-base);
margin-bottom: 0.15rem;
}
.api-finder__category-desc {
display: block;
font-size: 0.875rem;
color: var(--vdd-text-muted);
line-height: 1.4;
margin-top: 0.25rem;
}
/* Chevron on the right edge */
.api-finder__category-chevron {
display: inline-flex;
align-items: center;
color: var(--vdd-text-muted);
flex-shrink: 0;
margin-left: auto;
}
/* Options panel — connects seamlessly to the selected category card above */
.api-finder__options {
border: var(--vdd-border-width) solid var(--vdd-blue-medium);
border-top: none;
border-radius: 0 0 var(--vdd-radius) var(--vdd-radius);
padding: var(--vdd-pad);
background-color: var(--vdd-blue-surface); /* light: #f7f8ff dark: #1C2233 */
margin-bottom: 0.5rem;
}
html[data-theme="dark"] .api-finder__options {
border-color: var(--vdd-link-dark);
}
.api-finder__item {
margin-bottom: var(--vdd-card-gap);
}
.api-finder__btn {
width: 100%;
text-align: left;
display: flex;
justify-content: space-between;
align-items: center;
padding: var(--vdd-pad);
border: var(--vdd-border-width) solid transparent; /* borderless at rest; the --selected state below draws the border */
border-radius: var(--vdd-radius);
background-color: var(--vdd-bg-box);
cursor: pointer;
font-size: 1rem;
font-family: inherit;
color: var(--ifm-font-color-base);
transition: border-color 0.2s ease, background-color 0.2s ease;
}
.api-finder__btn:hover {
background-color: var(--vdd-surface-medium); /* hover = background tint only, no border until selected */
}
html[data-theme="dark"] .api-finder__btn:hover {
background-color: var(--vdd-bg-box-hover);
}
.api-finder__btn--selected {
border-color: var(--vdd-blue-medium);
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom: none;
background-color: var(--vdd-bg-box);
}
.api-finder__btn--selected:hover {
border-color: var(--vdd-blue-medium);
background-color: var(--vdd-bg-box);
}
html[data-theme="dark"] .api-finder__btn--selected {
border-color: var(--vdd-link-dark);
}
.api-finder__btn:focus-visible {
outline: 3px solid var(--ifm-link-color);
outline-offset: 3px;
}
.api-finder__question {
flex: 1;
}
.api-finder__chevron {
display: inline-flex;
align-items: center;
margin-left: 1rem;
color: var(--vdd-text-muted);
flex-shrink: 0;
}
/* Sub-options panel — appears when an intermediate node (e.g. "One-time payments") is expanded */
.api-finder__suboptions {
border: var(--vdd-border-width) solid var(--vdd-blue-medium);
border-top: none;
border-radius: 0 0 var(--vdd-radius) var(--vdd-radius);
padding: var(--vdd-pad);
background-color: var(--vdd-blue-surface-deep); /* deeper blue tint than options panel */
margin-bottom: 0;
}
html[data-theme="dark"] .api-finder__suboptions {
border-color: var(--vdd-link-dark);
}
.api-finder__result {
padding: var(--vdd-pad);
border: var(--vdd-border-width) solid var(--vdd-blue-medium);
border-top: none;
border-radius: 0 0 var(--vdd-radius) var(--vdd-radius);
background-color: var(--vdd-blue-surface); /* light: #f7f8ff dark: #1C2233 */
margin-bottom: 0;
}
.api-finder__result:focus {
outline: none;
}
html[data-theme="dark"] .api-finder__result {
border-color: var(--vdd-link-dark);
}
.api-finder__description {
font-size: 0.95rem;
margin-bottom: 1rem;
color: var(--ifm-font-color-base);
}
.api-finder__api-links {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin-bottom: 0.75rem;
}
.api-finder__links {
list-style: none;
padding: 0;
margin: 0 0 0.25rem;
display: flex;
flex-direction: column;
gap: 0.35rem;
}
.api-finder__links li {
margin: 0;
}
.api-finder__links a {
font-size: 0.9rem;
}
.api-finder__note {
margin-top: 0.875rem;
margin-bottom: 0;
font-size: 0.825rem;
color: var(--vdd-text-muted);
font-style: italic;
}
@media (prefers-reduced-motion: reduce) {
.api-finder__category-btn,
.api-finder__btn {
transition: none;
}
}
.cookie-consent-buttons {
display: flex;
flex-wrap: wrap;
gap: .7rem;
margin: 1rem 0;
align-items: center;
}
.cookie-consent-buttons p {
margin: 0;
}
/* "(opens dialog)" inside the primary button. No opacity: dimming the white
text to 80% gave 4.10:1 on the button's #4961cd background, below the 4.5:1
AA minimum for this 14px text. At full opacity it is 5.42:1, and the smaller
font size still reads as secondary. */
.cookie-consent-buttons__hint {
font-size: .875em;
font-weight: 400;
}
.none_Mtv9 {
margin: 0;
}
@media screen and (min-width: 720px) {
.none_Mtv9 {
margin: 0;
}
}
.xSmall_aSZi {
margin: 0.25rem;
}
@media screen and (min-width: 720px) {
.xSmall_aSZi {
margin: 0.5rem;
}
}
.small_V3dY {
margin: 0.5rem;
}
@media screen and (min-width: 720px) {
.small_V3dY {
margin: 1rem;
}
}
.medium_eTaB {
margin: 1rem;
}
@media screen and (min-width: 720px) {
.medium_eTaB {
margin: 1.5rem;
}
}
.large_N6G9 {
margin: 1.5rem;
}
@media screen and (min-width: 720px) {
.large_N6G9 {
margin: 2rem;
}
}
.xLarge_MI0M {
margin: 2rem;
}
@media screen and (min-width: 720px) {
.xLarge_MI0M {
margin: 2.5rem;
}
}
.xxLarge_mwOG {
margin: 2.5rem;
}
@media screen and (min-width: 720px) {
.xxLarge_mwOG {
margin: 4rem;
}
}
.xxxLarge_Zfe8 {
margin: 4rem;
}
@media screen and (min-width: 720px) {
.xxxLarge_Zfe8 {
margin: 5rem;
}
}
.none_gj5c {
margin-bottom: 0;
}
@media screen and (min-width: 720px) {
.none_gj5c {
margin-bottom: 0;
}
}
.xSmall_z6Hn {
margin-bottom: 0.25rem;
}
@media screen and (min-width: 720px) {
.xSmall_z6Hn {
margin-bottom: 0.5rem;
}
}
.small_alIV {
margin-bottom: 0.5rem;
}
@media screen and (min-width: 720px) {
.small_alIV {
margin-bottom: 1rem;
}
}
.medium__qsp {
margin-bottom: 1rem;
}
@media screen and (min-width: 720px) {
.medium__qsp {
margin-bottom: 1.5rem;
}
}
.large_NHST {
margin-bottom: 1.5rem;
}
@media screen and (min-width: 720px) {
.large_NHST {
margin-bottom: 2rem;
}
}
.xLarge_BKKm {
margin-bottom: 2rem;
}
@media screen and (min-width: 720px) {
.xLarge_BKKm {
margin-bottom: 2.5rem;
}
}
.xxLarge_vTUm {
margin-bottom: 2.5rem;
}
@media screen and (min-width: 720px) {
.xxLarge_vTUm {
margin-bottom: 4rem;
}
}
.xxxLarge_HB2x {
margin-bottom: 4rem;
}
@media screen and (min-width: 720px) {
.xxxLarge_HB2x {
margin-bottom: 5rem;
}
}
.none_jKph {
margin-left: 0;
}
@media screen and (min-width: 720px) {
.none_jKph {
margin-left: 0;
}
}
.xSmall_ETeC {
margin-left: 0.25rem;
}
@media screen and (min-width: 720px) {
.xSmall_ETeC {
margin-left: 0.5rem;
}
}
.small_cpKT {
margin-left: 0.5rem;
}
@media screen and (min-width: 720px) {
.small_cpKT {
margin-left: 1rem;
}
}
.medium_ncMm {
margin-left: 1rem;
}
@media screen and (min-width: 720px) {
.medium_ncMm {
margin-left: 1.5rem;
}
}
.large_ynDu {
margin-left: 1.5rem;
}
@media screen and (min-width: 720px) {
.large_ynDu {
margin-left: 2rem;
}
}
.xLarge_zQDd {
margin-left: 2rem;
}
@media screen and (min-width: 720px) {
.xLarge_zQDd {
margin-left: 2.5rem;
}
}
.xxLarge_N8sG {
margin-left: 2.5rem;
}
@media screen and (min-width: 720px) {
.xxLarge_N8sG {
margin-left: 4rem;
}
}
.xxxLarge_poE8 {
margin-left: 4rem;
}
@media screen and (min-width: 720px) {
.xxxLarge_poE8 {
margin-left: 5rem;
}
}
.none_WN7J {
margin-right: 0;
}
@media screen and (min-width: 720px) {
.none_WN7J {
margin-right: 0;
}
}
.xSmall__vWI {
margin-right: 0.25rem;
}
@media screen and (min-width: 720px) {
.xSmall__vWI {
margin-right: 0.5rem;
}
}
.small_dLZJ {
margin-right: 0.5rem;
}
@media screen and (min-width: 720px) {
.small_dLZJ {
margin-right: 1rem;
}
}
.medium_to4Q {
margin-right: 1rem;
}
@media screen and (min-width: 720px) {
.medium_to4Q {
margin-right: 1.5rem;
}
}
.large_rLB5 {
margin-right: 1.5rem;
}
@media screen and (min-width: 720px) {
.large_rLB5 {
margin-right: 2rem;
}
}
.xLarge_V46L {
margin-right: 2rem;
}
@media screen and (min-width: 720px) {
.xLarge_V46L {
margin-right: 2.5rem;
}
}
.xxLarge_qG37 {
margin-right: 2.5rem;
}
@media screen and (min-width: 720px) {
.xxLarge_qG37 {
margin-right: 4rem;
}
}
.xxxLarge_o40a {
margin-right: 4rem;
}
@media screen and (min-width: 720px) {
.xxxLarge_o40a {
margin-right: 5rem;
}
}
.none_bUMK {
margin-top: 0;
}
@media screen and (min-width: 720px) {
.none_bUMK {
margin-top: 0;
}
}
.xSmall_iRGz {
margin-top: 0.25rem;
}
@media screen and (min-width: 720px) {
.xSmall_iRGz {
margin-top: 0.5rem;
}
}
.small_SXLn {
margin-top: 0.5rem;
}
@media screen and (min-width: 720px) {
.small_SXLn {
margin-top: 1rem;
}
}
.medium_HY_e {
margin-top: 1rem;
}
@media screen and (min-width: 720px) {
.medium_HY_e {
margin-top: 1.5rem;
}
}
.large_xsLy {
margin-top: 1.5rem;
}
@media screen and (min-width: 720px) {
.large_xsLy {
margin-top: 2rem;
}
}
.xLarge_GNfn {
margin-top: 2rem;
}
@media screen and (min-width: 720px) {
.xLarge_GNfn {
margin-top: 2.5rem;
}
}
.xxLarge_d4Lu {
margin-top: 2.5rem;
}
@media screen and (min-width: 720px) {
.xxLarge_d4Lu {
margin-top: 4rem;
}
}
.xxxLarge_y739 {
margin-top: 4rem;
}
@media screen and (min-width: 720px) {
.xxxLarge_y739 {
margin-top: 5rem;
}
}
.none_qerZ {
padding: 0;
}
.xSmall_dyUC {
padding: 0.5rem;
}
.small_vkQc {
padding: 1rem;
}
.medium_g9hY {
padding: 1.5rem;
}
.large_pEtM {
padding: 2rem;
}
.xLarge_dfK0 {
padding: 2.5rem;
}
.xxLarge_oVDP {
padding: 4rem;
}
.xxxLarge_U5hK {
padding: 5rem;
}
.none_LUP3 {
padding-bottom: 0;
}
.xSmall_tE5q {
padding-bottom: 0.5rem;
}
.small_zlHC {
padding-bottom: 1rem;
}
.medium_F2Nv {
padding-bottom: 1.5rem;
}
.large_OWpu {
padding-bottom: 2rem;
}
.xLarge_QVOe {
padding-bottom: 2.5rem;
}
.xxLarge_m1Gf {
padding-bottom: 4rem;
}
.xxxLarge_r4oV {
padding-bottom: 5rem;
}
.none_GohQ {
padding-left: 0;
}
.xSmall_czIV {
padding-left: 0.5rem;
}
.small_jr0w {
padding-left: 1rem;
}
.medium_d8_m {
padding-left: 1.5rem;
}
.large_pnDi {
padding-left: 2rem;
}
.xLarge_hBES {
padding-left: 2.5rem;
}
.xxLarge_brtR {
padding-left: 4rem;
}
.xxxLarge_JA5S {
padding-left: 5rem;
}
.none_O0uo {
padding-right: 0;
}
.xSmall_IX4n {
padding-right: 0.5rem;
}
.small_lUp7 {
padding-right: 1rem;
}
.medium_yisW {
padding-right: 1.5rem;
}
.large_oC4Q {
padding-right: 2rem;
}
.xLarge__CzO {
padding-right: 2.5rem;
}
.xxLarge_HuF_ {
padding-right: 4rem;
}
.xxxLarge_SV9G {
padding-right: 5rem;
}
.none_pWG8 {
padding-top: 0;
}
.xSmall_cPjl {
padding-top: 0.5rem;
}
.small_eFlp {
padding-top: 1rem;
}
.medium_wC4k {
padding-top: 1.5rem;
}
.large_FPFO {
padding-top: 2rem;
}
.xLarge_A24K {
padding-top: 2.5rem;
}
.xxLarge_M5kZ {
padding-top: 4rem;
}
.xxxLarge_lfNJ {
padding-top: 5rem;
}
.link_I5oY {
font-weight: var(--font-weight-medium);
-webkit-text-decoration: none;
text-decoration: none;
color: var(--link-color-text-default);
}
.link_I5oY:active {
color: var(--link-color-text-active);
}
.link_I5oY:hover {
color: var(--link-color-text-hover);
}
.link_I5oY:focus-visible {
outline: none;
box-shadow: 0 0 0 1px var(--white-color), 0 0 0 3px var(--link-color-boxshadow-focus);
}
.link_I5oY.white_wi11 {
color: var(--link-light-color-text-default);
}
.link_I5oY.white_wi11:active {
color: var(--link-light-color-text-active);
}
.link_I5oY.white_wi11:hover {
color: var(--link-light-color-text-hover);
border-bottom: 1px solid var(--link-light-color-border-bottom-hover);
}
.link_I5oY.white_wi11:focus-visible {
box-shadow: 0 0 0 3px var(--link-color-boxshadow-focus);
}
.link_I5oY.inline_pQR_ {
border-bottom: 1px solid var(--link-inline-color-border-bottom-default);
}
.link_I5oY.inline_pQR_:hover {
border-bottom: 1px solid var(--link-inline-color-border-bottom-hover);
}
.link_I5oY.inline_pQR_:focus-visible {
box-shadow: 0 0 0 3px var(--link-color-boxshadow-focus);
}
.baseSubtitleStyle_aJ5D {
font-family: var(--font-family-default);
font-weight: var(--typography-subtitle-font-weight);
font-style: normal;
text-rendering: optimizeLegibility;
margin: 0;
padding: 0;
}
.subtitle_EtxW {
font-size: var(--typography-subtitle-medium-font-size);
line-height: var(--typography-subtitle-medium-line-height);
}
.subtitleLarge_dAMf {
font-size: var(--typography-subtitle-large-font-size);
line-height: var(--typography-subtitle-large-line-height);
}
.subtitleSmall_AO1e {
font-size: var(--typography-subtitle-small-font-size);
line-height: var(--typography-subtitle-small-line-height);
}
.baseHeadingStyle_Fvrc {
font-family: var(--font-family-header);
font-weight: var(--typography-heading-font-weight);
font-style: normal;
text-rendering: optimizeLegibility;
margin-top: 0;
margin-bottom: 0.5rem;
}
.heading1_EZ6x {
font-size: var(--typography-h1-small-font-size);
line-height: var(--typography-h1-small-line-height);
}
@media screen and (min-width: 720px) {
.heading1_EZ6x {
font-size: var(--typography-h1-medium-font-size);
line-height: var(--typography-h1-medium-line-height);
}
}
.heading2_SOpl {
font-size: var(--typography-h2-small-font-size);
line-height: var(--typography-h2-line-height);
}
@media screen and (min-width: 720px) {
.heading2_SOpl {
font-size: var(--typography-h2-medium-font-size);
}
}
.heading3_dG_o {
font-size: var(--typography-h3-small-font-size);
line-height: var(--typography-h3-line-height);
}
@media screen and (min-width: 720px) {
.heading3_dG_o {
font-size: var(--typography-h3-medium-font-size);
}
}
.heading4_ca2C {
font-size: var(--typography-h4-small-font-size);
line-height: var(--typography-h4-line-height);
}
@media screen and (min-width: 720px) {
.heading4_ca2C {
font-size: var(--typography-h4-medium-font-size);
}
}
.heading5_ph4T {
font-size: var(--typography-h5-font-size);
line-height: var(--typography-h5-line-height);
}
.heading6_NK1n {
font-size: var(--typography-h6-font-size);
line-height: var(--typography-h6-line-height);
}
.label_slne {
font-family: var(--font-family-default);
font-size: var(--font-size-small);
line-height: var(--line-height-small);
font-weight: var(--font-weight-medium);
}
.bannerIcon_Vqri {
flex: 0 0 auto;
grid-area: icon;
}
.bannerIcon_Vqri.default_c9lz {
color: var(--banner-icon-color-fill-default);
}
.bannerIcon_Vqri.success_LhxY {
color: var(--banner-icon-success-color-fill-default);
}
.bannerIcon_Vqri.warning_ChgE {
color: var(--banner-icon-warning-color-fill-default);
}
.bannerIcon_Vqri.error_jmu5 {
color: var(--banner-icon-error-color-fill-default);
}
.bannerIllustration_UBbC {
height: 100px;
width: 100px;
grid-area: illustration;
align-self: center;
padding-right: 1rem;
}
.bannerIllustration_UBbC.rightPosition_K3yG {
padding-right: 0;
}
@media screen and (min-width: 720px) {
.bannerIllustration_UBbC.rightPosition_K3yG {
padding-left: 1rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
:root {
--docusaurus-tag-list-border: var(--ifm-color-emphasis-300);
}
.tag_zVej {
border: 1px solid var(--docusaurus-tag-list-border);
transition: border var(--ifm-transition-fast);
}
.tag_zVej:hover {
--docusaurus-tag-list-border: var(--ifm-link-color);
-webkit-text-decoration: none;
text-decoration: none;
}
.tagRegular_sFm0 {
border-radius: var(--ifm-global-radius);
padding: 0.2rem 0.5rem 0.3rem;
font-size: 90%;
}
.tagWithCount_h2kH {
display: flex;
align-items: center;
position: relative;
padding: 0 0.5rem 0 1rem;
border-left: 0;
}
.tagWithCount_h2kH::before,
.tagWithCount_h2kH::after {
content: '';
position: absolute;
top: 50%;
border: 1px solid var(--docusaurus-tag-list-border);
transition: inherit;
}
.tagWithCount_h2kH::before {
right: 100%;
transform: translate(50%, -50%) rotate(-45deg);
width: 1.18rem;
height: 1.18rem;
border-right: 0;
border-bottom: 0;
}
.tagWithCount_h2kH::after {
left: 0;
transform: translateY(-50%);
width: 0.5rem;
height: 0.5rem;
border-radius: 50%;
}
.tagWithCount_h2kH span {
background: var(--ifm-color-secondary);
color: var(--ifm-color-black);
font-size: 0.7rem;
line-height: 1.2;
border-radius: var(--ifm-global-radius);
padding: 0.1rem 0.4rem;
margin-left: 0.3rem;
}
}
.bannerRoot_Zby9 {
font-family: var(--font-family-default);
font-size: var(--font-size-small);
line-height: var(--line-height-default);
font-weight: var(--font-weight-default);
display: grid;
width: auto;
border-radius: 8px;
padding: 0.75rem 1rem;
grid-auto-columns: min-content 1fr min-content;
}
@media screen and (min-width: 720px) {
.bannerRoot_Zby9 {
grid-auto-columns: min-content 1fr min-content min-content;
}
}
.bannerRoot_Zby9.compact_lCbG {
width: fit-content;
}
.bannerRoot_Zby9.gridWithIllustrationRightWithTitle_wlm7 {
grid-template-areas: "illustration . close"
"title title title"
"content content content";
}
@media screen and (min-width: 720px) {
.bannerRoot_Zby9.gridWithIllustrationRightWithTitle_wlm7 {
grid-template-areas: "title title illustration close"
"content content illustration close";
}
}
.bannerRoot_Zby9.gridWithIllustrationRightNoTitle_D8V7 {
grid-template-areas: "illustration . close"
"title title title"
"content content content";
}
@media screen and (min-width: 720px) {
.bannerRoot_Zby9.gridWithIllustrationRightNoTitle_D8V7 {
grid-template-areas: "content content illustration close"
"content content illustration close";
}
}
.bannerRoot_Zby9.gridWithIllustrationLeftWithTitle_QZX_ {
grid-template-areas: "illustration . close"
"title title title"
"content content content";
}
@media screen and (min-width: 720px) {
.bannerRoot_Zby9.gridWithIllustrationLeftWithTitle_QZX_ {
grid-template-areas: "illustration title close"
"illustration content close";
}
}
.bannerRoot_Zby9.gridWithIllustrationLeftNoTitle_AN3B {
grid-template-areas: "illustration . close"
"title title title"
"content content content";
}
@media screen and (min-width: 720px) {
.bannerRoot_Zby9.gridWithIllustrationLeftNoTitle_AN3B {
grid-template-areas: "illustration content close"
"illustration content close";
}
}
.bannerRoot_Zby9.gridWithoutIllustrationWithTitle_cl7R {
grid-template-areas: "icon title close"
"content content close"
"actions actions actions";
}
@media screen and (min-width: 720px) {
.bannerRoot_Zby9.gridWithoutIllustrationWithTitle_cl7R {
grid-template-areas: "icon title close"
"icon content close"
"actions actions actions";
}
}
.bannerRoot_Zby9.gridWithoutIllustrationNoTitle_r5dg {
grid-template-areas: "icon title close"
"content content close"
"actions actions actions";
}
@media screen and (min-width: 720px) {
.bannerRoot_Zby9.gridWithoutIllustrationNoTitle_r5dg {
grid-template-areas: "icon content close"
"icon content close"
"actions actions actions";
}
}
.bannerTitle_DS4V {
grid-area: title;
align-self: flex-end;
}
.bannerContent_jIgp {
grid-area: content;
align-content: center;
}
.additionalMargin_J4Uw {
padding-left: 0.5rem;
}
.bannerActions_ZQkU {
grid-area: actions;
place-self: center;
width: 100%;
margin-top: 1rem;
}
@media screen and (min-width: 720px) {
.bannerActions_ZQkU {
place-self: flex-start;
width: max-content;
margin: 0.5rem 1rem 0rem 1rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.tags_jXut {
display: inline;
}
.tag_QGVx {
margin: 0 0.4rem 0.5rem 0;
display: inline-block;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.iconEdit_Z9Sw {
margin-right: 0.3em;
vertical-align: sub;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.lastUpdated_JAkA {
font-size: smaller;
font-style: italic;
margin-top: 0.2rem;
}
@media (min-width: 997px) {
.lastUpdated_JAkA {
text-align: right;
}
}
@media print {
.noPrint_WFHX {
display: none;
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.tocCollapsibleButton_TO0P {
font-size: inherit;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0.4rem 0.8rem;
width: 100%;
}
.tocCollapsibleButton_TO0P::after {
content: '';
background: var(--ifm-menu-link-sublist-icon) 50% 50% / 2rem 2rem no-repeat;
filter: var(--ifm-menu-link-sublist-icon-filter);
height: 1.25rem;
width: 1.25rem;
transform: rotate(180deg);
transition: transform var(--ifm-transition-fast);
}
.tocCollapsibleButtonExpanded_MG3E::after {
transform: none;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.tocCollapsible_ETCw {
background-color: var(--ifm-menu-color-background-active);
border-radius: var(--ifm-global-radius);
margin: 1rem 0;
}
.tocCollapsibleContent_vkbj > ul {
border-left: none;
border-top: 1px solid var(--ifm-color-emphasis-300);
padding: 0.2rem 0;
font-size: 15px;
}
.tocCollapsibleContent_vkbj ul li {
margin: 0.4rem 0.8rem;
}
.tocCollapsibleContent_vkbj a {
display: block;
}
.tocCollapsibleExpanded_sAul {
transform: none;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
@media (min-width: 997px) {
/* Prevent hydration FOUC, as the mobile TOC needs to be server-rendered */
.tocMobile_ITEo {
display: none;
}
}
@media print {
.tocMobile_ITEo {
display: none;
}
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.tableOfContents_bqdL {
max-height: calc(100vh - (var(--ifm-navbar-height) + 2rem));
overflow-y: auto;
position: sticky;
top: calc(var(--ifm-navbar-height) + 1rem);
}
@media (max-width: 996px) {
.tableOfContents_bqdL {
display: none;
}
.docItemContainer_F8PC {
padding: 0 0.3rem;
}
}
}
.actionBanner_DBqU.default_tZCg {
background-color: var(--action-banner-color-background-default);
border: thin solid var(--action-banner-color-border-default);
}
.actionBanner_DBqU.success_51lu {
background-color: var(--action-banner-success-color-background-default);
border: thin solid var(--action-banner-success-color-border-default);
}
.actionBanner_DBqU.warning_PPHL {
background-color: var(--action-banner-warning-color-background-default);
border: thin solid var(--action-banner-warning-color-border-default);
}
.actionBanner_DBqU.error_hibf {
background-color: var(--action-banner-error-color-background-default);
border: thin solid var(--action-banner-error-color-border-default);
}
.actionBanner_DBqU.error_hibf p {
color: var(--action-banner-error-color-text-default);
}
.actionBanner_DBqU.noTitle_VXmS {
align-items: center;
}
.illustratedBanner_DqqE {
padding: 1.5rem 1rem;
}
.illustratedBanner_DqqE.information_NITq {
background-color: var(--illustrated-banner-information-color-background-default);
border: thin solid var(--illustrated-banner-information-color-border-default);
}
.illustratedBanner_DqqE.help_kUFT {
background-color: var(--illustrated-banner-help-color-background-default);
border: thin solid var(--illustrated-banner-help-color-border-default);
}
.illustratedBanner_DqqE.warning_Bqpj {
background-color: var(--illustrated-banner-warning-color-background-default);
border: thin solid var(--illustrated-banner-warning-color-border-default);
color: var(--illustrated-banner-warning-color-text-default);
}
.statusBanner_l6AQ.default_P64x {
background-color: var(--status-banner-color-background-default);
border: thin solid var(--status-banner-color-border-default);
}
.statusBanner_l6AQ.success_irbQ {
background-color: var(--status-banner-success-color-background-default);
border: thin solid var(--status-banner-success-color-border-default);
}
.statusBanner_l6AQ.warning_FO23 {
background-color: var(--status-banner-warning-color-background-default);
border: thin solid var(--status-banner-warning-color-border-default);
}
.statusBanner_l6AQ.error_tyRQ {
background-color: var(--status-banner-error-color-background-default);
border: thin solid var(--status-banner-error-color-border-default);
}
.statusBanner_l6AQ.error_tyRQ p {
color: var(--status-banner-error-color-text-default);
}
.statusBanner_l6AQ.noTitle_iQQe {
align-items: center;
}
/* Row layout lives in src/components/AIToolbar/styles.module.css, which composes
.button, .icon, and .visuallyHidden from here so both controls stay identical. */
.button_xFhl {
display: inline-flex;
align-items: center;
gap: 0.35em;
padding: 0.2em 0.6em;
font-size: 0.8rem;
font-family: inherit;
color: var(--ifm-color-emphasis-700);
background: none;
border: 1px solid var(--ifm-color-emphasis-300);
border-radius: var(--ifm-global-radius);
cursor: pointer;
transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
white-space: nowrap;
-webkit-text-decoration: none;
text-decoration: none;
}
.button_xFhl:hover,
.button_xFhl:focus-visible {
color: var(--ifm-color-primary);
border-color: var(--ifm-color-primary);
background-color: var(--ifm-color-primary-lightest);
-webkit-text-decoration: none;
text-decoration: none;
}
.button_xFhl:focus-visible {
outline: 2px solid var(--ifm-color-primary);
outline-offset: 2px;
}
.icon_UXur {
width: 1em;
height: 1em;
flex-shrink: 0;
}
/* Announce "opens in a new tab" to screen readers without changing the visible label. */
.visuallyHidden_i1aE {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
[data-theme='dark'] .button_xFhl:hover,
[data-theme='dark'] .button_xFhl:focus-visible {
background-color: var(--ifm-color-emphasis-100);
}
/*
* The button, icon, and visually-hidden treatments are composed from
* ViewAsMarkdown so the two controls in the row cannot drift apart.
*/
.row_AFMW {
display: flex;
align-items: center;
gap: 0.75rem;
margin: 0 0 var(--ifm-spacing-vertical);
padding-bottom: 0.6rem;
border-bottom: 1px solid var(--ifm-color-emphasis-200);
}
/* The lone View as Markdown link above the title, outside the API section. This is
the placement the link has always had. */
.cornerRow_C61q {
display: flex;
justify-content: flex-end;
margin-bottom: var(--ifm-spacing-vertical);
}
.dropdown_xwL6 {
position: relative;
display: inline-flex;
}
.button_kRNp {
}
.visuallyHidden_qRxK {
}
.triggerIcon_nssW {
width: 1em;
height: 1em;
flex-shrink: 0;
}
.caret_AGig {
font-size: 0.7em;
line-height: 1;
}
/* Panel */
.panel_NMW0 {
position: absolute;
top: calc(100% + 0.4rem);
left: 0;
z-index: var(--ifm-z-index-dropdown);
/* Wide enough that the longest install command sits on one line. */
width: 30rem;
color: var(--ifm-font-color-base);
background-color: var(--ifm-background-surface-color);
border: 1px solid var(--ifm-color-emphasis-300);
border-radius: var(--ifm-global-radius);
box-shadow: var(--ifm-global-shadow-md);
}
/* The hidden attribute alone loses to the display value set above. */
.panel_NMW0[hidden] {
display: none;
}
.panelHeader_Ug65 {
padding: 0.9rem 1rem 0.7rem;
border-bottom: 1px solid var(--ifm-color-emphasis-200);
}
.panelTitle_reTw {
margin: 0 0 0.2rem;
font-size: 0.95rem;
font-weight: 600;
line-height: 1.3;
}
.panelIntro_WOfc {
margin: 0;
font-size: 0.8rem;
line-height: 1.45;
color: var(--ifm-color-emphasis-700);
}
.panelLink_LL_w {
font-size: 0.8rem;
white-space: nowrap;
}
/* Tabs */
/* The pill switcher used for MDX across the site, from the `tabs` section
of src/css/custom.css. Shape, tokens, and the filled active pill are the same;
only the padding and font size are scaled down, so four labels fit the panel. */
.tabList_gUPL {
display: flex;
flex-wrap: nowrap;
gap: 0.25rem;
width: fit-content;
max-width: 100%;
margin: 0.8rem 1rem 0;
padding: 0;
background-color: var(--vdd-bg-box);
border: 1px solid var(--vdd-border-decorative);
border-radius: 9999px;
}
.tab_tyb3 {
display: inline-flex;
gap: 0.35em;
align-items: center;
padding: 0.4rem 0.8rem;
margin: 0;
font-family: inherit;
font-size: 0.8rem;
font-weight: 500;
/* Inactive labels are link-colored so they read as controls, not headings. */
color: var(--ifm-link-color);
white-space: nowrap;
cursor: pointer;
background-color: transparent;
border: none;
border-radius: 9999px;
transition: background-color 0.2s ease, color 0.2s ease;
}
.tab_tyb3:hover {
background-color: var(--vdd-bg-box-hover);
}
/* Repeating :hover matches .tabs__item--active's specificity trick in custom.css:
the class alone would lose to .tab:hover on order.
The active state is carried by the white, bolder label rather than by the pill
edge, which is under the 3:1 in WCAG 1.4.11 against the dark list background. */
.tabSelected_JeeE,
.tabSelected_JeeE:hover {
background-color: var(--vdd-blue-medium);
color: var(--vdd-white);
font-weight: 600;
}
.tab_tyb3:focus-visible {
outline: 2px solid var(--ifm-link-color);
outline-offset: 2px;
}
/* The icon inherits currentColor, so it inverts with the label on the active pill. */
.tabIcon_cK14 {
width: 1.05em;
height: 1.05em;
flex-shrink: 0;
}
/* Tab panel */
.tabPanel_TkqH {
padding: 0.8rem 1rem 1rem;
}
.tabPanel_TkqH:focus-visible {
outline: 2px solid var(--ifm-color-primary);
outline-offset: -2px;
}
/* Note on the left, Copy on the right, both above the command. Overlaying the copy
button on the code instead would need a wide right padding, which pushed even
short commands onto a second line. */
.commandHeader_CAI4 {
display: flex;
gap: 0.75rem;
align-items: center;
justify-content: space-between;
margin-bottom: 0.4rem;
min-height: 1.9rem;
}
.toolNote_TKxC {
margin: 0;
font-size: 0.8rem;
color: var(--ifm-color-emphasis-700);
}
.code_CGOY {
margin: 0;
padding: 0.7rem 0.8rem;
font-size: 0.78rem;
line-height: 1.55;
border-radius: var(--ifm-global-radius);
}
.codeLine_yg98 {
display: block;
white-space: pre-wrap;
/* Wrap between words, and only break inside one when it cannot fit at all.
word-break: break-word here split "vipps-developer-docs" mid-token. */
overflow-wrap: anywhere;
}
.copyButton_w9dT {
flex-shrink: 0;
}
.copyIcon_nCnm {
width: 1em;
height: 1em;
flex-shrink: 0;
}
/* The panel would run off the right edge of a narrow viewport. */
@media (max-width: 576px) {
/* Anchor the panel to the row rather than to the trigger. The trigger sits
partway across the row, after the View as Markdown link, so a panel this wide
hanging off its left edge pushes its own right-hand side past the viewport —
which put the Copy button somewhere a tap could not reach. Spanning the row
keeps the whole panel on screen. */
.row_AFMW {
position: relative;
}
.dropdown_xwL6 {
position: static;
}
.panel_NMW0 {
left: 0;
right: 0;
width: auto;
}
/* The four pills are about 40px wider than the panel on a phone, so they have to
give somewhere. They wrap onto a second row rather than scrolling sideways: a
scrolling row left "Any editor" half past the right edge with nothing on screen
to say the row could be scrolled at all.
Wrapping also keeps every pill whole. A partly clipped control is the kind of
target that is awkward to tap and impossible to hit reliably. */
.tabList_gUPL {
flex-wrap: wrap;
/* Fill the panel minus the side margins. `width: 100%` would measure the
panel's full width and then push that much again past the margins. */
width: auto;
/* Room for the focus ring, which sits 2px outside each pill. */
padding: 0.25rem;
/* A pill outline only reads as one around a single row. */
border-radius: var(--ifm-global-radius);
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.breadcrumbHomeIcon_YNFT {
position: relative;
top: 1px;
vertical-align: top;
height: 1.1rem;
width: 1.1rem;
}
}
@layer docusaurus.theme-classic {/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
.breadcrumbsContainer_Z_bl {
--ifm-breadcrumb-size-multiplier: 0.8;
margin-bottom: 0.8rem;
}
}
.docItemContainer_c0TR header + *,
.docItemContainer_c0TR article > *:first-child {
margin-top: 0;
}
@media (min-width: 997px) {
.docItemCol_z5aJ {
max-width: 75% !important;
}
}
.intro_Y6vt {
display: flex;
width: 100%;
margin-top: 80px;
justify-content: center;
max-width: 1000px;
text-align: center;
}
.over_NSH8 {
display: flex;
width: 100%;
justify-content: center;
text-align: center;
font-size: 0.875rem;
line-height: 1.25rem;
font-style: italic;
}
.note_gO3y {
display: flex;
width: 100%;
justify-content: center;
text-align: center;
font-size: 0.875rem;
line-height: 1.25rem;
font-style: italic;
margin-top: 1.2rem;
margin-bottom: 0 !important;
}
.feedbackform_xoPz {
margin-top: 3rem;
justify-content: center;
display: flex;
width: 100%;
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
.feedbackform_xoPz .wrapper_toDS {
display: flex;
gap: 20px;
padding: 10px 30px 20px 30px;
margin-bottom: 10px;
border-radius: 0.5rem;
background: var(--vdd-white);
box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.45);
width: 680px;
}
@media (max-width: 768px) {
.feedbackform_xoPz .wrapper_toDS {
width: 100%;
min-width: 0;
padding: 16px 20px 20px 20px;
box-sizing: border-box;
border: 1px solid var(--vdd-border-light);
border-radius: 0.5rem;
box-shadow: none;
}
.feedbackform_xoPz {
width: 100%;
max-width: 100%;
min-width: 0;
}
}
.feedbackform_xoPz button {
background: var(--vdd-white);
border: none;
}
.feedbackform_xoPz button .content_nnEp {
display: flex;
padding: 10px 24px;
justify-content: center;
align-items: center;
border-radius: 0.375rem;
border: 1px solid var(--vdd-border-light);
gap: 8px;
background: var(--vdd-white);
text-align: center;
font-size: 16px;
font-weight: 500;
color: var(--vdd-blue-medium);
}
.feedbackform_xoPz button .content_nnEp:hover {
background: var(--vdd-blue-medium);
color: var(--vdd-white);
box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1);
}
.feedbackform_xoPz button:focus-visible .content_nnEp {
outline: 3px solid var(--vdd-blue-medium);
outline-offset: 2px;
}
.feedbackform_xoPz button .content_nnEp .emoji_XV8W {
display: flex;
justify-content: center;
align-items: center;
font-size: 18px;
}
.feedbackform_xoPz button.active_FsnQ .content_nnEp {
background: var(--vdd-blue-medium);
color: var(--vdd-white);
padding: 10px 24px;
}
.feedbackform_xoPz button.active_FsnQ .content_nnEp:hover {
background: var(--vdd-blue);
}
.feedbackform_xoPz .wrapper_toDS .thankyou_ANzx {
display: flex;
align-items: center;
flex-direction: column;
width: 100%;
height: 300px;
opacity: 0;
animation: fade-in_d4Wr 0.4s ease-in forwards;
}
.feedbackform_xoPz .wrapper_toDS .thankyou_ANzx p {
color: var(--vdd-black);
font-size: 18px;
font-weight: 600;
}
.feedbackform_xoPz .formbody_ZqAO {
width: 100%;
}
.feedbackform_xoPz .formbody_ZqAO .formheader_zvOF {
display: flex;
padding-top: 10px;
justify-content: space-between;
gap: 20px;
width: 100%;
}
.feedbackform_xoPz .formbody_ZqAO .formheader_zvOF svg {
margin-right: -18px;
}
@media (max-width: 768px) {
.feedbackform_xoPz .formbody_ZqAO .formheader_zvOF {
display: flex;
gap: 0;
width: 100%;
}
.feedbackform_xoPz .formbody_ZqAO .formheader_zvOF svg {
margin-right: -10px;
}
}
.yesno_yMMU .question_SsTU {
color: var(--vdd-black);
font-size: 18px;
font-weight: 600;
}
.yesno_yMMU .header_K6d6 {
color: var(--vdd-black);
font-size: 16px;
font-weight: 400;
margin-bottom: 0px;
}
.yesno_yMMU .buttonrow_tyCM {
display: flex;
gap: 10px;
}
.feedbackform_xoPz .forminput_WcaP {
display: flex;
gap: 20px;
margin-top: 20px;
align-self: stretch;
flex-direction: column;
align-items: flex-start;
flex: 1 0 0;
gap: 4px;
color: var(--vdd-black);
opacity: 0;
animation: fade-in_d4Wr 0.4s ease-in forwards;
}
.feedbackform_xoPz .forminput_WcaP .question_SsTU {
color: var(--vdd-black);
font-size: 18px;
font-weight: 600;
margin-bottom: 3px;
}
.feedbackform_xoPz .forminput_WcaP .emphasis_pbD7 {
font-style: italic;
color: var(--vdd-purple);
font-size: 14px;
}
.feedbackform_xoPz .forminput_WcaP .noReply_E8ld {
font-size: 0.85em;
color: var(--ifm-color-emphasis-800);
background: transparent;
margin-top: 0;
margin-bottom: 6px;
}
html[data-theme='dark'] .feedbackform_xoPz .forminput_WcaP .noReply_E8ld {
color: var(--ifm-color-emphasis-700);
background: transparent;
}
.feedbackform_xoPz .forminput_WcaP .helpHint_EavQ {
font-size: 1.2em;
font-weight: 600;
color: var(--vdd-black);
background: var(--vdd-orange-surface);
border-left: 5px solid var(--vdd-orange);
border-radius: 6px;
padding: 14px 16px;
margin-top: -8px;
margin-bottom: 6px;
animation: fade-in_d4Wr 0.2s ease-in forwards;
box-shadow: 0 2px 8px rgba(255, 100, 0, 0.12);
}
html[data-theme='dark'] .feedbackform_xoPz .forminput_WcaP .helpHint_EavQ {
color: var(--vdd-off-white);
background: rgba(255, 165, 82, 0.18);
border-left: 5px solid #FFA552;
box-shadow: 0 2px 8px rgba(255, 165, 82, 0.15);
}
textarea::placeholder {
color: #888;
}
@keyframes fade-in_d4Wr {
100% {
opacity: 1;
}
}
.feedbackform_xoPz .forminput_WcaP textarea {
display: flex;
height: 120px;
padding: 16px;
align-items: flex-start;
align-self: stretch;
border-radius: 8px;
border: 1px solid var(--vdd-border-input);
background: var(--vdd-off-white);
font-family: var(--font-family-default);
font-size: 16px;
color: var(--vdd-black);
margin-bottom: 1rem;
}
.feedbackform_xoPz .forminput_WcaP .charactercounter_yw6Z {
color: var(--vdd-text-muted);
margin-bottom: 0px;
}
.feedbackform_xoPz .info_ic2M {
display: flex;
gap: 4px;
padding: 2px 0px;
margin-bottom: 14px;
margin-top: 10px;
}
.feedbackform_xoPz .info_ic2M span {
font-size: 16px;
font-weight: 400;
}
/* Dark theme */
html[data-theme='dark'] .feedbackform_xoPz .wrapper_toDS {
background-color: var(--vdd-dark-blue);
}
html[data-theme='dark'] .yesno_yMMU .question_SsTU {
color: var(--vdd-white);
}
html[data-theme='dark'] .yesno_yMMU .header_K6d6 {
color: var(--vdd-white);
}
html[data-theme='dark'] .feedbackform_xoPz button {
background: var(--vdd-dark-blue);
}
html[data-theme='dark'] .feedbackform_xoPz button .content_nnEp {
border: 1px solid var(--vdd-border-light);
background: var(--vdd-dark-blue);
color: var(--ifm-link-color);
}
html[data-theme='dark'] .feedbackform_xoPz button .content_nnEp:hover {
background: var(--vdd-blue-medium);
color: var(--vdd-white);
box-shadow: 0 10px 15px -3px rgba(255,255,255,0.15), 0 4px 6px -4px rgba(255,255,255,0.1);
}
html[data-theme='dark'] .feedbackform_xoPz button.active_FsnQ .content_nnEp {
background: var(--vdd-blue-medium);
color: var(--vdd-white);
}
html[data-theme='dark'] .feedbackform_xoPz button.active_FsnQ .content_nnEp:hover {
background: var(--vdd-blue);
}
html[data-theme='dark'] .feedbackform_xoPz .forminput_WcaP .question_SsTU {
color: var(--vdd-white);
}
html[data-theme='dark'] .feedbackform_xoPz .forminput_WcaP .emphasis_pbD7 {
color: #8853C9;
}
html[data-theme='dark'] textarea::placeholder {
color: #cac8c8;
}
html[data-theme='dark'] .forminput_WcaP textarea {
background-color: #44494F;
color: var(--vdd-white)
}
html[data-theme='dark'] .feedbackform_xoPz .info_ic2M {
color: var(--vdd-white);
}
html[data-theme='dark'] .feedbackform_xoPz .wrapper_toDS .thankyou_ANzx p {
color: var(--vdd-white);
}
/* PRINT MODE */
@media print {
.feedbackform_xoPz {
display: none !important;
}
}