@import url("/shared/hub-app.css?v=whub-20260526-layout13");

.walmart-brand__logo {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.walmart-brand__logo::before,
.walmart-brand__logo::after {
  display: none;
}

.walmart-topbar-status {
  min-width: min(320px, 36vw);
  min-height: 0;
  padding-block: 10px;
}

.walmart-health-pill {
  display: grid;
  gap: 4px;
  min-width: 150px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 86%, var(--surface-raised)) 0%, var(--surface) 100%);
}

.walmart-health-pill span,
.walmart-meta {
  color: var(--muted);
  font-size: 12px;
  font-weight: var(--fw-strong);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.walmart-health-pill strong {
  font-size: 15px;
  line-height: 1.4;
}

.walmart-workspace-grid {
  grid-template-columns: minmax(0, 1.6fr) minmax(300px, 0.84fr);
}

.walmart-workspace .hub-main-grid__rail {
  position: sticky;
  top: 24px;
  align-self: start;
}

.walmart-workspace .hub-store-identity__overview {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.walmart-workspace .hub-store-domain-box {
  min-width: 0;
}

.walmart-publish-layout {
  align-items: start;
}

.walmart-publish-layout > .hub-subpanel,
.walmart-publish-layout__left > .hub-subpanel {
  min-height: 100%;
}

.walmart-publish-grid,
.walmart-runtime-grid {
  align-items: end;
}

.walmart-runtime-grid {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.walmart-sync-overview {
  position: sticky;
  top: 24px;
}

.walmart-kpi-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.walmart-results-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
}

.walmart-overview-kpis {
  margin-top: 0;
}

.walmart-workspace .hub-step-strip a.hub-step-chip {
  color: inherit;
  text-decoration: none;
}

.walmart-teach-card {
  display: grid;
  gap: 18px;
  align-content: start;
}

.walmart-mini-checklist {
  display: grid;
  gap: 8px;
  margin-top: 16px;
}

.walmart-mini-checklist span {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.walmart-mini-checklist span::before {
  content: "";
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  margin-top: 6px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #67d7ff));
}

.walmart-mini-checklist--panel {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.walmart-note-card {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 84%, var(--surface-raised)) 0%, var(--surface) 100%);
  box-shadow: var(--shadow-soft);
}

.walmart-note-card--soft {
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent-soft) 46%, var(--surface)) 0%, var(--surface) 100%);
}

.walmart-note-card--compact strong {
  font-size: 16px;
}

.walmart-note-card strong {
  display: block;
  margin-top: 8px;
  font-size: 18px;
  line-height: 1.45;
  letter-spacing: -0.03em;
}

.walmart-note-card p:last-child {
  margin-bottom: 0;
}

.walmart-fc-choice-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.walmart-fc-choice {
  min-height: 42px;
  padding-inline: 16px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text);
  font-size: 13px;
  font-weight: var(--fw-strong);
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.walmart-fc-choice:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--accent-soft-strong) 50%, var(--line));
}

.walmart-fc-choice.is-active {
  border-color: transparent;
  background: linear-gradient(135deg, var(--accent-strong), color-mix(in srgb, var(--accent-strong) 62%, #67d7ff));
  color: #fff;
  box-shadow: 0 14px 24px rgba(79, 111, 255, 0.18);
}

.walmart-store-roster {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.walmart-roster-card {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 86%, var(--surface-raised)) 0%, var(--surface) 100%);
  box-shadow: var(--shadow-soft);
}

.walmart-roster-card.is-active {
  border-color: var(--accent-soft-strong);
  background: linear-gradient(180deg, var(--surface) 0%, var(--surface-tint) 100%);
}

.walmart-roster-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.walmart-roster-card__head strong {
  font-size: 16px;
  line-height: 1.45;
  letter-spacing: -0.02em;
}

.walmart-roster-card__head p,
.walmart-roster-card__meta,
.walmart-checklist p,
.walmart-activity-item p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.55;
  font-size: 13px;
}

.walmart-roster-card__meta {
  display: grid;
  gap: 4px;
}

.walmart-token-usage-card .hub-kpi strong {
  letter-spacing: -0.03em;
}

.token-usage-bars {
  display: grid;
  gap: 14px;
}

.token-usage-feature {
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 86%, var(--surface-raised)) 0%, var(--surface) 100%);
  box-shadow: var(--shadow-soft);
}

.token-usage-feature.is-empty {
  opacity: 0.84;
}

.token-usage-feature__head,
.token-usage-recent__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.token-usage-feature__head strong,
.token-usage-recent__head strong {
  font-size: 16px;
  line-height: 1.45;
  letter-spacing: -0.02em;
}

.token-usage-feature__head p,
.token-usage-feature__meta,
.token-usage-recent p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.token-usage-feature__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
}

.token-usage-feature__meta--secondary {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.token-usage-bar-track {
  position: relative;
  overflow: hidden;
  height: 12px;
  margin: 14px 0 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-tint) 60%, var(--line));
}

.token-usage-bar-fill {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent-strong), color-mix(in srgb, var(--accent-strong) 62%, #67d7ff));
}

.token-usage-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--accent-soft-strong) 52%, var(--line));
  background: color-mix(in srgb, var(--accent-soft) 40%, var(--surface));
  color: var(--text);
  font-size: 12px;
  font-weight: var(--fw-strong);
  white-space: nowrap;
}

.token-usage-trend__bars {
  display: grid;
  grid-template-columns: repeat(14, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
  min-height: 220px;
}

.token-usage-trend__item {
  position: relative;
  display: grid;
  gap: 8px;
  justify-items: center;
}

.token-usage-trend__bar-wrap {
  display: flex;
  align-items: end;
  justify-content: center;
  width: 100%;
  min-height: 172px;
  padding: 10px 0 0;
}

.token-usage-trend__bar {
  display: block;
  width: min(28px, 100%);
  min-height: 6px;
  border-radius: 999px 999px 8px 8px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent-strong) 76%, #9fe2ff) 0%, var(--accent-strong) 100%);
  box-shadow: 0 10px 20px rgba(79, 111, 255, 0.16);
}

.token-usage-trend__label {
  color: var(--muted);
  font-size: 11px;
  font-weight: var(--fw-strong);
  letter-spacing: 0.04em;
}

.token-usage-trend__tooltip {
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.45;
}

.token-usage-recent {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 86%, var(--surface-raised)) 0%, var(--surface) 100%);
}

.token-usage-recent.is-error {
  border-color: color-mix(in srgb, #e26d5a 38%, var(--line));
  background: linear-gradient(180deg, color-mix(in srgb, #ffe4df 42%, var(--surface)) 0%, var(--surface) 100%);
}

.token-usage-recent__error {
  color: #b13b1f;
}

@media (max-width: 960px) {
  .token-usage-trend__bars {
    gap: 6px;
    min-height: 180px;
  }

  .token-usage-trend__bar-wrap {
    min-height: 132px;
  }
}

.walmart-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface);
  font-size: 12px;
  font-weight: var(--fw-medium);
  white-space: nowrap;
}

.walmart-pill.is-success {
  border-color: color-mix(in srgb, #2f9e44 35%, var(--line));
  background: color-mix(in srgb, #2f9e44 12%, var(--surface));
  color: #23763a;
}

.walmart-pill.is-warning {
  border-color: color-mix(in srgb, #d97706 35%, var(--line));
  background: color-mix(in srgb, #d97706 12%, var(--surface));
  color: #9a5a08;
}

.walmart-pill.is-muted {
  color: var(--muted);
}

.walmart-mode-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.walmart-mode-button.is-active {
  background: linear-gradient(135deg, var(--accent-strong), color-mix(in srgb, var(--accent-strong) 62%, #67d7ff));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 14px 24px rgba(79, 111, 255, 0.18);
}

.walmart-friendly-result {
  white-space: pre-line;
}

.walmart-activity-list {
  display: grid;
  gap: 12px;
}

.walmart-activity-item {
  padding: 16px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 84%, var(--surface-raised)) 0%, var(--surface) 100%);
  box-shadow: var(--shadow-soft);
}

.walmart-activity-item span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: var(--fw-strong);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.walmart-activity-item strong {
  display: block;
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.walmart-details {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 84%, var(--surface-raised)) 0%, var(--surface) 100%);
  box-shadow: var(--shadow-soft);
}

.walmart-details + .walmart-details {
  margin-top: 16px;
}

.walmart-details > summary {
  cursor: pointer;
  list-style: none;
  padding: 18px;
  font-weight: var(--fw-strong);
}

.walmart-details > summary::-webkit-details-marker {
  display: none;
}

.walmart-result-log {
  margin: 0;
  padding: 0 18px 18px;
  max-height: 560px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, monospace;
  font-size: 13px;
  line-height: 1.55;
}

.walmart-raw-editors {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 0 18px 18px;
}

.walmart-raw-editors label {
  gap: 10px;
}

.walmart-raw-editors--form {
  align-items: end;
}

.walmart-raw-editors--form textarea {
  min-height: 0;
}

.walmart-raw-editors textarea {
  min-height: 260px;
  font-family: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, monospace;
  font-size: 12.5px;
}

.walmart-raw-editors__full {
  grid-column: 1 / -1;
}

.walmart-checklist {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.walmart-checklist article {
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-soft) 84%, var(--surface-raised)) 0%, var(--surface) 100%);
}

.walmart-checklist strong {
  display: block;
  font-size: 15px;
  line-height: 1.45;
}

#processStatus,
#walmartSyncStatus {
  white-space: pre-line;
}

.walmart-products-card .hub-page-head__chips {
  margin-top: 12px;
}

.products-title-cell--walmart {
  align-items: flex-start;
}

.walmart-products-table td {
  vertical-align: top;
}

.walmart-products-table {
  min-width: 1480px;
}

.walmart-products-table th:first-child,
.walmart-products-table td:first-child {
  min-width: 500px;
  width: 34%;
}

.walmart-products-table th:nth-child(2),
.walmart-products-table td:nth-child(2) {
  min-width: 160px;
}

.walmart-products-table th:nth-child(3),
.walmart-products-table td:nth-child(3),
.walmart-products-table th:nth-child(4),
.walmart-products-table td:nth-child(4) {
  min-width: 200px;
}

.walmart-products-table th:nth-child(5),
.walmart-products-table td:nth-child(5) {
  min-width: 170px;
}

.walmart-products-table .products-title-cell__copy {
  max-width: min(100%, 52ch);
}

.walmart-products-identifiers {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  min-height: 18px;
}

.walmart-products-identifiers-text {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

.walmart-products-text-cell {
  min-width: 180px;
  max-width: 240px;
}

.walmart-products-text-cell span,
.walmart-products-table .hub-table__multiline span {
  display: block;
  white-space: normal;
  word-break: break-word;
}

.walmart-products-table code {
  font-size: 12px;
}

.walmart-products-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--surface-soft);
  color: var(--text);
  font-size: 12px;
  font-weight: var(--fw-strong);
  letter-spacing: 0.01em;
  white-space: nowrap;
}

.walmart-products-pill.is-success {
  border-color: color-mix(in srgb, #2a9d63 36%, var(--line));
  background: color-mix(in srgb, #2a9d63 16%, var(--surface));
  color: #16633f;
}

.walmart-products-pill.is-warning {
  border-color: color-mix(in srgb, #d48a1f 40%, var(--line));
  background: color-mix(in srgb, #f2c879 22%, var(--surface));
  color: #8a5412;
}

.walmart-products-pill.is-info {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
  background: color-mix(in srgb, var(--accent-soft) 58%, var(--surface));
  color: color-mix(in srgb, var(--accent-strong) 72%, #153260);
}

.product-connections-progress-wrap {
  max-height: 360px;
  overflow: auto;
}

.product-connections-progress-table {
  min-width: 100%;
  table-layout: fixed;
}

.product-connections-progress-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: color-mix(in srgb, var(--surface-soft) 88%, var(--surface));
}

.product-connections-progress-table th:first-child,
.product-connections-progress-table td:first-child {
  width: 168px;
  min-width: 168px;
}

.product-connections-progress-table__time {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}

.product-connections-progress-table .hub-table__multiline span {
  display: block;
  white-space: normal;
  word-break: break-word;
  line-height: 1.6;
}

.walmart-products-pill.is-muted {
  border-color: color-mix(in srgb, var(--muted) 30%, var(--line));
  background: color-mix(in srgb, var(--surface-soft) 82%, var(--surface));
  color: var(--muted);
}

.walmart-products-mini-tag {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  margin-left: 8px;
  margin-top: 6px;
  padding: 0 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--accent-soft) 54%, var(--surface));
  color: color-mix(in srgb, var(--accent-strong) 72%, #153260);
  font-size: 11px;
  font-weight: var(--fw-strong);
}

.upc-pool-overview-panel,
.upc-pool-rules-panel {
  min-height: 100%;
}

.upc-pool-editor-panel {
  grid-column: 1 / -1;
}

.upc-pool-assignments-panel {
  grid-column: 1 / -1;
}

.upc-pool-textarea {
  min-height: 420px;
  font-family: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, monospace;
  font-size: 12.5px;
  line-height: 1.6;
  resize: vertical;
}

.upc-pool-assignment-list {
  display: grid;
  gap: 12px;
}

.upc-pool-assignment-item {
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--surface-soft) 86%, var(--surface-raised)) 0%,
    var(--surface) 100%
  );
}

.upc-pool-assignment-item__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.upc-pool-assignment-item__head strong {
  font-size: 15px;
  line-height: 1.45;
  word-break: break-word;
}

.upc-pool-assignment-item__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 10px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.6;
}

@media (max-width: 1280px) {
  .walmart-workspace .hub-main-grid__rail {
    position: static;
  }

  .walmart-sync-overview {
    position: static;
  }
}

@media (max-width: 900px) {
  .walmart-topbar-status {
    min-width: 0;
  }

  .walmart-results-grid {
    grid-template-columns: 1fr;
  }

  .walmart-kpi-grid {
    grid-template-columns: 1fr;
  }

  .upc-pool-overview-panel,
  .upc-pool-rules-panel,
  .upc-pool-editor-panel {
    grid-column: auto;
  }

  .upc-pool-assignments-panel {
    grid-column: auto;
  }
}

@media (max-width: 760px) {
  .walmart-raw-editors {
    grid-template-columns: 1fr;
  }

  .products-pagination {
    width: 100%;
    justify-content: stretch;
  }

  .products-pagination > * {
    flex: 1 1 auto;
  }
}