update

resources/scss/app.scss

@@ -5,6 +5,7 @@
 @use "modules/shipment-presets";
 @use "modules/delivery-status";
 @use "modules/delivery-status-mappings";
+@use "modules/global-search";
 
 * {
   box-sizing: border-box;

resources/scss/modules/_global-search.scss

@@ -0,0 +1,92 @@
+.global-search {
+  flex: 1;
+  max-width: 500px;
+  position: relative;
+  margin: 0 16px;
+}
+
+.global-search__input {
+  width: 100%;
+  padding: 6px 12px;
+  font-size: 13px;
+  border: 1px solid var(--c-border);
+  border-radius: 4px;
+  background: var(--c-bg);
+  color: var(--c-text);
+  outline: none;
+  transition: border-color 0.15s;
+
+  &::placeholder {
+    color: var(--c-text-muted, #94a3b8);
+  }
+
+  &:focus {
+    border-color: var(--c-primary, #3b82f6);
+    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15);
+  }
+}
+
+.global-search__results {
+  display: none;
+  position: absolute;
+  top: 100%;
+  left: 0;
+  right: 0;
+  margin-top: 4px;
+  background: var(--c-surface, #fff);
+  border: 1px solid var(--c-border);
+  border-radius: 6px;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
+  max-height: 400px;
+  overflow-y: auto;
+  z-index: 1000;
+}
+
+.global-search__item {
+  display: block;
+  padding: 8px 12px;
+  cursor: pointer;
+  text-decoration: none;
+  color: var(--c-text);
+  border-bottom: 1px solid var(--c-border);
+  transition: background-color 0.1s;
+
+  &:last-child {
+    border-bottom: none;
+  }
+
+  &:hover,
+  &.is-highlighted {
+    background: var(--c-bg, #f1f5f9);
+  }
+}
+
+.global-search__item-title {
+  font-weight: 600;
+  font-size: 13px;
+  margin-bottom: 2px;
+}
+
+.global-search__item-details {
+  font-size: 11px;
+  color: var(--c-text-muted, #64748b);
+}
+
+.global-search__empty {
+  padding: 12px;
+  text-align: center;
+  color: var(--c-text-muted, #94a3b8);
+  font-size: 13px;
+}
+
+@media (max-width: 768px) {
+  .global-search {
+    max-width: none;
+    margin: 0 8px;
+  }
+
+  .global-search__input {
+    font-size: 12px;
+    padding: 5px 8px;
+  }
+}