/* Pure — webtrees-Theme, 2.3.0. Erlaeuterungen in Notes.md */


/* --- Schrift Inter, selbst gehostet, SIL OFL 1.1 -------------------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("Asset?asset=fonts%2FInter-Regular.woff2") format("woff2");
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("Asset?asset=fonts%2FInter-Bold.woff2") format("woff2");
}


/* --- Grundwerte ---------------------------------------------------- */
:root {
  --bs-body-font-family: "Inter", var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.05;

  --bs-gutter-x: 0.4rem;
  --bs-gutter-y: 0rem;

  --chart-line-radius: 1rem;
  --chart-line: solid gray thin;

  --link-color: black;
  --link-color-hover: #104e8b;
  --link-decoration: none;
  --link-decoration-hover: underline;
}


/* --- Kopfbereich --------------------------------------------------- */
header {
  border-bottom: 1pt solid black;
}


/* --- Ueberschriften ------------------------------------------------ */
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
  letter-spacing: -0.02em;
}

.h1,
h1 {
  font-size: 170%;
}

.h2,
h2 {
  font-size: 160%;
}

.h3,
h3 {
  font-size: 150%;
}

.h4,
h4 {
  font-size: 130%;
}

.h5,
h5 {
  font-size: 120%;
}

.h6,
h6 {
  font-size: 100%;
}


/* --- Fliesstext ---------------------------------------------------- */
p,
[dir] p {
  margin-top: 0.2rem;
  margin-bottom: 0.4rem;
}


/* --- Tabellen ------------------------------------------------------ */
table {
  border-collapse: collapse;
}

tbody {
  vertical-align: top;
}

[dir] tbody,
[dir] td,
[dir] tfoot,
[dir] th,
[dir] thead,
[dir] tr {
  border: inherit;
}

.table,
[dir] .table {
  border: solid var(--bs-table-border-color) thin;
}

th,
[dir] th {
  font-weight: 500;
}

[dir] table:not([cellpadding]) td,
[dir] table:not([cellpadding]) th {
  padding: 0.2rem 0.4rem;
}


/* --- Karten -------------------------------------------------------- */
.card {
  --bs-card-border-color: black;
  --bs-card-spacer-y: 0.1rem;
  --bs-card-spacer-x: 0.25rem;
  --bs-card-cap-padding-x: calc(var(--bs-gutter-x) * 0.5);
  --bs-card-cap-padding-y: calc(var(--bs-gutter-y) * 0.5);
}

.card-header {
  font-weight: 500;
}

[dir] .card-header {
  padding: var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);
}


/* --- Form ---------------------------------------------------------- */
.form-control,
[dir] .form-control {
  padding: .2rem .4rem;
}


/* --- Raster -------------------------------------------------------- */
.row {
  --bs-gutter-x: 0.4rem;
  --bs-gutter-y: 0rem;
}


/* --- Akkordeon ----------------------------------------------------- */
.accordion {
  --bs-accordion-btn-padding-x: calc(var(--bs-gutter-x) * 0.5);
  --bs-accordion-btn-padding-y: 0.25rem;
}

[dir] .accordion-button,
[dir] .accordion-body {
  padding: var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);
}


/* --- DataTables 2 -------------------------------------------------- */
[dir] div.dt-container div.dt-layout-full> :only-child {
  margin: inherit;
}


/* --- webtrees-eigene Bausteine ------------------------------------- */
.wt-table-surname {
  width: auto;
}

.wt-facts-table {
  width: 100%;
}

[dir] .wt-facts-table th,
[dir] .wt-facts-table td {
  padding: var(--bs-gutter-x) 0.1rem;
}

[dir] .wt-facts-table th {
  width: 30%;
}

.wt-chart-box {
  line-height: 1.02;
}

[dir] .wt-header-wrapper {
  background: none;
}

.wt-site-title {
  order: 4;
  flex: 0 0 calc(100%);
  font-size: x-large;
  font-weight: bold;
  color: black;
  margin-bottom: .1rem !important;
}

.wt-header-search {
  order: 3;
  align-items: flex-end;
}

.wt-secondary-navigation {
  order: 2;
  flex-grow: 1;
  flex-direction: column;
  flex-wrap: wrap-reverse;
}

[dir] .wt-user-menu{
  margin-left: -0.5rem;
}

[dir] .wt-user-menu .nav-link {
    padding: .25rem .5rem;
}

.wt-page-title {
  font-weight: 650;
}

[dir] .wt-main-container{
  padding: 0.5rem 0.75 rem;
}

.wt-main-blocks,
.wt-side-blocks {
  --bs-gutter-y: 0.4rem;
}

[dir] .wt-block {
  margin-bottom: var(--bs-gutter-y) !important;
}

.wt-footers {
  font-size: calc(var(--bs-body-font-size) * 0.8);
  padding-bottom: 0.25rem;
}

[dir] .my-2 {
  margin-bottom: .2rem !important;
  margin-top: .2rem !important;
}


/* --- Schaltflaechen ------------------------------------------------ */
.btn {
  --bs-btn-padding-x: 0.2rem;
  --bs-btn-padding-y: var(--bs-btn-padding-x);
  --bs-btn-font-size: var(--bs-body-font-size);
  --bs-btn-font-weight: var(--bs-body-font-weight);
  --bs-btn-line-height: var(--bs-body-line-height);
}


/* --- Karten (Leaflet) ---------------------------------------------- */
[dir] .leaflet-bottom .leaflet-control-scale {
  margin-bottom: 1.25rem;
}

.leaflet-container {
  margin-bottom: 0.5rem;
}


/* --- Drittanbieter-Tabelle, modules/privacy-policy/page.phtml ------- */
.wt-external-endpoints a {
  color: var(--link-color-hover);
}


/* --- Statistikblock, modules/gedcom-stats/statistics.phtml ---------- */
@media (min-width: 576px) {
  .wt-block-content-gedcom_stats .row > .col:first-child {
    flex: 0 0 auto;
    width: auto;
  }
}

.wt-block-content-gedcom_stats .row > .col:first-child .wt-facts-table {
  width: auto;
}

.wt-block-content-gedcom_stats .row > .col:first-child .wt-facts-table td {
  text-align: end;
  width: 1%;
}


/* --- Nachnamenliste, lists/surnames-table.phtml --------------------- */
.wt-table-surname td.text-center {
  text-align: end !important;
}


/* --- Nachrichtenblock, modules/user-messages/user-messages.phtml ---- */
.wt-block-content-user_messages table {
  table-layout: fixed;
}

.wt-block-content-user_messages th:nth-child(1) {
  width: 10%;
}

.wt-block-content-user_messages th:nth-child(2) {
  width: 45%;
}

.wt-block-content-user_messages th:nth-child(3) {
  width: 20%;
}

.wt-block-content-user_messages th:nth-child(4) {
  width: 25%;
}

.wt-block-content-user_messages td:nth-child(4) {
  overflow-wrap: anywhere;
}