/* .tooltipster */
.tooltipster-base {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10000001!important;  /* par-dessus les modales */
    width: auto;
    overflow: visible;
}

.tooltipster-base .tooltipster-box {
    background: var(--tt-bg);
    box-shadow: 0 0 16px var(--tt-shadow);
    padding: 3px 6px;
    border-radius: 0;
    font-size: 14px;
    line-height: 1.6em;
}

.tooltipster-base .tooltipster-content { 
    /* pour éviter le pluggin tooltipster-scrollableTip */
    overflow-y: auto;
    overflow-x: hidden;
    max-height: calc(100dvh - 16px);
    -webkit-overflow-scrolling: touch;
}

.tooltipster-fade { opacity: 0; transition: opacity .25s }
.tooltipster-fade.tooltipster-show { opacity: 1 }

/* Sidetip */
.tooltipster-sidetip .tooltipster-arrow { position:absolute; width: 14px; height: 14px; }

/* TOP & BOTTOM */
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow,
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow { left: 50%; transform: translateX(-50%)}
.tooltipster-sidetip.tooltipster-top .tooltipster-arrow { bottom: -14px }
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow { top: -14px }

/* LEFT & RIGHT */
.tooltipster-sidetip.tooltipster-left .tooltipster-arrow,
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow { top: 50%; transform: translateY(-50%) }
.tooltipster-sidetip.tooltipster-left .tooltipster-arrow { right: -14px }
.tooltipster-sidetip.tooltipster-right .tooltipster-arrow { left: -14px }     

/* Triangle */
.tooltipster-sidetip .tooltipster-arrow-background,
.tooltipster-sidetip .tooltipster-arrow-border {
    border: 7px solid transparent;
    position: absolute;
    width: 0;
    height: 0;
}

/* Un seul côté coloré */
.tooltipster-sidetip.tooltipster-top    .tooltipster-arrow-background { border-top-color: var(--tt-bg) }
.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background { border-bottom-color: var(--tt-bg) }
.tooltipster-sidetip.tooltipster-left   .tooltipster-arrow-background { border-left-color: var(--tt-bg) }
.tooltipster-sidetip.tooltipster-right  .tooltipster-arrow-background { border-right-color: var(--tt-bg) }

/* Aperçu des books */
.bkp { width: clamp(250px, 95vw, 403px); padding: 2px 0; font-family: 'Roboto Condensed', sans-serif; font-weight: 400; line-height: 1em }
.bkp-rel { position: relative; margin: 5px 0 }
.bkp-rel .img-o { background: var(--color-tone-5); width:301px }
.bkp-mc { position: absolute; right:0; top:0; background: var(--color-tone-0); z-index:2 }
.bkp-mc .img-o { margin: 0 0 5px 5px; width:97px }
.bkp-txt { margin: 5px 0; background: var(--color-tone-1); padding: 3px 4px; overflow: auto; }
.bkp-title { text-align: center }
.bkp-txt div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.bkp-txt div:first-child { float: left }
.bkp-txt div:last-child { float: right; max-width: 200px }

/* Aperçu des galeries */
.galp { width: clamp(250px, 95vw, 376px); margin: 5px 2px!important;  }
.galp > div { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 8px }
.galp .img-o { flex: 1 1 0; max-width: 120px }
.galp p { margin: 0 }
.galp div + p { margin-top: 0.5em!important }
.galp-desc { font-size: .9em }