/* Opmaak van inhoud uit de Quill-editor op de publieke site */
.rich{overflow-wrap:break-word}
.rich>*:last-child{margin-bottom:0}
.rich p{margin:0 0 1em}
.rich.muted p,.rich.muted li{color:var(--muted)}
.rich.lead p{font-size:1.2rem;color:var(--muted)}
.rich h1,.rich h2,.rich h3,.rich h4{margin:1.4em 0 .5em}
.rich>h1:first-child,.rich>h2:first-child,.rich>h3:first-child{margin-top:0}
.rich h3{font-size:1.3rem;color:var(--primary-dark)}
.rich a{font-weight:700}
.rich img{max-width:100%;height:auto;border-radius:10px;display:inline-block;vertical-align:middle}
.rich blockquote{margin:1.5em 0;padding:14px 22px;border-left:4px solid var(--accent);background:var(--soft);border-radius:0 10px 10px 0;font-style:italic}
.rich pre,.rich .ql-code-block-container{background:#0d2235;color:#e3edf6;padding:16px 20px;border-radius:10px;overflow:auto;font-family:ui-monospace,Consolas,monospace;font-size:.9rem;margin:0 0 1em;white-space:pre-wrap}
.rich code{background:var(--soft);padding:2px 6px;border-radius:4px;font-size:.92em}
.rich pre code{background:none;padding:0}
.rich hr{border:0;border-top:1px solid var(--line);margin:2em 0}

/* Lijsten (Quill 2 zet alle lijsten in <ol> met data-list) */
.rich ol,.rich ul{list-style:none;padding:0;margin:0 0 1.2em;counter-reset:ql}
.rich li{position:relative;padding-left:34px;margin:10px 0}
.rich li>.ql-ui{display:none}
.rich li[data-list=bullet]::before,.rich ul>li:not([data-list])::before{content:"";position:absolute;left:0;top:4px;width:22px;height:22px;border-radius:50%;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/14px no-repeat}
.rich li[data-list=ordered],.rich ol>li:not([data-list]){counter-increment:ql}
.rich li[data-list=ordered]::before,.rich ol>li:not([data-list])::before{content:counter(ql);position:absolute;left:0;top:2px;width:24px;height:24px;border-radius:50%;background:var(--primary);color:#fff;font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center}
.rich li[data-list=checked]::before,.rich li[data-list=unchecked]::before{position:absolute;left:2px;top:0;font-size:1.1rem;color:var(--primary)}
.rich li[data-list=checked]::before{content:"☑"}
.rich li[data-list=unchecked]::before{content:"☐"}
.rich li[data-list=checked]{text-decoration:line-through;color:var(--muted)}
.rich li.ql-indent-1{margin-left:2em}.rich li.ql-indent-2{margin-left:4em}.rich li.ql-indent-3{margin-left:6em}.rich li.ql-indent-4{margin-left:8em}
.rich p.ql-indent-1{padding-left:2em}.rich p.ql-indent-2{padding-left:4em}.rich p.ql-indent-3{padding-left:6em}.rich p.ql-indent-4{padding-left:8em}

/* Uitlijning, groottes, lettertypes */
.rich .ql-align-center{text-align:center}
.rich .ql-align-right{text-align:right}
.rich .ql-align-justify{text-align:justify}
.rich .ql-size-small{font-size:.8em}
.rich .ql-size-large{font-size:1.4em}
.rich .ql-size-huge{font-size:2.2em;line-height:1.2}
.rich .ql-font-serif{font-family:Georgia,"Times New Roman",serif}
.rich .ql-font-monospace{font-family:ui-monospace,Consolas,monospace}
.rich .ql-direction-rtl{direction:rtl;text-align:inherit}

/* Video's */
.rich iframe.ql-video,.rich iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:10px;display:block;margin:0 0 1em}

/* Tabellen */
.rich table{width:100%;border-collapse:collapse;margin:0 0 1.2em;font-size:.95rem}
.rich td,.rich th{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.rich tr:nth-child(odd) td{background:var(--soft)}

/* Beheerbalk voor ingelogde gebruikers */
.admin-bar{background:#111;color:#fff;font-size:.85rem;display:flex;gap:18px;padding:6px 20px}
.admin-bar a{color:#fff;text-decoration:none;font-weight:700}
.admin-bar a:hover{color:var(--accent)}

.split-inner.no-img{grid-template-columns:1fr;max-width:820px}
.panel-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:start}
.panel-grid.no-img{grid-template-columns:1fr}
.panel-grid img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;aspect-ratio:4/3;object-fit:cover}
.empty-note{background:var(--soft);padding:20px 24px;border-radius:var(--radius)}
@media (max-width:860px){.panel-grid{grid-template-columns:1fr}}
[hidden]{display:none !important}
