/* === Ubuntu === */
@font-face {
    font-family: 'Ubuntu';
    src: url("/static/assets/fonts/Ubuntu-Regular.2bbbdb8c03d2.ttf") format('truetype');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Ubuntu';
    src: url("/static/assets/fonts/Ubuntu-Bold.896a60219f61.ttf") format('truetype');
    font-weight: 700;
    font-display: swap;
}

/* === Publico Sans === */
@font-face {
    font-family: 'Publico Sans';
    src: url("/static/assets/fonts/PublicSans-Regular.18f93d6b04b3.ttf") format('truetype');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Publico Sans';
    src: url("/static/assets/fonts/PublicSans-Bold.9fc9c1206d8e.ttf") format('truetype');
    font-weight: 700;
    font-display: swap;
}

body {
    font-family: 'Ubuntu', system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Publico Sans', Cambria, serif;
}

/* Lists */
.richtext ul {
    list-style-type: disc ;
    margin: 0 0 1rem 1.5rem;
    padding-left: 1.25rem;
}
.richtext ol {
    list-style-type: decimal ;
    margin: 0 0 1rem 1.5rem;
    padding-left: 1.25rem;
}
.richtext li {
    margin: 0.25rem 0;
    line-height: 1.6;
}
.richtext li::marker {
  color: #0b3a8d; /* blauwe bullets */
}

/* Tables */
.richtext table {
  width: 100%;
    border-collapse: collapse;
    margin: 1rem 0;
    font-size: 0.95rem;
}
.richtext th,
.richtext td {
    border: 1px solid #e2e8f0;
    padding: 0.5rem 0.75rem;
    vertical-align: top;
}
.richtext thead th {
    background: #f8fafc;
    font-weight: 600;
    text-align: left;
}
.richtext tbody tr:nth-child(even) {
    background: #fafafa;
}

/* Code */
.richtext code {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    background: #f3f6fb;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0.15rem 0.35rem;
    font-size: 0.9em;
    color: #0b3a8d;
    white-space: pre-wrap;
}
.richtext pre {
    background: #f3f6fb;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    padding: 1rem;
    margin: 1rem 0;
    overflow-x: auto;
}
.richtext pre code {
    background: transparent;
    border: none;
    padding: 0;
    color: #1e293b;
    font-size: 0.9rem;
    line-height: 1.6;
}

/* Typography */
.richtext p {
    margin: 0 0 1rem;
}
.richtext h1,
.richtext h2,
.richtext h3 {
    margin: 1.25rem 0 0.75rem;
    font-weight: 700;
    color: #0b3a8d;
}

.richtext h1 { font-size: 2rem; }
.richtext h2 { font-size: 1.5rem; }
.richtext h3 { font-size: 1.25rem; }


.richtext a {
    color: #0b3a8d;
    text-decoration: underline;
}
.richtext a:hover {
    color: #183c9d;
    text-decoration-thickness: 2px;
}
.richtext img {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
}
.richtext blockquote {
    border-left: 4px solid #e2e8f0;
    padding-left: 1rem;
    color: #555;
    font-style: italic;
    margin: 1rem 0;
}
.richtext strong {
    font-weight: 600;
    color: #092F87;
}

[x-cloak] { display: none !important; }

/* Laat de cropper het hele vlak vullen */
.avatar-cropper .cropper-container {
  width: 100% !important;
  height: 100% !important;
}

/* Zorg dat de canvas ook 100% van de container gebruikt */
.avatar-cropper cropper-canvas,
.avatar-cropper .cropper-wrap-box,
.avatar-cropper .cropper-canvas,
.avatar-cropper .cropper-drag-box {
  width: 100% !important;
  height: 100% !important;
}

cropper-handle{
    border: 2px solid #fff;
}

input:disabled, select:disabled {
    background-color: #f3f4f6;
}

#remarks{
    border: 1px solid #d1d5db;
}