.top-nav {
  position: sticky; top: 0; z-index: 1000;
  background: #fff; border-bottom: 1px solid var(--border);
  box-shadow: 0 2px 6px rgba(0,0,0,.04);
}
.top-nav .nav-inner {
  max-width: 1900px; margin: 0 auto; padding: .5rem .75rem;
  display: grid; gap: .5rem;
}

/* 上層：Grid 排三區，自動換行 */
.utility-bar {
  display: grid;
  grid-template-columns: 1fr auto; /* 品牌 | 使用者 | 操作 */
  align-items: center; gap: var(--gap);
    width: 100%;
}


.left-group {
  display: flex;
  align-items: center;
  gap: .75rem;
}

.right-group {
  display: flex;
  align-items: center;
}

.brand {
  font-weight: 700; color: var(--brand); text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.user-card {
  border: 1px solid var(--border);
  padding: .35rem .5rem; border-radius: .5rem;
  font-size: .95rem; white-space: nowrap; min-width: 0;
}
.actions {
  display: inline-flex; align-items: center; gap: .5rem; min-width: 0;
}

/* 下層：Tabs + 合計 */
.tabs-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: end; gap: var(--gap);
  border-top: 1px solid var(--border); padding-top: .25rem;
}

/* Tabs：保持你原有語意，但做成可換行且一致 */
.tabs {
  display: flex; flex-wrap: wrap; gap: .25rem .5rem;
  list-style: none; margin: 0; padding: 0;
}
.tabs > li { min-width: 0; }
.tabs .nav-link {
  display: inline-block;
  padding: .4rem .75rem; border-radius: .5rem;
  text-decoration: none; border: 1px solid transparent;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  color: #333; background: #f6f6f6;
}
.tabs .nav-link.active { background: #e9f2ff; border-color: #cfe2ff; color: #084298; }

/* 小徽章 */
.badge { display: inline-block; padding: .15rem .5rem; border-radius: .5rem; font-size: .85rem; }
.badge.qty { background: #f1f3f5; color: #495057; }
.badge.amt { background: #fff4e6; color: #d9480f; }

/* 合計區 */
.tabs-agg { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.agg-label { color: #666; font-size: .9rem; }

/* 按鈕/下拉（統一風格） */
.btn {
  border: 1px solid var(--border); background: #fff;
  padding: .4rem .75rem; border-radius: .5rem; cursor: pointer;
}
.btn:hover { background: #f8f9fa; }
.btn-ghost, .btn.btn-ghost {
  background: transparent; border: 1px dashed var(--border);
}
.select {
  border: 1px solid var(--border); background: #fff; padding: .35rem .5rem; border-radius: .5rem;
}

/* RWD：窄螢幕自動疊放 */
@media (max-width: 992px) {
  .utility-bar { grid-template-columns: 1fr; }
  .actions { flex-wrap: wrap; }
  .tabs-row { grid-template-columns: 1fr; row-gap: .5rem; }
}

.search-group {
  display: flex;
  align-items: center;
  gap: .5rem;
}