:root {
    --container-width: 700px;
}

.nicegui-content {
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
}

.thumb {
    max-width: 150px;
    border-radius: 8px;
}

h1 {
    font-size:4em;
    font-weight:400;
    color:#1d3557;
}

.subtitle {
    font-size:1.5em;
    color: rgba(29, 53, 87, 0.7);
}


h1 .icon {
  height: 1.2em;   /* image ajustée à la taille du texte */
    display: inline;
}

.main-content {
    margin: 1em;
    max-width: var(--container-width);
    margin:auto;
    padding-bottom: 3em;
}

html {
    /**background-color: #e9c46a;*/
}

header {
    overflow: hidden;
    padding: 2em;
    background-color: #dfdfdf;
}

.header {
    flex: 0 0 100%;
    text-align: center !important;
}

.searchbox {
    float:left
}

footer {
    background-color: #dfdfdf;
    margin-top:100px !important;
    padding:5em;
    color:black !important;
    text-align: center;
}

.politician-name {
    font-size: x-large;
    font-weight: bold;
}


.citation {
    margin: 3em;
    padding: 1em;
    font-size:larger;
    background-color: lightyellow;
    border-radius:1em;
}

blockquote {
    font-style: italic;
    color:#222;
}

.realrow {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.realrow img {
    height: auto;
    flex-shrink: 0;
}

.realrow .content {
    flex: 1;
}

.tooltip {
    display: flex;
    gap:0.5em;
    max-width: 30em;
}

.tooltip .photo {
    height: auto;
    flex-shrink: 0;
}

.tooltip .content {
    display:block;
    max-width: 60em;
}


/** CUSTOM ICONS */

.prison-icon::before {
  content: "";
  display: inline-block;
  width: 1em;    /* largeur de l’icône */
  height: 1em;   /* hauteur de l’icône */
  background-image: url('/static/icons/ball-chain.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-right:0.2em;
}

.no-vote::before {
  content: "";
  display: inline-block;
  width: 1em;    /* largeur de l’icône */
  height: 1em;   /* hauteur de l’icône */
  background-image: url('/static/icons/no-vote.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-right:0.2em;
}

.party {
    text-decoration: none !important;
    background-color: lightgrey;
    padding: 0.2em;
    border-radius: 4px;
    color: black;
    margin-right:0.5em;
    max-width: 40em;
}

.sidebar {
    position: fixed;
    left:0px;
    margin:0.5px;
    padding: 1em;
    width: calc(50% - var(--container-width) / 2);
}

.node {
    cursor: pointer
}

.graph-title {
    text-align: center;
    font-size: larger;
    padding-bottom: 1.5em;
}

@media (min-width: 64rem) {
  .small-only {
    display: none;
  }
}

.introduction {
    margin: 1.5em;
    padding: 0.5em;
    border-radius: 10px;
    background-color: lightyellow;
}

.button {
    background-color: dodgerblue;
    border-radius: 2px;
}

header h1 {
    font-size: 28pt;
    line-height: 4rem;
}

.subtitle {
    font-size: 14pt;
}