/* Warehouse inventory: final, page-scoped mobile layout. Loaded after legacy styles. */
.inventory-shell {
  --warehouse-green: #075d39;
  --warehouse-ink: #101b16;
  --warehouse-muted: #72777c;
  --warehouse-line: #e5e7e4;
  background: #fffefa !important;
  color: var(--warehouse-ink) !important;
  padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important;
}

.inventory-shell .portal-header.with-back {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) max-content !important;
  gap: 10px !important;
  min-height: 76px !important;
  padding: 0 20px !important;
  border-bottom: 1px solid var(--warehouse-line) !important;
  background: #fffefa !important;
}

/* The warehouse detail uses exactly the same header layout as the warehouse list. */
.inventory-shell .portal-header:not(.with-back) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) max-content !important;
  gap: 10px !important;
  min-height: 68px !important;
  padding: 10px var(--pk-page, 20px) !important;
  border-bottom: 1px solid var(--warehouse-line) !important;
  background: #fffefa !important;
}

.inventory-shell .portal-header:not(.with-back) .brand {
  grid-column: 1 !important;
  justify-self: start !important;
  min-width: 0 !important;
  overflow: visible !important;
  color: var(--warehouse-green) !important;
  font: 700 22px/1 Georgia, "Times New Roman", serif !important;
  white-space: nowrap !important;
}

.inventory-shell .portal-header:not(.with-back) .header-actions {
  grid-column: 2 !important;
  justify-self: end !important;
  gap: 8px !important;
}

.inventory-shell .inventory-back {
  display: inline-flex !important;
  width: auto !important;
  min-width: 0 !important;
  height: 44px !important;
  padding: 0 !important;
  align-items: center !important;
  gap: 0 !important;
  color: var(--warehouse-green) !important;
  background: transparent !important;
  border: 0 !important;
  font: 500 18px/1 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

.inventory-shell .inventory-back > span {
  display: inline !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
}

.inventory-shell .inventory-back > span:first-child {
  font-size: 34px !important;
  font-weight: 400 !important;
  line-height: .8 !important;
}

.inventory-shell .portal-header .brand {
  grid-column: 2 !important;
  min-width: 0 !important;
  color: var(--warehouse-green) !important;
  font: 700 20px/1 Georgia, "Times New Roman", serif !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.inventory-shell .portal-header.with-back .inventory-back { grid-column: 1 !important; justify-self: start !important; }
.inventory-shell .portal-header.with-back .header-actions { grid-column: 3 !important; justify-self: end !important; }

.inventory-shell .portal-header .header-actions { display: flex !important; gap: 8px !important; }
.inventory-shell .portal-header .language-trigger { min-width: 76px !important; height: 44px !important; padding: 0 9px !important; }
.inventory-shell .portal-header .avatar { width: 46px !important; height: 46px !important; min-height: 46px !important; }

.inventory-shell .inventory-intro {
  display: grid !important;
  grid-template-columns: max-content minmax(110px, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 0 !important;
  padding: 11px 20px !important;
  border-bottom: 1px solid var(--warehouse-line) !important;
  background: #fffefa !important;
}
.inventory-shell .inventory-kicker { grid-column: 1 / -1 !important; margin: 0 !important; color: #626a66 !important; font: 500 15px/1.2 Inter, sans-serif !important; letter-spacing: .04em !important; }
.inventory-shell .inventory-intro h1 { margin: 0 !important; color: #0d1812 !important; font: 500 28px/1 Georgia, "Times New Roman", serif !important; letter-spacing: -.04em !important; }
.inventory-shell .inventory-review-trigger {
  justify-self: stretch !important;
  width: 100% !important;
  min-height: 40px !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--warehouse-green) !important;
  color: #fff !important;
  font: 700 15px/1 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  white-space: nowrap !important;
}
.inventory-shell .inventory-intro > div { display: contents !important; }
.inventory-shell .inventory-intro > div p { grid-column: 1 !important; margin: 8px 0 0 !important; color: #3f4743 !important; font: 400 17px/1.35 Inter, sans-serif !important; }
.inventory-shell .inventory-intro > div b { grid-column: 2 !important; grid-row: 2 / span 2 !important; align-self: end !important; margin: 0 0 3px !important; color: var(--warehouse-green) !important; font: 500 16px/1.2 Inter, sans-serif !important; white-space: nowrap !important; }

.inventory-shell .inventory-list { display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }
.inventory-shell .inventory-row {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: center !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 12px 20px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--warehouse-line) !important;
  border-radius: 0 !important;
  background: #fffefa !important;
  box-shadow: none !important;
}
.inventory-shell .inventory-row-mark { display: block !important; width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; border: 1.5px solid var(--warehouse-green) !important; border-radius: 50% !important; background: transparent !important; box-sizing: border-box !important; }
.inventory-shell .inventory-row h2 { margin: 0 !important; color: #111411 !important; font: 600 18px/1.12 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; letter-spacing: -.025em !important; overflow-wrap: normal !important; }
.inventory-shell .inventory-row p { margin: 5px 0 0 !important; color: var(--warehouse-muted) !important; font: 400 13px/1.2 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important; white-space: nowrap !important; overflow-wrap: normal !important; }
.inventory-shell .inventory-row p span { margin: 0 10px !important; }

.inventory-shell .inventory-toolbar { position: fixed !important; z-index: 30 !important; left: 50% !important; bottom: calc(88px + env(safe-area-inset-bottom)) !important; display: grid !important; grid-template-columns: minmax(0, 1fr) 56px !important; gap: 12px !important; width: min(calc(100% - 32px), 430px) !important; padding: 0 !important; transform: translateX(-50%) !important; background: transparent !important; }
.inventory-shell .inventory-search { display: flex !important; align-items: center !important; min-width: 0 !important; height: 56px !important; padding: 0 16px !important; border: 1px solid #d9ddd9 !important; border-radius: 13px !important; background: #fffefa !important; box-shadow: 0 8px 20px rgba(11, 28, 18, .08) !important; }
.inventory-shell .inventory-search input { width: 100% !important; min-width: 0 !important; border: 0 !important; outline: 0 !important; background: transparent !important; color: #26312a !important; font: 400 16px/1 Inter, sans-serif !important; }
.inventory-shell #inventory-filter { width: 56px !important; height: 56px !important; min-width: 56px !important; border: 1px solid #e1e4e1 !important; border-radius: 50% !important; background: #fffefa !important; color: var(--warehouse-green) !important; box-shadow: 0 8px 20px rgba(11, 28, 18, .10) !important; }

.inventory-shell nav { z-index: 25 !important; display: grid !important; grid-template-columns: repeat(3, 1fr) !important; width: min(calc(100% - 32px), 430px) !important; height: 76px !important; padding: 0 10px !important; border: 0 !important; border-radius: 26px !important; background: rgba(255,255,253,.98) !important; box-shadow: 0 7px 18px rgba(9,27,16,.16) !important; }
.inventory-shell nav a { display: grid !important; place-items: center !important; gap: 3px !important; padding: 9px 2px !important; color: #9a9d9a !important; font: 400 14px/1 Inter, sans-serif !important; white-space: nowrap !important; overflow-wrap: normal !important; }
.inventory-shell nav a.on { color: var(--warehouse-green) !important; font-weight: 600 !important; }

@media (max-width: 374px) {
  .inventory-shell .portal-header.with-back { grid-template-columns: 48px minmax(0, 1fr) max-content !important; gap: 5px !important; padding-inline: 14px !important; }
  .inventory-shell .inventory-back { font-size: 16px !important; }
  .inventory-shell .portal-header .brand { font-size: 19px !important; }
  .inventory-shell .portal-header .language-trigger { min-width: 64px !important; padding-inline: 6px !important; }
  .inventory-shell .inventory-row { grid-template-columns: 32px minmax(0, 1fr) !important; gap: 13px !important; padding: 11px 16px !important; }
  .inventory-shell .inventory-row-mark { width: 28px !important; height: 28px !important; min-width: 28px !important; min-height: 28px !important; }
  .inventory-shell .inventory-row h2 { font-size: 17px !important; }
}