/* One interaction pattern for forms opened from the shell and workbenches. */
body:has(dialog.ui-form-drawer[open]) {overflow:hidden}
dialog.ui-form-drawer {
  position:fixed;
  inset:0 0 0 auto;
  width:min(680px,100vw);
  max-width:100vw;
  height:100dvh;
  max-height:100dvh;
  margin:0;
  padding:0;
  overflow:auto;
  border:0;
  border-radius:16px 0 0 16px;
  background:var(--ui-surface);
  color:var(--ui-text);
  box-shadow:-16px 0 48px #0d1b3450;
}
dialog.ui-form-drawer::backdrop {background:#0d1b3499}
.ui-form-drawer .ui-form-drawer-header {
  position:sticky;
  top:0;
  z-index:4;
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:68px;
  padding:16px 24px;
  border-bottom:1px solid var(--ui-line);
  background:var(--ui-surface);
}
.ui-form-drawer .ui-form-drawer-header h2 {margin:0;font-size:19px;line-height:1.2;letter-spacing:-.02em}
.ui-form-drawer .ui-form-drawer-close {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  padding:0;
  border:1px solid var(--ui-line);
  border-radius:9px;
  background:var(--ui-surface-soft);
  color:var(--ui-muted);
  cursor:pointer;
}
.ui-form-drawer .ui-form-drawer-close .ui-icon {width:18px;height:18px}
.ui-form-drawer .ui-form-drawer-close:focus-visible {outline:3px solid #7bb3ff;outline-offset:2px}
.ui-form-drawer .ui-form-drawer-body {padding:20px 24px 28px}
.ui-form-drawer .incident-create-form {max-width:none;padding:0}
.ui-form-drawer .incident-create-form h2 {display:none}
.ui-form-drawer .incident-create-form .intro {margin:0 0 20px;color:var(--ui-muted);font-size:13px;line-height:1.5}
.ui-form-drawer .incident-form-field label,.ui-form-drawer .problem-create-form label {color:var(--ui-text);font-size:12px;font-weight:650}
.ui-form-drawer .incident-form-field :is(input,textarea,select),.ui-form-drawer .problem-create-form :is(input,textarea,select) {background:var(--ui-surface-soft);border-color:var(--ui-line);color:var(--ui-text)}
.ui-form-drawer .incident-create-actions,.ui-form-drawer .problem-create-actions {padding:14px 0 0;margin-top:14px;border-top:1px solid var(--ui-line)}
.ui-form-drawer .account-page {max-width:none;margin:0}
.ui-form-drawer .account-page-header {margin:0 0 18px}
.ui-form-drawer .account-page-header h1 {display:none}
.ui-form-drawer .account-page-header p {font-size:13px;line-height:1.5}
.ui-form-drawer .account-layout {display:block}
.ui-form-drawer .account-form {display:grid;grid-column:auto;grid-row:auto;padding:0;border:0;background:transparent;box-shadow:none}
.ui-form-drawer .account-aside {display:none}
.ui-form-drawer .account-section {padding:18px;background:var(--ui-surface-soft)}
.ui-form-drawer .account-actions {padding-top:14px;border-top:1px solid var(--ui-line)}
.theme-dark dialog.ui-form-drawer,.theme-dark .ui-form-drawer .ui-form-drawer-header {background:var(--ui-surface);color:var(--ui-text)}
@media(max-width:760px) {
  dialog.ui-form-drawer {width:100vw;border-radius:0}
  .ui-form-drawer .ui-form-drawer-header {padding:12px 16px}
  .ui-form-drawer .ui-form-drawer-body {padding:16px}
  .ui-form-drawer .account-fields {grid-template-columns:1fr}
  .ui-form-drawer .account-fields .wide {grid-column:auto}
}