/*
 * Bitwards SDK Javadoc — Android documentation style
 * Mirrors the look and feel of developer.android.com/reference
 */

/* ── Google Fonts ─────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Google+Sans:ital,wght@0,400;0,500;0,700;1,400&family=Roboto:ital,wght@0,300;0,400;0,500;1,400&family=Roboto+Mono:wght@400;500&display=swap');

/* ── Design tokens ────────────────────────────────────────── */
:root {
    --font-sans:  'Google Sans', 'Roboto', -apple-system, 'Segoe UI', Arial, sans-serif;
    --font-body:  'Roboto', -apple-system, 'Segoe UI', Arial, sans-serif;
    --font-mono:  'Roboto Mono', 'Courier New', Courier, monospace;

    /* Override the Javadoc default stylesheet's font variables so every
       element it styles automatically picks up the Android fonts. */
    --body-font-family:  var(--font-body);
    --block-font-family: var(--font-body);   /* replaces DejaVu Serif */
    --code-font-family:  var(--font-mono);

    /* Table row colours — all white, no alternating grey */
    --even-row-color:       #FFFFFF;
    --odd-row-color:        #FFFFFF;
    /* Section wrapper background — default is #f8f8f8 which shows as grey
       in the first column; set to white to match the table rows */
    --section-background-color: #FFFFFF;

    --color-bg:           #FFFFFF;
    --color-surface:      #F8F9FA;
    --color-border:       #DADCE0;
    --color-text:         #202124;
    --color-text-muted:   #5F6368;
    --color-link:         #1A73E8;
    --color-link-hover:   #174EA6;
    --color-accent-bg:    #E8F0FE;   /* light Google-blue tint */
    --color-nav-bg:       #0E1146;   /* dark top-bar */
    --color-nav-text:     #E8EAED;

    /* Override the standard Javadoc stylesheet's own nav variables so the
       Java 17 doclet's .top-nav/.sub-nav elements pick up the right colours
       without requiring layout-breaking !important rules. */
    --navbar-background-color:    #0E1146;
    --navbar-text-color:          #E8EAED;
    --subnav-background-color:    #E8EAED;
    --color-code-bg:      #263238;   /* dark code panel */
    --color-code-text:    #ECEFF1;
    --color-inline-bg:    #F1F3F4;   /* inline code chip */
    --color-inline-text:  #37474F;
    --color-note-bg:      #E8F5E9;   /* green note box */
    --color-note-border:  #34A853;
    --color-warn-bg:      #FFF8E1;   /* amber warning box */
    --color-warn-border:  #F9A825;
    --color-table-head:   #E8F0FE;
    --color-row-alt:      #F8F9FA;

    --radius:    4px;
    --radius-lg: 8px;
}

/* ── Reset / base ─────────────────────────────────────────── */
body, html {
    margin: 0;
    padding: 0;
    background: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 14px;
    line-height: 1.7;
}

/* ── Top navigation bar ───────────────────────────────────── */
/* Old doclet (.topNav) — full flex layout override */
.topNav,
div.topNav,
.bar {
    background-color: var(--color-nav-bg) !important;
    border-bottom: none !important;
    padding: 0 24px !important;
    min-height: 56px;
    display: flex;
    align-items: center;
}

.topNav a,
.topNav a:visited,
.bar a {
    color: var(--color-nav-text) !important;
    font-family: var(--font-sans);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    padding: 0 12px;
    letter-spacing: 0.25px;
}

.topNav a:hover { color: #FFFFFF !important; text-decoration: none; }

/* New Java 17 doclet (.top-nav) — colour only; layout left to standard stylesheet */
.top-nav,
div.top-nav {
    background-color: var(--color-nav-bg) !important;
    border-bottom: none !important;
    background-image: url('bitwards.png') !important;
    background-repeat: no-repeat !important;
    background-position: center 7px !important;
    background-size: auto 26px !important;
}

.top-nav a:hover { color: #FFFFFF !important; }

.subNav {
    background-color: #E8EAED !important;
    border-bottom: 1px solid #DADCE0 !important;
    padding: 4px 24px !important;
    font-size: 12px;
}

.subNav a, .subNav a:visited {
    color: #3C4043 !important;
    text-decoration: none;
}

.subNav a:hover { color: var(--color-link) !important; }

/* Java 17 doclet sub-nav: vertically centred content via flexbox */
.sub-nav {
    display: flex !important;
    align-items: center !important;
    border-bottom: 1px solid #DADCE0 !important;
}

/* Flex items must not float; clear is irrelevant in a flex container */
.sub-nav > div {
    float: none !important;
    clear: none !important;
}

/* #navbar-sub-list contains floated <ul> children; overflow:hidden creates a
   block formatting context so the div gets a real height and flex centering works */
#navbar-sub-list {
    overflow: hidden;
}

/* Push search area to the right end of the bar */
.sub-nav .nav-list-search {
    margin-left: auto !important;
    float: none !important;
}

/* Hide the redundant "SEARCH" link — the input field already has a placeholder */
.sub-nav .nav-list-search > a,
.subNav .navListSearch > a {
    display: none !important;
}

.navList, .navListSearch,
.nav-list, .nav-list-search { list-style: none; margin: 0; padding: 0; display: flex; }
.navList li, .navListSearch li,
.nav-list li, .nav-list-search li { margin: 0; }

/* ── Bottom navigation bar ────────────────────────────────── */
.bottomNav, div.bottomNav,
.bottom-nav, div.bottom-nav {
    background-color: var(--color-nav-bg) !important;
    border-top: 1px solid #3C4043 !important;
    padding: 8px 24px !important;
}

.bottomNav a, .bottomNav a:visited,
.bottom-nav a, .bottom-nav a:visited {
    color: var(--color-nav-text) !important;
    font-size: 12px;
    text-decoration: none;
}

/* ── Content wrapper ──────────────────────────────────────── */
.contentContainer,
div.contentContainer,
main,
.serializedFormContainer,
.constantValuesContainer {
    max-width: 960px;
    margin: 0 auto;
    padding: 32px 48px;
    box-sizing: border-box;
}

/* ── Page / class header ──────────────────────────────────── */
div.header {
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 28px;
    padding-bottom: 16px;
}

div.header .subTitle,
div.header h2 {
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 400;
    color: var(--color-text-muted);
    margin: 0 0 4px 0;
    border: none;
}

div.header h1,
div.header .title {
    font-family: var(--font-sans);
    font-size: 28px;
    font-weight: 400;
    color: var(--color-text);
    margin: 0;
    padding: 0;
    border: none;
}

/* ── Headings inside descriptions ─────────────────────────── */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-sans);
    color: var(--color-text);
    margin-top: 36px;
    margin-bottom: 12px;
    font-weight: 500;
    line-height: 1.3;
}

h1 { font-size: 26px; font-weight: 400; border-bottom: 1px solid var(--color-border); padding-bottom: 10px; }
h2 { font-size: 20px; border-bottom: 1px solid var(--color-border); padding-bottom: 8px; }
h3 { font-size: 16px; color: var(--color-text); }
h4 { font-size: 14px; font-family: var(--font-mono); font-weight: 500; }

/* ── Links ────────────────────────────────────────────────── */
a, a:visited       { color: var(--color-link); text-decoration: none; }
a:hover            { color: var(--color-link-hover); text-decoration: underline; }
a code             { color: var(--color-link); font-size: 0.875em; }

/* ── Inline code ──────────────────────────────────────────── */
code, tt, .memberNameLink code {
    font-family: var(--font-mono);
    font-size: 12.5px;
    background: var(--color-inline-bg);
    color: var(--color-inline-text);
    padding: 1px 5px;
    border-radius: var(--radius);
}

/* ── Code blocks (prettyprint from package-info / class docs) */
pre,
pre.prettyprint {
    font-family: var(--font-mono) !important;
    font-size: 11px !important;
    background: var(--color-code-bg) !important;
    color: var(--color-code-text) !important;
    border: none !important;
    border-radius: var(--radius-lg) !important;
    padding: 10px 24px !important;
    overflow-x: auto;
    line-height: 1.6;
    margin: 10px 0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.20);
}

pre code, pre.prettyprint code {
    background: none !important;
    color: inherit !important;
    padding: 0 !important;
    font-size: inherit !important;
    border-radius: 0 !important;
    /* display: block and negative margins are set in the trim rule above */
}

/* prettyprint token colours (desert skin approximation) */
.pln { color: #ECEFF1; }
.kwd { color: #89DDFF; font-weight: 500; }
.com { color: #546E7A; font-style: italic; }
.typ { color: #80CBC4; }
.lit { color: #F78C6C; }
.str { color: #C3E88D; }
.pun { color: #89DDFF; }
.atn { color: #FFCB6B; }
.atv { color: #C3E88D; }

/* ── "Important" / callout box (custom Bitwards class) ─────── */
div.important {
    background-color: var(--color-warn-bg) !important;
    border-left: 4px solid var(--color-warn-border) !important;
    border-radius: 0 var(--radius) var(--radius) 0 !important;
    padding: 14px 18px !important;
    margin: 20px 0 !important;
    font-size: 13.5px !important;
    line-height: 1.6;
}

div.important p:first-child { margin-top: 0; }
div.important p:last-child  { margin-bottom: 0; }

/* ── "Developer guides" callout card (matches developer.android.com style) ── */
.devguide-callout {
    display: flex !important;
    align-items: flex-start !important;
    gap: 14px !important;
    background: #E8F5E9 !important;      /* Material green-50 */
    border: 1px solid #A5D6A7 !important; /* Material green-200 */
    border-left: 4px solid #1B8463 !important; /* Android teal-green */
    border-radius: 0 var(--radius) var(--radius) 0 !important;
    padding: 16px 20px !important;
    margin: 0 0 28px 0 !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}

/* Article SVG icon */
.devguide-icon {
    flex-shrink: 0 !important;
    margin-top: 1px !important;
    color: #1B8463 !important;
}

.devguide-body {
    min-width: 0 !important;
}

.devguide-body strong {
    display: block !important;
    font-family: var(--font-body) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1B6B4A !important;
    margin-bottom: 4px !important;
}

.devguide-body p {
    margin: 0 !important;
    color: var(--color-text) !important;
}

/* ── Summary tables ───────────────────────────────────────── */
.memberSummary,
.typeSummary,
.overviewSummary,
.constantsSummary,
.deprecatedSummary,
table.summary-table,
table[summary] {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    margin: 20px 0 28px;
    font-size: 13px;
}

/* Table caption / section header row — legacy <caption> format */
.memberSummary caption,
.typeSummary caption,
.overviewSummary caption,
table.summary-table caption,
caption {
    background: var(--color-surface) !important;
    color: var(--color-text) !important;
    font-family: var(--font-sans);
    font-weight: 600;
    font-size: 13px;
    text-align: left;
    padding: 10px 16px;
    border-bottom: 1px solid var(--color-border);
    caption-side: top;
}

/* Java 17 div-based caption — default renders as a floating tab bubble;
   override to a full-width section-header bar matching Android docs. */
.caption {
    padding: 0 !important;
    overflow: visible !important;
    margin: 0 !important;
}

.caption span {
    display: block !important;
    float: none !important;
    width: 100% !important;
    height: auto !important;
    box-sizing: border-box !important;
    padding: 10px 16px !important;
    background: var(--color-surface) !important;
    color: var(--color-text) !important;
    font-family: var(--font-sans) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-bottom: 1px solid var(--color-border) !important;
    border-radius: var(--radius) var(--radius) 0 0 !important;
}

/* Table header cells — legacy <th> format */
th, .memberSummary th, .typeSummary th,
.overviewSummary th, .constantsSummary th {
    background: var(--color-table-head);
    color: var(--color-text);
    font-family: var(--font-sans);
    font-weight: 500;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 8px 16px;
    text-align: left;
    border-bottom: 1px solid var(--color-border);
}

/* Table body cells — legacy <td> format */
td, .memberSummary td, .typeSummary td,
.overviewSummary td, .constantsSummary td {
    padding: 8px 16px;
    border-bottom: 1px solid var(--color-border);
    vertical-align: top;
    line-height: 1.5;
}

/* ── Java 17 div-based summary/details tables ────────────────
 * The Java 17 doclet renders tables as CSS-grid divs, not <table>.
 * .table-header  = column header cell
 * .col-first / .col-second / .col-last = data cells
 */
.table-header {
    font-family: var(--font-sans) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    color: var(--color-text) !important;
    background: var(--color-table-head) !important;
    padding: 8px 16px !important;
    border-bottom: 1px solid var(--color-border) !important;
}

/* Symmetric vertical padding fixes the multi-line "shadow" effect:
   the default stylesheet uses 8px top / 3px bottom which crowds
   wrapped text against the row border below it. */
.summary-table > div,
.details-table > div {
    padding: 8px 16px !important;
    line-height: 1.5 !important;
    border-bottom: 1px solid var(--color-border) !important;
}

/* Outer border on div-based summary/details tables */
.summary-table,
.details-table {
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius) !important;
    overflow: hidden !important;
    margin: 0 0 24px !important;
}


.col-first, .col-second, .col-last,
.col-constructor-name, .col-summary-item-name {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    line-height: 1.5 !important;
}

/* ── Android-style stacked summary tables ─────────────────────
 * Reflows the three-column grid (modifier | name | description)
 * into a two-column layout (modifier | name stacked over description)
 * matching developer.android.com.
 *
 * CSS Grid auto-placement works as follows for each data triplet
 * (col-first spans 2 rows; col-second fills row N col 2;
 *  col-last auto-advances to row N+1 col 2):
 *
 *   col 1          │ col 2
 *   ───────────────┼───────────────────────
 *   modifier/type  │ MethodName(Params)     ← col-second
 *   (span 2 rows)  │ Short description…     ← col-last
 */
.three-column-summary {
    grid-template-columns: minmax(15%, max-content) minmax(55%, auto) !important;
}

/* Drop the redundant "Description" column header */
.three-column-summary .table-header.col-last {
    display: none !important;
}

/* Modifier/type cell spans 2 rows and stretches to fill both,
   so its border-bottom aligns with col-last's border-bottom */
.three-column-summary .col-first:not(.table-header) {
    grid-row: span 2 !important;
    align-self: stretch !important;
}

/* Name row — tight bottom so description sits flush below;
   no border here because col-last's border closes the group */
.three-column-summary .col-second:not(.table-header) {
    padding-bottom: 2px !important;
    border-bottom: none !important;
}

/* Description row — column 2 (overrides the responsive span-2 rule),
   no top gap, slightly smaller and muted */
.three-column-summary .col-last:not(.table-header) {
    grid-column: 2 !important;
    padding-top: 2px !important;
    padding-bottom: 10px !important;
    font-size: 0.88em !important;
    color: var(--color-text-muted) !important;
}

/* Alternating row colours */
tr.altColor, tr.altColor td, .altColor   { background: var(--color-row-alt) !important; }
tr.rowColor, tr.rowColor td, .rowColor   { background: var(--color-bg) !important; }
tr:last-child td                          { border-bottom: none; }

/* ── Member detail section headers ────────────────────────── */
ul.blockList ul.blockList li.blockList h3,
ul.blockList ul.blockList li.blockList h4,
section.detail h3,
section.detail h4 {
    font-family: var(--font-mono) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    background: var(--color-accent-bg) !important;
    color: var(--color-text) !important;
    padding: 10px 16px !important;
    margin: 0 !important;
    border-bottom: 1px solid var(--color-border) !important;
    border-radius: var(--radius) var(--radius) 0 0 !important;
}

ul.blockList > li.blockList > ul.blockList > li.blockList,
section.detail {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    margin-bottom: 16px;
    padding: 0;
    overflow: hidden;
}

.memberDetails, section.detail .block {
    padding: 14px 16px;
}

/* ── Inheritance / class hierarchy list ───────────────────── */
ul.inheritance {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    font-family: var(--font-mono);
    font-size: 13px;
    color: var(--color-text-muted);
}

ul.inheritance li {
    padding-left: 24px;
    position: relative;
}

ul.inheritance li::before {
    content: '↳';
    position: absolute;
    left: 4px;
    color: var(--color-border);
}

ul.inheritance > li:first-child { padding-left: 0; }
ul.inheritance > li:first-child::before { display: none; }

/* ── All implemented interfaces / subclasses ──────────────── */
.description dl dt {
    font-family: var(--font-sans);
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--color-text-muted);
    margin-top: 12px;
}

.description dl dd {
    margin-left: 0;
    font-size: 13px;
}

/* ── Tag sections (Parameters, Returns, Throws, Since…) ────── */
dl, dt, dd { margin: 0; padding: 0; }

.paramLabel, .returnLabel, .throwsLabel,
span.paramLabel, span.returnLabel, span.throwsLabel {
    font-family: var(--font-sans);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--color-text-muted);
    display: block;
    margin-top: 12px;
    margin-bottom: 4px;
}

.block { margin: 12px 0; font-size: 14px; }

/* ── Horizontal rules ─────────────────────────────────────── */
hr {
    border: none;
    border-top: 1px solid var(--color-border);
    margin: 28px 0;
}

/* ── Lists inside descriptions ────────────────────────────── */
.description ul, .description ol,
.block ul, .block ol {
    padding-left: 24px;
    margin: 8px 0;
}

.description li, .block li { margin: 5px 0; }

/* ── Table of contents (in package-info / class docs) ─────── */
ul > li > a[href^="#"] {
    color: var(--color-link);
}

/* ── Deprecation block ────────────────────────────────────── */
.deprecationBlock, .deprecationComment {
    background: var(--color-warn-bg);
    border-left: 4px solid var(--color-warn-border);
    border-radius: 0 var(--radius) var(--radius) 0;
    padding: 12px 16px;
    margin: 8px 0;
    font-size: 13px;
}

/* ── Skip-nav / utility ───────────────────────────────────── */
.skipNav { font-size: 0; height: 0; overflow: hidden; }

/* ── Search autocomplete — must float above the "On this page" panel ─ */
ul.ui-autocomplete {
    z-index: 200 !important;
}

/* ── Search box ───────────────────────────────────────────── */
#search, input[type="text"] {
    font-family: var(--font-body);
    font-size: 13px;
    border: 1px solid var(--color-border);
    border-radius: 20px;
    padding: 6px 14px;
    outline: none;
    color: var(--color-text);
}

#search:focus, input[type="text"]:focus {
    border-color: var(--color-link);
    box-shadow: 0 0 0 2px rgba(26,115,232,0.2);
}

/* ── Package overview / index frame ──────────────────────── */
.indexContainer h2 {
    font-size: 14px;
    font-weight: 500;
    border: none;
    color: var(--color-text-muted);
    margin: 16px 0 8px;
}

.indexContainer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.indexContainer li { padding: 3px 0; font-size: 13px; }
.indexContainer a  { color: var(--color-link); }

/* ── "On this page" right-hand TOC panel ─────────────────── */
#on-this-page {
    position: fixed;
    top: 80px;
    right: 0;
    width: 216px;
    max-height: calc(100vh - 96px);
    overflow-y: auto;
    padding: 20px 16px 32px 20px;
    border-left: 1px solid var(--color-border);
    background: var(--color-bg);
    box-sizing: border-box;
    z-index: 100;
}

.otp-title {
    font-family: var(--font-sans);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--color-text-muted);
    margin: 0 0 10px 0;
    padding: 0;
}

.otp-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.otp-item {
    margin: 0;
    line-height: 1.4;
}

.otp-item a {
    display: block;
    padding: 3px 0;
    color: var(--color-text-muted);
    font-family: var(--font-body);
    font-size: 12px;
    text-decoration: none;
    border-left: 2px solid transparent;
    padding-left: 8px;
    transition: color 0.15s, border-color 0.15s;
    white-space: normal;
}

.otp-item a:hover {
    color: var(--color-link);
    text-decoration: none;
}

.otp-item a.otp-active {
    color: var(--color-link);
    border-left-color: var(--color-link);
    font-weight: 500;
}

/* h3 entries are indented one level (Summary sub-items) */
.otp-h3 a {
    padding-left: 20px;
    font-size: 11.5px;
}

/* Individual member entries (fields, constructors, methods) */
.otp-member a {
    padding-left: 20px;
    font-family: var(--font-mono);
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Deprecated members — strikethrough, dimmed */
.otp-deprecated a {
    text-decoration: line-through;
    opacity: 0.55;
}

/* Static badge — small pill shown after the member name */
.otp-badge {
    display: inline-block;
    margin-left: 5px;
    padding: 1px 5px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.4;
    vertical-align: middle;
    letter-spacing: 0.2px;
    pointer-events: none;
}
.otp-badge-static {
    background: #E8F0FE;
    color: #1A73E8;
}

/* Thin rule between description headings and API Reference group */
.otp-separator {
    border-top: 1px solid var(--color-border);
    margin: 10px 0 6px;
    list-style: none;
    padding: 0;
}


/* Push the main content area left so it doesn't hide under the panel */
body.has-otp .contentContainer,
body.has-otp div.contentContainer,
body.has-otp main {
    margin-left: 0;
    margin-right: 232px;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 768px) {
    #on-this-page { display: none; }
    body.has-otp .contentContainer,
    body.has-otp div.contentContainer,
    body.has-otp main { margin-right: 0; }
}

@media (max-width: 768px) {
    .contentContainer, div.contentContainer { padding: 16px 20px; }
    h1 { font-size: 22px; }
    h2 { font-size: 18px; }
    pre, pre.prettyprint { padding: 10px 16px !important; font-size: 10px !important; }
}