:root {
    /* Sidebar design tokens */
    --xl-content-size: 1152px;
}

.docs-section-main-section {
    width: 100%;
}

.docs-section-main-section .overview {
    background: rgb(13, 56, 61);
}

.docs-section-main-section > * > * {
    padding-left: var(--s0);
}

@media (min-width: 1025px) {
    .docs-section-main-section > * > * {
        padding-left: var(--s5);
    }
}

.docs-section-main-section .overview .content {
    max-width: var(--xl-content-size);
    color: var(--color-light);
    margin-left: var(--s-1);
}

/* Prevent hyphenation on docs home header - break between words instead */
.docs-section-main-section #home-banner-header {
    hyphens: none;
    -webkit-hyphens: none;
}

.overview {
    font-size: var(--font-size-lg);
    line-height: var(--line-height-xl);
}

.overview p {
    line-height: 1.75;
    font-size: var(--font-size-xl);
}

.docs-section-main-section .overview {
    padding-top: var(--s5);
    padding-bottom: var(--s5);
}

.docs-section-main-section #on-page-cta-form {
    max-width: var(--xl-content-size);
}

.docs-main-section {
    max-width: var(--xl-content-size);
    padding: var(--s-1);
}

@media (min-width: 1025px) {
    .docs-main-section {
        padding-right: var(--s0);
    }
}

/* Code block styles for docs content */
.docs-content pre {
    border-radius: var(--border-radius);
    padding-inline-start: var(--s1);
    padding-block-start: var(--s1);
    padding-block-end: var(--s1);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.docs-content pre > code {
    display: inline-block;
    font-size: var(--font-size);
    background-color: inherit;
    word-break: normal;
    white-space: pre;
    border-radius: var(--border-radius);
    line-height: var(--line-height-sm);
}

.docs-content *:not(pre) > code {
    background-color: var(--color-light-grey);
    word-break: break-word;
    white-space: pre-wrap;
    border-radius: var(--border-radius);
    padding: var(--s-7) var(--s-5);
}

/* Table styles for docs content */
.docs-content table {
    border-collapse: collapse;
    width: 100%;
    margin: var(--s1) 0;
    border: 2px solid var(--color-light-grey);
    border-radius: var(--border-radius);
    overflow: hidden;
}

.docs-content table thead {
    background-color: var(--color-light);
}

.docs-content table th,
.docs-content table td {
    border: 1px solid var(--color-light-grey);
    padding: var(--s-1) var(--s0);
    text-align: left;
}

.docs-content table th {
    font-weight: 600;
    color: var(--color-dark);
}

.docs-content table tbody tr:hover {
    background-color: var(--color-light);
}

/* Remove double borders at edges */
.docs-content table thead tr:first-child th {
    border-top: none;
}

.docs-content table tbody tr:last-child td {
    border-bottom: none;
}

.docs-content table th:first-child,
.docs-content table td:first-child {
    border-left: none;
}

.docs-content table th:last-child,
.docs-content table td:last-child {
    border-right: none;
}

/* Prevent article title from causing horizontal overflow on mobile */
.article-title {
    overflow-wrap: break-word;
    word-break: break-word;
    max-width: 100%;
}

.title-section {
    overflow: hidden;
}