/* App shell: MDI desktop, child windows, taskbar. */

html, body { height: 100%; }

#view-app { display: flex; flex-direction: column; height: 100vh; }
.app-navbar { flex: 0 0 auto; min-height: 3rem; }

.app-desktop {
  position: relative;
  flex: 1 1 auto;
  overflow: hidden;
  background: var(--tblr-bg-surface-secondary);
}

.app-taskbar {
  flex: 0 0 auto;
  display: flex;
  gap: .25rem;
  padding: .25rem .5rem;
  background: var(--tblr-bg-surface);
  border-top: 1px solid var(--tblr-border-color);
  overflow-x: auto;
  min-height: 2.6rem;
}
.app-taskbar:empty { display: none; }
.app-taskbar .task-btn {
  flex: 0 0 auto;
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---- child windows (desktop >= 992px) ---- */
.app-window {
  position: absolute;
  display: flex;
  flex-direction: column;
  min-width: 320px;
  min-height: 240px;
  background: var(--tblr-bg-surface);
  border: 1px solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
  box-shadow: var(--tblr-box-shadow);
  overflow: hidden;
}
.app-window.maximized {
  left: 0 !important; top: 0 !important;
  width: 100% !important; height: 100% !important;
  border-radius: 0;
}

.window-titlebar {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .35rem .6rem;
  background: var(--tblr-primary);
  color: #fff;
  cursor: move;
  user-select: none;
  touch-action: none;
  flex: 0 0 auto;
}
.app-window:not(.active) .window-titlebar {
  background: var(--tblr-bg-surface-tertiary);
  color: var(--tblr-body-color);
}
.window-title {
  flex: 1 1 auto;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.window-titlebar .btn-win {
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0 .3rem;
  line-height: 1;
  font-size: 1rem;
  opacity: .85;
}
.window-titlebar .btn-win:hover { opacity: 1; }

.window-body {
  flex: 1 1 auto;
  overflow: auto;
  padding: .75rem;
}

.window-resize {
  position: absolute;
  right: 0; bottom: 0;
  width: 16px; height: 16px;
  cursor: nwse-resize;
  touch-action: none;
}
.window-resize::after {
  content: '';
  position: absolute;
  right: 3px; bottom: 3px;
  width: 8px; height: 8px;
  border-right: 2px solid var(--tblr-border-color-dark, #999);
  border-bottom: 2px solid var(--tblr-border-color-dark, #999);
}

/* ---- mobile / tablet (< 992px): stacked full-width forms ---- */
@media (max-width: 991.98px) {
  .app-desktop { overflow-y: auto; }
}
.app-window.mobile {
  position: static !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  box-shadow: none;
}
.app-window.mobile .window-titlebar { cursor: default; }
.app-window.mobile .window-resize { display: none; }
.app-window.mobile.hidden-mobile { display: none; }

/* misc */
.form-error-summary:empty { display: none; }