/* Shared small bits used across apps. */

.app-toolbar { flex: none; display: flex; align-items: center; gap: 6px; padding: 8px 12px; border-bottom: 1px solid var(--stroke); background: var(--bg-1); }
.app-toolbar .title { font-weight: 600; font-size: 13px; }
.app-toolbar .spacer { flex: 1; }
.tool-btn {
  display: inline-flex; align-items: center; gap: 7px;
  height: 30px; padding: 0 11px; border-radius: var(--radius-s);
  font-size: 12px; color: var(--text-1); border: 1px solid var(--stroke);
  background: var(--bg-2);
}
.tool-btn:hover { background: var(--bg-3); border-color: var(--stroke-2); }
.tool-btn.primary { background: var(--accent); border-color: transparent; color: #fff; }
.tool-btn.primary:hover { background: var(--accent-2); }
.tool-btn.danger { color: #ff6b5e; }
.tool-btn[disabled] { opacity: .45; pointer-events: none; }
.tool-icon { width: 30px; height: 30px; border-radius: var(--radius-s); display: grid; place-items: center; color: var(--text-2); }
.tool-icon:hover { background: var(--hover); color: var(--text-1); }

.progress-track { height: 6px; border-radius: 6px; background: var(--bg-4); overflow: hidden; }
.progress-track i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--accent), var(--accent-2)); transition: width .3s; }

.empty-state { display: grid; place-content: center; justify-items: center; gap: 10px; height: 100%; color: var(--text-3); padding: 30px; text-align: center; }
.empty-state .icon { opacity: .6; }
.empty-state .es-t { font-size: 13px; color: var(--text-2); }

select.field { padding: 7px 10px; }
