/* Inventory overview: identity, current balance and the two daily actions.
   History, minimum stock and editing remain in the product detail screen. */
#stockView .card.inventory-card {
  display: flex !important;
  flex-direction: column;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  gap: 0 !important;
  border-radius: 14px !important;
  background: var(--ds-surface) !important;
  box-shadow: none !important;
  backdrop-filter: none;
}
#stockView .card.inventory-card:hover { box-shadow: none !important; }
#stockView .card.inventory-card.card--selected { box-shadow: 0 0 0 2px #77b1cb26 !important; }
#stockView .inventory-card__open { display: block; width: 100%; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--ds-muted); cursor: pointer; }
#stockView .card.inventory-card .card__img {
  flex: 0 0 auto;
  display: block;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 7px 7px 0 !important;
  aspect-ratio: auto !important;
  background: transparent !important;
  border-radius: 0;
}
#stockView .card.inventory-card .card__img img,
#stockView .card.inventory-card .card__image-placeholder {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover;
  border-radius: 8px !important;
}
#stockView .card.inventory-card .card__image-placeholder { display: grid; place-items: center; }
#stockView .card.inventory-card .card__body {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 9px 10px 10px !important;
  gap: 6px !important;
}
#stockView .card.inventory-card .card__title,
#stockView .card.inventory-card .card__title .ws-product-link {
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  letter-spacing: -.01em;
  text-transform: none !important;
  overflow: visible !important;
  overflow-wrap: anywhere;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}
#stockView .card.inventory-card .card__title .ws-product-link {
  display: block;
  min-height: 44px !important;
  width: 100%;
}
#stockView .card.inventory-card .inventory-search-sku { font-size: 12px !important; line-height: 1.4 !important; }
#stockView .inventory-card__balance {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 3px 8px;
  min-width: 0;
  margin-top: auto;
  padding-block: 1px 3px;
}
#stockView .inventory-card__quantity {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  color: var(--ds-text);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
#stockView .inventory-card__quantity strong { font-size: 26px; line-height: 1.15; font-weight: 650; letter-spacing: -.035em; }
#stockView .inventory-card__quantity small { color: var(--ds-muted); font-size: 12px; line-height: 1.4; font-weight: 400; letter-spacing: 0; }
#stockView .inventory-card__status { color: var(--ds-warning); font-size: 12px; line-height: 1.35; font-weight: 500; }
#stockView .inventory-card__status.is-empty { color: var(--ds-danger); }
#stockView .card.inventory-card .card__footer { margin: 0 !important; padding: 0 !important; }
#stockView .card.inventory-card .card__actions-inline { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; }
#stockView .card.inventory-card .card__actions-inline .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 44px !important;
  height: auto !important;
  padding: 8px 4px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
  font-weight: 550 !important;
  white-space: nowrap;
}
body #stockView .card.inventory-card .card__actions-inline .btn.btn--compact-remove { color: var(--ds-text) !important; }

/* The list has no empty history column or unused edit-button slot. */
body[data-inventory-layout="list"] #stockView .card.inventory-row {
  grid-template-columns: 52px minmax(0, 1fr) auto auto;
  min-height: 0 !important;
  gap: 12px;
  padding: 10px !important;
  box-shadow: none !important;
}
#stockView .inventory-row__identity { gap: 2px; }
#stockView .inventory-row .inventory-card__status { font-size: 12px; }
#stockView .inventory-row__quantity { display: flex; align-items: baseline; gap: 4px; }
#stockView .inventory-row__quantity strong { font-size: 24px; }
#stockView .inventory-row__quantity small { font-size: 12px; }
#stockView .inventory-row__actions { grid-column: auto; display: flex; gap: 6px; }
#stockView .inventory-row__actions .btn { min-height: 44px !important; height: auto !important; font-size: 12px !important; padding: 8px 12px !important; }

/* Keep display preferences one step away from daily stock actions. */
#stockView .ws-display-options { position: relative; min-width: 0; }
#stockView .ws-display-options > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 44px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: var(--ds-muted);
  font-size: 12px;
  font-weight: 550;
  line-height: 1.4;
  list-style: none;
  cursor: pointer;
}
#stockView .ws-display-options > summary::-webkit-details-marker { display: none; }
#stockView .ws-display-options > summary::after { content: "⌄"; font-size: 14px; }
#stockView .ws-display-options[open] > summary,
#stockView .ws-display-options > summary:hover { color: var(--ds-text); background: var(--ds-elevated); }
#stockView .ws-display-options[open] > summary::after { transform: rotate(180deg); }
#stockView .ws-display-options__body {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 15;
  width: max-content;
  max-width: calc(100vw - 32px);
  padding: 6px;
  border: 1px solid var(--ds-border);
  border-radius: 12px;
  background: var(--ds-surface);
  box-shadow: 0 10px 24px #0005;
}
#stockView .ws-display-options .inventory-layout { border: 0; border-radius: 8px; background: transparent; flex-wrap: wrap; padding: 0; }
#stockView .ws-display-options .inventory-layout button { min-height: 44px !important; }
#stockView .ws-inventory-toolbar .flow-toolbar .btn,
#stockView .ws-inventory-toolbar #bulkToggleBtn {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--ds-muted) !important;
  box-shadow: none !important;
}
#stockView .ws-inventory-toolbar .flow-toolbar .btn:hover,
#stockView .ws-inventory-toolbar #bulkToggleBtn:hover { color: var(--ds-text) !important; background: var(--ds-elevated) !important; }
#stockView .ws-inventory-toolbar #bulkToggleBtn.is-active { color: var(--ds-accent) !important; background: var(--ds-soft) !important; }

/* Desktop navigation can give its space back to the working area. */
@media (min-width: 1200px) {
  #wsSidebarToggle {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    width: 100%;
    margin: -14px 0 12px;
    padding: 8px 12px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--ds-muted);
    font: inherit;
    font-size: 12px;
    text-align: left;
    cursor: pointer;
  }
  #wsSidebarToggle svg { flex: 0 0 20px; width: 20px; height: 20px; }
  #wsSidebarToggle:hover { background: var(--ds-elevated); color: var(--ds-text); }
  body[data-sidebar="collapsed"] { --rail-width: 76px; }
  body[data-sidebar="collapsed"] #mobileNav { padding-inline: 10px; }
  body[data-sidebar="collapsed"] #mobileNav .workspace-brand { justify-content: center; padding: 4px 0 24px; }
  body[data-sidebar="collapsed"] #mobileNav .workspace-brand > span:last-child,
  body[data-sidebar="collapsed"] #mobileNav .mobile-nav__item > span,
  body[data-sidebar="collapsed"] #wsSidebarToggle > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  body[data-sidebar="collapsed"] #mobileNav .mobile-nav__item,
  body[data-sidebar="collapsed"] #wsSidebarToggle { justify-content: center; gap: 0; padding: 10px 0; min-height: 44px; }
  body[data-sidebar="collapsed"] #wsSidebarToggle { margin-block: -8px 12px; }
}

@media (max-width: 767px) {
  #stockView .card.inventory-card .card__body { padding: 7px 9px 9px !important; }
  #stockView .card.inventory-card .card__img { padding: 6px 6px 0 !important; }
  #stockView .card.inventory-card .card__title,
  #stockView .card.inventory-card .card__title .ws-product-link { font-size: 14px !important; }
  #stockView .inventory-card__quantity strong { font-size: 25px; }
  body[data-inventory-layout="list"] #stockView .card.inventory-row { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 6px 10px; }
  #stockView .inventory-row__actions { grid-column: 2 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-view="stock"][data-stock-tools="closed"] #stockView .ws-inventory-toolbar .inventory-viewbar { display: flex !important; }
  #stockView .ws-inventory-toolbar .inventory-viewbar { flex: 0 0 auto; gap: 4px; }
  #stockView .ws-inventory-toolbar .flow-toolbar { flex: 1 1 auto; gap: 0; }
  #stockView .ws-inventory-toolbar .flow-toolbar .btn,
  #stockView .ws-inventory-toolbar #bulkToggleBtn { min-height: 44px !important; padding-inline: 7px !important; font-size: 12px !important; }
  body[data-stock-tools="closed"] #stockView .ws-display-options { display: none; }
  body[data-stock-tools="open"] #stockView .ws-inventory-toolbar .inventory-viewbar { flex: 1 1 100%; }
  #stockView .ws-display-options { flex: 1 1 auto; }
  #stockView .ws-display-options__body { position: static; width: auto; max-width: 100%; margin-top: 4px; box-shadow: none; }
  #stockView .ws-display-options .inventory-layout { display: flex; }
  #stockView .ws-display-options .inventory-layout button { flex: 1 1 70px; padding-inline: 6px; }
}

/* A narrow phone needs readable actions more than a second card column. */
@media (max-width: 359px) {
  body:not([data-inventory-layout="list"]):not([data-inventory-layout="table"]) #stockView #grid { grid-template-columns: minmax(0, 1fr) !important; gap: 8px !important; }
  #stockView .card.inventory-card {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 10px !important;
    padding: 10px !important;
    align-items: start;
  }
  #stockView .card.inventory-card .card__img { margin: 0 !important; padding: 0 !important; }
  #stockView .card.inventory-card .card__body { padding: 0 !important; gap: 5px !important; }
  #stockView .card.inventory-card .card__actions-inline { gap: 5px !important; }
}

@media (min-width: 768px) and (max-width: 1199px) {
  body:not([data-inventory-layout="list"]):not([data-inventory-layout="table"]) #stockView #grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important; }
  body.ws-product-open[data-inventory-layout="list"] #stockView .card.inventory-row { grid-template-columns: 44px minmax(0, 1fr) auto; }
  body.ws-product-open #stockView .inventory-row__actions { grid-column: 2 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Keep the short landscape-phone arrangement usable after removing its old stock box. */
@media (min-width: 768px) and (max-width: 1199px) and (max-height: 520px) {
  body:not([data-inventory-layout="list"]):not([data-inventory-layout="table"]) #stockView #grid { grid-template-columns: minmax(0, 1fr) !important; }
  body:not([data-inventory-layout="list"]) #stockView .card.inventory-card { display: grid !important; grid-template-columns: 88px minmax(0, 1fr); gap: 12px !important; padding: 10px !important; }
  body:not([data-inventory-layout="list"]) #stockView .card.inventory-card .card__img { padding: 0 !important; }
  body:not([data-inventory-layout="list"]) #stockView .card.inventory-card .card__body { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(150px, .55fr); gap: 4px 12px !important; padding: 0 !important; }
  #stockView .card.inventory-card .card__title { grid-column: 1; }
  #stockView .card.inventory-card .inventory-card__balance { grid-column: 2; grid-row: 1; align-self: center; margin: 0; }
  #stockView .card.inventory-card .card__footer { grid-column: 1 / -1; }
}

/* Initial placeholders share the real card/list hierarchy and dimensions. */
#stockView .card--skeleton .inventory-card__open{width:100%;display:block}
#stockView .card--skeleton .skel--square{display:block}
#stockView .card--skeleton .stock-placeholder-text{color:transparent!important;display:inline-block;min-width:40%;border-radius:5px;background:rgba(255,255,255,.07);animation:stock-placeholder-pulse 1.25s ease-in-out infinite}
#stockView .card--skeleton .inventory-card__quantity small{visibility:hidden}
#stockView .card--skeleton .btn{opacity:1;color:transparent!important;background:rgba(255,255,255,.05)!important}
@keyframes stock-placeholder-pulse{50%{opacity:.45}}@media(prefers-reduced-motion:reduce){#stockView .stock-placeholder-text{animation:none!important}}

/* Bulk actions are opt-in, including before scripts and restored page snapshots. */
html body:not([data-stock-bulk="active"]) #stockView #bulkToolbar{display:none!important}