@font-face {
    font-family: "Gilroy";
    font-weight: 700;
    src: url("/static-assets/fonts/gilroy-bold-webfont.woff2") format("woff2");
}
@font-face {
    font-family: "Proxima-Nova";
    font-weight: 400;
    src: url("/static-assets/fonts/proximanova-regular-webfont.woff2") format("woff2");
}
@font-face {
    font-family: "Proxima-Nova";
    font-weight: 700;
    src: url("/static-assets/fonts/proximanova-bold-webfont.woff2") format("woff2");
}

:root {
    --brand-red: #df1b12;
    --brand-blue: #1988cf;
    --brand-white: #ffffff;
    --brand-black: ##0a0e11;
    --gray-very-dark: #18212a;
    --gray-dark: #3c4956;
    --gray-neutral-strong: rgba(128, 128, 128, 0.4);
    --gray-neutral: rgba(128, 128, 128, 0.15);
    --gray-subtle: rgba(128, 128, 128, 0.05);
    --gray-hover: rgba(242, 242, 242, 0.5);
    --gray-selected: rgba(242, 242, 242, 1);
    --gray-opaque: #666666;
    --opacity-inactive: 0.7;
    --text: var(--brand-black);
    --background: var(--brand-white);
    --theme-toggle-background: var(--background);
    --spacing-small: 0.5rem;
    --spacing-medium: 1rem;
    --spacing-large: 2rem;
    --spacing-xlarge: 3rem;
    --size-header: 5rem;
    --size-button: 3rem;
    --size-font: 16px;
    --size-font-code: 14px;
    --size-font-domain: 14px;
    --size-font-module: 12px;
    --size-font-cover: 32px;
    --size-max-width: 1200px;
    --size-radius: 0.5rem;
    --size-radius-highlight: 0.3125rem;
    --size-side-bar: 350px;
    --size-module-offset: 26px;
    --shadow-default: 0 0.5rem 1rem -0.5rem rgba(0, 0, 0, 0.1);
    --breadcrumb-font-color: var(--text);
    --hover-link-color: var(--brand-blue);
    --average-color: var(--text);
    --footer-height: var(--size-header);
    --size-side-bar: 350px;
    --shadow-default: 0 0.5rem 1rem -0.5rem rgba(0, 0, 0, 0.1);
    --breadcrumb-font-color: var(--text);
    --hover-link-color: var(--brand-blue);
    --average-color: var(--text);
    --footer-height: var(--size-header);
    --footer-padding-top: var(--spacing-xlarge);
    --horizontal-spacing-for-content: var(--spacing-xlarge);
    --mobile-horizontal-spacing-for-content: 8px;
    --bottom-spacing: var(--spacing-medium);
    --color-scrollbar: var(--gray-neutral-strong);
    --color-scrollbar-track: var(--background);
    --code-background: var(--gray-hover);
    font-size: var(--size-font);
}

:root body {
    font-family: "Proxima-Nova", var(--default-font-family);
    font-size: var(--size-font-domain);
    font-weight: 400;
    line-height: 20px;
    color: var(--text);
    background: var(--background);
}
:root input {
    color: var(--text) !important;
}
:root .paragraph {
    margin: var(--spacing-small) 0 !important;
    line-height: 1.75em;
}
:root .paragraph a {
    color: var(--hover-link-color);
}
:root h1,
:root h2,
:root h3,
:root h4,
:root h5,
:root h6 {
    margin-top: 1em;
    color: var(--text);
    font-family: "Gilroy";
    font-weight: 700;
}
:root h1 {
    font-size: 3rem;
    font-weight: normal !important;
}
:root h1.cover {
    border-bottom-color: var(--gray-neutral);
    font-size: var(--size-font-cover);
    font-weight: 700 !important;
    letter-spacing: normal;
}
.cover > h1 {
    font-size: 2rem;
    font-weight: 700 !important;
    letter-spacing: normal;
}
:root h2 {
    font-size: 16px;
    letter-spacing: normal;
    border-bottom: 1px solid var(--gray-neutral);
    margin-bottom: 8px !important;
}
#container {
    height: calc(100% - var(--size-header));
}
:root #leftColumn {
    border: none;
    width: 30vw;
    min-width: var(--size-side-bar);
    border-right: 1px solid var(--gray-neutral);
}

:root #leftColumn #paneSearch #navigation-pane-search {
    border-radius: 4rem;
    background: var(--gray-subtle);
    border-color: var(--gray-neutral);
    padding-right: var(--spacing-large);
    padding-left: var(--spacing-medium);
    font-size: 1rem;
}
:root #leftColumn #paneSearch .paneSearchInputClearIcon {
    margin-right: var(--spacing-small);
}
:root #leftColumn #paneSearch .paneSearchInputClearIcon svg {
    opacity: 0.3;
}
:root #leftColumn #paneSearch .paneSearchInputClearIcon svg * {
    fill: var(--text) !important;
}
:root #leftColumn .sideMenu > .sideMenuPart {
    margin-bottom: var(--spacing-small);
}

/* Hide androidJvm pills. */
.platform-tags {
    display: none;
}

/* NAVIGATION TREE */

#sideMenu {
    font-family: "Gilroy";
}
.sideMenuPart {
    background: var(--background-color);
}
.sideMenuPart.domain > .overview:hover {
    background: var(--gray-hover);
}
.sideMenuPart.domain:has(div[data-active]) > .overview {
    background: var(--gray-selected);
}
/* Show arrow always. */
.sideMenuPart.hidden > .sideMenuPart {
    display: flex;
}
.sideMenuPart.module > .sideMenuPart {
    display: none;
}

/* Remove unwanted offset. */
.sideMenuPart.domain > .overview > a {
    padding-left: 0px;
    color: var(--text);
    overflow-wrap: break-word;
}
/* Apply UX style. */
.sideMenuPart.domain > .overview {
    display: flex;
    margin: 12px;
    padding-left: 8px;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    border-radius: var(--size-radius-highlight);

    font-size: var(--size-font-domain);
    font-style: normal;
    font-weight: 700;
    line-height: 1.25rem;
}
/* Hide expand arrow for domains in navigation menu. */
.sideMenuPart.domain > .overview > .navButton {
    display: none;
}

/* Hide packages from navigation menu. */
.sideMenuPart.module > .sideMenuPart.hidden {
    display: none;
}
/* Apply UX style. */
.sideMenuPart.module {
    display: flex;
    padding-left: 0px;
    align-items: flex-start;
    gap: 4px;
    background: var(--background);
}
/* Set wanted offsets. */
.sideMenuPart.module > .overview {
    display: block;
    width: 100%;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 8px;
    padding-right: 8px;
    margin-left: 4px;
}
/* To exclude the module "arrow" from hover effect. */
.sideMenuPart.module > .overview > a:hover {
    margin-left: var(--size-module-offset);
}
/* Apply highlight box style. */
.sideMenuPart.module > .overview > a:hover {
    border-radius: var(--size-radius-highlight);
    background: var(--gray-hover);
}
/* Apply UX style. */
.sideMenuPart.module > .overview > a > span {
    display: flex;
    padding: 8px;
    align-items: center;
    gap: 12px;

    font-size: var(--size-font-module);
    font-style: normal;
    font-weight: 700;
    line-height: 1rem;
    color: var(--gray-opaque);
}
/* Undo the forced offset for the hover on .overview. */
.sideMenuPart.module > .overview > a > span:hover {
    position: relative;
    left: calc(-1 * var(--size-module-offset));
}
/* Apply UX style and fix padding. */
.sideMenuPart.module > .overview > .navButton {
    padding: 0px;
    padding-right: 4px;
    display: flex;
    align-items: flex-start;
    align-self: stretch;
}
/* Show different submenu indicator. */
.sideMenuPart.module > .overview > .navButton > .navButtonContent::before {
    -webkit-mask: url("../images/arrow-submenu.svg") no-repeat 50% 50%;
    mask: url("../images/arrow-submenu.svg") no-repeat 50% 50%;
    height: 32px;
    width: 16px;
    transform: rotate(0deg);
    background: var(--gray-neutral);

    padding-left: 0px;
    align-items: flex-start;
    gap: 4px;
    align-self: stretch;
}
/* Show different submenu indicator for last child. */
.sideMenuPart.module:last-child > .overview > .navButton > .navButtonContent::before {
    -webkit-mask: url("../images/arrow-submenu-last.svg") no-repeat;
    mask: url("../images/arrow-submenu-last.svg") no-repeat;
}

/* To exclude the module "arrow" from selected effect. */
:is(.sideMenuPart.module[data-active] > .overview > a ,
    .sideMenuPart.module:has(div[data-active]) > .overview > a) {
    margin-left: var(--size-module-offset);
}
/* Apply selected box style. */
:is(.sideMenuPart.module[data-active] > .overview > a,
    .sideMenuPart.module:has(div[data-active]) > .overview > a) {
    border-radius: var(--size-radius-highlight);
    background: var(--gray-selected);
}
/* Undo the forced offset for the selected effect on .overview. */
:is(.sideMenuPart.module[data-active] > .overview > a > span,
    .sideMenuPart.module:has(div[data-active]) > .overview > a > span) {
    position: relative;
    left: calc(-1 * var(--size-module-offset));
}




.sideMenuPart > .overview::before {
    left: -2rem;
    width: calc(100% + 2rem);
}

.sideMenuPart .sideMenuPart .overview::before {
    background: var(--gray-subtle);
}

.sideMenuPart .overview {
    display: flex;
    align-items: center;
}

.sideMenuPart .overview:hover::before {
    background-color: var(--gray-neutral);
}

.sideMenuPart .overview .navButton {
    margin-right: 0;
    width: 1.5rem;
}


:root .navigation-wrapper {
    border-bottom: 1px solid var(--gray-neutral);
    height: var(--size-header);
    background: var(--background);
    padding: 0px var(--spacing-medium);
    box-sizing: border-box;
    align-items: center;
}
.search button {
    fill: var(--text);
}

:root .navigation-wrapper .search-content {
    background: none;
}
:root .navigation-wrapper .search button {
    background: none;
    opacity: var(--opacity-inactive);
    width: var(--size-button);
    height: 100%;
}

/* LOGO */

:root .library-name a {
    content: " ";
    background-image: url("../images/tomtom-light.svg") !important;
    height: 100%;
    width: 300px;
    background-repeat: no-repeat;
    display: block;
    color: transparent;
    background-size: contain;
    padding: 1rem;
    background-position: left center;
    box-sizing: border-box;
}

@media screen and (max-width: 759px) {
    #leftToggler {
        color: var(--text);
    }

    #leftColumn {
        background: var(--background);
        margin-left: -350px;
    }
}

/* SEARCH */

:root div[data-test="ring-popup"] {
    background-color: var(--gray-very-dark) !important;
    color: var(--brand-white) !important;
    top: var(--size-header) !important;
    margin-top: var(--spacing-medium);
    left: 50% !important;
    transform: translate(-50%, 0);
    border-radius: var(--size-radius);
    box-shadow: 0 2rem 10rem -0.3rem rgba(0, 0, 0, 0.5);
}

:root div[data-test="ring-popup"] input {
    height: var(--size-header);
    color: currentColor !important;
}
:root div[data-test="ring-popup"] div[data-test="ring-select-popup-filter"] {
    display: flex;
    align-items: center;
}

:root div[data-test="ring-popup"] span[data-test-custom="ring-select-popup-filter-icon"] {
    top: initial !important;
}

/* BREADCRUMBS */

:root .breadcrumbs {
    color: currentColor;
}

:root .breadcrumbs a {
    border-bottom: 0 !important;
    margin: var(--spacing-medium);
    opacity: var(--opacity-inactive);
}

:root .breadcrumbs a:first-child {
    margin-left: 0;
}

:root .breadcrumbs a:last-child {
    font-weight: bold;
    opacity: 1;
    margin-right: 0;
}

/* CODE */

:root code {
    color: var(--text);
    font-size: var(--size-font-code);
    border-radius: 0.25rem;
    padding: var(--spacing-small);
    margin: var(--spacing-medium) 0;
}
:root code pre {
    color: var(--text);
}
:root .sample-container code {
    border-radius: var(--size-radius);
    padding: var(--spacing-small) var(--spacing-medium);
    border: 1px solid var(--gray-subtle);
}

:root .paragraph {
    color: var(--text) !important;
}

:root .paragraph a {
    color: var(--brand-blue) !important;
    font-size: inherit;
}
:root .symbol {
    border-radius: var(--size-radius);
    padding: var(--spacing-medium);
    border: 1px solid var(--gray-neutral);
    margin-bottom: var(--spacing-medium);
}
:root .symbol.strikethrough {
    text-decoration: initial;
    position: relative;
    opacity: 0.6;
}
:root .symbol.strikethrough a {
    color: currentColor;
}
:root .symbol.strikethrough::after {
    content: "DEPRECATED";
    position: absolute;
    right: 50px;
    background: var(--brand-red);
    color: white;
    font-size: 0.8em;
    padding: 1px 0.5rem;
    border-radius: 4px;
}
:root .symbol span.copy-icon {
    opacity: var(--opacity-inactive);
}
:root .symbol span.copy-icon:hover {
    opacity: 1;
}
:root .symbol span.copy-icon:hover::before {
    background-color: var(--text);
}
:root .copy-popup-wrapper {
    background: var(--background);
    border-radius: var(--size-radius);
    border: 1px solid var(--gray-neutral);
    padding: var(--spacing-small);
}

:root .main-content > *:not(.navigation-wrapper) {
    max-width: var(--size-max-width);
    margin: var(--spacing-medium) auto;
    padding-left: 80px;
    padding-right: 80px;
}
:root .main-content > *:not(.navigation-wrapper):nth-child(2) {
    margin-top: 0;
}
:root .tabs-section .section-tab {
    font-size: var(--size-font);
    opacity: var(--opacity-inactive);
    border-bottom: 2px solid var(--gray-neutral);
}
:root .tabs-section .section-tab[data-active=""] {
    color: var(--text);
    opacity: 1;
    border-bottom: 2px solid var(--brand-blue);
}
:root .tabs-section-body,
:root .divergent-group {
    background-color: transparent;
}
:root .table {
    background: none;
}
:root .table .table-row {
    background: var(--background);
    color: var(--text);
    border-bottom: none;
    padding: 10px 0px;
    gap: 16px;
}
:root .table .table-row .main-subrow {
    grid-template-columns: 30% 70%;
    font-size: var(--size-font-domain);
}
:root .table .table-row .main-subrow .inline-flex a {
    color: inherit;
    font-family: "Gilroy";
    font-weight: bold;
    border-bottom: none !important;
    word-break: break-word;
}

/* LANDING PAGE. */
#domain-table {
    margin-top: var(--spacing-xlarge);
}
/* Hide module list. */
#domain-table ~ h2,
#domain-table ~ .table {
    display: none;
}
#domain-table .table-row {
    border-bottom: none;
}
.domain-row {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    align-content: flex-start;
    align-self: stretch;
    padding: 10px 0px;
    gap: 0px 80px;
}
.domain-cell {
    display: inline-flex;
    font-size: var(--size-font);
    font-weight: 700;
    line-height: 24px;
    min-width: 200px;
    max-width: 300px;
    flex: 1 0 0;
    justify-content: flex-start;
    align-items: center;
    gap: 24px;
}
.domain-cell a {
    display: inline-flex;
    border-bottom: none !important;
}
.domain-link {
    display: contents;
    border-bottom: none !important;
}
.domain-button {
    padding: 10.52px;
    background: var(--brand-red);
    box-shadow: 0px 0px 5.260000228881836px 1.315000057220459px rgba(60, 73, 86, 0.08);
    border-radius: 100px;
    justify-content: center;
    align-items: center;
    display: inline-flex;
}
.domain-button > img {
    width: var(--spacing-large);
}

/* GENERIC. */

:root .page-summary {
    background: var(--background);
    border: 1px solid var(--gray-neutral);
    border-right: none;
    border-top-left-radius: var(--size-radius);
    border-bottom-left-radius: var(--size-radius);
}
:root .page-summary:not(.hidden) {
    padding-top: var(--spacing-small);
}
:root .page-summary:not(.hidden) ul li a {
    color: var(--text);
    opacity: var(--opacity-inactive);
}
:root .page-summary:not(.hidden) ul li:hover {
    background: var(--gray-subtle);
}
:root .page-summary:not(.hidden) ul li.selected {
    border-right: 4px solid var(--brand-blue);
    border-left: none;
}
:root .page-summary:not(.hidden) ul li.selected a {
    opacity: 1;
}
:root .footer {
    border-top: 1px solid var(--gray-neutral);
}
:root .footer span.go-to-top-icon {
    background: var(--gray-subtle);
}

/* Theming. */
#theme-toggle {
    content: url("../images/theme-toggle-light.svg");
}
:root.theme-dark #theme-toggle {
    content: url("../images/theme-toggle-dark.svg");
}
/* Remove hover highlght. */
#theme-toggle-button:hover {
    background: var(--gray-hover);
}

:root.theme-dark {
    --text: white;
    --brand-blue: #3f9cd9;
    --background-color: rgba(20, 20, 27, 1);
    --background: var(--background-color);
    --gray-hover: rgba(43, 43, 53, 1);
    --gray-selected: rgba(96, 97, 111, 1);
    --gray-opaque: rgba(255, 255, 255, 0.76);
}

:root.theme-dark .library-name a {
    background-image: url("../images/tomtom-dark.svg") !important;
}

/*# sourceMappingURL=logo-styles.css.map */