/* Imprimindo Lucro — operational design system, October 2026.
   Color communicates action and state; information stays on neutral surfaces. */
:root {
  color-scheme: dark;
  --ds-bg: #0B1118;
  --ds-surface: #141F2B;
  --ds-elevated: #192837;
  --ds-inset: #101820;
  --ds-text: #e5edf3;
  --ds-muted: #a4b4c3;
  --ds-border: #2b3b4b;
  --ds-accent: #77b1cb;
  --ds-action: #77b1cb;
  --ds-on-action: #ffffff;
  --ds-soft: #17313c;
  --ds-rail: #0f1922;
  --ds-danger: #ff9690;
  --ds-warning: #edc073;
  --text: var(--ds-text); --muted: var(--ds-muted);
  --bg0: var(--ds-bg); --bg1: var(--ds-bg); --bg2: var(--ds-inset);
  --glass: var(--ds-surface); --glass-strong: var(--ds-elevated);
  --glass-border: var(--ds-border); --glass-edge: #425869;
  --a-text: var(--ds-text); --a-sub: var(--ds-muted); --a-surface: var(--ds-surface); --a-border: var(--ds-border);
  --ui-bg: var(--ds-bg); --ui-panel: var(--ds-surface); --ui-text: var(--ds-text); --ui-muted: var(--ds-muted); --ui-border: var(--ds-border); --ui-accent: var(--ds-accent);
  --shadow-md: 0 4px 18px #00000024; --shadow-lg: 0 20px 70px #00000066;
  --apple-green-bg: var(--ds-soft); --apple-green-text: #77b1cb; --apple-green-border: #314f5c;
  --apple-green-bg-hover: #21404e; --apple-green-border-hover: #456a7b;
}
html, body { background: var(--ds-bg) !important; color: var(--ds-text); }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size: 14px; letter-spacing: -.012em; -webkit-font-smoothing: antialiased; }
body::before { background: var(--ds-bg); }
h1, h2, h3 { color: var(--ds-text); letter-spacing: -.035em; }
button, input, select, textarea { font-family: inherit; }
button { touch-action: manipulation; }
::selection { background: #285468; color: #ffffff; }
.skip-link { background: var(--ds-elevated); color: var(--ds-text); border: 1px solid var(--ds-accent); }
:where(button, a, input, select, textarea, summary):focus-visible { outline: 3px solid #77b1cb !important; outline-offset: 3px; }
.btn, .icon-btn, .fin-icon-btn { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; color: var(--ds-muted) !important; border-radius: 10px !important; box-shadow: 0 1px 2px #00000024 !important; font-weight: 600; transition: background .15s, border-color .15s, box-shadow .15s; }
.btn:hover, .icon-btn:hover, .fin-icon-btn:hover { border-color: #496273 !important; background: var(--ds-elevated) !important; }
.btn.btn--primary { background: var(--ds-action) !important; border-color: var(--ds-action) !important; color: var(--ds-on-action) !important; }
.btn.btn--primary:not(:disabled):hover { background: #77b1cb !important; border-color: #77b1cb !important; color: var(--ds-on-action) !important; }
.btn.btn--danger { background: #382427 !important; color: var(--ds-danger) !important; border-color: #664044 !important; }
.btn:disabled { opacity: .5; box-shadow: none !important; }
.input, select.input, textarea.input { color: var(--ds-text) !important; background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; border-radius: 10px !important; min-height: 44px; box-shadow: 0 1px 2px #00000024 !important; }
.input:focus { border-color: #77b1cb !important; box-shadow: 0 0 0 3px #77b1cb1f !important; }
.input::placeholder { color: var(--ds-muted) !important; opacity: 1; }
label, .hint, .edit-hint { color: var(--ds-muted); }
option { color: var(--ds-text); background: var(--ds-surface); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--ds-accent); }
.topbar { background: #0B1118f5 !important; border-bottom: 1px solid var(--ds-border) !important; backdrop-filter: blur(12px); padding-block: 18px !important; gap: 16px !important; }
.topbar, .topbar * { color: var(--ds-text) !important; }
.topbar .btn--primary { color: var(--ds-on-action) !important; }
.topbar .page-eyebrow { display: block; color: var(--ds-muted) !important; font-size: 10px; font-weight: 650; text-transform: uppercase; letter-spacing: .13em; margin-bottom: 5px; }
#viewTitle { font-size: 28px !important; font-weight: 720 !important; line-height: 1.15 !important; letter-spacing: -.045em !important; }
#viewSubtitle { color: var(--ds-muted) !important; font-size: 12px !important; margin-top: 5px; }
.topbar__actions #search.search-main { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; font-size: 14px !important; font-weight: 450 !important; padding-left: 15px !important; border-radius: 12px !important; }
.topbar__actions #search.search-main::placeholder { color: var(--ds-muted) !important; }
.sort-refresh-row #sortBy, #refresh { background: var(--ds-surface) !important; color: var(--ds-muted) !important; border: 1px solid var(--ds-border) !important; font-size: 12px !important; border-radius: 10px !important; }
#refresh { font-size: 0 !important; }
#refresh::before, #refresh::after { color: var(--ds-muted) !important; }
#bellNotifBtn { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; color: var(--ds-muted) !important; border-radius: 12px !important; }
.bell-btn__badge { background: #b74741 !important; color: var(--ds-on-action) !important; box-shadow: 0 0 0 3px var(--ds-bg); font-size: 9px !important; }
.topbar .chip { background: var(--ds-elevated); border-color: var(--ds-border); color: var(--ds-muted) !important; }
.app-content:focus { outline: none; }
.mobile-nav { background: var(--ds-rail) !important; border-color: var(--ds-border) !important; box-shadow: none !important; }
.workspace-brand { color: #f1f7f8; padding-bottom: 28px; }
.workspace-brand small { color: #8faab6; font-size: 10px; }
.workspace-brand__mark { background: #1e3e4c; color: #a0d3ea; border-radius: 11px; font-size: 16px; letter-spacing: -.1em; padding-right: 2px; }
.mobile-nav__item { color: #a9bfca !important; font-weight: 550; border-radius: 10px; }
.mobile-nav__item svg { stroke-width: 1.65; }
.mobile-nav__item:hover { background: #ffffff07 !important; color: #f4fcff !important; }
.mobile-nav__item[aria-current="page"] { background: #d8ecf511 !important; color: #d2e8f1 !important; box-shadow: inset 3px 0 #77b1cb; }
[data-mobile-nav="more"] { border-color: var(--ds-border) !important; }
.side-menu { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; box-shadow: 0 16px 64px #00000040 !important; color: var(--ds-text); }
.mobile-menu-head { letter-spacing: -.03em; }
.side-accordion { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.side-accordion__summary { color: var(--ds-muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.side-menu__btn { color: var(--ds-text) !important; background: var(--ds-elevated) !important; border-color: var(--ds-border) !important; text-align: left; }
.side-menu__btn.is-active { color: var(--ds-accent) !important; border-color: #27434f !important; background: var(--ds-soft) !important; }
.side-menu-backdrop { background: #050a106b !important; backdrop-filter: blur(3px); }
#stockView .kpis { gap: 12px !important; padding-top: 18px !important; }
#stockView .kpi { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; border-radius: 14px !important; padding: 15px 16px !important; min-height: 88px; gap: 12px; box-shadow: 0 2px 4px #00000024; }
#stockView .kpi__icon { display: flex !important; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 12px; background: var(--ds-elevated); color: var(--ds-muted); flex-shrink: 0; }
#stockView .kpi__icon svg { width: 20px; height: 20px; }
#stockView .kpi__label { color: var(--ds-muted) !important; font-size: 11px !important; font-weight: 550; text-transform: none; letter-spacing: 0 !important; }
#stockView .kpi__value { color: var(--ds-text) !important; font-size: 27px !important; font-weight: 720; line-height: 1.25; letter-spacing: -.04em; }
#stockView .kpi--warn .kpi__icon { background: #372b19; color: var(--ds-warning); }
#stockView .kpi--danger .kpi__icon { background: #382427; color: var(--ds-danger); }
#stockView .kpi--warn .kpi__value { color: var(--ds-warning) !important; }
#stockView .kpi--danger .kpi__value { color: var(--ds-danger) !important; }
#stockView .kpi--btn:hover { border-color: #496273 !important; transform: translateY(-1px); }
#statusFilters { gap: 6px !important; padding-top: 18px !important; }
#stockView #statusFilters .chip { background: transparent !important; border: 1px solid transparent !important; border-radius: 9px !important; color: var(--ds-muted) !important; padding: 8px 13px !important; font-size: 12px !important; min-height: 38px !important; box-shadow: none; }
#stockView #statusFilters .chip.is-active { background: var(--ds-soft) !important; border-color: #27434f !important; color: #77b1cb !important; }
#densityToggle { color: var(--ds-muted) !important; background: transparent !important; border-color: var(--ds-border) !important; min-height: 36px; }
#stockView .bulk-toolbar { margin-top: 8px !important; border: 0 !important; background: transparent !important; box-shadow: none; }
#bulkToggleBtn { min-height: 34px !important; padding: 6px 10px !important; font-size: 11px !important; background: transparent !important; border-color: transparent !important; color: var(--ds-muted) !important; }
#bulkActionsRow { padding: 12px; border: 1px solid #27434f; border-radius: 12px; background: var(--ds-soft); }
#stockView .grid { padding-top: 12px !important; align-items: stretch; }
#stockView .card { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; border-radius: 15px !important; box-shadow: 0 2px 3px #00000024 !important; transition: border-color .16s, box-shadow .16s; overflow: hidden; }
#stockView .card:hover { border-color: #496273 !important; box-shadow: 0 5px 18px #00000040 !important; transform: none; }
#stockView .card--selected { border-color: var(--ds-accent) !important; box-shadow: 0 0 0 2px #77b1cb1f !important; }
#stockView .card__img { margin: 0; padding: 7px !important; background: var(--ds-surface) !important; border: 0 !important; color: var(--ds-muted); font-size: 11px; border-radius: 0; }
#stockView .card__img::after { display: none !important; }
#stockView .card__img img { border-radius: 9px !important; }
#stockView .card__body { padding: 10px 11px 11px !important; gap: 5px !important; display: flex !important; flex-direction: column; }
#stockView .card__title { color: var(--ds-text) !important; font-size: 13px !important; font-weight: 650 !important; letter-spacing: -.015em; line-height: 1.35 !important; min-height: 2.7em !important; margin: 0 0 1px !important; overflow-wrap: anywhere; }
#stockView .card__obs { color: var(--ds-muted) !important; font-size: 11px; }
#stockView .card__availability { display: flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 600; color: #77b1cb; }
#stockView .card__availability::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
#stockView .card__availability.is-low { color: var(--ds-warning); }
#stockView .card__availability.is-empty { color: var(--ds-danger); }
#stockView .card__split { background: var(--ds-elevated) !important; border: 0 !important; border-radius: 9px !important; padding: 8px 9px !important; gap: 3px !important; margin-top: 4px !important; }
#stockView .card__stock-line { color: var(--ds-muted) !important; font-size: 10px !important; align-items: baseline; }
#stockView .card__stock-line strong { color: var(--ds-text) !important; font-size: 22px !important; font-weight: 700; letter-spacing: -.04em; }
#stockView .card__stock-line strong small { font-size: 10px; font-weight: 500; color: var(--ds-muted); letter-spacing: 0; }
#stockView .card__min-qty { border: 0 !important; padding-top: 0 !important; color: var(--ds-muted) !important; font-size: 10px !important; }
#stockView .card__min-qty strong { font-size: 11px !important; color: var(--ds-muted) !important; font-weight: 600; }
#stockView .card__meta { color: var(--ds-muted) !important; font-size: 9px !important; line-height: 1.35; margin-top: 2px; }
#stockView .card__footer { margin-top: auto !important; padding-top: 9px !important; }
#stockView .card__actions-inline { gap: 6px !important; }
#stockView .card__actions-inline .btn { border-radius: 8px !important; font-size: 10px !important; font-weight: 650; }
#stockView .card__actions-inline .btn--primary { background: var(--ds-soft) !important; color: #77b1cb !important; border: 1px solid #27434f !important; }
#stockView .card__actions-inline .btn--primary:hover { background: #21404e !important; }
#stockView .card__actions-inline .btn--compact-remove { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; color: var(--ds-muted) !important; }
#stockView .card__img-top-right { top: 10px !important; right: 10px !important; }
#stockView .card__img-top-right .btn { background: #17242fef !important; border: 1px solid #496273 !important; color: var(--ds-text) !important; box-shadow: 0 1px 5px #00000040 !important; border-radius: 9px !important; opacity: 1; }
#stockView .card__img-top-right svg { width: 15px; height: 15px; }
#stockView .card__pricing-dot { width: auto; height: auto; position: absolute; left: 12px; right: auto; bottom: 12px; border: 1px solid #3d5360; border-radius: 5px; background: #17242fef; color: var(--ds-warning); padding: 3px 5px; font-size: 8px; line-height: 1; box-shadow: none; animation: none; }
#stockView .card__bulk-check { background: var(--ds-surface); border: 1px solid var(--ds-border); color: var(--ds-text); border-radius: 8px; }
.empty { color: var(--ds-muted); border: 1px dashed var(--ds-border); border-radius: 16px; background: var(--ds-surface); margin: 24px; padding: 48px 20px; text-align: center; }
.empty strong, .empty span { display: block; }
.empty strong { font-size: 18px; color: var(--ds-text); margin-bottom: 7px; }
.skel { background: linear-gradient(90deg,var(--ds-elevated),var(--ds-inset),var(--ds-elevated)) !important; background-size: 200% 100% !important; }
.dialog { background: var(--ds-surface) !important; color: var(--ds-text); border: 1px solid var(--ds-border) !important; border-radius: 20px !important; box-shadow: 0 24px 80px #00000040 !important; }
.dialog::backdrop { background: #050a109e !important; backdrop-filter: blur(4px); }
.dialog__header { background: var(--ds-surface) !important; border-bottom: 1px solid var(--ds-border) !important; padding: 20px !important; }
.dialog__header h3 { font-size: 21px; color: var(--ds-text) !important; font-weight: 650; }
.dialog__content { color: var(--ds-muted); padding: 20px !important; gap: 10px !important; }
.dialog__content label { font-size: 12px; color: var(--ds-muted) !important; }
.dialog__actions, .dialog__footer { background: var(--ds-inset) !important; border-top: 1px solid var(--ds-border) !important; padding: 16px 20px !important; }
.balance { background: var(--ds-soft) !important; color: #77b1cb; border-color: #27434f !important; border-radius: 12px; padding: 14px; }
.balance__row strong { color: #77b1cb; font-size: 20px; }
.balance--negative { background: #382427 !important; border-color: #664044 !important; }
.balance--negative .balance__row strong { color: var(--ds-danger); }
.form-error, .login-error { color: var(--ds-danger); }
.hint { font-size: 11px; color: var(--ds-muted); }
#qtyDialog { max-width: 440px; }
#dlgQty { font-size: 26px !important; font-weight: 650; text-align: center; min-height: 60px; font-variant-numeric: tabular-nums; }
.toast { background: #17323e !important; color: #f2fbff !important; border: 1px solid #3e6677 !important; border-radius: 12px; box-shadow: 0 6px 24px #00000040; }
.toast--remove, .toast--error { background: #753d37 !important; border-color: #9c6358 !important; }
.login-overlay { background: #101820f5 !important; }
.login-card { background: var(--ds-surface) !important; border: 1px solid var(--ds-border) !important; color: var(--ds-text); box-shadow: 0 20px 60px #00000040 !important; padding: 32px !important; border-radius: 24px !important; }
.login-card h2 { font-size: 27px; line-height: 1.15; margin: 28px 0 8px; }
.login-brand { display: flex; gap: 10px; align-items: center; color: var(--ds-text); font-size: 12px; font-weight: 650; }
.login-brand > span { display: grid; place-items: center; width: 36px; height: 36px; background: var(--ds-soft); color: #77b1cb; border-radius: 10px; font-weight: 750; }
.login-description { color: var(--ds-muted); font-size: 13px; margin: 0 0 25px; }
.login-card label { color: var(--ds-muted); font-size: 12px; }
.login-card .input { min-height: 48px; margin: 6px 0 16px; }
.login-remember { font-size: 11px !important; gap: 8px; }
.login-card .btn--primary { min-height: 48px; width: 100%; margin-top: 10px; }
#productionStageNav { display: none; }
.production-load-status { font-size: 12px; color: var(--ds-muted); padding: 10px 14px; background: var(--ds-elevated); border: 1px solid var(--ds-border); border-radius: 10px; margin-bottom: 12px; }
.production-load-status.is-error { color: var(--ds-danger); background: #382427; border-color: #664044; }
.upseller__tab-icon svg { width: 17px; height: 17px; vertical-align: middle; }
.kanban-column { scroll-margin-top: 140px; }
@media (min-width: 1200px) {
  .topbar { padding: 22px 26px 18px !important; }
  #stockView .grid { padding-inline: 26px !important; gap: 12px !important; }
  #stockView .card__img img { max-height: 142px; }
  #stockView .card__meta { min-height: 24px; }
  #stockView .card__actions-inline .btn { min-height: 33px !important; height: 33px !important; }
  #stockView .kpis { padding-inline: 26px !important; }
  #statusFilters { padding-inline: 26px !important; }
  .workspace-brand { padding-bottom: 36px; }
  .mobile-nav { padding-top: 27px; }
  .mobile-nav__item { font-size: 12px; min-height: 44px; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  #stockView .kpi__icon { display: none !important; }
  #stockView .kpi { padding: 14px !important; }
  #viewTitle { font-size: 25px !important; }
  .topbar__actions.topbar__actions--search-first { grid-template-columns: minmax(0, 1fr) !important; }
  #stockView .card__actions-inline .btn { font-size: 12px !important; min-height: 44px !important; }
}
@media (max-width: 1199px) {
  #productionStageNav { display: flex; gap: 6px; margin-bottom: 12px; }
  #productionStageNav button { flex: 1; min-height: 44px; border-radius: 9px; background: var(--ds-surface); color: var(--ds-muted); border: 1px solid var(--ds-border); font-size: 11px; font-weight: 600; }
}
@media (max-width: 767px) {
  :root { --app-nav-height: 68px; }
  .topbar { padding: max(12px, env(safe-area-inset-top)) 16px 12px !important; gap: 13px !important; }
  .page-eyebrow { display: none !important; }
  #viewTitle { font-size: 24px !important; }
  #viewSubtitle { display: none !important; }
  .topbar__row--main { min-height: 40px; }
  .topbar__actions #search.search-main { min-height: 46px !important; font-size: 16px !important; }
  .topbar__actions .sort-refresh-row #sortBy { font-size: 12px !important; height: 42px !important; }
  .mobile-nav { background: #141F2Bf5 !important; border-top: 1px solid var(--ds-border) !important; padding-top: 7px; box-shadow: 0 -3px 18px #00000024 !important; }
  .mobile-nav__item { color: var(--ds-muted) !important; font-size: 10px; font-weight: 550; border-radius: 12px; gap: 4px; }
  .mobile-nav__item[aria-current="page"] { background: var(--ds-soft) !important; color: #77b1cb !important; box-shadow: none; }
  .mobile-nav__item:hover { color: #77b1cb !important; }
  .mobile-nav__item svg { width: 23px; height: 23px; }
  [data-mobile-nav="more"] { margin-top: 0; border: 0 !important; }
  .mobile-add { background: #77b1cb !important; border: 1px solid #438aaa !important; color: var(--ds-on-action) !important; box-shadow: 0 6px 18px #00000040; width: 50px; height: 50px; border-radius: 16px; }
  #stockView .kpis { gap: 8px !important; padding-top: 8px !important; }
  #stockView .kpi { flex-direction: row !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; min-height: 76px; padding: 12px !important; }
  #stockView .kpi__icon { display: none !important; }
  #stockView .kpi__label { font-size: 10px !important; }
  #stockView .kpi__value { font-size: 26px !important; }
  #stockView #statusFilters .chip { min-height: 42px !important; flex: 0 0 auto; padding-inline: 12px !important; font-size: 12px !important; }
  #statusFilters { padding-top: 12px !important; }
  #bulkToggleBtn { min-height: 44px !important; }
  #stockView .card__img { padding: 6px !important; }
  #stockView .card__body { padding: 9px !important; }
  #stockView .card__title { font-size: 13px !important; min-height: 2.7em !important; }
  #stockView .card__stock-line strong { font-size: 23px !important; }
  #stockView .card__actions-inline .btn { min-height: 44px !important; font-size: 12px !important; }
  #stockView .card__meta { font-size: 10px !important; }
  #stockView .card__pricing-dot { font-size: 8px; }
  .side-menu { border-radius: 22px !important; }
  .side-menu__btn { background: var(--ds-elevated) !important; }
  .kanban-column { scroll-margin-top: 85px; }
  .dialog { border-radius: 22px !important; }
  .dialog__header { padding: 18px !important; }
  .dialog__actions, .dialog__footer { padding-bottom: max(18px, env(safe-area-inset-bottom)) !important; }
}
@media (prefers-reduced-motion: reduce) {
  .btn, #stockView .card { transition: none; }
}
/* Match the specificity of the legacy stock overrides during migration. */
body .topbar .topbar__actions.topbar__actions--search-first #search.search-main {
  background: var(--ds-surface) !important; background-image: none !important; border: 1px solid var(--ds-border) !important; color: var(--ds-text) !important;
}
body .topbar .topbar__actions.topbar__actions--search-first #search.search-main::placeholder { color: var(--ds-muted) !important; opacity: 1; }
body .topbar .topbar__actions.topbar__actions--search-first #sortBy { background: var(--ds-surface) !important; color: var(--ds-muted) !important; border: 1px solid var(--ds-border) !important; }
body #stockView .kpi .kpi__icon { color: var(--ds-muted) !important; opacity: 1; filter: none; }
body #stockView .kpi--warn .kpi__icon { color: var(--ds-warning) !important; }
body #stockView .kpi--danger .kpi__icon { color: var(--ds-danger) !important; }
body #stockView .kpi .kpi__label { opacity: 1 !important; color: var(--ds-muted) !important; }
body #stockView .card .card__split .card__stock-line { color: var(--ds-muted) !important; font-size: 10px !important; }
body #stockView .card .card__split .card__stock-line strong { color: var(--ds-text) !important; font-size: 22px !important; }
body #stockView .card .card__split .card__min-qty { color: var(--ds-muted) !important; border: 0 !important; padding-top: 0 !important; }
body #stockView .card .card__split .card__min-qty strong { color: var(--ds-muted) !important; }
body #stockView .card .card__actions-inline .btn.btn--compact-remove { background: var(--ds-surface) !important; color: var(--ds-muted) !important; border-color: var(--ds-border) !important; }
body #stockView .card .card__actions-inline .btn.btn--compact-remove:hover { background: var(--ds-elevated) !important; border-color: #496273 !important; }
body #stockView .kpi .kpi__icon * { color: inherit !important; }
body #stockView #bulkToggleBtn { opacity: 1 !important; color: var(--ds-muted) !important; }
body #stockView .card__pricing-dot { font-size: 9px; }
body #stockView .card__meta { font-size: 10px !important; }
.production-load-status[data-state="error"] { color: var(--ds-danger); background: #382427; border-color: #664044; }
body #stockView .card .card__split .card__min-qty { color: var(--ds-muted) !important; }
body #stockView .card__meta { color: var(--ds-muted) !important; }
body #stockView .card__availability.is-ready { color: #77b1cb; }
body[data-density="comfortable"] #stockView .card__meta { font-size: 11px !important; }
#upsellerKanbanBoard .kanban-card__badges > span { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; height: auto !important; padding: 5px 9px !important; }
#upsellerKanbanBoard .production-qty-caption { display: inline !important; font-size: 10px; font-weight: 500; letter-spacing: 0; }
body[data-upseller-tab="production"] #upsellerStateCounts { display: none !important; }
@media (max-width: 767px) {
  #stockView .card__actions-inline .btn { font-size: 12px !important; }
}
#stockView .card__image-placeholder { display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 3; border-radius: 9px; background: var(--ds-elevated); color: var(--ds-muted); font-size: 11px; }
@media (max-width: 767px) { #stockView .card__image-placeholder { aspect-ratio: 1; } }

.production-load-status[data-state="warning"] { color: var(--ds-warning); background: #372b19; border-color: #5c4930; }

/* One navigation system per viewport; shared tools stay close to the task. */
.page-eyebrow, #openSettings, #goUpsellerBtn, #navigationMenu #openUpseller, #navigationMenu #openFinance, #navigationMenu #quickAdd, .menu-title-desktop { display: none !important; }
.topbar { padding-block: 14px !important; }
#viewTitle { font-size: 24px !important; }
#viewSubtitle { display: none !important; }
.topbar__right { gap: 8px !important; }
.mobile-menu-head { padding: 0 0 12px; margin-bottom: 4px; border-bottom: 1px solid var(--ds-border); }
.mobile-menu-head strong { font-size: 19px; }
#navigationMenu .side-accordion__summary { padding: 12px 0 8px; font-size: 10px; }
#navigationMenu .side-accordion__body { gap: 6px; }
#navigationMenu .side-menu__btn { min-height: 44px; padding: 10px 12px !important; border-radius: 8px !important; font-size: 13px !important; background: transparent !important; border-color: transparent !important; }
#navigationMenu .side-menu__btn:hover { background: var(--ds-elevated) !important; border-color: var(--ds-border) !important; }
#navigationMenu .side-menu__btn.is-active { background: var(--ds-soft) !important; color: var(--ds-accent) !important; }
.workspace-account { display: flex; flex-direction: column; gap: 4px; padding: 12px; color: var(--ds-text); font-size: 14px; }
.workspace-account > span { color: var(--ds-muted); font-size: 11px; }
.workspace-account > strong { overflow-wrap: anywhere; font-weight: 600; }
#navigationMenu #logoutBtn { color: var(--ds-danger) !important; }
.upseller__tabs [data-tab="production"], body[data-upseller-tab="production"] .upseller__tabs { display: none !important; }
#scanPanel:not([data-scanning="true"]) .scan__video { display: none; }
@media (min-width: 1200px) {
  #goBackBtn { display: none !important; }
  body[data-view="stock"] .topbar { display: grid !important; grid-template-columns: auto minmax(160px, 1fr) minmax(210px, .6fr) auto; grid-template-areas: "title search sort actions"; align-items: center; gap: 14px !important; padding: 16px 26px !important; }
  body[data-view="stock"] .topbar__row--main, body[data-view="stock"] .topbar__row--controls, body[data-view="stock"] .topbar__actions.topbar__actions--search-first { display: contents !important; }
  body[data-view="stock"] .topbar__left { grid-area: title; min-width: 0; }
  body[data-view="stock"] .topbar__right { grid-area: actions; }
  .topbar__controls-left { display: none !important; }
  body[data-view="stock"] .topbar #search.search-main { grid-area: search; width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; min-height: 42px !important; height: 42px !important; font-size: 13px !important; padding: 10px 12px !important; border-radius: 9px !important; }
  body[data-view="stock"] .sort-refresh-row { grid-area: sort; display: flex !important; gap: 8px; width: 100%; min-width: 0; margin: 0 !important; }
  body[data-view="stock"] .sort-refresh-row #sortBy { flex: 1; min-width: 0; width: 100%; min-height: 42px !important; height: 42px !important; padding: 8px 10px !important; }
  body[data-view="stock"] #refresh { min-height: 42px !important; height: 42px !important; width: 42px !important; min-width: 42px !important; }
  .topbar__right .btn { min-height: 42px !important; height: 42px !important; font-size: 12px; }
  #stockView .kpi { min-height: 72px; padding: 12px 14px !important; }
  #stockView .kpi__value { font-size: 25px !important; }
  #stockView .kpi__icon { width: 32px; height: 32px; border-radius: 9px; }
  .menu-destinations, .menu-title-mobile, .menu-account > summary { display: none !important; }
  .menu-title-desktop { display: inline !important; }
  #navigationMenu.side-menu { left: 14px; top: auto; bottom: 70px; width: 280px; max-height: calc(100dvh - 90px); border-radius: 14px !important; }
  .side-menu-backdrop { backdrop-filter: none !important; background: #050a1033 !important; }
}
@media (max-width: 767px) {
  #stockView .kpis { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 6px !important; }
  #stockView .kpi { min-height: 67px; padding: 9px 7px !important; }
  #stockView .kpi__label { font-size: 9px !important; white-space: normal; line-height: 1.25; min-height: 22px; }
  #stockView .kpi__value { font-size: 22px !important; }
  .topbar { gap: 10px !important; }
  #navigationMenu.side-menu { border-radius: 16px !important; }
}
@media (min-width: 1200px) {
  body[data-view="stock"] .topbar__right { display: flex !important; flex-wrap: nowrap !important; min-width: max-content; margin: 0; }
  body[data-view="stock"] .topbar__right > button { flex-shrink: 0; }
  body[data-view="stock"] #bellNotifBtn { width: 42px !important; min-width: 42px !important; padding: 0 !important; }
  body[data-view="stock"] .sort-refresh-row #sortBy { flex: 1 1 0 !important; min-width: 0 !important; max-width: 100%; }
  body[data-view="stock"] .sort-refresh-row #refresh { flex: 0 0 42px !important; margin: 0 !important; }
}
@media (max-width: 767px) {
  #stockView .card__img { min-height: 0 !important; aspect-ratio: auto !important; }
  #stockView .card__img img { aspect-ratio: 4 / 3; height: auto !important; }
  #stockView .card__image-placeholder { aspect-ratio: 4 / 3; }
  #stockView .card__actions-inline { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 6px !important; }
  #stockView .card__actions-inline .btn { min-width: 0; width: 100%; min-height: 44px !important; font-size: 11px !important; padding-inline: 5px !important; }
}
@media (min-width: 1200px) {
  .mobile-nav [data-mobile-nav="more"] { margin-top: auto !important; }
}

@media (max-width: 767px) {
  body[data-view="stock"] .topbar #mobileAddProduct { display: inline-flex; position: static; flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px; padding: 0; border-radius: 12px; box-shadow: none; }
  .topbar__right { flex-wrap: nowrap !important; }
}