html, body {
font-family: 'Roboto', sans-serif;
}
/* ── Copy-on-hover ── */
.copy-cell {
display: flex;
align-items: center;
}
.copy-cell .copy-btn {
opacity: 0;
transition: opacity 0.15s;
margin-left: 2px;
}
.copy-cell:hover .copy-btn {
opacity: 0.5;
}
.copy-cell .copy-btn:hover {
opacity: 1;
}
/* ── Blazor reconnect overlay ── */
#components-reconnect-modal {
display: none;
position: fixed;
bottom: 24px;
left: 50%;
transform: translateX(-50%);
z-index: 10000;
}
/* Blazor adds the class to in server mode */
body.components-reconnect-show #components-reconnect-modal,
body.components-reconnect-failed #components-reconnect-modal,
body.components-reconnect-rejected #components-reconnect-modal {
display: block;
}
/* Fallback: Blazor adds the class to the element itself in some versions */
#components-reconnect-modal.components-reconnect-show,
#components-reconnect-modal.components-reconnect-failed,
#components-reconnect-modal.components-reconnect-rejected {
display: block;
}
.reconnect-box {
background: var(--mud-palette-surface);
color: var(--mud-palette-text-primary);
border-radius: 8px;
padding: 28px 36px;
display: flex;
flex-direction: column;
align-items: center;
gap: 14px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
font-family: 'Roboto', sans-serif;
font-size: 14px;
}
.reconnect-box a {
color: var(--mud-palette-primary);
cursor: pointer;
}
/* Spinner */
.reconnect-spinner {
width: 32px;
height: 32px;
border: 3px solid var(--mud-palette-primary-lighten);
border-top-color: var(--mud-palette-primary);
border-radius: 50%;
animation: reconnect-spin 0.75s linear infinite;
}
@keyframes reconnect-spin {
to { transform: rotate(360deg); }
}
/* Show the right message per state */
.reconnect-state-show,
.reconnect-state-failed,
.reconnect-state-rejected {
display: none;
}
body.components-reconnect-show .reconnect-state-show,
#components-reconnect-modal.components-reconnect-show .reconnect-state-show {
display: inline;
}
body.components-reconnect-failed .reconnect-state-failed,
#components-reconnect-modal.components-reconnect-failed .reconnect-state-failed {
display: inline;
}
body.components-reconnect-rejected .reconnect-state-rejected,
#components-reconnect-modal.components-reconnect-rejected .reconnect-state-rejected {
display: inline;
}
/* Hide the spinner when not reconnecting */
body.components-reconnect-failed .reconnect-spinner,
body.components-reconnect-rejected .reconnect-spinner,
#components-reconnect-modal.components-reconnect-failed .reconnect-spinner,
#components-reconnect-modal.components-reconnect-rejected .reconnect-spinner {
display: none;
}