@layer components {
    /*
     * Mise en page propre aux pages d'informations / pages légales.
     * La typographie du contenu enrichi se trouve dans rich-content.css.
     */
    .content-page__body {
        white-space: normal;
    }

    .content-page__body.rich-content {
        width: 100%;
        padding: clamp(1.5rem, 4vw, 3rem);
    }

    .content-page-admin .dashboard-panel + .dashboard-panel {
        margin-top: 1.25rem;
    }

    .content-page-editor {
        display: grid;
        gap: 1.25rem;
    }

    .content-page-editor__languages {
        display: grid;
        gap: 0.85rem;
    }

    .content-page-editor__language {
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: 16px;
        background: var(--surface-soft);
    }

    .content-page-editor__language[open] {
        background: var(--surface-solid);
    }

    .content-page-editor__language > summary {
        display: flex;
        min-height: 60px;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        padding: 0.9rem 1rem;
        cursor: pointer;
        list-style: none;
    }

    .content-page-editor__language > summary::-webkit-details-marker {
        display: none;
    }

    .content-page-editor__language > summary span:first-child {
        display: grid;
        gap: 0.15rem;
    }

    .content-page-editor__language > summary small {
        color: var(--text-muted);
        font-size: 0.72rem;
    }

    .content-page-editor__language-body {
        display: grid;
        gap: 1rem;
        padding: 1rem;
        border-top: 1px solid var(--border);
    }

    .rich-editor-toolbar {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
        padding: 0.75rem;
        border: 1px solid var(--border);
        border-radius: 14px;
        background: var(--surface-soft);
    }

    .content-page-editor__textarea {
        min-height: 430px;
        resize: vertical;
        line-height: 1.7;
    }

    .content-page-editor__help {
        padding: 0.85rem;
        border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--border));
        border-radius: 13px;
        color: var(--text-soft);
        background: var(--primary-soft);
        font-size: 0.8rem;
    }

    .content-page-editor__settings {
        margin-top: 1.25rem;
        padding: 1rem;
        border: 1px solid var(--border);
        border-radius: 16px;
        background: var(--surface-soft);
    }

    .content-page-editor__settings h3 {
        margin-bottom: 1rem;
    }

    .content-page-image-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1rem;
    }

    .content-page-image-card {
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: 18px;
        background: var(--surface);
        box-shadow: var(--shadow-sm);
    }

    .content-page-image-card > form:last-child {
        padding: 0.9rem;
    }

    .has-rich-editor-overlay {
        overflow: hidden;
    }

    @media (max-width: 850px) {
        .content-page-image-grid {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 620px) {
        .content-page__body.rich-content {
            padding: 1.25rem;
        }

        .rich-editor-toolbar .btn {
            flex: 1 1 calc(50% - 0.5rem);
        }

        .content-page-editor__textarea {
            min-height: 330px;
        }
    }
}