/* Design system v2 — modal (round 26, UIX-6).
   Radius lg, pop shadow and hairline; the body enters with opacity + a 4px rise over
   --sc-dur-slow. The rise keeps shared.css's centring translate(-50%, -50%). */

.siteclick-container .siteclick-modal-body {
    border-color: var(--sc-color-hairline);
    border-radius: var(--sc-radius-lg);
    box-shadow: var(--sc-shadow-pop);
    overflow: hidden;
}
.siteclick-modal.active .siteclick-modal-body {
    animation: sc-modal-enter var(--sc-dur-slow) var(--sc-ease-out) both;
}
@keyframes sc-modal-enter {
    from { opacity: 0; transform: translate(-50%, calc(-50% + 4px)); }
    to   { opacity: 1; transform: translate(-50%, -50%); }
}

/* While siteclickConfirm({action}) runs, Annuleren and × are blocked. */
.siteclick-modal[data-sc-confirm-action] :is(.button-no, .siteclick-panel-close) {
    pointer-events: none;
    opacity: .5;
}

/* Run 27a (r.109–110): the overlay fades on --sc-motion via [data-sc-open]
   (40-sidebars.js), like the sidebar overlay; the blur from shared.css stays.
   Loads after shared.css, so it wins over display: none. */
.siteclick-container .siteclick-modal-overlay {
    display: block;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity var(--sc-motion), visibility 0s linear var(--sc-motion-d);
}
.siteclick-container .siteclick-modal-overlay[data-sc-open] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity var(--sc-motion), visibility 0s;
}