/* Page-owned styles for /confidentialite/ */

.page-confidentialite {
    --confidentialite-max-copy: 70ch;
    --confidentialite-section-space: var(--space-8);
    --confidentialite-card-gap: var(--space-5);
    --confidentialite-card-padding: var(--space-5);
    --confidentialite-border: 1px solid var(--color-border);
    --confidentialite-border-accent: 1px solid var(--color-border-accent);
    --confidentialite-radius: var(--radius-large);
    --confidentialite-radius-small: var(--radius-small);
    --confidentialite-transition: var(--transition-fast);
}

.confidentialite-container {
    width: 100%;
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--container-padding);
}

.confidentialite-section {
    padding-block: var(--confidentialite-section-space);
}

.confidentialite-section--alt {
    background-color: color-mix(in srgb, var(--color-vert-sauge) 6%, var(--color-creme));
}

.confidentialite-section__title {
    margin-block-end: var(--space-6);
    text-align: left;
}

/* Introduction */
.confidentialite-intro__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-6);
    text-align: center;
}

.confidentialite-intro__title {
    text-align: center;
    margin-block-end: var(--space-4);
}

.confidentialite-intro__content {
    width: 100%;
    max-width: var(--confidentialite-max-copy);
    margin-inline: auto;
    text-align: left;
}

.confidentialite-intro__subtitle {
    text-align: left;
    margin-block-end: var(--space-3);
}

.confidentialite-contact-card {
    width: 100%;
    max-width: 800px;
    margin-inline: auto;
    background-color: var(--color-surface);
    border: var(--confidentialite-border);
    border-radius: var(--confidentialite-radius);
    padding: var(--confidentialite-card-padding);
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-contact-card__title {
    margin-block-end: var(--space-2);
}

.confidentialite-contact-card__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-contact-card__list li {
    margin-block-end: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
}

.confidentialite-contact-card__label {
    font-weight: 600;
    min-width: 6rem;
}

.confidentialite-contact-card a {
    color: var(--color-primary);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

.confidentialite-contact-card a:hover,
.confidentialite-contact-card a:focus-visible {
    color: var(--color-primary-hover);
    text-decoration-color: var(--color-primary-hover);
}

/* Copy blocks */
.confidentialite-copy {
    max-width: var(--confidentialite-max-copy);
}

.confidentialite-copy--left {
    margin-inline: auto;
    text-align: left;
}

.confidentialite-list {
    list-style: disc;
    padding-inline-start: var(--space-5);
    margin-block-end: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-list li {
    margin-block-end: 0;
    line-height: var(--text-body-line-height);
}

.confidentialite-list--compact {
    gap: var(--space-1);
}

.confidentialite-note {
    font-size: var(--text-caption-size);
    line-height: var(--text-caption-line-height);
    color: var(--color-text-muted);
    margin-block-start: var(--space-3);
    padding: var(--space-2) var(--space-3);
    background-color: color-mix(in srgb, var(--color-vert-sauge) 10%, transparent);
    border-radius: var(--confidentialite-radius-small);
}

.confidentialite-note--accent {
    color: var(--color-accent);
    background-color: color-mix(in srgb, var(--color-rouge-cerise) 8%, transparent);
    font-weight: 600;
}

/* Collected data grid */
.confidentialite-collect-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--confidentialite-card-gap);
}

.confidentialite-collect-card {
    min-width: 0;
    background-color: var(--color-surface);
    border: var(--confidentialite-border);
    border-radius: var(--confidentialite-radius);
    padding: var(--confidentialite-card-padding);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-collect-card__title {
    margin-block-end: 0;
}

.confidentialite-collect-card p,
.confidentialite-collect-card ul {
    margin-block-end: 0;
}

/* Use grid */
.confidentialite-use-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--confidentialite-card-gap);
}

.confidentialite-use-card {
    min-width: 0;
    background-color: var(--color-surface);
    border: var(--confidentialite-border);
    border-radius: var(--confidentialite-radius);
    padding: var(--confidentialite-card-padding);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-use-card__title {
    margin-block-end: 0;
}

.confidentialite-use-card p,
.confidentialite-use-card ul {
    margin-block-end: 0;
}

/* Share section */
.confidentialite-share-content {
    max-width: var(--confidentialite-max-copy);
    margin-inline: 0;
    text-align: left;
    margin-block-end: var(--space-6);
}

.confidentialite-share-content__title {
    margin-block-end: var(--space-3);
}

.confidentialite-commitment {
    max-width: var(--confidentialite-max-copy);
    margin-inline: 0;
    background-color: color-mix(in srgb, var(--color-rouge-cerise) 6%, var(--color-creme));
    border: 1px solid var(--color-border-accent);
    border-radius: var(--confidentialite-radius);
    padding: var(--confidentialite-card-padding);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-commitment__title {
    margin-block-end: 0;
    color: var(--color-accent);
}

.confidentialite-commitment p {
    margin-block-end: 0;
}

/* Retention table */
.confidentialite-retention {
    max-width: var(--confidentialite-max-copy);
    margin-inline: 0;
    text-align: left;
}

.confidentialite-retention p {
    margin-block-end: var(--space-4);
}

.confidentialite-table {
    width: 100%;
    margin-block-end: 0;
    border-collapse: collapse;
}

.confidentialite-table th,
.confidentialite-table td {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    border-block-end: 1px solid var(--color-border);
    vertical-align: top;
}

.confidentialite-table th {
    font-weight: 600;
    background-color: color-mix(in srgb, var(--color-vert-sauge) 10%, transparent);
}

/* Rights section */
.confidentialite-rights-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--confidentialite-card-gap);
}

.confidentialite-rights-list,
.confidentialite-rights-details {
    min-width: 0;
    background-color: var(--color-surface);
    border: var(--confidentialite-border);
    border-radius: var(--confidentialite-radius);
    padding: var(--confidentialite-card-padding);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-rights-list__title,
.confidentialite-rights-details__title {
    margin-block-end: 0;
}

.confidentialite-rights-list p,
.confidentialite-rights-list ul,
.confidentialite-rights-details p {
    margin-block-end: 0;
}

/* Security section */
.confidentialite-security {
    max-width: var(--confidentialite-max-copy);
    margin-inline: 0;
    text-align: left;
}

.confidentialite-security p {
    margin-block-end: var(--space-4);
}

.confidentialite-security .confidentialite-note {
    margin-block-start: var(--space-4);
}

/* Updates section */
.confidentialite-updates {
    max-width: var(--confidentialite-max-copy);
    margin-inline: 0;
    text-align: left;
}

.confidentialite-updates p {
    margin-block-end: var(--space-4);
}

.confidentialite-updates__date {
    font-weight: 600;
    color: var(--color-primary);
}

/* Tablet breakpoint */
@media (max-width: 64rem) {
    .confidentialite-collect-grid,
    .confidentialite-use-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .confidentialite-rights-grid {
        grid-template-columns: 1fr;
    }

    .confidentialite-intro__container {
        gap: var(--space-5);
    }
}

/* Mobile breakpoint */
@media (max-width: 48rem) {
    .page-confidentialite {
        --confidentialite-section-space: var(--space-6);
        --confidentialite-card-gap: var(--space-4);
        --confidentialite-card-padding: var(--space-4);
    }

    .confidentialite-container {
        padding-inline: var(--container-padding-mobile);
    }

    .confidentialite-intro__container {
        align-items: stretch;
        text-align: left;
    }

    .confidentialite-intro__title {
        text-align: left;
    }

    .confidentialite-intro__content,
    .confidentialite-contact-card {
        max-width: none;
        margin-inline: 0;
    }

    .confidentialite-collect-grid,
    .confidentialite-use-grid {
        grid-template-columns: 1fr;
    }

    .confidentialite-share-content,
    .confidentialite-commitment,
    .confidentialite-retention,
    .confidentialite-security,
    .confidentialite-updates {
        max-width: none;
        margin-inline: 0;
    }

    .confidentialite-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .confidentialite-table th,
    .confidentialite-table td {
        min-width: 10rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .page-confidentialite *,
    .page-confidentialite *::before,
    .page-confidentialite *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}
