/* ==========================================================================
   Logo
   ========================================================================== */
#logo {
  font-family: 'Palitura', sans-serif;
  font-size: 1.25rem;
}

#geomancy {
  font-weight: 500;
}

#tools {
  font-weight: 400;
}

/* ==========================================================================
   Navbar
   ========================================================================== */
.btn {
  --bs-btn-border-radius: var(--bs-border-radius-sm);
}

.navbar .vr {
  height: 2rem;
}

.dropdown-menu .dropdown-item.active .theme-check {
  display: inline-block !important;
}

#themeDropdown + .dropdown-menu {
  width: 8rem;
  min-width: 8rem;
  max-width: 8rem;
}

.navbar .dropdown-menu {
  --bs-dropdown-padding-x: .25rem;
  --bs-dropdown-padding-y: .25rem;
  --bs-dropdown-border-radius: var(--bs-border-radius-sm);
}

.navbar .dropdown-menu .dropdown-item {
    border-radius: var(--bs-border-radius-sm);
}

/* ==========================================================================
   Forms
   ========================================================================== */
.form-select {
  --bs-form-select-border-radius: var(--bs-border-radius-sm);
}

/* ==========================================================================
   Base typography & layout
   ========================================================================== */
body {
  font-family: 'IBM Plex Sans', sans-serif;
  -webkit-font-feature-settings: "liga" on, "calt" on !important;
  -moz-font-feature-settings: "liga" on, "calt" on !important;
  font-feature-settings: "liga" on, "calt" on !important;
  padding-top: 33px;
}

#questionHeader {
  font-family: 'Palitura', sans-serif !important;
  font-weight: 300;
  padding-bottom: 8px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Palitura', sans-serif !important;
  font-weight: 400 !important;
}

h5.modal-title {
  font-weight: 500 !important;
}

.icon {
  font-family: 'Linotype Astrology Pi One', sans-serif !important;
  font-weight: normal;
}

/* ==========================================================================
   Nav pills / tabs
   ========================================================================== */
.nav-pills .nav-link {
  border: none;
  --bs-nav-pills-border-radius: var(--bs-border-radius-sm);
  padding: .5rem 1rem;
  font-weight: 500;
}

.tab-content {
  margin-bottom: 4rem !important;
}

/* ==========================================================================
   Container
   ========================================================================== */
.container-fluid {
  max-width: 1140px;
  min-width: 380px !important;
}

/* ==========================================================================
   Modal
   ========================================================================== */
.modal-backdrop,
.modal-backdrop.show {
  inset: 0 !important;
  width: 100dvw !important;
  height: 100dvh !important;
  margin: 0 !important;
}

/* ==========================================================================
   TOC list
   ========================================================================== */
.toc-list {
  list-style: none;
  padding: 0;
  max-width: 100%;
}

.toc-list-last {
  margin-bottom: 0 !important;
}

.toc-list li {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  gap: 0.4ch 0.8ch;
  margin: 0.3em 0;
}

.title {
  white-space: nowrap;
}

.dots {
  padding-bottom: 0.15em;
}

/* ==========================================================================
   Numeric alignment helpers
   ========================================================================== */
#vita,
#lucrum,
#fratres,
#genitor,
#nati,
#valetudo,
#uxor,
#mors,
#itineris,
#regnum,
#benefacta,
#carcer,
#rw,
#lw,
#judge,
#reconciler,
#sum,
#triplicity1,
#triplicity2,
#triplicity3,
#triplicity4,
#pof,
#pos,
#querent,
#quesited,
#reception,
#benefaction,
#besiegement,
#fortuna-major,
#affliction {
  min-width: 2.5ch;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.last {
  margin-block-end: 0 !important;
}

/* ==========================================================================
   Reconciler
   ========================================================================== */
.reconciler {
  border-radius: var(--bs-border-radius-lg)
}

/* ==========================================================================
   House chart
   ========================================================================== */
.houseChart {
  padding-bottom: calc(100% - 2px);
  position: relative;
  overflow: hidden !important;
  border-radius: var(--bs-border-radius-lg)
}

.outerRotation {
  position: absolute;
  transform: rotate(45deg);
  width: calc(142% + -4px);
  left: calc(-21% + 2px);
  top: calc(-21% + 1px);
  overflow: hidden !important;
}

.houseChart .col {
  padding-top: calc(25% - 1px);
  position: relative;
  cursor: default !important;
}

/* ==========================================================================
   Figure
   ========================================================================== */
.shieldChart,
.houseChart .col.dl .figure,
.houseChart .col.ur .figure,
.houseChart .col.ul .figure,
.houseChart .col.dr .figure {
  user-select: none;
  cursor: default;
}

/* ==========================================================================
   Shield chart container
   ========================================================================== */
#shieldChartContainer {
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
}

/* ==========================================================================
   Shield chart corner rounding
   ========================================================================== */
.shieldChart .row:first-child .col:first-child {
  border-top-left-radius: var(--bs-border-radius-lg);
}

.shieldChart .row:last-child .col:first-child {
  border-bottom-left-radius: var(--bs-border-radius-lg);
}

.shieldChart .row:first-child .col:last-child {
  border-top-right-radius: var(--bs-border-radius-lg);
}

.shieldChart .row:last-child .col:last-child {
  border-bottom-right-radius: var(--bs-border-radius-lg);
}
