:root {
    --sex-f-bg: #e9daf1;
    --sex-f-fg: #ff2080;
    --sex-m-bg: #edf7fd;
    --sex-m-fg: #81a9cb;
}

.bt-sex-f { background-color: var(--sex-f-bg); }
.bt-sex-m { background-color: var(--sex-m-bg); }
.citation { white-space: nowrap; text-decoration: none; }
.citation img { vertical-align: -2px; }
.site-nav .navbar-brand { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; color: #205c47; }
.site-brand-column { flex: 0 0 auto; min-width: 0; max-width: calc(100% - 64px); margin-inline-end: 1rem; }
.site-nav .navbar-brand { margin-inline-end: 0; font-size: 1.1rem; }
.site-brand-tools { margin-top: .1rem; padding-inline-start: 48px; }
.site-nav-language { display: flex; flex: 0 0 auto; gap: .2rem; margin-inline-start: .35rem; padding-inline-start: .35rem; border-inline-start: 1px solid #c9d4ce; }
.language-flag { display: inline-flex; align-items: center; justify-content: center; padding: .25rem; border: 1px solid transparent; border-radius: .3rem; background: transparent; }
.language-flag img { display: block; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.12); }
.language-flag:hover { background: #eaf3ee; }
.language-flag.is-active { border-color: #99bda6; background: #eaf3ee; }
.language-flag:focus-visible { outline: 2px solid #5b9177; outline-offset: 2px; }
.site-nav-search { display: flex; gap: .25rem; flex: 0 1 170px; min-width: 130px; margin-inline: .2rem; }
.site-nav-search .form-control { min-width: 0; font-size: .8rem; }
.site-nav-search .btn { padding-inline: .5rem; background: #205c47; border-color: #205c47; }
.site-nav-search .btn:hover { background: #184936; border-color: #184936; }
.site-nav-profile { margin-inline: .25rem; }
.brand-mark { flex-shrink: 0; }
.site-nav .nav-link { white-space: nowrap; }
.site-nav .nav-link.active { color: #205c47; font-weight: 600; }
.site-nav .navbar-collapse { flex-wrap: wrap; row-gap: .65rem; }
.site-nav .nav-item + .nav-item { border-top: 1px solid #c9d4ce; }
@media (min-width: 1400px) {
    .site-nav .navbar-collapse, .site-nav .navbar-nav { flex-wrap: nowrap; }
    .site-nav .navbar-collapse { min-width: 0; gap: .15rem; }
    .site-nav .navbar-nav { align-items: center; }
    .site-nav .navbar-nav .nav-link { font-size: .875rem; padding-inline: .45rem; }
    .site-nav .nav-item + .nav-item { border-top: 0; }
    .site-nav .nav-item + .nav-item .nav-link { border-inline-start: 1px solid #acbdb3; }
    .site-nav .nav-link { margin-block: .4rem; padding-block: .15rem; padding-inline: .6rem; }
}
@media (max-width: 575px) {
    .site-nav .navbar-brand { font-size: .95rem; }
    .site-nav .brand-mark { width: 32px; height: 32px; }
    .site-brand-tools { padding-inline-start: 40px; }
}
@media (max-width: 1399px) {
    .site-nav-search { max-width: 420px; margin: .75rem 0; }
}
@media (min-width: 1400px) and (max-width: 1599px) {
    .site-nav .navbar-brand { font-size: 1rem; }
    .site-nav .navbar-nav .nav-link { font-size: .8rem; padding-inline: .3rem; }
    .site-nav-search { flex-basis: 145px; }
    .site-nav-profile { margin-inline: .25rem; }
}
.site-nav .navbar-nav .nav-item .nav-link-support { color: #205c47; background: #eaf3ee; border: 1px solid #c5dbcd; border-radius: .45rem; padding: .2rem .7rem; margin-inline: .35rem; font-weight: 600; }
.site-nav .navbar-nav .nav-item .nav-link-support:hover { background: #dcece2; border-color: #99bda6; }
.site-nav .navbar-nav .nav-item .nav-link-support.active { background: #dcece2; border-color: #99bda6; }
.report-action { color: #875039; background: #fff5ef; border: 1px solid #e6c9b9; font-weight: 500; }
.report-action:hover { color: #713d27; background: #ffece1; border-color: #c99c82; }
.report-action:focus-visible, .site-nav .nav-link-support:focus-visible { outline: 3px solid #5b9177; outline-offset: 3px; box-shadow: none; }
@media (min-width: 1400px) {
    .site-nav .nav-item-support { position: relative; margin-inline-start: .35rem; padding-inline-start: .45rem; }
    .site-nav .nav-item-support::before { content: ""; position: absolute; inset-inline-start: 0; top: 50%; transform: translateY(-50%); height: 1.4rem; border-inline-start: 1px solid #acbdb3; }
}
.bible-search-results > li { display: flex; gap: .75rem; padding: 1rem; }
.bible-hit-number { min-width: 1.5rem; padding-top: .2rem; }
.bible-search-results article { min-width: 0; overflow-wrap: anywhere; }
.bible-search-results p { line-height: 1.7; }
.bible-search-results mark { background: #fff0ae; color: inherit; border-radius: .2rem; padding: .05em .12em; }
.page-path-tools { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: .25rem 1rem; }
.page-path-tools > nav { min-width: 0; }
.page-path-tools > a { flex-shrink: 0; }

.reader-text .verse { line-height: 1.7; margin-bottom: .35rem; }
.study-shell { max-width: 1520px; margin-inline: auto; }
.study-page-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .75rem 1.5rem; margin-block: .75rem 1.5rem; }
.study-version-label { display: inline-block; font-size: .8rem; color: #52675c; padding: .3rem .6rem; border: 1px solid #d7e4dc; border-radius: .4rem; vertical-align: middle; }
.study-page-links { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .9rem; }
.study-page-links a { color: #205c47; text-decoration: none; padding-bottom: .2rem; border-bottom: 1px solid #bfd1c5; }
.study-control-panel, .study-testament-panel { padding: 1.25rem; background: #fafcfb; border: 1px solid #dce5df; border-radius: .65rem; }
.reader-navigation-grid { display: grid; grid-template-columns: minmax(140px, 1.2fr) 80px minmax(180px, 1.5fr) minmax(180px, 1.5fr) auto; gap: .85rem; }
.reader-navigation-grid .form-label { font-size: .8rem; margin-bottom: .35rem; color: #52675c; }
.study-tools { border-top: 1px solid #dce5df; padding-top: .8rem; }
.study-tools > summary, .study-resources > summary { cursor: pointer; color: #205c47; font-size: .9rem; font-weight: 600; }
.study-tool-options { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; }
.study-resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.study-resource-grid a { display: flex; flex-direction: column; gap: .35rem; padding: 1rem; border: 1px solid #dce5df; border-radius: .5rem; color: #205c47; text-decoration: none; }
.study-resource-grid a:hover { background: #f0f6f2; border-color: #aec9b8; }
.study-resource-grid a > span + span { color: var(--bs-secondary-color); font-size: .85rem; }
.study-book-link { display: flex; gap: .5rem; justify-content: space-between; padding: .3rem .45rem; border-radius: .3rem; color: #264a39; text-decoration: none; }
.study-book-link:hover, .study-book-link:focus-visible { background: #eaf3ee; }
@media (max-width: 991px) {
    .reader-navigation-grid { grid-template-columns: minmax(0, 1fr) 80px auto; }
    .reader-navigation-grid .reader-version-control { grid-column: span 3; }
    .reader-navigation-grid .btn-group { grid-column: 3; grid-row: 1; }
    .study-resource-grid { grid-template-columns: 1fr; }
}
.reader-text .verse-links { display: inline; margin-left: .25rem; }
.reader-text .verse-links .badge { font-weight: 500; }
.reader-comparison-row, .bible-comparison-result { border-radius: .4rem; transition: background-color 120ms ease; }
.reader-comparison-row:hover, .reader-comparison-row:focus-within,
.bible-comparison-result:hover, .bible-comparison-result:focus-within { background-color: rgba(var(--bs-success-rgb, 25, 135, 84), .075); }
@media (prefers-reduced-motion: reduce) {
    .reader-comparison-row, .bible-comparison-result { transition: none; }
}
.original-words { display: flex; flex-wrap: wrap; gap: .35rem; padding: .6rem; background: var(--bs-tertiary-bg); border-radius: .4rem; align-items: stretch; }
.original-word { display: flex; flex-direction: column; justify-content: space-between; text-align: center; text-decoration: none; color: inherit; padding: .3rem .5rem; border: 1px solid var(--bs-border-color); border-radius: .3rem; background: var(--bs-body-bg); max-width: 16rem; }
.original-word:hover, .original-word:focus-visible { border-color: var(--bs-primary); background: var(--bs-primary-bg-subtle); }
.original-glyph { font-family: "SBL Hebrew", "SBL Greek", "Noto Serif Hebrew", "Times New Roman", serif; font-size: 1.45rem; line-height: 1.6; }
.original-gloss { font-size: .8rem; line-height: 1.4; }
.original-strong { font-size: .7rem; color: var(--bs-secondary-color); margin-top: .2rem; overflow-wrap: anywhere; }
.original-variant { border-style: dashed; }
.verse-highlight { background: #fff3cd; border-radius: 4px; }
.reader-text .verse[data-verse] { cursor: pointer; }
.reader-verse-number { border: 0; background: transparent; padding: .1rem .2rem; color: inherit; font: inherit; border-radius: .2rem; }
.reader-verse-number:hover, .reader-verse-number:focus-visible { background: var(--bs-success-bg-subtle, #d1e7dd); outline: 1px solid var(--bs-success, #198754); }
.reader-verse-number[aria-pressed="true"] { color: var(--bs-success, #198754); font-weight: 700; }
.reader-text [data-verse-row].verse-selected { background: #e7f2ea; border-radius: .3rem; box-shadow: inset 3px 0 #438b5a; }
.reader-selection-bar { position: sticky; top: .5rem; z-index: 5; }
.reader-share-url { flex: 1 1 16rem; min-width: 0; }
.reader-selection-bar [hidden] { display: none !important; }
.reader-text [hidden] { display: none !important; }
.article p { margin-bottom: .6rem; }
.tree-tooltip { position: absolute; background: #fff; border: 1px solid #ccc; border-radius: 6px; padding: 6px 10px; font-size: 12px; pointer-events: none; box-shadow: 0 2px 8px rgba(0,0,0,.1); z-index: 5; }
.vis-item.tl-person { background-color: #edf7fd; border-color: #81a9cb; }
.vis-item.tl-person.tl-f { background-color: #e9daf1; border-color: #c08ad8; }
.vis-item.tl-event { background-color: #fff3cd; border-color: #e0a800; }
.vis-item.tl-period { background-color: #e2e3e5; border-color: #6c757d; }
.vis-item.tl-office { background-color: #d1e7dd; border-color: #198754; }
.vis-item.tl-estimated { border-style: dashed; opacity: .75; }
.vis-item .vis-item-content { font-size: 12px; }
.entity-list-controls input[type="search"] { flex: 1 1 160px; width: auto; }
.entity-sort-heading a { display: inline-flex; align-items: center; gap: .5rem; color: inherit; text-decoration: none; white-space: nowrap; }
.entity-sort-heading a span { color: var(--bs-secondary-color); font-size: .9em; }
.entity-sort-heading.is-sorted { --bs-table-bg: rgba(25, 135, 84, .08); }
.entity-sort-heading.is-sorted a { color: var(--bs-success-text-emphasis); }
.entity-sort-heading a:hover, .entity-sort-heading a:focus-visible { text-decoration: underline; }
