) */
.menu__link--active:not(.menu__link--sublist) {
font-weight: 600;
color: var(--label-default) !important;
background: var(--brand-12) !important;
position: relative;
border-radius: 6px;
}
.menu__link--active:not(.menu__link--sublist)::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 3px;
background: var(--brand);
border-radius: 0 2px 2px 0;
}
/* Category row active — promote bg/bar to the whole collapsible row
so the caret button sits inside the same pill, perfectly aligned. */
.menu__list-item-collapsible {
position: relative;
display: flex;
align-items: stretch;
border-radius: 6px;
overflow: hidden;
}
.menu__list-item-collapsible > .menu__link {
flex: 1;
border-radius: 0 !important;
}
.menu__list-item-collapsible:has(> .menu__link--active) {
background: var(--brand-12);
}
.menu__list-item-collapsible:has(> .menu__link--active) > .menu__link--active {
background: transparent !important;
font-weight: 600;
color: var(--label-default) !important;
}
.menu__list-item-collapsible:has(> .menu__link--active) > .menu__link--active::before {
display: none;
}
.menu__list-item-collapsible:has(> .menu__link--active)::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 3px;
background: var(--brand);
border-radius: 0 2px 2px 0;
}
/* Caret button — match row height & center the icon */
.menu__list-item-collapsible > .menu__caret {
display: flex;
align-items: center;
justify-content: center;
align-self: stretch;
padding: 0 12px;
margin: 0;
background: transparent;
}
.menu__list-item-collapsible > .menu__caret::before {
background-size: 1.25rem 1.25rem;
}
/* Sidebar border */
aside.theme-doc-sidebar-container {
border-right: 1px solid var(--line-second) !important;
}
/* Sidebar fixed + independent scroll */
aside.theme-doc-sidebar-container {
position: sticky !important;
top: 56px !important;
height: calc(100vh - 56px) !important;
overflow: hidden !important;
}
aside.theme-doc-sidebar-container > div { height: 100% !important; }
/* Docusaurus's inner sidebar div ships with padding-top: var(--ifm-navbar-height)
to clear the navbar — but our aside already sits below the navbar via top: 56px,
so kill the duplicate gap. */
aside.theme-doc-sidebar-container > div > div[class*='sidebar_'] {
padding-top: 0 !important;
}
aside.theme-doc-sidebar-container nav.menu {
height: 100% !important;
max-height: 100% !important;
overflow-y: auto !important;
scroll-behavior: smooth;
}
/* Caret */
.menu__caret::before,
.menu__link--sublist-caret::after {
filter: brightness(0.7);
}
/* ============================
Content area
============================ */
.theme-doc-markdown {
max-width: none; /* fill 1fr between sidebar and TOC */
}
/* Wider container so content can use the full 3-column grid */
.docs-wrapper .container,
.docs-wrapper .container--fluid {
max-width: none !important;
}
/* TOC desktop column — 360px per guide §12 */
.theme-doc-toc-desktop {
width: 360px !important;
max-width: 360px !important;
flex: 0 0 360px;
}
/* Responsive sidebar / TOC widths (guide §19) */
@media (max-width: 1700px) {
:root { --doc-sidebar-width: 320px; }
.theme-doc-toc-desktop { width: 320px !important; max-width: 320px !important; flex: 0 0 320px; }
}
@media (max-width: 1500px) {
:root { --doc-sidebar-width: 280px; }
.theme-doc-toc-desktop { width: 280px !important; max-width: 280px !important; flex: 0 0 280px; }
}
@media (max-width: 1280px) {
:root { --doc-sidebar-width: 260px; }
.theme-doc-toc-desktop { display: none !important; }
}
.markdown img {
border-radius: 8px;
max-width: 100%;
margin: 1rem 0;
}
.markdown iframe,
.markdown video,
.markdown embed,
.markdown object {
max-width: 100%;
height: auto;
aspect-ratio: 16 / 9;
}
/* Lead paragraph — first text paragraph after H1 (guide §14, p.lead 19/500).
Uses :first-of-type so a leading blockquote / image-only-p doesn't disqualify. */
.theme-doc-markdown > p:first-of-type:not(:has(> img:only-child)) {
font-size: 1.1875rem; /* 19px */
font-weight: 500;
line-height: 1.65;
color: var(--label-default);
margin-bottom: 1.5rem;
}
/* Auto figure-like container — images alone in or
(guide §17, GitBook-converted markdown rarely uses real ) */
.theme-doc-markdown p:has(> img:only-child),
.theme-doc-markdown div[align]:has(> img:only-child) {
background: var(--bg-card);
border: 1px solid var(--line-second);
border-radius: 12px;
padding: 12px;
margin: 8px 0 28px;
text-align: center;
display: block;
}
.theme-doc-markdown p:has(> img:only-child) > img,
.theme-doc-markdown div[align]:has(> img:only-child) > img {
border-radius: 8px;
margin: 0;
max-width: 100%;
height: auto;
display: inline-block;
}
/* Figure container (guide §17) */
.markdown figure {
background: var(--bg-card);
border: 1px solid var(--line-second);
border-radius: 12px;
padding: 12px;
margin: 8px 0 28px;
text-align: center;
}
.markdown figure img {
border-radius: 8px;
margin: 0;
}
.markdown figcaption {
font-size: 0.8125rem; /* 13px */
font-weight: 500;
color: var(--label-second);
margin-top: 8px;
text-align: center;
}
/* Tables */
.markdown table {
border-collapse: separate;
border-spacing: 0;
border-radius: 12px;
overflow: hidden;
border: 1px solid var(--line-second);
font-size: 0.875rem;
}
.markdown th {
background-color: var(--fill-second);
font-weight: 600;
font-size: 0.8125rem;
text-transform: uppercase;
letter-spacing: 0.05em;
padding: 0.75rem 1rem;
color: var(--label-default);
}
.markdown td { padding: 0.75rem 1rem; }
.markdown tr:not(:last-child) td {
border-bottom: 1px solid var(--line-second);
}
/* ============================
Admonitions (guide §15)
============================ */
.alert,
.theme-admonition {
background: var(--bg-card) !important;
border: 1px solid var(--line-second) !important;
border-left: 4px solid var(--label-fourth) !important;
border-radius: 12px !important;
padding: 18px 22px !important;
margin: 28px 0 !important;
font-size: 0.9375rem;
box-shadow: none;
color: var(--label-default);
}
.theme-admonition--warning,
.alert--warning { border-left-color: var(--adm-warning) !important; }
.theme-admonition--info,
.alert--info,
.alert--secondary { border-left-color: var(--adm-info) !important; }
.theme-admonition--tip,
.alert--success { border-left-color: var(--adm-tip) !important; }
.theme-admonition--danger,
.alert--danger { border-left-color: var(--adm-danger) !important; }
.alert .admonition-heading,
.theme-admonition .admonitionHeading_node_modules-\@docusaurus-theme-classic-lib-theme-Admonition-Layout-styles-module {
font-size: 0.875rem;
font-weight: 700;
letter-spacing: 0;
color: var(--label-default);
margin-bottom: 8px;
}
.alert p:last-child { margin-bottom: 0; }
/* ============================
TOC (guide §12)
============================ */
.table-of-contents {
border-left: 2px solid var(--line-second);
padding-left: 0.875rem;
position: relative;
font-size: 1rem;
}
.table-of-contents::before {
content: 'On this page';
display: block;
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.04em;
color: var(--label-second);
margin-bottom: 0.625rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid var(--line-second);
}
html[lang='ko'] .table-of-contents::before { content: '이 페이지에서'; }
html[lang='ja'] .table-of-contents::before { content: 'このページで'; }
.table-of-contents__link {
font-size: 1rem;
font-weight: 500;
color: var(--label-fourth);
transition: color 0.15s ease;
}
.table-of-contents__link:hover {
color: var(--label-default);
}
.table-of-contents__link--active {
font-weight: 600;
color: var(--label-default);
}
/* ============================
Breadcrumbs (guide §13)
============================ */
.breadcrumbs { margin-bottom: 24px; }
.breadcrumbs__item:not(:last-child)::after {
color: var(--label-fourth);
opacity: 1;
}
.breadcrumbs__link {
font-size: 0.8125rem;
font-weight: 500;
color: var(--label-second);
padding: 0.25rem 0.5rem;
border-radius: 6px;
letter-spacing: 0;
}
.breadcrumbs__link:hover {
background: var(--bg-card);
}
.breadcrumbs__item--active .breadcrumbs__link {
color: var(--label-default);
font-weight: 600;
background: var(--bg-card);
}
/* ============================
Pagination + Next-steps (guide §16)
============================ */
.pagination-nav__link {
border-radius: 12px;
border: 1px solid var(--line-second);
background: var(--bg-card);
padding: 1.25rem;
transition: all 0.2s ease;
}
.pagination-nav__link:hover {
background: transparent;
border-color: var(--brand);
transform: translateY(-2px);
box-shadow: 0 2px 8px rgba(10, 142, 79, 0.06);
}
.pagination-nav__sublabel {
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0;
color: var(--label-second);
text-transform: none;
}
.pagination-nav__label {
font-weight: 600;
font-size: 1rem;
color: var(--label-default);
}
.pagination-nav__label::before,
.pagination-nav__label::after {
color: var(--brand);
}
/* ============================
Footer (guide §9-1)
============================ */
.footer {
background: var(--footer-bg);
padding: 48px 0;
}
.footer--light {
--ifm-footer-background-color: var(--footer-bg);
--ifm-footer-color: var(--footer-link);
--ifm-footer-link-color: var(--footer-text);
--ifm-footer-title-color: var(--footer-text);
}
.footer__title {
font-weight: 700;
font-size: 1.125rem; /* 18px */
letter-spacing: 0;
text-transform: none;
margin-bottom: 1rem;
color: var(--footer-text);
}
.footer__link-item {
font-weight: 400;
font-size: 0.9375rem; /* 15px */
line-height: 1;
color: var(--footer-link);
}
.footer__link-item:hover {
color: var(--brand);
-webkit-text-decoration: none;
text-decoration: none;
}
.footer__items {
display: flex;
flex-direction: column;
gap: 20px;
}
.footer__copyright {
font-size: 0.875rem;
color: var(--footer-copy);
margin-top: 24px;
padding-top: 24px;
border-top: 1px solid var(--line-second);
text-align: center;
opacity: 1;
}
/* ============================
Search input
============================ */
.DocSearch-Button {
border-radius: 10px !important;
border: 1px solid var(--line-second) !important;
background: transparent !important;
}
/* ============================
Scrollbar
============================ */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.18);
border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
background: rgba(0, 0, 0, 0.28);
}
/* ============================
Search Results Page
============================ */
main article[class*='searchResultsPage'],
main article.search-results,
main > .container > div > article {
max-width: 820px;
margin: 0 auto;
padding: 2.5rem 1rem 4rem;
}
main h1[class*='searchResult'],
main article > h1 {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: -0.02em;
margin: 0 0 1.25rem;
line-height: 1.25;
color: var(--label-default);
}
input[class*='searchQueryInput'] {
width: 100% !important;
font-size: 0.9375rem !important;
padding: 14px 18px !important;
border-radius: 12px !important;
border: 1.5px solid var(--line-second) !important;
background: var(--fill-default) !important;
color: var(--label-default) !important;
outline: none !important;
margin-bottom: 1rem !important;
font-family: inherit !important;
}
input[class*='searchQueryInput']:hover,
input[class*='searchQueryInput']:focus {
border-color: var(--brand) !important;
box-shadow: 0 0 0 3px rgba(10, 142, 79, 0.1) !important;
}
p[class*='searchResultsTotal'],
[class*='searchResultsTotal'] {
font-size: 0.8125rem !important;
color: var(--label-second) !important;
margin: 0 0 1rem !important;
font-weight: 500;
}
article[class*='searchResultItem'] {
padding: 18px 22px !important;
margin: 0 0 10px !important;
border: 1px solid var(--line-second) !important;
border-radius: 10px;
background: var(--fill-default);
transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
article[class*='searchResultItem']:hover {
border-color: var(--brand);
box-shadow: 0 4px 16px rgba(10, 142, 79, 0.06);
transform: translateY(-2px);
}
h2[class*='searchResultItemHeading'],
[class*='searchResultItemHeading'] {
font-size: 1rem !important;
font-weight: 600 !important;
line-height: 1.4 !important;
margin: 0 0 6px !important;
letter-spacing: -0.01em !important;
}
h2[class*='searchResultItemHeading'] a,
[class*='searchResultItemHeading'] a {
color: var(--label-default);
-webkit-text-decoration: none;
text-decoration: none;
}
article[class*='searchResultItem']:hover h2[class*='searchResultItemHeading'] a {
color: var(--brand);
}
[class*='searchResultItemPath'] {
font-size: 0.75rem !important;
color: var(--label-second) !important;
margin: 0 !important;
line-height: 1.5 !important;
font-style: italic;
}
[class*='searchResultItemSummary'] {
font-size: 0.8125rem !important;
line-height: 1.55 !important;
color: var(--label-second) !important;
margin: 8px 0 0 !important;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
[class*='searchResultItem'] mark,
mark[class*='highlight'] {
background: var(--brand-12);
color: var(--brand);
padding: 0 2px;
border-radius: 3px;
font-weight: 600;
}
@media (max-width: 640px) {
main article[class*='searchResultsPage'],
main article.search-results,
main > .container > div > article {
padding: 1.5rem 1rem 2.5rem;
}
main h1[class*='searchResult'],
main article > h1 {
font-size: 1.1875rem;
margin-bottom: 1rem;
}
input[class*='searchQueryInput'] {
font-size: 0.875rem !important;
padding: 12px 14px !important;
}
article[class*='searchResultItem'] {
padding: 14px 16px !important;
margin-bottom: 8px !important;
}
h2[class*='searchResultItemHeading'],
[class*='searchResultItemHeading'] {
font-size: 0.9375rem !important;
}
[class*='searchResultItemSummary'] {
font-size: 0.75rem !important;
}
[class*='searchResultItemPath'] {
font-size: 0.6875rem !important;
}
}
/* ============================
Per-page navbar visibility
============================ */
html:not([data-home='1']) .nav-home-only {
display: none !important;
}
html[data-home='1'] .nav-guide-only {
display: none !important;
}
/* Mobile sidebar — auto-expand 문의 dropdown */
.navbar-sidebar li:has(> div > .nav-contact-dropdown) > .menu__list {
display: block !important;
height: auto !important;
overflow: visible !important;
}
.navbar-sidebar li:has(> div > .nav-contact-dropdown) .menu__caret {
display: none;
}
/* Landing chrome — light */
html[data-home='1'],
html[data-home='1'] .main-wrapper {
background: var(--bg-page);
}
.navbar-sidebar {
height: 100vh !important;
background: var(--bg-page) !important;
}
.navbar-sidebar__brand {
background: var(--bg-page) !important;
border-bottom: 1px solid var(--line-second);
}
.sidebar-injected-nav {
border-bottom: 1px solid var(--line-second);
padding: 8px 0 12px;
margin-bottom: 4px;
}
.sidebar-injected-nav .menu__list {
padding: 0;
margin: 0;
}
.sidebar-injected-nav .menu__list-item {
margin: 0;
}
/* Home navbar dropdown (문의) — light */
html[data-home='1'] .navbar .dropdown__menu {
background: var(--fill-default) !important;
border: 1px solid var(--line-second) !important;
border-radius: 10px !important;
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.08) !important;
padding: 6px !important;
min-width: 200px;
}
html[data-home='1'] .navbar .dropdown__link {
color: var(--label-default) !important;
border-radius: 7px;
padding: 9px 14px !important;
font-size: 0.8125rem;
transition: all 0.12s ease;
}
html[data-home='1'] .navbar .dropdown__link:hover {
background: var(--bg-card) !important;
color: var(--brand) !important;
}
/* Home navbar — light translucent */
html[data-home='1'] .navbar {
background: var(--bg-header) !important;
border-bottom: 1px solid var(--line-second) !important;
backdrop-filter: saturate(180%) blur(20px);
}
html[data-home='1'] .navbar__title,
html[data-home='1'] .navbar__link,
html[data-home='1'] .navbar__brand,
html[data-home='1'] .navbar__items .clean-btn {
color: var(--label-default) !important;
}
html[data-home='1'] .navbar__link:hover {
color: var(--brand) !important;
}
/* Hide navbar's own search on landing — Hero has its own */
html[data-home='1'] .navbar .navbar__search {
display: none !important;
}
/* Skip-to-content link */
html[data-home='1'] [class*='skipToContent'] {
background: var(--fill-default) !important;
color: var(--label-default) !important;
}
.brand-accent {
color: var(--brand) !important;
}
/* ============================
Homepage helpers (used by Layout content if any)
============================ */
.hero-section {
display: flex;
align-items: center;
gap: 48px;
margin-bottom: 3rem;
padding: 2rem 0;
}
.hero-section > div { flex: 1; }
.hero-section p {
font-size: 1.0625rem;
line-height: 1.75;
color: var(--label-second);
}
.hero-app-image {
width: 240px;
flex-shrink: 0;
border-radius: 20px;
}
.section-product-image {
width: 130px;
float: right;
margin-left: 20px;
margin-bottom: 12px;
border-radius: 12px;
}
.clearfix { clear: both; }
/* Narrow viewport — hamburger appears (Docusaurus default <996px),
text logo is swapped to symbol-only mark, title text hidden. */
@media (max-width: 996px) {
.navbar__title { display: none !important; }
.navbar__logo {
width: 28px !important;
height: 28px !important;
flex-shrink: 0;
}
.navbar__logo img {
content: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1LjM2NTcgNS42NjU4OUwxNy41OCA0LjM3NDlWMS4yOTA5NkwxNS4zNjU3IDBWNS42NjU4OVoiIGZpbGw9IiNBNEE3QTkiLz4KPHBhdGggZD0iTTcuMjA5OTMgMTkuMDg1OVYxMC40MTYyTDE0LjYzIDYuMTAwNFYwTDIuMzc2MDEgNy4xNDI0N0MyLjI2MTkxIDcuMjA5NDkgMi4xNjcxNSA3LjMwNTQ5IDIuMTAxMTggNy40MjA5M0MyLjAzNTIxIDcuNTM2NDEgMi4wMDAzNCA3LjY2NzMgMiA3LjgwMDU4VjIyLjE0NDZMNy4yMDk5MyAxOS4wODU5WiIgZmlsbD0iIzI3QzRCOCIvPgo8cGF0aCBkPSJNMjIuMzkyNSAxOS42OTczTDE0Ljk4NSAyNC4wMTMxTDcuNjIzNDEgMTkuNzIyNkwyLjM5MjU4IDIyLjc3MjhMMTQuNjI5OSAyOS44OTg0QzE0Ljc0NDMgMjkuOTY0NyAxNC44NzM5IDI5Ljk5OTYgMTUuMDA1OSAyOS45OTk2QzE1LjEzNzkgMzAuMDAwMiAxNS4yNjc3IDI5Ljk2NTIgMTUuMzgxOSAyOS44OTg0TDI3LjY0MDEgMjIuNzUxN0wyMi4zOTI1IDE5LjY5NzNaIiBmaWxsPSIjNkQ2RTcxIi8+CjxwYXRoIGQ9Ik0yNy42MTk5IDcuMTQyMzNMMjIuNzYwOSA0LjMxMTUyVjcuMzk1NDhMMTcuNTU1MiAxMC40MzcyTDIyLjc3NzYgMTMuNDc5VjE5LjAzNTJMMjggMjIuMTAyM1Y3LjgwMDQ4QzI3Ljk5OTIgNy42NjY3NiAyNy45NjM4IDcuNTM1NjIgMjcuODk3MSA3LjQyMDFDMjcuODMwNCA3LjMwNDYyIDI3LjczNDcgNy4yMDg4MyAyNy42MTk5IDcuMTQyMzNaIiBmaWxsPSIjQTRBN0E5Ii8+CjxwYXRoIGQ9Ik0xMi4zOTExIDEzLjQ0MjRMMTIuMzk1MyAxOS40ODM3TDE3LjQ3NTYgMTYuNTIyMVYxMC40NzY2TDEyLjM5MTEgMTMuNDQyNFoiIGZpbGw9IiM2RDZFNzEiLz4KPC9zdmc+Cg==);
height: 28px !important;
width: 28px !important;
max-width: none !important;
}
.navbar-sidebar__brand .navbar__title { display: none !important; }
.navbar-sidebar__brand .navbar__logo img {
content: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE1LjM2NTcgNS42NjU4OUwxNy41OCA0LjM3NDlWMS4yOTA5NkwxNS4zNjU3IDBWNS42NjU4OVoiIGZpbGw9IiNBNEE3QTkiLz4KPHBhdGggZD0iTTcuMjA5OTMgMTkuMDg1OVYxMC40MTYyTDE0LjYzIDYuMTAwNFYwTDIuMzc2MDEgNy4xNDI0N0MyLjI2MTkxIDcuMjA5NDkgMi4xNjcxNSA3LjMwNTQ5IDIuMTAxMTggNy40MjA5M0MyLjAzNTIxIDcuNTM2NDEgMi4wMDAzNCA3LjY2NzMgMiA3LjgwMDU4VjIyLjE0NDZMNy4yMDk5MyAxOS4wODU5WiIgZmlsbD0iIzI3QzRCOCIvPgo8cGF0aCBkPSJNMjIuMzkyNSAxOS42OTczTDE0Ljk4NSAyNC4wMTMxTDcuNjIzNDEgMTkuNzIyNkwyLjM5MjU4IDIyLjc3MjhMMTQuNjI5OSAyOS44OTg0QzE0Ljc0NDMgMjkuOTY0NyAxNC44NzM5IDI5Ljk5OTYgMTUuMDA1OSAyOS45OTk2QzE1LjEzNzkgMzAuMDAwMiAxNS4yNjc3IDI5Ljk2NTIgMTUuMzgxOSAyOS44OTg0TDI3LjY0MDEgMjIuNzUxN0wyMi4zOTI1IDE5LjY5NzNaIiBmaWxsPSIjNkQ2RTcxIi8+CjxwYXRoIGQ9Ik0yNy42MTk5IDcuMTQyMzNMMjIuNzYwOSA0LjMxMTUyVjcuMzk1NDhMMTcuNTU1MiAxMC40MzcyTDIyLjc3NzYgMTMuNDc5VjE5LjAzNTJMMjggMjIuMTAyM1Y3LjgwMDQ4QzI3Ljk5OTIgNy42NjY3NiAyNy45NjM4IDcuNTM1NjIgMjcuODk3MSA3LjQyMDFDMjcuODMwNCA3LjMwNDYyIDI3LjczNDcgNy4yMDg4MyAyNy42MTk5IDcuMTQyMzNaIiBmaWxsPSIjQTRBN0E5Ii8+CjxwYXRoIGQ9Ik0xMi4zOTExIDEzLjQ0MjRMMTIuMzk1MyAxOS40ODM3TDE3LjQ3NTYgMTYuNTIyMVYxMC40NzY2TDEyLjM5MTEgMTMuNDQyNFoiIGZpbGw9IiM2RDZFNzEiLz4KPC9zdmc+Cg==);
height: 28px !important;
width: 28px !important;
}
/* Make sure hamburger toggle is visible */
.navbar__toggle {
display: inline-flex !important;
}
}
@media (max-width: 768px) {
.hero-section {
flex-direction: column;
gap: 24px;
}
.hero-app-image { width: 200px; }
.section-product-image { width: 90px; }
.navbar__search-input {
width: 140px !important;
min-width: 100px !important;
}
.navbar__search {
flex: 1;
max-width: 200px;
}
}
/* ============================
Smooth transitions
============================ */
a,
.menu__link,
.navbar__link,
.pagination-nav__link,
.table-of-contents__link {
transition: color 0.15s ease, background-color 0.15s ease,
border-color 0.15s ease, box-shadow 0.15s ease;
}
@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;
}
}
}
@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.
*/
.toggle_vylO {
width: 2rem;
height: 2rem;
}
.toggleButton_gllP {
-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);
}
.toggleButton_gllP:hover {
background: var(--ifm-color-emphasis-200);
}
.toggleIcon_g3eP {
display: none;
}
[data-theme-choice='system'] .systemToggleIcon_QzmC,
[data-theme-choice='light'] .lightToggleIcon_pyhR,
[data-theme-choice='dark'] .darkToggleIcon_wfgR {
display: initial;
}
.toggleButtonDisabled_aARS {
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);
}
}
@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.
*/
.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;
}
}
.searchBar_RVTs .dropdownMenu_qbY6 {
left: auto !important;
right: 0 !important;
background: var(--search-local-modal-background, #f5f6f7);
border-radius: 6px;
box-shadow: var(
--search-local-modal-shadow,
inset 1px 1px 0 0 hsla(0, 0%, 100%, 0.5),
0 3px 8px 0 #555a64
);
margin-top: 8px;
width: var(--search-local-modal-width, 560px);
position: relative;
padding: var(--search-local-spacing, 12px);
}
.searchInput_YFbd:focus {
outline: 2px solid
var(--search-local-input-active-border-color, var(--ifm-color-primary));
outline-offset: 0px;
}
html[data-theme="dark"] div.ask-ai,
div.ask-ai {
--ask-ai-primary: var(--ifm-color-primary);
--ask-ai-primary-hover: var(--ifm-color-primary-light);
--ask-ai-foreground: var(--ifm-color-content);
--ask-ai-border: var(--ifm-color-emphasis-300);
--ask-ai-error: var(--ifm-color-danger);
--ask-ai-button-bg: var(--ifm-color-emphasis-200);
}
.ask-ai {
--ask-ai-background: var(--search-local-modal-background, #f5f6f7);
--ask-ai-muted: var(--search-local-muted-color, #969faf);
}
html[data-theme="dark"] .ask-ai {
--ask-ai-background: var(
--search-local-modal-background,
var(--ifm-background-color)
);
--ask-ai-muted: var(
--search-local-muted-color,
var(--ifm-color-secondary-darkest)
);
}
@media not (max-width: 996px) {
.searchBar_RVTs.searchBarLeft_MXDe .dropdownMenu_qbY6 {
left: 0 !important;
right: auto !important;
}
}
@media (max-width: 576px) {
.navbar__search-input:not(:focus) {
width: 2rem;
}
.searchBar_RVTs .dropdownMenu_qbY6 {
width: var(--search-local-modal-width-sm, 340px);
max-width: calc(100vw - var(--ifm-navbar-padding-horizontal) * 2);
}
}
html[data-theme="dark"] .searchBar_RVTs .dropdownMenu_qbY6 {
background: var(--search-local-modal-background, var(--ifm-background-color));
box-shadow: var(
--search-local-modal-shadow,
inset 1px 1px 0 0 #2c2e40,
0 3px 8px 0 #000309
);
}
.searchBar_RVTs .dropdownMenu_qbY6 .suggestion_fB_2 {
cursor: pointer;
background: var(--search-local-hit-background, #fff);
border-radius: 4px;
box-shadow: var(--search-local-hit-shadow, 0 1px 3px 0 #d4d9e1);
padding: 0 var(--search-local-spacing, 12px);
width: 100%;
align-items: center;
color: var(--search-local-hit-color, #444950);
display: flex;
flex-direction: row;
height: var(--search-local-hit-height, 56px);
}
html[data-theme="dark"] .dropdownMenu_qbY6 .suggestion_fB_2 {
background: var(--search-local-hit-background, var(--ifm-color-emphasis-100));
box-shadow: var(--search-local-hit-shadow, none);
color: var(--search-local-hit-color, var(--ifm-font-color-base));
}
.searchBar_RVTs .dropdownMenu_qbY6 .suggestion_fB_2:not(:last-child) {
margin-bottom: 4px;
}
.searchBar_RVTs .dropdownMenu_qbY6 .suggestion_fB_2.cursor_eG29 {
background-color: var(
--search-local-highlight-color,
var(--ifm-color-primary)
);
}
.hitTree_kk6K,
.hitIcon_a7Zy,
.hitPath_ieM4,
.noResultsIcon_EBY5,
.hitFooter_E9YW a {
color: var(--search-local-muted-color, #969faf);
}
html[data-theme="dark"] .hitTree_kk6K,
html[data-theme="dark"] .hitIcon_a7Zy,
html[data-theme="dark"] .hitPath_ieM4,
html[data-theme="dark"] .noResultsIcon_EBY5 {
color: var(--search-local-muted-color, var(--ifm-color-secondary-darkest));
}
.hitTree_kk6K {
display: flex;
align-items: center;
}
.hitTree_kk6K > svg {
height: var(--search-local-hit-height, 56px);
opacity: 0.5;
stroke-width: var(--search-local-icon-stroke-width, 1.4);
width: 24px;
}
.hitIcon_a7Zy {
stroke-width: var(--search-local-icon-stroke-width, 1.4);
height: 20px;
width: 20px;
}
.hitWrapper_sAK8 {
flex: 1 1 auto;
display: flex;
flex-direction: column;
font-weight: 500;
justify-content: center;
margin: 0 8px;
overflow-x: hidden;
width: 80%;
}
.hitWrapper_sAK8 mark {
background: none;
color: var(--search-local-highlight-color, var(--ifm-color-primary));
}
.hitTitle_vyVt {
font-size: 0.9em;
}
.hitPath_ieM4 {
font-size: 0.75em;
}
.hitPath_ieM4,
.hitTitle_vyVt {
white-space: nowrap;
overflow-x: hidden;
text-overflow: ellipsis;
}
.hitAction_NqkB {
height: 20px;
width: 20px;
}
.hideAction_vcyE > svg {
display: none;
}
.noResults_l6Q3 {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: var(--search-local-spacing, 12px) 0;
}
.noResultsIcon_EBY5 {
margin-bottom: var(--search-local-spacing, 12px);
}
.hitFooter_E9YW {
text-align: center;
margin-top: var(--search-local-spacing, 12px);
font-size: 0.85em;
}
.hitFooter_E9YW a {
-webkit-text-decoration: underline;
text-decoration: underline;
}
.cursor_eG29 .hideAction_vcyE > svg {
display: block;
}
.suggestion_fB_2.cursor_eG29,
.suggestion_fB_2.cursor_eG29 mark,
.suggestion_fB_2.cursor_eG29 .hitTree_kk6K,
.suggestion_fB_2.cursor_eG29 .hitIcon_a7Zy,
.suggestion_fB_2.cursor_eG29 .hitPath_ieM4 {
color: var(
--search-local-hit-active-color,
var(--ifm-color-white)
) !important;
}
.suggestion_fB_2.cursor_eG29 mark {
-webkit-text-decoration: underline;
text-decoration: underline;
}
.searchBarContainer_NW3z {
margin-left: 16px;
}
.searchBarContainer_NW3z .searchBarLoadingRing_YnHq {
display: none;
position: absolute;
left: 10px;
top: 6px;
}
.searchBarContainer_NW3z .searchClearButton_qk4g {
position: absolute;
right: 0.8rem;
top: 50%;
transform: translate(0, -50%);
padding: 0;
background: none;
border: none;
line-height: 1rem;
}
.navbar__search {
position: relative;
}
.searchIndexLoading_EJ1f .navbar__search-input {
background-image: none;
}
.searchBarContainer_NW3z.searchIndexLoading_EJ1f .searchBarLoadingRing_YnHq {
display: inline-block;
}
.searchHintContainer_Pkmr {
position: absolute;
right: 10px;
top: 0px;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
pointer-events: none;
gap: 4px;
}
.searchHint_iIMx {
color: var(--ifm-navbar-search-input-placeholder-color);
background-color: var(--ifm-navbar-search-input-background-color);
border: 1px solid var(--ifm-color-emphasis-500);
box-shadow: inset 0 -1px 0 var(--ifm-color-emphasis-500);
}
@media (max-width: 576px) {
.searchBarContainer_NW3z:not(.focused_OWtg) .searchClearButton_qk4g,
.searchHintContainer_Pkmr {
display: none;
}
}
/* Manually make the search bar be LTR even if in RTL */
html[dir="rtl"] .searchHintContainer_Pkmr {
right: auto;
left: 10px;
}
html[dir="rtl"] .searchBarContainer_NW3z .searchClearButton_qk4g {
right: auto;
left: 0.8rem;
}
html[dir="rtl"] .searchBarContainer_NW3z .searchBarLoadingRing_YnHq {
left: auto;
right: 10px;
}
html[dir="rtl"] .navbar__search-input {
padding: 0 2.25em 0 0.5em;
}
/* For autocomplete.js only. */
.input_FOTf {
}
.hint_URu1 {
}
.suggestions_X8XU {
}
.dataset_QiCy {
}
.empty_eITn {
}
/**/
/* https://loading.io/css/ */
.loadingRing_RJI3 {
display: inline-block;
position: relative;
width: 20px;
height: 20px;
opacity: var(--search-local-loading-icon-opacity, 0.5);
}
.loadingRing_RJI3 div {
box-sizing: border-box;
display: block;
position: absolute;
width: 16px;
height: 16px;
margin: 2px;
border: 2px solid
var(--search-load-loading-icon-color, var(--ifm-navbar-search-input-color));
border-radius: 50%;
animation: loading-ring_FB5o 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
border-color: var(
--search-load-loading-icon-color,
var(--ifm-navbar-search-input-color)
)
transparent transparent transparent;
}
.loadingRing_RJI3 div:nth-child(1) {
animation-delay: -0.45s;
}
.loadingRing_RJI3 div:nth-child(2) {
animation-delay: -0.3s;
}
.loadingRing_RJI3 div:nth-child(3) {
animation-delay: -0.15s;
}
@keyframes loading-ring_FB5o {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@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;
}
}
@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;
}
}
@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;
}
}
@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;
}
}
.searchContextInput_mXoe,
.searchQueryInput_CFBF {
border-radius: var(--ifm-global-radius);
border: var(--ifm-global-border-width) solid
var(--ifm-color-content-secondary);
font-size: var(--ifm-font-size-base);
padding: 0.5rem;
width: 100%;
background: var(--ifm-background-color);
color: var(--ifm-font-color-base);
margin-bottom: 1rem;
}
.searchResultItem_U687 {
padding: 1rem 0px;
border-bottom: 1px solid rgb(223, 227, 232);
}
.searchResultItem_U687 > h2 {
margin-bottom: 0;
}
.searchResultItemPath_uIbk {
color: var(--ifm-color-content-secondary);
font-size: 0.8rem;
margin: 0.5rem 0px 0px;
}
.searchResultItemSummary_oZHr {
font-style: italic;
margin: 0.5rem 0px 0px;
}
@media only screen and (max-width: 996px) {
.searchQueryColumn_q7nx {
max-width: 60% !important;
}
.searchContextColumn_oWAF {
max-width: 40% !important;
}
}
@media screen and (max-width: 576px) {
.searchQueryColumn_q7nx {
max-width: 100% !important;
}
.searchContextColumn_oWAF {
max-width: 100% !important;
padding-left: var(--ifm-spacing-horizontal) !important;
}
}
/* ═══════════════════════════════════════════════════════════════
D'CENT Support Center — Light theme home
Per docs/dcent-light-design.md
═══════════════════════════════════════════════════════════════ */
.page_IdJK {
--h-bg: #FFFFFF;
--h-bg-card: #F4F5F7;
--h-fill-2: #F7F7F8;
--h-line: #E0E1E5;
--h-line-soft: #EDEEF1;
--h-fg: #171719;
--h-fg2: #171719;
--h-fg3: #5A5C63;
--h-mute: #5A5C63;
--h-mute2: #878A93;
--h-mute3: #AEB0B6;
--h-mute4: #989BA2;
--h-brand: #0A8E4F;
--h-brand-strong: #0CA95E;
--h-brand-12: rgba(10, 142, 79, 0.14);
--h-brand-20: #CFF0E0; /* palette-green-90 solid */
--h-brand-99: #F3FBF7;
--h-warn: #E0660E;
--h-warn-soft: rgba(224, 102, 14, 0.10);
--h-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
--h-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
background: var(--h-bg);
color: var(--h-fg);
min-height: 100vh;
font-family: 'Inter', 'Noto Sans KR', 'Roboto', -apple-system,
BlinkMacSystemFont, 'Segoe UI', sans-serif;
letter-spacing: 0;
position: relative;
}
.page_IdJK a {
color: inherit;
-webkit-text-decoration: none;
text-decoration: none;
}
.container_bfhl {
max-width: 1220px;
margin: 0 auto;
padding: 0 32px;
position: relative;
}
/* Eyebrow */
.eyebrow_kY3W {
font-family: 'Inter', sans-serif;
font-size: 0.75rem; /* 12px sections */
font-weight: 600;
letter-spacing: 0;
color: var(--h-mute);
display: inline-flex;
align-items: center;
gap: 10px;
}
:lang(en) .eyebrow_kY3W,
html[lang='en'] .eyebrow_kY3W {
letter-spacing: 0.08em;
}
/* ═══════════════════════════════════════════════════════════════
Hero
═══════════════════════════════════════════════════════════════ */
.hero_aEcG {
padding: 96px 0 56px;
text-align: center;
position: relative;
overflow-x: clip;
overflow-y: visible;
border-bottom: 1px solid var(--h-line);
}
.heroGrid_ibpR {
position: absolute;
inset: 0;
background-image:
linear-gradient(var(--h-line) 1px, transparent 1px),
linear-gradient(90deg, var(--h-line) 1px, transparent 1px);
background-size: 64px 64px;
-webkit-mask-image: radial-gradient(ellipse 70% 55% at center 40%, #000 10%, transparent 70%);
mask-image: radial-gradient(ellipse 70% 55% at center 40%, #000 10%, transparent 70%);
opacity: 0.45;
pointer-events: none;
}
.heroGlow_CLW8 {
position: absolute;
top: -240px;
left: 50%;
transform: translateX(-50%);
width: min(1100px, 200vw);
height: 640px;
background: radial-gradient(
ellipse at center,
rgba(10, 142, 79, 0.10) 0%,
rgba(10, 142, 79, 0.04) 28%,
transparent 62%
);
filter: blur(44px);
pointer-events: none;
}
.heroVignette_EvUL {
position: absolute;
inset: 0;
background: radial-gradient(
ellipse at center 60%,
transparent 40%,
rgba(255, 255, 255, 0.4) 80%,
var(--h-bg) 100%
);
pointer-events: none;
}
.heroInner_V4lS {
position: relative;
z-index: 2;
display: flex;
flex-direction: column;
align-items: center;
gap: 0;
}
/* Eyebrow override (hero only — bigger per guide §4-2) */
.heroInner_V4lS .eyebrow_kY3W {
font-size: 1.25rem; /* 20px */
font-weight: 500;
color: var(--h-brand-strong);
letter-spacing: 0;
margin-bottom: 16px;
animation: fadeUp_LJ2A 0.9s var(--h-ease-out) backwards;
}
/* Hero title */
.heroTitle_qg2I {
margin: 0 0 16px;
font-weight: 600;
line-height: 1.1;
letter-spacing: -0.01em;
color: var(--h-fg);
animation: fadeUp_LJ2A 0.9s var(--h-ease-out) backwards;
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
}
.heroLine1_jFaj,
.heroLine2_NQzp {
font-size: clamp(2.25rem, 5vw, 3.5rem); /* 56px desktop */
font-weight: 600;
letter-spacing: -0.01em;
color: var(--h-fg);
line-height: 1.1;
}
.heroDisplay_pWUI {
display: none;
}
.heroSub_yj39 {
font-size: 1.25rem; /* 20px */
color: var(--h-mute);
margin: 0 0 32px;
font-weight: 400;
max-width: 560px;
line-height: 1.6;
animation: fadeUp_LJ2A 0.9s var(--h-ease-out) backwards;
}
/* ─── Search bar (guide §4-4: 64px, brand submit, hover=focus) ─── */
.searchTrigger_xxCg {
width: min(620px, 100%);
height: 64px;
display: flex;
align-items: center;
gap: 12px;
background: var(--h-bg);
border: 1px solid var(--h-line);
border-radius: 12px;
padding: 0 18px;
cursor: text;
transition: border-color 0.2s var(--h-ease), box-shadow 0.2s var(--h-ease);
position: relative;
animation: fadeUp_LJ2A 0.9s var(--h-ease-out) backwards;
}
.searchTrigger_xxCg:hover,
.searchTrigger_xxCg:focus-within {
border-color: var(--h-brand);
box-shadow: 0 0 0 3px rgba(10, 142, 79, 0.10);
outline: none;
}
.searchTrigger_xxCg svg {
flex-shrink: 0;
color: var(--h-mute2);
}
.searchInput_yMmf {
flex: 1;
text-align: left;
font-size: 1rem; /* 16px */
color: var(--h-fg);
background: transparent;
border: 0;
outline: none;
font-family: inherit;
letter-spacing: inherit;
min-width: 0;
}
.searchInput_yMmf::placeholder {
color: var(--h-mute2);
}
.searchGo_gSXr {
flex-shrink: 0;
width: 36px;
height: 36px;
border-radius: 9px;
background: var(--h-brand-strong); /* #0CA95E per guide */
color: #FFFFFF;
border: 0;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background 0.2s var(--h-ease), transform 0.2s var(--h-ease);
}
.searchGo_gSXr svg { color: #FFFFFF; }
.searchGo_gSXr:hover:not(:disabled) {
background: var(--h-brand);
transform: translateX(2px);
}
.searchGo_gSXr:disabled {
background: var(--h-mute3);
color: #FFFFFF;
cursor: not-allowed;
}
/* ─── Live suggestions dropdown ─── */
.suggestions_CMM3 {
position: absolute;
top: calc(100% + 10px);
left: 0;
right: 0;
list-style: none;
margin: 0;
padding: 8px;
background: var(--h-bg);
border: 1px solid var(--h-line);
border-radius: 14px;
box-shadow: 0 24px 64px rgba(0, 0, 0, 0.10);
max-height: 440px;
overflow-y: auto;
z-index: 50;
text-align: left;
animation: fadeDown__v5h 0.2s var(--h-ease-out);
}
@keyframes fadeDown__v5h {
from { opacity: 0; transform: translateY(-4px); }
to { opacity: 1; transform: translateY(0); }
}
.suggestion_do44 {
padding: 12px 16px;
border-radius: 10px;
cursor: pointer;
transition: background 0.12s ease;
border: 1px solid transparent;
}
.suggestion_do44 + .suggestion_do44 { margin-top: 2px; }
.suggestionActive_mnqB,
.suggestion_do44:hover {
background: var(--h-bg-card);
border-color: var(--h-line);
}
.suggestionTitle_p3X8 {
font-size: 0.9375rem;
font-weight: 500;
color: var(--h-fg);
line-height: 1.35;
}
.suggestionTitle_p3X8 mark {
background: var(--h-brand-12);
color: var(--h-brand);
padding: 0 2px;
border-radius: 3px;
font-weight: 600;
}
.suggestionPath_rHWk {
font-size: 0.75rem;
color: var(--h-mute2);
margin-top: 4px;
font-style: italic;
line-height: 1.4;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.loadingSpinner_t3HL {
display: inline-block;
width: 16px;
height: 16px;
border: 2px solid var(--h-line);
border-top-color: var(--h-brand);
border-radius: 50%;
animation: spin_vmyB 0.8s linear infinite;
margin-right: 8px;
vertical-align: middle;
}
@keyframes spin_vmyB { to { transform: rotate(360deg); } }
.suggestionsEmpty_M4NT {
position: absolute;
top: calc(100% + 10px);
left: 0;
right: 0;
padding: 18px 20px;
background: var(--h-bg);
border: 1px solid var(--h-line);
border-radius: 14px;
box-shadow: 0 24px 64px rgba(0, 0, 0, 0.08);
color: var(--h-mute);
font-size: 0.875rem;
text-align: center;
z-index: 50;
animation: fadeDown__v5h 0.2s var(--h-ease-out);
}
/* ═══════════════════════════════════════════════════════════════
Guide cards (top 2 cards under hero)
═══════════════════════════════════════════════════════════════ */
.guideCards_shkE {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
margin-top: 0;
}
.guideCard_O2ON {
background: var(--h-bg-card);
border: 1px solid var(--h-line);
border-radius: 16px;
padding: 32px;
-webkit-text-decoration: none !important;
text-decoration: none !important;
color: inherit !important;
display: flex;
flex-direction: column;
transition: border-color 0.2s ease, transform 0.2s ease, background 0.2s ease;
}
.guideCard_O2ON:hover {
background: transparent;
border-color: var(--h-brand);
transform: translateY(-2px);
}
.guideCardIcon_BVRH {
width: 48px;
height: 48px;
background: var(--h-brand-20); /* palette-green-90 solid */
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
margin-bottom: 20px;
}
.guideCardTitle_ii6p {
font-size: 1.5rem; /* 24px */
font-weight: 600;
color: var(--h-fg) !important;
margin: 0 0 8px;
letter-spacing: -0.01em;
}
.guideCardDesc_M9pa {
font-size: 1rem; /* 16px */
font-weight: 500;
color: var(--h-mute);
line-height: 1.6;
margin: 0 0 16px;
}
.guideCardLinks_fJH7 {
list-style: none;
padding: 0;
margin: 0 0 20px;
display: flex;
flex-direction: column;
gap: 4px;
}
.guideCardLinks_fJH7 li a {
color: var(--h-mute) !important;
-webkit-text-decoration: none;
text-decoration: none;
font-size: 1.125rem; /* 18px */
font-weight: 500;
height: 56px;
display: flex;
align-items: center;
padding: 0 12px;
border-radius: 8px;
transition: background 0.15s ease, color 0.15s ease;
}
.guideCardLinks_fJH7 li a::after {
content: '→';
margin-left: auto;
color: var(--h-mute4);
transition: color 0.15s ease;
}
.guideCardLinks_fJH7 li a:hover {
background: var(--h-bg-card);
color: var(--h-fg) !important;
}
.guideCard_O2ON:hover .guideCardLinks_fJH7 li a {
background: transparent;
}
.guideCardLinks_fJH7 li a:hover::after {
color: var(--h-brand);
}
.guideCardCta_cnfg {
margin-top: auto;
padding-top: 16px;
border-top: 1px solid var(--h-line);
color: var(--h-mute) !important;
font-weight: 500;
font-size: 1.125rem; /* 18px */
text-align: right;
display: block;
transition: color 0.2s ease;
}
.guideCard_O2ON:hover .guideCardCta_cnfg {
color: var(--h-fg) !important;
}
@media (max-width: 768px) {
.guideCards_shkE { grid-template-columns: 1fr; }
.guideCard_O2ON { padding: 24px; }
}
/* ═══════════════════════════════════════════════════════════════
Section rhythm
═══════════════════════════════════════════════════════════════ */
.section_Q9Zo {
padding: 64px 0;
position: relative;
}
.sectionHead_ZZjR {
margin-bottom: 44px;
max-width: 720px;
}
.sectionMeta__BD3 {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 14px;
}
.sectionIndex_IC09 {
font-size: 0.8125rem; /* 13px */
font-weight: 700;
color: var(--h-brand-strong);
letter-spacing: 0;
padding: 0;
border: 0;
background: transparent;
}
.sectionRule_uj1D {
flex: 0 0 28px;
height: 1px;
background: var(--h-line);
}
.sectionTitle_Ut5p {
font-size: 2.5rem; /* 40px */
font-weight: 600;
letter-spacing: -0.01em;
color: var(--h-fg);
margin: 0;
line-height: 1.15;
}
.sectionCaption_e0TX {
font-size: 1rem;
color: var(--h-mute);
margin: 14px 0 0;
max-width: 560px;
}
/* ═══════════════════════════════════════════════════════════════
Quick Tools
═══════════════════════════════════════════════════════════════ */
.tools_A2Fl {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 14px;
}
.tool_GiCo {
display: flex;
align-items: center;
gap: 18px;
background: var(--h-bg-card);
border: 1px solid var(--h-line);
border-radius: 14px;
padding: 20px 22px;
transition: all 0.25s var(--h-ease);
position: relative;
overflow: hidden;
min-height: 112px;
animation: fadeUp_LJ2A 0.75s var(--h-ease-out) backwards;
animation-delay: inherit;
}
.tool_GiCo:hover {
background: transparent;
border-color: var(--h-brand);
transform: translateY(-2px);
box-shadow: 0 12px 40px rgba(10, 142, 79, 0.06);
}
.toolIndex_JFt7 { display: none; }
.toolArrow_eeyJ {
width: 24px;
height: 24px;
border-radius: 6px;
background: var(--h-bg);
border: 1px solid var(--h-line);
display: flex;
align-items: center;
justify-content: center;
color: var(--h-mute);
transition: all 0.2s var(--h-ease);
flex-shrink: 0;
margin-left: auto;
}
.tool_GiCo:hover .toolArrow_eeyJ {
background: var(--h-brand-strong);
color: #FFFFFF;
border-color: var(--h-brand-strong);
transform: rotate(-12deg) scale(1.05);
}
.toolIcon_woJ_ {
width: 44px;
height: 44px;
border-radius: 11px;
background: var(--h-brand-20);
color: var(--h-brand);
display: flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(10, 142, 79, 0.20);
position: relative;
transition: all 0.2s var(--h-ease);
}
.tool_GiCo:hover .toolIcon_woJ_ {
transform: scale(1.04);
}
.toolBody_Zt2H { flex: 1; min-width: 0; }
.toolTitle_rJNm {
font-weight: 600;
font-size: 1.125rem; /* 18px */
line-height: 1.35;
color: var(--h-fg);
letter-spacing: -0.005em;
margin-bottom: 4px;
}
.toolDesc_aeKj {
font-size: 0.9375rem;
color: var(--h-mute);
line-height: 1.5;
}
/* Urgent variant — amber edge */
.urgent_rdN1 .toolIcon_woJ_ {
background: var(--h-warn-soft);
color: var(--h-warn);
border-color: rgba(224, 102, 14, 0.22);
animation: urgentPulse_YeDb 3s ease-in-out infinite;
}
@keyframes urgentPulse_YeDb {
0%, 100% { box-shadow: 0 0 0 0 rgba(224, 102, 14, 0.18); }
50% { box-shadow: 0 0 0 4px rgba(224, 102, 14, 0); }
}
.urgent_rdN1 .toolIndex_JFt7 { color: var(--h-warn); }
.urgentEdge_qJv9 {
position: absolute;
left: 0;
top: 18px;
bottom: 18px;
width: 2px;
background: linear-gradient(
180deg,
transparent,
var(--h-warn) 30%,
var(--h-warn) 70%,
transparent
);
opacity: 0.8;
}
.urgent_rdN1:hover {
border-color: var(--h-warn);
}
/* ═══════════════════════════════════════════════════════════════
Category cards
═══════════════════════════════════════════════════════════════ */
.cats_kMZn {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 18px;
}
.cat_BCwj {
position: relative;
background: var(--h-bg-card);
border: 1px solid var(--h-line);
border-radius: 18px;
padding: 30px 30px 26px;
transition: all 0.25s var(--h-ease);
display: flex;
flex-direction: column;
overflow: hidden;
animation: fadeUp_LJ2A 0.75s var(--h-ease-out) backwards;
animation-delay: inherit;
}
.catCorner_hTpf {
position: absolute;
top: 14px;
right: 14px;
width: 16px;
height: 16px;
opacity: 0.4;
transition: opacity 0.3s var(--h-ease);
}
.catCorner_hTpf::before,
.catCorner_hTpf::after {
content: '';
position: absolute;
background: var(--h-brand);
}
.catCorner_hTpf::before { top: 0; right: 0; width: 12px; height: 1px; }
.catCorner_hTpf::after { top: 0; right: 0; width: 1px; height: 12px; }
.cat_BCwj:hover {
background: transparent;
border-color: var(--h-brand);
transform: translateY(-2px);
box-shadow: 0 14px 44px rgba(10, 142, 79, 0.06);
}
.cat_BCwj:hover .catCorner_hTpf { opacity: 1; }
.catHead_Z0zF {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 14px;
margin-bottom: 22px;
position: relative;
}
.catEmblem_tJIV {
width: 52px;
height: 52px;
border-radius: 13px;
background: var(--h-brand-20); /* palette-green-90 solid */
display: flex;
align-items: center;
justify-content: center;
color: var(--h-brand);
border: 1px solid rgba(10, 142, 79, 0.18);
flex-shrink: 0;
transition: transform 0.3s var(--h-ease);
}
.cat_BCwj:hover .catEmblem_tJIV { transform: scale(1.04); }
.catCount_kq7m {
text-align: right;
padding-top: 4px;
}
.catCount_kq7m span {
font-size: 1rem; /* 16px */
font-weight: 700;
color: var(--h-fg);
letter-spacing: -0.01em;
display: block;
line-height: 1;
}
.catCount_kq7m em {
font-size: 0.875rem; /* 14px */
font-weight: 500;
color: var(--h-mute3);
font-style: normal;
display: block;
margin-top: 4px;
}
.catTitle_durB {
font-weight: 600;
font-size: 1.5rem; /* 24px */
letter-spacing: -0.01em;
color: var(--h-fg) !important;
line-height: 1.25;
display: block;
margin-bottom: 18px;
transition: color 0.2s var(--h-ease);
}
.catTitle_durB:hover {
color: var(--h-brand) !important;
}
.catList_Sy3Q {
list-style: none;
margin: 0 0 22px;
padding: 0;
flex: 1;
}
.catList_Sy3Q li {
border-top: 1px solid var(--h-line-soft);
}
.catList_Sy3Q li:first-child {
border-top: 1px solid var(--h-line);
}
.catList_Sy3Q li a {
color: var(--h-mute) !important;
display: flex;
align-items: center;
font-size: 1.125rem; /* 18px */
font-weight: 500;
line-height: 1.4;
gap: 10px;
height: 56px;
padding: 0 4px;
transition: all 0.2s var(--h-ease);
}
.catBullet_WSra {
color: var(--h-mute4);
font-size: 1.25rem;
margin-left: auto;
transition: all 0.2s var(--h-ease);
flex-shrink: 0;
order: 2;
}
.catList_Sy3Q li a:hover {
color: var(--h-fg) !important;
}
.catList_Sy3Q li a:hover .catBullet_WSra {
color: var(--h-brand);
transform: translateX(3px);
}
.catMore_pdBf {
font-size: 1.125rem; /* 18px */
letter-spacing: 0;
color: var(--h-mute) !important;
font-weight: 500;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
padding-top: 16px;
border-top: 1px solid var(--h-line);
text-transform: none;
}
.catMore_pdBf svg {
transition: transform 0.25s var(--h-ease);
}
.cat_BCwj:hover .catMore_pdBf {
color: var(--h-fg) !important;
}
.cat_BCwj:hover .catMore_pdBf svg {
color: var(--h-brand);
transform: translateX(4px);
}
/* ═══════════════════════════════════════════════════════════════
CTA banner — light gradient (palette-green-90 → green-99)
═══════════════════════════════════════════════════════════════ */
.cta__fRr {
margin-top: 60px;
background: linear-gradient(135deg, var(--h-brand-20), var(--h-brand-99));
border: 1px solid rgba(12, 169, 94, 0.32);
border-radius: 20px;
padding: 44px 48px;
display: grid;
grid-template-columns: 1fr auto;
gap: 32px;
align-items: center;
position: relative;
overflow: hidden;
}
.ctaGlow_jfqq {
position: absolute;
top: -60%;
right: -15%;
width: min(520px, 150vw);
height: 520px;
background: radial-gradient(
circle,
rgba(10, 142, 79, 0.10),
transparent 60%
);
filter: blur(44px);
pointer-events: none;
}
.ctaText_yx_o { position: relative; }
.ctaMeta_OAD_ {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 12px;
}
.ctaBar_qcu3 {
width: 3px;
height: 14px;
background: var(--h-brand);
border-radius: 2px;
}
.cta__fRr h3 {
margin: 6px 0 10px;
font-size: 1.75rem; /* 28px */
font-weight: 600;
letter-spacing: -0.01em;
color: var(--h-fg);
line-height: 1.2;
}
.cta__fRr p {
margin: 0;
color: var(--h-mute);
font-size: 0.9375rem;
max-width: 460px;
}
.cta__fRr p b {
color: var(--h-fg);
font-weight: 600;
}
.btns_kYFG {
display: flex;
gap: 10px;
position: relative;
flex-wrap: wrap;
justify-content: flex-end;
}
.btn_bvfa {
padding: 13px 20px;
border-radius: 11px;
font-family: inherit;
font-size: 0.9375rem;
font-weight: 600;
border: 1px solid var(--h-line);
background: var(--h-bg); /* fill-default */
color: var(--h-fg);
display: inline-flex;
align-items: center;
gap: 9px;
cursor: pointer;
transition: all 0.2s var(--h-ease);
letter-spacing: 0;
-webkit-text-decoration: none;
text-decoration: none;
}
.btn_bvfa svg { transition: transform 0.2s var(--h-ease); }
.btn_bvfa:hover {
border-color: var(--h-brand);
color: var(--h-brand);
transform: translateY(-1px);
}
.btn_bvfa:hover svg:last-child {
transform: translateX(2px);
}
.btnPrimary_hBjO {
background: var(--h-brand-strong);
color: #FFFFFF;
border-color: var(--h-brand-strong);
}
.btnPrimary_hBjO:hover {
background: var(--h-brand);
border-color: var(--h-brand);
color: #FFFFFF;
}
/* ═══════════════════════════════════════════════════════════════
Animations
═══════════════════════════════════════════════════════════════ */
@keyframes fadeUp_LJ2A {
from { opacity: 0; transform: translateY(18px); }
to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
.heroTitle_qg2I,
.heroSub_yj39,
.searchTrigger_xxCg,
.tool_GiCo,
.cat_BCwj,
.urgent_rdN1 .toolIcon_woJ_ {
animation: none !important;
}
.tool_GiCo:hover,
.cat_BCwj:hover,
.searchTrigger_xxCg:hover,
.btn_bvfa:hover,
.guideCard_O2ON:hover {
transform: none;
}
}
/* ═══════════════════════════════════════════════════════════════
Responsive
═══════════════════════════════════════════════════════════════ */
@media (max-width: 1100px) {
.tools_A2Fl { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
.hero_aEcG { padding: 88px 0 56px; }
.heroLine1_jFaj,
.heroLine2_NQzp { font-size: 1.75rem; }
.sectionTitle_Ut5p { font-size: 1.875rem; }
.tools_A2Fl { grid-template-columns: repeat(2, 1fr); }
.cats_kMZn { grid-template-columns: repeat(2, 1fr); }
.cta__fRr {
grid-template-columns: 1fr;
padding: 32px;
}
.btns_kYFG { justify-content: flex-start; }
}
@media (max-width: 600px) {
.container_bfhl { padding: 0 20px; }
.hero_aEcG { padding: 72px 0 48px; }
.section_Q9Zo { padding: 56px 0; }
.tools_A2Fl, .cats_kMZn { grid-template-columns: 1fr; }
.heroLine1_jFaj,
.heroLine2_NQzp { font-size: 1.5rem; }
.heroSub_yj39 { font-size: 1rem; }
.cta__fRr { padding: 28px; }
}
@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-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;
}
}
@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-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.
*/
.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.
*/
.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.
*/
.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;
}
}
}
@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-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;
}
}
@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.
*/
.docItemContainer_Djhp header + *,
.docItemContainer_Djhp article > *:first-child {
margin-top: 0;
}
@media (min-width: 997px) {
.docItemCol_VOVn {
max-width: 75% !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.
*/
.mdxPageWrapper_j9I6 {
justify-content: center;
}
}