.rv-admin .rv-btn,
.rv-frontend .rv-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--rv-md-space-2);
    padding: var(--rv-md-space-2) var(--rv-md-space-4);
    min-height: 40px;
    font-size: var(--rv-text-sm);
    font-weight: 600;
    border-radius: var(--rv-md-radius-sm);
    border: 2px solid transparent;
    background: transparent;
    color: var(--rv-md-on-surface);
    text-decoration: none;
    cursor: pointer;
    transition: box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    white-space: normal;
    text-align: center;
}

.rv-admin .rv-btn:focus-visible,
.rv-frontend .rv-btn:focus-visible {
    outline: none;
    box-shadow: var(--rv-md-focus-ring);
}

.rv-admin .rv-btn[disabled],
.rv-frontend .rv-btn[disabled] {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.rv-admin .rv-btn.is-loading,
.rv-frontend .rv-btn.is-loading {
    position: relative;
    color: transparent;
}

.rv-admin .rv-btn.is-loading::after,
.rv-frontend .rv-btn.is-loading::after {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid currentColor;
    border-top-color: transparent;
    animation: rv-spin 0.8s linear infinite;
}

/* ===================================
   BUTTON STYLING — één bron, op tokens
   Hoge specificiteit + !important blijft nodig om WordPress-admin-
   en themaknopstijlen (ook binnen modals) te overrulen, maar alle
   waarden verwijzen naar het MD3-tokensysteem.
   =================================== */

/* Base Button Styling */
.rv-btn,
.rv-modal .rv-btn,
.rv-modal-overlay .rv-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: var(--rv-space-2) !important;
    padding: 10px 20px !important;
    font-size: var(--rv-text-sm) !important;
    font-weight: 600 !important;
    line-height: var(--rv-line-normal) !important;
    text-decoration: none !important;
    border: 2px solid transparent !important;
    border-radius: var(--rv-md-radius-sm) !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
    white-space: normal !important;
    text-align: center !important;
}

.rv-admin .rv-btn--filled,
.rv-frontend .rv-btn--filled,
.rv-admin .rv-btn--primary,
.rv-frontend .rv-btn--primary,
.rv-modal-overlay .rv-btn--primary,
.rv-modal .rv-btn--primary,
#new-appointment-modal .rv-btn--primary,
#new-appointment-modal button[type="submit"],
#appointment-modal .rv-btn--primary,
.rv-modal-overlay .rv-modal .rv-btn--primary,
.rv-modal-overlay button.rv-btn--primary,
div.rv-modal-overlay div.rv-modal button.rv-btn.rv-btn--primary {
    background: var(--rv-md-primary) !important;
    border-color: var(--rv-md-primary) !important;
    color: var(--rv-md-on-primary) !important;
    box-shadow: var(--rv-md-elevation-1) !important;
}

.rv-admin .rv-btn--filled:hover,
.rv-frontend .rv-btn--filled:hover,
.rv-admin .rv-btn--primary:hover,
.rv-frontend .rv-btn--primary:hover,
.rv-modal-overlay .rv-btn--primary:hover,
.rv-modal .rv-btn--primary:hover,
#new-appointment-modal .rv-btn--primary:hover,
#new-appointment-modal button[type="submit"]:hover,
#appointment-modal .rv-btn--primary:hover,
.rv-modal-overlay .rv-modal .rv-btn--primary:hover,
div.rv-modal-overlay div.rv-modal button.rv-btn.rv-btn--primary:hover {
    background: var(--rv-color-accent) !important;
    border-color: var(--rv-color-accent) !important;
    color: var(--rv-md-on-primary) !important;
    box-shadow: var(--rv-md-elevation-2) !important;
    transform: translateY(-1px);
}

/* Text/Cancel Buttons (ook in modals) */
#new-appointment-modal .rv-btn--text,
.rv-modal-overlay .rv-modal .rv-btn--text,
div.rv-modal-overlay div.rv-modal button.rv-btn.rv-btn--text {
    background: transparent !important;
    border: 2px solid transparent !important;
    color: var(--rv-color-accent) !important;
}

#new-appointment-modal .rv-btn--text:hover,
.rv-modal-overlay .rv-modal .rv-btn--text:hover,
div.rv-modal-overlay div.rv-modal button.rv-btn.rv-btn--text:hover {
    background: var(--rv-color-surface-2) !important;
}

/* Danger Outlined Buttons (ook in modals) */
#appointment-modal .rv-btn--danger,
.rv-modal-overlay .rv-modal .rv-btn--danger.rv-btn--outlined,
div.rv-modal-overlay div.rv-modal button.rv-btn.rv-btn--outlined.rv-btn--danger {
    background: transparent !important;
    border: 2px solid var(--rv-md-error) !important;
    color: var(--rv-md-error) !important;
}

#appointment-modal .rv-btn--danger:hover,
.rv-modal-overlay .rv-modal .rv-btn--danger.rv-btn--outlined:hover,
div.rv-modal-overlay div.rv-modal button.rv-btn.rv-btn--outlined.rv-btn--danger:hover {
    background: var(--rv-md-error-container) !important;
    border-color: var(--rv-color-error-strong) !important;
    color: var(--rv-color-error-strong) !important;
}

.rv-admin .rv-btn--tonal,
.rv-frontend .rv-btn--tonal {
    background: var(--rv-md-primary-container);
    border-color: transparent;
    color: var(--rv-md-on-primary-container);
}

.rv-admin .rv-btn--tonal:hover,
.rv-frontend .rv-btn--tonal:hover {
    background: var(--rv-color-accent-soft);
    color: var(--rv-md-primary);
}

.rv-admin .rv-btn--outlined,
.rv-frontend .rv-btn--outlined,
.rv-admin .rv-btn--secondary,
.rv-frontend .rv-btn--secondary,
.rv-modal-overlay .rv-btn--outlined,
.rv-modal .rv-btn--outlined {
    background: transparent !important;
    border-color: var(--rv-md-outline-variant) !important;
    color: var(--rv-color-accent) !important;
}

.rv-admin .rv-btn--outlined:hover,
.rv-frontend .rv-btn--outlined:hover,
.rv-admin .rv-btn--secondary:hover,
.rv-frontend .rv-btn--secondary:hover,
.rv-modal-overlay .rv-btn--outlined:hover,
.rv-modal .rv-btn--outlined:hover {
    border-color: var(--rv-color-accent) !important;
    background: var(--rv-color-bg) !important;
}

.rv-admin .rv-btn--text,
.rv-frontend .rv-btn--text,
.rv-modal-overlay .rv-btn--text,
.rv-modal .rv-btn--text {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--rv-color-accent) !important;
    padding: 10px 16px !important;
}

.rv-admin .rv-btn--text:hover,
.rv-frontend .rv-btn--text:hover,
.rv-modal-overlay .rv-btn--text:hover,
.rv-modal .rv-btn--text:hover {
    background: var(--rv-color-surface-2) !important;
}

.rv-admin .rv-btn--danger,
.rv-frontend .rv-btn--danger {
    background: var(--rv-md-error);
    border-color: var(--rv-md-error);
    color: var(--rv-md-on-error);
    box-shadow: var(--rv-md-elevation-1);
}

.rv-admin .rv-btn--danger:hover,
.rv-frontend .rv-btn--danger:hover {
    background: var(--rv-color-error-strong);
    border-color: var(--rv-color-error-strong);
}

.rv-admin .rv-btn--danger.rv-btn--outlined,
.rv-frontend .rv-btn--danger.rv-btn--outlined,
.rv-modal-overlay .rv-btn--danger.rv-btn--outlined,
.rv-modal .rv-btn--danger.rv-btn--outlined {
    background: transparent !important;
    border-color: var(--rv-md-error) !important;
    color: var(--rv-md-error) !important;
    box-shadow: none !important;
}

.rv-admin .rv-btn--danger.rv-btn--outlined:hover,
.rv-frontend .rv-btn--danger.rv-btn--outlined:hover,
.rv-modal-overlay .rv-btn--danger.rv-btn--outlined:hover,
.rv-modal .rv-btn--danger.rv-btn--outlined:hover {
    background: var(--rv-md-error-container) !important;
    border-color: var(--rv-color-error-strong) !important;
    color: var(--rv-color-error-strong) !important;
}

.rv-admin .rv-btn--danger.rv-btn--text,
.rv-frontend .rv-btn--danger.rv-btn--text {
    background: transparent;
    border-color: transparent;
    color: var(--rv-md-error);
    box-shadow: none;
}

.rv-admin .rv-btn--danger.rv-btn--tonal,
.rv-frontend .rv-btn--danger.rv-btn--tonal {
    background: var(--rv-md-error-container);
    border-color: transparent;
    color: var(--rv-md-on-error-container);
    box-shadow: none;
}

.rv-admin .rv-btn--icon,
.rv-frontend .rv-btn--icon {
    padding: 0;
    width: 40px;
    height: 40px;
    border-radius: var(--rv-md-radius-md);
}

.rv-admin .rv-btn--icon .dashicons,
.rv-frontend .rv-btn--icon .dashicons {
    font-size: 18px;
    width: 18px;
    height: 18px;
}

@keyframes rv-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.rv-admin .dropbtn.rv-btn--secondary {
    background: transparent;
    border-color: var(--rv-md-outline);
    color: var(--rv-md-on-surface);
}

.rv-admin .dropbtn.rv-btn--secondary:hover {
    background: var(--rv-md-surface-variant);
    border-color: var(--rv-md-primary);
    color: var(--rv-md-primary);
}

.rv-admin .button.rv-btn--primary,
.rv-admin .button-primary.rv-btn--primary,
.rv-admin .submit-btn.rv-btn--primary {
    background: var(--rv-md-primary);
    border-color: var(--rv-md-primary);
    color: var(--rv-md-on-primary);
}

.rv-admin .button.rv-btn--secondary,
.rv-admin .button-primary.rv-btn--secondary,
.rv-admin .submit-btn.rv-btn--secondary {
    background: transparent;
    border-color: var(--rv-md-outline);
    color: var(--rv-md-on-surface);
}

.rv-admin #filter-bar .rv-btn--primary {
    background: var(--rv-md-primary);
    border-color: var(--rv-md-primary);
    color: var(--rv-md-on-primary);
}

.rv-admin #filter-bar .rv-btn--secondary {
    background: transparent;
    border-color: var(--rv-md-outline);
    color: var(--rv-md-on-surface);
}

.rv-admin .rv-input,
.rv-frontend .rv-input {
    padding: var(--rv-md-space-2) var(--rv-md-space-3);
    border-radius: var(--rv-md-radius-md);
    border: 1px solid var(--rv-md-outline);
    background: var(--rv-md-surface);
    color: var(--rv-md-on-surface);
    font-size: var(--rv-text-sm);
    line-height: var(--rv-line-normal);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.rv-admin .rv-input:focus,
.rv-frontend .rv-input:focus {
    border-color: var(--rv-md-primary);
    box-shadow: var(--rv-md-focus-ring);
    outline: none;
}

.rv-admin select.rv-input,
.rv-frontend select.rv-input {
    padding-right: 36px;
    background-position: right 10px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}

.rv-admin .toolbar.rv-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-md-space-4);
    padding: var(--rv-md-space-4);
    border: 1px solid var(--rv-md-outline);
    border-radius: var(--rv-md-radius-lg);
    background: var(--rv-md-surface);
    box-shadow: var(--rv-md-elevation-1);
    flex-wrap: wrap;
}

.rv-admin .rv-table {
    border: 1px solid var(--rv-md-outline);
    border-radius: var(--rv-md-radius-lg);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    background: var(--rv-md-surface);
    box-shadow: var(--rv-md-elevation-1);
    width: 100%;
}

.rv-admin .rv-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.rv-admin .rv-table-actions {
    display: inline-flex;
    align-items: center;
    gap: var(--rv-md-space-2);
}

.rv-admin .rv-table th,
.rv-admin .rv-table td {
    padding: var(--rv-md-space-3) var(--rv-md-space-4);
}

.rv-admin .rv-table thead th {
    background: var(--rv-md-surface-variant);
    font-weight: 700;
}

.rv-admin .modal.rv-modal {
    background: var(--rv-md-scrim);
}

.rv-admin .modal-content.rv-modal__content {
    border-radius: var(--rv-dialog-radius, var(--rv-md-radius-xl));
    border: 1px solid var(--rv-md-outline);
    box-shadow: var(--rv-md-elevation-3);
}

.rv-admin .rv-empty-state,
.rv-frontend .rv-empty-state {
    border: 1px dashed var(--rv-md-outline);
    border-radius: var(--rv-md-radius-lg);
    padding: var(--rv-md-space-6);
    background: var(--rv-md-surface);
    color: var(--rv-md-on-surface);
    box-shadow: var(--rv-md-elevation-1);
    margin: var(--rv-md-space-5) 0;
}

.rv-admin .rv-empty-state--compact {
    padding: var(--rv-md-space-4);
    margin: var(--rv-md-space-3) 0;
}

.rv-admin .rv-empty-state__title,
.rv-frontend .rv-empty-state__title {
    margin: 0 0 var(--rv-md-space-2);
    font-size: var(--rv-text-lg);
    line-height: var(--rv-line-tight);
}

.rv-admin .rv-empty-state__text,
.rv-frontend .rv-empty-state__text {
    margin: 0 0 var(--rv-md-space-4);
    color: var(--rv-md-on-surface-variant);
}

.rv-admin .rv-empty-state__actions,
.rv-frontend .rv-empty-state__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--rv-md-space-3);
}

.rv-frontend .reparatie-container {
    background: linear-gradient(180deg, var(--rv-color-bg) 0%, #ffffff 45%);
    padding: var(--rv-space-7);
    border-radius: var(--rv-radius-lg);
}

.rv-frontend .rv-h3 {
    font-size: var(--rv-text-lg);
    line-height: var(--rv-line-tight);
    margin: 0 0 var(--rv-space-2);
    font-weight: 700;
    color: var(--rv-color-text);
}

.rv-frontend .rv-card {
    background: var(--rv-color-surface);
    border: 1px solid var(--rv-color-border);
    border-top: 4px solid var(--rv-color-primary);
    border-radius: var(--rv-radius-lg);
    padding: var(--rv-space-6);
    box-shadow:
        0 1px 3px rgba(0, 0, 0, 0.05),
        0 1px 2px rgba(0, 0, 0, 0.03);
    display: flex;
    flex-direction: column;
    gap: var(--rv-space-4);
    min-height: 100%;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover-lift alleen op interactieve kaarten (links of expliciete modifier);
   informatiekaarten wekken anders een klik-affordance die er niet is. */
.rv-frontend a.rv-card:hover,
.rv-frontend .rv-card--interactive:hover {
    transform: translateY(-4px);
    box-shadow:
        0 12px 24px rgba(0, 0, 0, 0.08),
        0 4px 8px rgba(0, 0, 0, 0.04),
        0 0 0 1px rgba(var(--rv-color-primary-rgb, 8, 35, 82), 0.1);
    border-color: rgba(var(--rv-color-primary-rgb, 8, 35, 82), 0.2);
}

@media (max-width: 900px) {
    .rv-frontend .reparatie-container {
        padding: var(--rv-space-5);
    }
}

/* Force WordPress admin wrapper background to match design system */
#wpwrap {
    background: var(--rv-md-background) !important;
}

/* Admin app shell */
.rv-admin {
    background: var(--rv-md-background) !important;
    color: var(--rv-md-on-background);
    font-size: var(--rv-text-sm);
    min-height: 100vh;
    padding: var(--rv-md-space-6);
}

.rv-admin,
.rv-admin *,
.rv-admin *::before,
.rv-admin *::after {
    box-sizing: border-box;
}

.rv-admin input,
.rv-admin select,
.rv-admin textarea,
.rv-admin button {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.rv-admin .rv-admin-shell {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.rv-admin .rv-page {
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-6);
    margin-top: 0;
}

body.rv-modal-open {
    overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
    .rv-admin *,
    .rv-admin *::before,
    .rv-admin *::after,
    .rv-frontend *,
    .rv-frontend *::before,
    .rv-frontend *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

.rv-admin .rv-page__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rv-md-space-4);
}

.rv-admin .rv-page__title {
    font-size: var(--rv-text-2xl);
    line-height: var(--rv-line-tight);
    margin: 0;
    font-weight: 600;
}

.rv-admin .rv-page__subtitle {
    margin: var(--rv-md-space-2) 0 0;
    font-size: var(--rv-text-sm);
    color: var(--rv-md-on-surface-variant);
}

.rv-admin .rv-page__actions {
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-3);
    flex-wrap: wrap;
}

.rv-admin .rv-notice-stack {
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-3);
}

.rv-admin .rv-notice {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rv-md-space-3);
    padding: var(--rv-md-space-3) var(--rv-md-space-4);
    border-radius: var(--rv-md-radius-lg);
    border: 1px solid var(--rv-md-outline);
    background: var(--rv-md-surface);
    box-shadow: var(--rv-md-elevation-1);
    color: var(--rv-md-on-surface);
}

.rv-admin .rv-notice__content {
    flex: 1;
}

.rv-admin .rv-notice__title {
    margin: 0 0 var(--rv-md-space-1);
    font-size: var(--rv-text-sm);
    font-weight: 600;
}

.rv-admin .rv-notice__text {
    margin: 0;
    font-size: var(--rv-text-sm);
    color: var(--rv-md-on-surface-variant);
}

.rv-admin .rv-notice--success {
    border-color: var(--rv-color-success);
    background: var(--rv-color-success-soft);
    color: var(--rv-color-success-strong);
}

.rv-admin .rv-notice--warning {
    border-color: var(--rv-color-warning);
    background: var(--rv-color-warning-soft);
    color: var(--rv-color-warning-strong);
}

.rv-admin .rv-notice--error {
    border-color: var(--rv-color-error);
    background: var(--rv-color-error-soft);
    color: var(--rv-color-error-strong);
}

.rv-admin .rv-notice--info {
    border-color: var(--rv-color-info);
    background: var(--rv-color-info-soft);
    color: var(--rv-color-info-strong);
}

.rv-admin .notice {
    margin: 0;
    padding: var(--rv-md-space-3) var(--rv-md-space-4);
    border-radius: var(--rv-md-radius-lg);
    border: 1px solid var(--rv-md-outline);
    background: var(--rv-md-surface);
    box-shadow: var(--rv-md-elevation-1);
}

.rv-admin .notice-success {
    border-color: var(--rv-color-success);
    background: var(--rv-color-success-soft);
    color: var(--rv-color-success-strong);
}

.rv-admin .notice-error {
    border-color: var(--rv-color-error);
    background: var(--rv-color-error-soft);
    color: var(--rv-color-error-strong);
}

.rv-admin .notice-warning {
    border-color: var(--rv-color-warning);
    background: var(--rv-color-warning-soft);
    color: var(--rv-color-warning-strong);
}

.rv-admin .notice-info {
    border-color: var(--rv-color-info);
    background: var(--rv-color-info-soft);
    color: var(--rv-color-info-strong);
}

.rv-admin .rv-surface,
.rv-admin .rv-card {
    background: var(--rv-md-surface);
    border: 1px solid var(--rv-md-outline);
    border-radius: var(--rv-md-radius-lg);
    padding: var(--rv-md-space-5);
    box-shadow: var(--rv-md-elevation-1);
}

.rv-admin .rv-surface--tight,
.rv-admin .rv-card--tight {
    padding: var(--rv-md-space-4);
}

.rv-admin .rv-card--flush {
    padding: 0;
    overflow: hidden;
}

.rv-admin .rv-surface__header,
.rv-admin .rv-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-md-space-4);
    padding-bottom: var(--rv-md-space-3);
    margin-bottom: var(--rv-md-space-4);
    border-bottom: 1px solid var(--rv-md-outline-variant);
}

.rv-admin .rv-surface__title,
.rv-admin .rv-card__title {
    font-size: var(--rv-text-lg);
    font-weight: 600;
    margin: 0;
}

.rv-admin .rv-surface__body,
.rv-admin .rv-card__content {
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-4);
}

.rv-admin .rv-dialog {
    --rv-dialog-width: clamp(720px, 92vw, 960px);
    --rv-dialog-height: min(92vh, 860px);
    --rv-dialog-margin: 32px auto;
    --rv-dialog-radius: var(--rv-md-radius-xl);
}

.rv-admin md-dialog:not(:defined) {
    display: none;
}

.rv-admin.rv-admin-dialog-host {
    position: fixed;
    inset: 0;
    width: 0;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: visible;
    background: transparent;
    z-index: 10000;
}

.rv-admin.rv-admin-dialog-host--media {
    z-index: 9000;
}

.rv-admin .rv-dialog--fullscreen {
    --rv-dialog-width: 100vw;
    --rv-dialog-height: 100vh;
    --rv-dialog-margin: 0;
    --rv-dialog-radius: 0;
}

.rv-admin .rv-dialog--large {
    --rv-dialog-width: clamp(720px, 92vw, 960px);
    --rv-dialog-height: min(92vh, 860px);
    --rv-dialog-margin: 32px auto;
}

.rv-admin .rv-dialog--xlarge {
    --rv-dialog-width: clamp(960px, 76vw, 1200px);
    --rv-dialog-height: min(90vh, 920px);
    --rv-dialog-margin: 40px auto;
}

.rv-admin .rv-dialog--compact {
    --rv-dialog-width: clamp(320px, 80vw, 440px);
    --rv-dialog-height: auto;
    --rv-dialog-margin: 24px auto;
    --rv-dialog-radius: var(--rv-md-radius-lg);
}

/* Compacte bevestiging: rustige kop, acties samen rechts */
.rv-admin .rv-dialog--compact .rv-dialog__title {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.rv-admin .rv-dialog--compact .rv-dialog__actions {
    justify-content: flex-end;
    border-top: none;
}

.rv-admin .rv-dialog--compact .rv-dialog__actions-left {
    margin-right: 0;
}

.rv-admin md-dialog.rv-dialog {
    width: var(--rv-dialog-width) !important;
    height: var(--rv-dialog-height) !important;
    margin: var(--rv-dialog-margin);
    inset: 0;
    max-width: var(--rv-dialog-width) !important;
    min-width: var(--rv-dialog-width) !important;
    max-height: var(--rv-dialog-height) !important;
    min-height: var(--rv-dialog-height) !important;
    --md-dialog-container-max-width: var(--rv-dialog-width);
    --md-dialog-container-min-width: var(--rv-dialog-width);
    --md-dialog-container-max-height: var(--rv-dialog-height);
    --md-dialog-container-min-height: var(--rv-dialog-height);
    --md-dialog-container-shape: var(--rv-dialog-radius);
    --md-dialog-container-color: var(--rv-md-surface);
}

.rv-admin md-dialog.rv-dialog--compact {
    height: auto !important;
    margin: auto;
    min-height: 0 !important;
    max-height: min(70vh, 420px) !important;
    --md-dialog-container-min-height: 0;
    --md-dialog-container-max-height: min(70vh, 420px);
}

.rv-admin .rv-dialog__headline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rv-md-space-3);
}

.rv-admin .rv-dialog__headline-text {
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-1);
}

.rv-admin .rv-dialog__title {
    margin: 0;
    font-size: var(--rv-text-lg);
    font-weight: 600;
}

.rv-admin .rv-dialog__supporting {
    margin: 0;
    color: var(--rv-md-on-surface-variant);
    font-size: var(--rv-text-sm);
}

.rv-admin .rv-dialog__close {
    --md-icon-button-state-layer-width: 40px;
    --md-icon-button-state-layer-height: 40px;
    --md-icon-button-icon-size: 20px;
}

.rv-admin .rv-dialog__content {
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-3);
    min-height: 0;
}

.rv-admin .rv-dialog__actions {
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-3);
    flex-wrap: wrap;
    border-top: 1px solid var(--rv-md-outline-variant);
    background: var(--rv-md-surface);
}

.rv-admin .rv-dialog__actions-left {
    margin-right: auto;
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-2);
}

.rv-admin .rv-dialog__actions-right {
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-2);
}

.rv-admin .rv-spinner {
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 3px solid var(--rv-md-outline-variant);
    border-top-color: var(--rv-md-primary);
    border-radius: 50%;
    animation: rv-spinner-rotate 0.8s linear infinite;
    flex: 0 0 auto;
}

.rv-admin .rv-spinner--sm {
    width: 20px;
    height: 20px;
    border-width: 2px;
}

.rv-admin .rv-dialog__progress {
    display: inline-block;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
    overflow: hidden;
    transition: opacity 0.2s ease, width 0.2s ease, margin 0.2s ease;
    pointer-events: none;
}

.rv-admin .rv-dialog[data-rv-dialog-busy="true"] .rv-dialog__progress {
    opacity: 1;
    width: 20px;
    height: 20px;
    margin-right: var(--rv-md-space-2);
}

@keyframes rv-spinner-rotate {
    to {
        transform: rotate(360deg);
    }
}

.rv-admin .rv-toolbar,
.rv-admin .toolbar.rv-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-md-space-3);
    flex-wrap: wrap;
}

.rv-admin .rv-toolbar__left,
.rv-admin .rv-toolbar__right {
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-3);
    flex-wrap: wrap;
}

.rv-admin .rv-toolbar__right {
    justify-content: flex-end;
    margin-left: auto;
}

.rv-admin [hidden] {
    display: none !important;
}

.rv-admin .rv-field {
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-2);
}

.rv-admin .rv-field__label {
    font-size: var(--rv-text-sm);
    font-weight: 600;
}

.rv-admin .rv-field__hint {
    font-size: var(--rv-text-xs);
    color: var(--rv-md-on-surface-variant);
}

.rv-admin .rv-field__control>.rv-input,
.rv-admin .rv-field__control>select,
.rv-admin .rv-field__control>textarea {
    width: 100%;
}

.rv-admin .rv-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-2);
}

.rv-admin .rv-list__item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rv-md-space-3);
    padding: var(--rv-md-space-3) var(--rv-md-space-4);
    border-radius: var(--rv-md-radius-lg);
    border: 1px solid var(--rv-md-outline);
    background: var(--rv-md-surface);
    box-shadow: var(--rv-md-elevation-1);
}

.rv-admin .rv-list__item:focus-within {
    box-shadow: var(--rv-md-focus-ring);
}

.rv-admin .rv-list__content {
    display: flex;
    flex-direction: column;
    gap: var(--rv-md-space-1);
}

.rv-admin .rv-list__title {
    margin: 0;
    font-weight: 600;
}

.rv-admin .rv-list__supporting {
    margin: 0;
    font-size: var(--rv-text-sm);
    color: var(--rv-md-on-surface-variant);
}

.rv-admin .rv-list__actions {
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-2);
    flex-wrap: wrap;
}

.rv-admin .rv-list--ordered {
    counter-reset: rv-list;
}

.rv-admin .rv-list--ordered .rv-list__item {
    position: relative;
    padding-left: calc(var(--rv-md-space-5) + 18px);
}

.rv-admin .rv-list--ordered .rv-list__item::before {
    counter-increment: rv-list;
    content: counter(rv-list) ".";
    position: absolute;
    left: var(--rv-md-space-4);
    top: var(--rv-md-space-3);
    font-weight: 600;
    color: var(--rv-md-primary);
}

.rv-admin .rv-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--rv-md-space-1);
    padding: 4px 10px;
    border-radius: var(--rv-md-radius-pill);
    font-size: var(--rv-text-xs);
    font-weight: 600;
    border: 1px solid transparent;
}

/* Chipkleuren: *-strong tekst op soft-achtergrond (WCAG AA op 12px) */
.rv-admin .rv-chip--success {
    background: var(--rv-color-success-soft);
    color: var(--rv-color-success-strong);
}

.rv-admin .rv-chip--muted {
    background: var(--rv-color-surface-alt);
    color: var(--rv-color-muted);
}

.rv-admin .rv-chip--error {
    background: var(--rv-color-error-soft);
    color: var(--rv-color-error-strong);
}

.rv-admin .rv-chip--info {
    background: var(--rv-color-info-soft);
    color: var(--rv-color-info-strong);
}

.rv-admin .rv-chip--warning {
    background: var(--rv-color-warning-soft);
    color: var(--rv-color-warning-strong);
}

.rv-admin .rv-table,
.rv-admin .wp-list-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.rv-admin .rv-table th,
.rv-admin .rv-table td,
.rv-admin .wp-list-table th,
.rv-admin .wp-list-table td {
    padding: var(--rv-md-space-3) var(--rv-md-space-4);
    text-align: left;
    vertical-align: middle;
}

.rv-admin .rv-table thead th,
.rv-admin .wp-list-table thead th {
    background: var(--rv-md-surface-variant);
    font-weight: 700;
}

.rv-admin .wp-list-table tbody tr:nth-child(even),
.rv-admin .rv-table tbody tr:nth-child(even) {
    background: var(--rv-md-surface-container-high);
}

.rv-admin .wp-list-table tbody tr:hover,
.rv-admin .rv-table tbody tr:hover {
    background: var(--rv-md-surface-variant);
}

.rv-admin .rv-table-surface .wp-list-table {
    margin: 0;
    border: none;
    box-shadow: none;
}

.rv-admin .rv-table-surface .rv-table {
    margin: 0;
    border: none;
    box-shadow: none;
}

.rv-admin .rv-table-surface {
    padding: 0;
    overflow: hidden;
}

.rv-admin .tablenav.bottom {
    display: none;
}

.rv-admin .tablenav {
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-3);
    margin: 0;
    padding: 0;
}

.rv-admin .tablenav .actions,
.rv-admin .tablenav .tablenav-pages {
    float: none;
}

.rv-admin .tablenav .tablenav-pages {
    margin-left: auto;
}

.rv-admin .tablenav .actions {
    display: inline-flex;
    align-items: center;
    gap: var(--rv-md-space-2);
}

.rv-admin .tablenav select,
.rv-admin .tablenav input[type="text"],
.rv-admin .tablenav input[type="search"] {
    padding: var(--rv-md-space-2) var(--rv-md-space-3);
    border-radius: var(--rv-md-radius-md);
    border: 1px solid var(--rv-md-outline);
    background: var(--rv-md-surface);
    font-size: var(--rv-text-sm);
}

.rv-admin .tablenav .button {
    background: transparent;
    border: 1px solid var(--rv-md-outline);
    border-radius: var(--rv-md-radius-md);
    padding: var(--rv-md-space-2) var(--rv-md-space-3);
    font-size: var(--rv-text-sm);
    font-weight: 600;
}

.rv-admin .tablenav .button:hover {
    border-color: var(--rv-md-primary);
    color: var(--rv-md-primary);
    background: var(--rv-md-surface-variant);
}

.rv-admin .search-box {
    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--rv-md-space-2);
}

.rv-admin .search-box input[type="search"] {
    padding: var(--rv-md-space-2) var(--rv-md-space-3);
    border-radius: var(--rv-md-radius-md);
    border: 1px solid var(--rv-md-outline);
    background: var(--rv-md-surface);
    font-size: var(--rv-text-sm);
}

.rv-admin .search-box .button {
    background: transparent;
    border: 1px solid var(--rv-md-outline);
    border-radius: var(--rv-md-radius-md);
    padding: var(--rv-md-space-2) var(--rv-md-space-3);
    font-size: var(--rv-text-sm);
    font-weight: 600;
}

.rv-admin .search-box .button:hover {
    border-color: var(--rv-md-primary);
    color: var(--rv-md-primary);
    background: var(--rv-md-surface-variant);
}

.rv-admin .rv-modal {
    display: none;
    position: fixed;
    inset: 0;
    padding: 0;
    background: var(--rv-md-scrim);
    overflow: hidden;
    z-index: 9999;
}

.rv-admin .rv-modal__content {
    background: var(--rv-md-surface);
    border: 1px solid var(--rv-md-outline);
    border-radius: var(--rv-dialog-radius, var(--rv-md-radius-xl));
    box-shadow: var(--rv-md-elevation-3);
}

.rv-admin .rv-modal__content.rv-dialog {
    margin: var(--rv-dialog-margin);
    width: var(--rv-dialog-width);
    height: var(--rv-dialog-height);
    padding: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.rv-admin .rv-modal__content .rv-dialog__headline {
    padding: var(--rv-md-space-5) var(--rv-md-space-5) var(--rv-md-space-3);
}

.rv-admin .rv-modal__content .rv-dialog__content {
    padding: 0 var(--rv-md-space-5) var(--rv-md-space-4);
    overflow: auto;
    flex: 1;
    min-height: 0;
}

.rv-admin .rv-modal__content .rv-dialog__actions {
    padding: var(--rv-md-space-3) var(--rv-md-space-5) var(--rv-md-space-4);
    margin-top: auto;
}

@media (max-width: 960px) {
    .rv-admin .rv-admin-shell {
        padding: 0;
    }

    .rv-admin .rv-page__header {
        flex-direction: column;
        align-items: flex-start;
    }

    .rv-admin .rv-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 640px) {
    .rv-admin .rv-notice {
        flex-direction: column;
        align-items: stretch;
    }

    .rv-admin .rv-notice > .rv-btn:not(.rv-btn--icon) {
        width: 100%;
    }
}

/* Alleen voor schermlezers. Werd in templates gebruikt (models-by-brand,
   zoekresultaten) maar was nooit gedefinieerd, waardoor die koppen
   zichtbaar op de pagina stonden. */
.rv-frontend .rv-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
