/* Generated from scoped fragments; do not edit this file. */
/* General-purpose alert gluon. Debug dialogs inherit their existing palette. */
.qrk-ui-alert {
 position: fixed; inset: 0; margin: auto; width: min(480px, calc(100vw - 40px));
 box-sizing: border-box; padding: 24px; border: 1px solid var(--qrk-origin-line, #bdccd6); border-radius: 14px;
 background: var(--qrk-origin-surface, #edf1f5); color: var(--qrk-origin-ink, #29384b); box-shadow: 0 12px 48px #0006;
 font: inherit;
}
.qrk-ui-alert::backdrop { background: #101b2980; backdrop-filter: blur(4px); }
.qrk-ui-alert h2 { margin: 0 0 20px; font-size: 18px; color: inherit; }
.qrk-ui-alert label { display: grid; gap: 8px; font-size: 12px; }
.qrk-ui-alert :is(input, select) {
 box-sizing: border-box; width: 100%; padding: 10px 12px; border: 1px solid var(--qrk-origin-line, #bdccd6);
 border-radius: 7px; background: var(--qrk-origin-canvas, #f3f5f7); color: var(--qrk-origin-ink, #29384b); font: inherit;
}
.qrk-ui-alert .qrk-ui-alert-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 20px; }
.qrk-ui-alert button { padding: 8px 16px; border: 1px solid var(--qrk-origin-line, #bdccd6); border-radius: 7px; background: var(--qrk-origin-canvas, #f3f5f7); color: var(--qrk-origin-ink, #29384b); cursor: pointer; }
.qrk-ui-alert button[type="submit"] { background: var(--qrk-origin-selected, #d6e9eb); border-color: var(--qrk-origin-green, #167b76); color: var(--qrk-origin-green, #167b76); }

.qrk-ui-alert button:disabled { opacity: .4; cursor: default; }


.qrk-ui-alert:not([open]) { display: none; }
.qrk-ui-alert { display: block; max-height: calc(100vh - 40px); overflow: auto; }
.qrk-ui-alert h2 > [data-qrk-icon] { margin-right: .5em; color: var(--qrk-alert-tone, inherit); }
.qrk-ui-alert[data-tone] { border-color: var(--qrk-alert-tone); }
.qrk-ui-alert-note { color: var(--qrk-origin-muted, #68778a); font-size: 12px; line-height: 1.5; margin-top: 12px; }
.qrk-ui-alert .qrk-ui-alert-default { background: var(--qrk-origin-green, #167b76); border-color: var(--qrk-origin-green, #167b76); color: var(--qrk-origin-canvas, #fff); font-weight: 600; }
.qrk-ui-alert:has(.qrk-ui-alert-default) button[type="submit"]:not(.qrk-ui-alert-default) { background: transparent; border-color: var(--qrk-origin-line, #bdccd6); color: var(--qrk-origin-text, #526174); }
.qrk-ui-alert button.qrk-button { color: var(--qrk-button-ink); border-color: var(--qrk-button-ink); background: color-mix(in srgb, var(--qrk-button-ink) 15%, var(--qrk-origin-surface, #edf1f5)); }
.qrk-ui-alert[data-tone="info"] { --qrk-alert-tone: var(--qrk-color-info, #32658d); }
.qrk-ui-alert[data-tone="alert"] { --qrk-alert-tone: var(--qrk-color-accent, #087f98); }
.qrk-ui-alert[data-tone="warning"] { --qrk-alert-tone: var(--qrk-color-warning, #796016); }
.qrk-ui-alert[data-tone="caution"] { --qrk-alert-tone: var(--qrk-color-caution, #985317); }
.qrk-ui-alert[data-tone="danger"] { --qrk-alert-tone: var(--qrk-color-danger, #a33d43); }
.qrk-ui-alert[data-tone="success"] { --qrk-alert-tone: var(--qrk-color-success, #167b76); }
.qrk-ui-alert[data-tone="dark"] { --qrk-alert-tone: var(--qrk-color-ink, #29384b); }
.qrk-ui-alert[data-tone="light"] { --qrk-alert-tone: var(--qrk-color-muted, #68778a); }

/* Frontend pages may not load the admin palette; standalone alerts supply it locally. */
.qrk-ui-alert:not(.qrk-origin-menu *) {
 --qrk-color-info: #32658d; --qrk-color-accent: #087f98; --qrk-color-warning: #796016; --qrk-color-caution: #985317;
 --qrk-color-danger: #a33d43; --qrk-color-success: #167b76; --qrk-color-ink: #29384b; --qrk-color-text: #526174;
 --qrk-color-white: #fff; --qrk-color-muted: #68778a; --qrk-color-surface: #edf1f5; --qrk-color-border: #bdccd6;
}

/* Match the reserved viewport gutter to the surface beneath the modal scrim. */
.qrk-ui-alert { --qrk-alert-gutter-color: color-mix(in srgb, var(--qrk-origin-surface, #edf1f5) 50%, #101b29); }

/* Keep the native select behavior, with a quieter field and an inset chevron. */
.qrk-ui-alert select,

.qrk-ui-alert select:focus {
 border-color: var(--qrk-origin-green, #167b76);
 outline: 1px solid var(--qrk-origin-green, #167b76) !important; outline-offset: 0 !important;
 box-shadow: none;
}
