.page-défunt {
    padding: 2rem;

    flex-direction: column;
    align-items: stretch;
    justify-content: stretch;
}

.page-défunt .corps {
    display: grid;

    grid-template-columns: 25rem 1fr minmax(auto, 10rem) 8rem;
    grid-template-rows: 13rem 2.6875rem minmax(0, 1fr);
    grid-gap: 1rem;
}

/* positionnement */

.page-défunt .illustration {
    grid-column: 1 / 2;
    grid-row: 1 / 4;
}

.page-défunt .détails {
    grid-column: 2 / 4;
    grid-row: 1 / 2;
}

.page-défunt .récupération {
    grid-column: 3 / 5;
    grid-row: 1 / 2;
}

.page-défunt .onglets {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
}

.page-défunt [data-ref] {
    grid-column: 2 / 3;
    grid-row: 3 / 4;
}

.page-défunt [data-ref="autres-défunts"] {
    grid-column: 2 / 4;
}

/* perso */

.page-défunt .illustration {
    overflow: hidden;
}

.page-défunt .illustration img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.page-défunt .détails {
    margin-right: 1rem;

    display: flex;
    flex-direction: column;

    overflow-y: auto;

    scrollbar-width: thin;
}

.page-défunt .détails > div {
    margin-bottom: 0.5rem;

    display: flex;
    flex-direction: row;

}

.page-défunt .détails dt {
    width: 14rem;
    flex-shrink: 0;
}

.page-défunt .détails dt {
    margin-right: 0.5rem;

    font-weight: bold;
    text-align: right;
}

.page-défunt .détails dt::after {
    content: ' :';
}

.page-défunt .illustration {
    position: sticky;
    top: 0;

    background-color: #E3E3E3;
}

.page-défunt .détails,
.page-défunt .récupération {
    padding-top: 0.5rem;
}

.page-défunt .récupération {
    padding-right: 1.25rem;

    display: flex;
    flex-direction: column;

    align-items: flex-end;
}

.page-défunt .impression span {
    display: none;
}

.page-défunt canvas.qr {
    height: 8rem;
    width: 8rem;

    margin-top: 2rem;
}

.page-défunt .onglets {
    display: flex;
    flex-direction: row;
}

.page-défunt .onglets > button,
.page-défunt .onglets > a {

    border-radius: 4px;

    flex-grow: 2;
    flex-basis: 0;

    overflow: hidden;

    background-color: var(--couleur-thème);
}

.page-défunt .onglets a > button {
    width: 100%;
    height: 100%;
}

.page-défunt .onglets > *:not(:first-child) {
    margin-left: 0.5rem;
}

.page-défunt .onglets button[data-nb]::after {
    content: attr(data-nb);

    height: 1.8rem;
    width: 1.8rem;

    margin-left: 0.5rem;

    border-radius: 50%;

    flex-shrink: 0;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

    background-color: white;
    color: var(--couleur-thème)
}

.page-défunt [data-onglet="emplacement"] [data-ref="emplacement"],
.page-défunt [data-onglet="demande"] [data-ref="demande"],
.page-défunt [data-onglet="autres-défunts"] [data-ref="autres-défunts"] {
    display: flex;

    overflow-y: visible;
}

.page-défunt [data-onglet="emplacement"] [data-cible="emplacement"],
.page-défunt [data-onglet="demande"] [data-cible="demande"],
.page-défunt [data-onglet="autres-défunts"] [data-cible="autres-défunts"] {
    opacity: 0.5;
    pointer-events: none;
}

.page-défunt [data-ref] {
    display: none;
    flex-direction: column;

    min-height: 22rem;

    overflow-y: hidden;
}

.page-défunt [data-ref] > p {
    margin: 1rem 0;

    font-size: 1.25rem;
    font-weight: bold;
}
.page-défunt .carte-emplacement {
    flex-grow: 2;
    width: 100%;
}


.page-défunt .défunts {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(auto, 16.75rem));
    grid-auto-rows: min-content;
    grid-auto-flow: row;

    grid-gap: 0.5rem;

    overflow-y: auto;
}

.page-défunt .bloc-défunt {
    background-color: #E3E3E3;
}

.page-défunt .bloc-défunt .délai {
    display: none;
}

.mort-pour-la-france dd {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.mort-pour-la-france dd img {
    height: 1em;

    margin-right: 0.5rem;
}

@media screen and (min-width: 37.5rem) and (max-width: 80rem) {
    .page-défunt .récupération {
        display: none;
    }
}

@media screen and (max-width: 80rem) {


    .page-défunt .détails,
    .page-défunt .onglets,
    .page-défunt [data-ref] {
        grid-column-end: 5;
    }

    .page-défunt .détails {
        margin-right: 0;
    }
}

@media screen and (max-width: 62.5rem) {
    .page-défunt .corps {
        display: flex;
        flex-direction: column;
    }

    .page-défunt .illustration,
    .page-défunt .détails {
        flex-shrink: 0;
    }

    .page-défunt .illustration {
        position: static;

        height: 39rem;
    }

    .page-défunt .onglets {
        height: 2.6875rem;
    }

}

@media screen and (max-height: 48.128rem), (max-width: 37.5rem) {
    .page-défunt .onglets {
        height: auto;

        flex-direction: column;
    }

    #corps .page-défunt .onglets > * {
        height: 2.6875rem;

        flex-basis: initial;
    }

    .page-défunt .onglets > :not(:first-child) {
        margin-left: 0;
        margin-top: 0.5rem;
    }

    .page-défunt .carte-emplacement {
        height: 37.5rem;
    }

    .page-défunt .défunts {
        display: flex;
        flex-direction: column;
    }

    .page-défunt .récupération {
        padding: 0;
        padding-top: 1rem;
        align-items: center;
    }

    .page-défunt .récupération .qr {
        display: none;
    }

}

@media screen and (max-width: 33.75rem) {
    .page-défunt h1 > span:first-child {
        display: none;
    }
}
