/**
 * `[ck_donnees_collectees]` — l'accordéon du relevé des données personnelles.
 *
 * Parti pris : le bloc DISPARAÎT dans la page. 4.5.190 (Kévin, 02/10) : il HÉRITE DU SITE — chaque texte est
 * un paragraphe `<p>`, il prend donc la taille, la couleur et la graisse que le Design system de CercleKit donne
 * au paragraphe. Le chevron (un trait, pas un triangle) et les lignes sont dessinés par ces paragraphes, en
 * `currentColor` : ils ont la couleur du paragraphe. Le gras reste la seule variation (titre, en-têtes, donnée).
 *
 * @package CercleKit
 */

.ck-dc {
    margin: 1.5em 0;
}

/* Le titre cliquable. Les marques natives de <summary> retirées : c'est notre chevron qui parle. */
.ck-dc__sum {
    display: block;
    cursor: pointer;
    list-style: none;                 /* Firefox */
}
.ck-dc__sum::-webkit-details-marker { display: none; }   /* Safari */

/* Le titre est un paragraphe : la ligne dessous est la sienne (sa couleur). */
.ck-dc .ck-dc__titre {
    display: flex;
    align-items: center;
    gap: .5em;
    margin: 0;
    padding: 0 0 .5em;
    font-weight: 700;
    border-bottom: 1px solid currentColor;
}

/* Le chevron : un trait en SVG, à la taille du texte, qui pivote à l'ouverture. */
.ck-dc__chev {
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    transition: transform .18s ease;
}
.ck-dc[open] .ck-dc__chev { transform: rotate(90deg); }
@media (prefers-reduced-motion: reduce) {
    .ck-dc__chev { transition: none; }
}

.ck-dc__sum:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* Le compteur : juste un nombre, en graisse normale. */
.ck-dc__n {
    font-weight: 400;
}

/* Un tableau ne se plie pas : sur un téléphone il défile dans sa boîte. */
.ck-dc__body {
    padding-top: .8em;
    overflow-x: auto;
}

.ck-dc__t {
    width: 100%;
    border-collapse: collapse;
}
.ck-dc__t th,
.ck-dc__t td {
    text-align: left;
    padding: 0;
    vertical-align: top;
    height: 1px;                      /* l'astuce qui laisse le paragraphe prendre toute la hauteur de la rangée */
}
/* Chaque cellule est un paragraphe : la ligne sous la rangée est la sienne (couleur du paragraphe). */
.ck-dc__t th p,
.ck-dc__t td p {
    box-sizing: border-box;
    height: 100%;                     /* une rangée = une ligne droite, même si une cellule passe sur deux lignes */
    margin: 0;
    padding: .35em 1.2em .35em 0;
    border-bottom: 1px solid currentColor;
}
.ck-dc__t td:last-child p,
.ck-dc__t th:last-child p { padding-right: 0; }

/* Le gras : en-têtes de colonnes et nom de la donnée. */
.ck-dc__t th p,
.ck-dc__d p { font-weight: 700; }

/* Le thème habille les tableaux (bordures grises, une ligne sur deux teintée) : dans ce bloc, seules nos
   lignes, couleur du paragraphe. Sélecteurs plus forts que ceux du thème (`table tbody>tr:nth-child(odd)>td`). */
.ck-dc .ck-dc__t,
.ck-dc .ck-dc__t > * > tr > th,
.ck-dc .ck-dc__t > * > tr > td {
    border: 0;
    background: none;
}