/* Alle compacte actieknoppen: brieven, organisaties, audits, facturen en documenten.
   Pas alleen deze drie waarden aan om de maten overal gelijk te houden. */
.crm {
    --crm-action-size:28px;
    --crm-action-symbol-size:16px;
    --crm-action-gap:10px;
}
@media (max-width:1024px), (pointer:coarse) {
    .crm { --crm-action-size:44px; }
}

/* Alleen de maatvoering heeft voorrang op oudere pagina-eigen CSS.
   Kleuren, verborgen/uitgeschakeld en de werking blijven bij de bestaande knop. */
.crm :is(
    .crm-action-icon, .crm-open-eye, .crm-table-action, .crm-mail-icon,
    .crm-icon-button, .letters-icon-button, .crm-doc-icon, .crm-document-icon,
    .crm-signup-remove, .crm-certificate-eye, .crm-billing-icon-action,
    .crm-dash-icon-action, .kea-news-action, .kea-mollie-remove,
    .crm-queue-actions > .btn
) {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box!important;
    width:var(--crm-action-size)!important;
    height:var(--crm-action-size)!important;
    min-width:var(--crm-action-size)!important;
    min-height:var(--crm-action-size)!important;
    max-width:var(--crm-action-size)!important;
    max-height:var(--crm-action-size)!important;
    flex:0 0 var(--crm-action-size)!important;
    padding:0!important;
    border-radius:5px!important;
    font-size:var(--crm-action-symbol-size)!important;
    line-height:1!important;
    vertical-align:middle;
}
.crm :is(
    .crm-action-icon, .crm-open-eye, .crm-table-action, .crm-mail-icon,
    .crm-icon-button, .letters-icon-button, .crm-doc-icon, .crm-document-icon,
    .crm-signup-remove, .crm-certificate-eye, .crm-billing-icon-action,
    .crm-dash-icon-action, .kea-news-action, .kea-mollie-remove,
    .crm-queue-actions > .btn
) > :is(svg, img, .crm-delete-icon, .crm-document-eye, .crm-document-archive),
.crm :is(
    .crm-action-icon, .crm-open-eye, .crm-table-action, .crm-mail-icon,
    .crm-icon-button, .letters-icon-button, .crm-doc-icon, .crm-document-icon,
    .crm-signup-remove, .crm-certificate-eye, .crm-billing-icon-action,
    .crm-dash-icon-action, .kea-news-action, .kea-mollie-remove,
    .crm-queue-actions > .btn
)[data-crm-icon]::before,
.crm :is(
    .crm-action-icon, .crm-open-eye, .crm-table-action, .crm-mail-icon,
    .crm-icon-button, .letters-icon-button, .crm-doc-icon, .crm-document-icon,
    .crm-signup-remove, .crm-certificate-eye, .crm-billing-icon-action,
    .crm-dash-icon-action, .kea-news-action, .kea-mollie-remove,
    .crm-queue-actions > .btn
) [data-crm-icon]::before {
    width:var(--crm-action-symbol-size)!important;
    height:var(--crm-action-symbol-size)!important;
    min-width:var(--crm-action-symbol-size)!important;
    max-width:var(--crm-action-symbol-size)!important;
    flex:0 0 var(--crm-action-symbol-size)!important;
    margin:0!important;
    vertical-align:middle;
}
.crm :is(
    .crm-action-icon, .crm-open-eye, .crm-table-action, .crm-mail-icon,
    .crm-icon-button, .letters-icon-button, .crm-doc-icon, .crm-document-icon,
    .crm-signup-remove, .crm-certificate-eye, .crm-billing-icon-action,
    .crm-dash-icon-action, .kea-news-action, .kea-mollie-remove,
    .crm-queue-actions > .btn
) > :is(svg, img) {
    display:block;
    object-fit:contain;
    pointer-events:none;
}
.crm :is(
    .crm-action-icon, .crm-open-eye, .crm-table-action, .crm-mail-icon,
    .crm-icon-button, .letters-icon-button, .crm-doc-icon, .crm-document-icon,
    .crm-signup-remove, .crm-certificate-eye, .crm-billing-icon-action,
    .crm-dash-icon-action, .kea-news-action, .kea-mollie-remove,
    .crm-queue-actions > .btn
) > [data-crm-icon] {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:1;
}

/* Ook in popups en na het bijwerken van een lijst via Ajax. */
.crm :is(.letters-row-actions, .letters-actions-manage, .crm-table-action-row,
    .crm-row-actions, .crm-queue-actions, .crm-document-row-actions, .kea-news-actions) {
    align-items:center;
    gap:var(--crm-action-gap)!important;
}
.crm :is(.letters-row-actions, .letters-actions-manage, .crm-table-action-row,
    .crm-row-actions, .crm-queue-actions, .crm-document-row-actions, .kea-news-actions) > :is(a, button) {
    margin:0!important;
}

/* In hoog contrast blijft het bestaande tekstalternatief leesbaar. */
@media (forced-colors:active) {
    .crm .letters-icon-button {
        width:auto!important;
        max-width:none!important;
        flex-basis:auto!important;
        padding:4px 8px!important;
        font-size:13px!important;
    }
}