/*
 * Restricted content warning: functional rules only.
 * The dialog uses the shared Notice dialog look (.message-dialog in app.css,
 * plus the theme stylesheet); do not restyle it here.
 */

[data-restricted-content][hidden] { display: none !important; }

/* Keep both actions on screen on short viewports; long messages scroll. */
.restricted-warning .message-dialog__card {
    max-height: 85vh;
    max-height: 85dvh;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

/* Before the gate script upgrades it to a modal (and with JavaScript off),
   the server-rendered dialog still covers the page instead of sitting after
   the footer. */
@supports selector(:modal) {
    .restricted-warning[open]:not(:modal) {
        position: fixed;
        inset: 0;
        margin: auto;
        height: fit-content;
        border-radius: var(--radius-panel);
        box-shadow: 0 0 0 100vmax rgba(7, 11, 21, 0.88);
    }

    body.theme-scheme-light .restricted-warning[open]:not(:modal) {
        box-shadow: 0 0 0 100vmax rgba(248, 246, 244, 0.92);
    }
}

.restricted-warning [data-restricted-continue]:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}