#dialog {
font-family:var(--ui-font-family);
}
#application button {
font-size:var(--ui-text-body-size); font-weight:var(--ui-font-emphasis);
}
#application h1 {
margin: 0;
}
#application h2 {
margin: 0;
}
#application h3 {
margin: 0;
}
#application p {
margin: 0;
}
#application h1 {
font-size:var(--ui-text-title-size); font-weight:var(--ui-font-emphasis); line-height:var(--ui-text-title-line);
}
#application h2 {
font-size:var(--ui-text-section-size); font-weight:var(--ui-font-emphasis); line-height:var(--ui-text-section-line);
}
#application h3 {
font-size:var(--ui-text-section-size); font-weight:var(--ui-font-emphasis);
}
#application .muted {
color: var(--muted);
}
#dialog .muted {
color: var(--muted);
}
#application p.muted {
font-size:var(--ui-text-help-size); line-height:var(--ui-text-help-line);
}
.button-native.secondary {
--ui-control-background: #f8fafd;
}
.button-native.ghost {
--ui-control-background: transparent;
}
.button-native.danger {
--ui-control-background: #fff0ef; --ui-control-border: var(--ui-border-width) solid #f4b8b8; --ui-control-color: var(--danger);
}
.field-native {
display: flex; flex-direction: column; gap: 5px; min-width: 0;
}
.field-native>span {
font-size:var(--ui-text-help-size); font-weight:var(--ui-font-emphasis); color: var(--muted);
}
.field-native>small {
font-size:var(--ui-text-help-size); color: var(--muted);
}
.native-input {
width: 100%; min-width: 0; --ui-control-border: 1px solid #aebbcc; --ui-control-background: #fff; --ui-control-color: #263241; min-height: 40px; --ui-control-padding: 8px 10px; font-family:var(--ui-font-family);font-size:var(--ui-text-body-size);font-weight:var(--ui-font-label);line-height:var(--ui-text-body-line);
}
.native-select {
width: 100%; min-width: 0; --ui-control-border: 1px solid #aebbcc; --ui-control-background: #fff; --ui-control-color: #263241; min-height: 40px; --ui-control-padding: 8px 10px; font-family:var(--ui-font-family);font-size:var(--ui-text-body-size);font-weight:var(--ui-font-label);line-height:var(--ui-text-body-line);
}
#application textarea {
width: 100%; min-width: 0; border: 1px solid #aebbcc; border-radius: var(--ui-radius); background: #fff; color: #263241; min-height: 40px; padding: 8px 10px; font-family:var(--ui-font-family);font-size:var(--ui-text-body-size);font-weight:var(--ui-font-label);line-height:var(--ui-text-body-line); outline: none;
}
.native-input:focus {
--ui-control-border: var(--ui-border-width) solid #4b8ad8;
}
.native-select:focus {
--ui-control-border: var(--ui-border-width) solid #4b8ad8;
}
#application textarea:focus {
border-color: #4b8ad8; box-shadow: 0 0 0 1px #4b8ad8;
}
.native-input:disabled {
--ui-control-background: #eef2f6; --ui-control-color: #7a8796;
}
.native-select:disabled {
--ui-control-background: #eef2f6; --ui-control-color: #7a8796;
}
.inline-error {
color: var(--danger); padding: 10px 14px; background: #feecec; border: 1px solid #f4b8b8; border-radius: var(--ui-radius); white-space: pre-wrap;
}
#dialog {
border: 1px solid var(--line); border-radius: var(--ui-radius); padding: 0; color: var(--text); width: 650px; max-width: calc(100vw - 32px); max-height: calc(100vh - 40px); box-shadow: 0 20px 75px #14243740; overflow: auto;
}
#dialog::backdrop {
background: #0b121b40;
}
.dialog-hero {
padding: 20px 24px; border-bottom: 1px solid var(--line); background: #f8fafd;
}
.dialog-hero .kicker {
font-size:var(--ui-text-help-size); font-weight:var(--ui-font-emphasis); letter-spacing: .8px; color: var(--teal); margin-bottom: 7px;
}
.dialog-hero h2 {
font-size:var(--ui-text-title-size); margin: 0 0 5px; font-weight:var(--ui-font-emphasis);
}
.dialog-body {
padding: 20px 24px; display: flex; flex-direction: column; gap: 14px;
}
.dialog-body p {
margin: 0; white-space: pre-wrap; line-height:var(--ui-text-body-line);
}
.dialog-footer {
display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid var(--line); background: #f8fafd;
}
.busy {
cursor: progress!important;
}
.button-native {
--ui-control-border: 1px solid #aebbcc; --ui-control-background: #fff; --ui-control-color: #111827; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: 7px; text-decoration: none; font-family:var(--ui-font-family);font-size:var(--ui-text-body-size);font-weight:var(--ui-font-emphasis);line-height:var(--ui-text-body-line);
}
.button-native.primary {
--ui-control-background: #ff7a1a; --ui-control-border: var(--ui-border-width) solid #ff7a1a; --ui-control-color: #fff;
}
.dialog-body .field-native {
display: flex; flex-direction: column; gap: 5px;
}
.dialog-body .native-input {
height: 40px; width: 100%; --ui-control-border: 1px solid #aebbcc; --ui-control-padding: 6px 10px; font-family:var(--ui-font-family);font-size:var(--ui-text-body-size);font-weight:var(--ui-font-regular);line-height:var(--ui-text-body-line);
}
.dialog-body .native-select {
height: 40px; width: 100%; --ui-control-border: 1px solid #aebbcc; --ui-control-padding: 6px 10px; font-family:var(--ui-font-family);font-size:var(--ui-text-body-size);font-weight:var(--ui-font-regular);line-height:var(--ui-text-body-line);
}
[hidden] {
display: none!important;
}
.operation-wait {
border: 0; background: transparent; box-shadow: none; color: #fff; padding: 24px; max-width: calc(100vw - 32px); font-family:var(--ui-font-family);font-size:var(--ui-text-section-size);font-weight:var(--ui-font-emphasis);line-height:var(--ui-text-section-line); text-align: center; outline: none; overflow: visible; cursor: wait;
}
.operation-wait::backdrop {
background: #0b121b99; cursor: wait;
}
.operation-wait-dots {
display: inline-block; animation: operation-wait-dots 1.2s steps(1,end) infinite;
}
@keyframes operation-wait-dots {
0%,100%{clip-path:inset(0 66.6667% 0 0)}33.3333%{clip-path:inset(0 33.3333% 0 0)}66.6667%{clip-path:inset(0 0 0 0)}
}
@media(prefers-reduced-motion:reduce) {
.operation-wait-dots {
animation: none;
}
}
