html,
body,
#root {
  max-width: 100%;
  overflow-x: hidden;
}

/* Deep responsive pass: inner tabs, cards, text, images and dense tables. */
.retail-ops-shell img,
.retail-ops-shell picture,
.retail-ops-shell canvas,
.retail-ops-shell svg {
  max-width: 100%;
}

.retail-ops-shell img {
  height: auto;
  object-fit: cover;
}

.retail-ops-shell h1,
.retail-ops-shell h2,
.retail-ops-shell h3,
.retail-ops-shell h4,
.retail-ops-shell p,
.retail-ops-shell span,
.retail-ops-shell strong,
.retail-ops-shell small,
.retail-ops-shell label,
.retail-ops-shell button {
  min-width: 0;
}

@media (max-width: 1180px) {
  html body .retail-ops-shell .retail-ops-workbench-tabs,
  html body .retail-ops-shell .retail-ops-product-subnav,
  html body .retail-ops-shell .retail-ops-point-tabs,
  html body .retail-ops-shell .retail-ops-report-tabs,
  html body .retail-ops-shell .retail-ops-period-tabs,
  html body .retail-ops-shell .retail-ops-sold-unit-filters,
  html body .retail-ops-shell [role="tablist"] {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 42px !important;
    height: auto !important;
    padding: 5px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin !important;
    -webkit-overflow-scrolling: touch;
  }

  html body .retail-ops-shell .retail-ops-status-filter {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 40px !important;
    height: auto !important;
    padding: 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin !important;
    -webkit-overflow-scrolling: touch;
  }

  html body .retail-ops-shell .retail-ops-workbench-tabs button,
  html body .retail-ops-shell .retail-ops-product-subnav button,
  html body .retail-ops-shell .retail-ops-point-tabs button,
  html body .retail-ops-shell .retail-ops-report-tabs button,
  html body .retail-ops-shell .retail-ops-period-tabs button,
  html body .retail-ops-shell .retail-ops-sold-unit-filters button,
  html body .retail-ops-shell .retail-ops-status-filter button,
  html body .retail-ops-shell [role="tablist"] button {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    min-height: 34px !important;
    padding: 0 12px !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    line-height: 1.1 !important;
  }

  html body .retail-ops-shell .retail-ops-panel-title,
  html body .retail-ops-shell .retail-ops-dashboard-hero,
  html body .retail-ops-shell .retail-ops-guide-hero,
  html body .retail-ops-shell .retail-ops-point-hero,
  html body .retail-ops-shell .retail-ops-kpi,
  html body .retail-ops-shell .retail-ops-card,
  html body .retail-ops-shell .retail-ops-point-card,
  html body .retail-ops-shell .retail-ops-article-card,
  html body .retail-ops-shell .retail-ops-customer-order-card,
  html body .retail-ops-shell .retail-ops-panel {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html body .retail-ops-shell .retail-ops-panel-title p,
  html body .retail-ops-shell .retail-ops-dashboard-hero p,
  html body .retail-ops-shell .retail-ops-guide-hero p,
  html body .retail-ops-shell .retail-ops-point-hero p,
  html body .retail-ops-shell .retail-ops-card p,
  html body .retail-ops-shell .retail-ops-point-card p,
  html body .retail-ops-shell .retail-ops-article-card p,
  html body .retail-ops-shell .retail-ops-customer-order-card p,
  html body .retail-ops-shell .retail-ops-panel p,
  html body .retail-ops-shell .retail-ops-panel small,
  html body .retail-ops-shell .retail-ops-card small,
  html body .retail-ops-shell .retail-ops-point-card small {
    display: block !important;
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
  }

  html body .retail-ops-shell .retail-ops-table-tools {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    overflow: visible !important;
  }

  html body .retail-ops-shell .retail-ops-table-tools > * {
    min-width: 0 !important;
  }
}

@media (max-width: 760px) {
  html body .retail-ops-shell .retail-ops-workbench-tabs,
  html body .retail-ops-shell .retail-ops-product-subnav,
  html body .retail-ops-shell .retail-ops-point-tabs,
  html body .retail-ops-shell .retail-ops-report-tabs,
  html body .retail-ops-shell .retail-ops-period-tabs,
  html body .retail-ops-shell .retail-ops-sold-unit-filters,
  html body .retail-ops-shell .retail-ops-status-filter,
  html body .retail-ops-shell [role="tablist"] {
    border-radius: 12px !important;
    min-height: 38px !important;
    padding: 4px !important;
  }

  html body .retail-ops-shell .retail-ops-workbench-tabs button,
  html body .retail-ops-shell .retail-ops-product-subnav button,
  html body .retail-ops-shell .retail-ops-point-tabs button,
  html body .retail-ops-shell .retail-ops-report-tabs button,
  html body .retail-ops-shell .retail-ops-period-tabs button,
  html body .retail-ops-shell .retail-ops-sold-unit-filters button,
  html body .retail-ops-shell .retail-ops-status-filter button,
  html body .retail-ops-shell [role="tablist"] button {
    min-height: 32px !important;
    padding: 0 10px !important;
    border-radius: 9px !important;
    font-size: 11px !important;
  }

  html body .retail-ops-shell .retail-ops-panel,
  html body .retail-ops-shell .retail-ops-kpi,
  html body .retail-ops-shell .retail-ops-card,
  html body .retail-ops-shell .retail-ops-point-card,
  html body .retail-ops-shell .retail-ops-article-card,
  html body .retail-ops-shell .retail-ops-customer-order-card {
    padding: 12px !important;
  }

  html body .retail-ops-shell .retail-ops-panel-title {
    gap: 8px !important;
  }

  html body .retail-ops-shell .retail-ops-panel-title h2,
  html body .retail-ops-shell .retail-ops-card h2,
  html body .retail-ops-shell .retail-ops-card h3,
  html body .retail-ops-shell .retail-ops-point-card h3,
  html body .retail-ops-shell .retail-ops-article-card h3 {
    font-size: 16px !important;
    line-height: 1.16 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  html body .retail-ops-shell .retail-ops-panel-title p,
  html body .retail-ops-shell .retail-ops-card p,
  html body .retail-ops-shell .retail-ops-point-card p,
  html body .retail-ops-shell .retail-ops-article-card p {
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  html body .retail-ops-shell .retail-ops-article-card-meta,
  html body .retail-ops-shell .retail-ops-customer-order-meta,
  html body .retail-ops-shell .retail-ops-card-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  html body .retail-ops-shell .retail-ops-table-wrap,
  html body .retail-ops-shell .retail-ops-client-table-wrap,
  html body .retail-ops-shell .retail-ops-ledger-table-wrap,
  html body .retail-ops-shell .retail-ops-catalog-table-wrap,
  html body .retail-ops-shell .retail-ops-contact-table-wrap,
  html body .retail-ops-shell .retail-ops-doc-table-wrap,
  html body .retail-ops-shell .retail-ops-point-table-wrap,
  html body .retail-ops-shell .retail-ops-excel-table-wrap,
  html body .retail-ops-shell .retail-ops-stock-import-table-wrap {
    border-radius: 12px !important;
    max-height: min(68svh, 520px) !important;
    box-shadow: inset -18px 0 16px -18px rgba(15, 23, 42, .32) !important;
  }

  html body .retail-ops-shell .retail-ops-table {
    min-width: 660px !important;
    font-size: 10.5px !important;
  }

  html body .retail-ops-shell .retail-ops-table.retail-ops-client-table {
    min-width: 760px !important;
  }

  html body .retail-ops-shell .retail-ops-table.retail-ops-ledger-table,
  html body .retail-ops-shell .retail-ops-table.retail-ops-catalog-table {
    min-width: 680px !important;
  }

  html body .retail-ops-shell .retail-ops-table th,
  html body .retail-ops-shell .retail-ops-table td {
    padding: 7px 8px !important;
    font-size: 10.5px !important;
    line-height: 1.18 !important;
  }

  html body .retail-ops-shell .retail-ops-table td:nth-child(2),
  html body .retail-ops-shell .retail-ops-table td:nth-child(3) {
    max-width: 220px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

/* Final local responsive refinements for dense operational subviews. */
@media (max-width: 1180px) {
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  html body .retail-ops-shell .retail-ops-kpi {
    min-height: 82px !important;
    padding: 12px !important;
  }

  html body .retail-ops-shell .retail-ops-kpi strong,
  html body .retail-ops-shell .retail-ops-kpi span,
  html body .retail-ops-shell .retail-ops-kpi small {
    display: block !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    -webkit-line-clamp: unset !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard-actions,
  html body .retail-ops-shell .retail-ops-top-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard-actions .retail-ops-btn,
  html body .retail-ops-shell .retail-ops-top-actions .retail-ops-btn {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
    white-space: normal !important;
    text-align: center !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav button,
  html body .retail-ops-shell .retail-ops-workbench-tabs button,
  html body .retail-ops-shell .retail-ops-point-tabs button,
  html body .retail-ops-shell [role="tablist"] button {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 2px !important;
    min-width: 124px !important;
    min-height: 42px !important;
    padding: 5px 12px !important;
    text-align: center !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav button span,
  html body .retail-ops-shell .retail-ops-product-subnav button small,
  html body .retail-ops-shell .retail-ops-workbench-tabs button span,
  html body .retail-ops-shell .retail-ops-workbench-tabs button small,
  html body .retail-ops-shell .retail-ops-point-tabs button span,
  html body .retail-ops-shell .retail-ops-point-tabs button small,
  html body .retail-ops-shell [role="tablist"] button span,
  html body .retail-ops-shell [role="tablist"] button small {
    display: block !important;
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    line-height: 1.08 !important;
  }

  html body .retail-ops-shell .retail-ops-filter-strip {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 5px !important;
    scrollbar-width: thin !important;
    -webkit-overflow-scrolling: touch;
  }

  html body .retail-ops-shell .retail-ops-filter-strip > *,
  html body .retail-ops-shell .retail-ops-filter-strip button,
  html body .retail-ops-shell .retail-ops-filter-strip select,
  html body .retail-ops-shell .retail-ops-filter-strip label {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 760px) {
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }

  html body .retail-ops-shell .retail-ops-kpi {
    min-height: 74px !important;
    padding: 10px !important;
  }

  html body .retail-ops-shell .retail-ops-kpi strong {
    font-size: 15px !important;
    line-height: 1.1 !important;
  }

  html body .retail-ops-shell .retail-ops-kpi span,
  html body .retail-ops-shell .retail-ops-kpi small {
    font-size: 10px !important;
    line-height: 1.12 !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard-actions,
  html body .retail-ops-shell .retail-ops-top-actions {
    grid-template-columns: 1fr !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav,
  html body .retail-ops-shell .retail-ops-workbench-tabs,
  html body .retail-ops-shell .retail-ops-point-tabs,
  html body .retail-ops-shell [role="tablist"] {
    justify-content: flex-start !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav button,
  html body .retail-ops-shell .retail-ops-workbench-tabs button,
  html body .retail-ops-shell .retail-ops-point-tabs button,
  html body .retail-ops-shell [role="tablist"] button {
    min-width: 118px !important;
    min-height: 40px !important;
    padding: 5px 10px !important;
    font-size: 10.5px !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav button small,
  html body .retail-ops-shell .retail-ops-workbench-tabs button small,
  html body .retail-ops-shell .retail-ops-point-tabs button small,
  html body .retail-ops-shell [role="tablist"] button small {
    font-size: 9.5px !important;
  }

  html body .retail-ops-shell .retail-ops-article-cell strong,
  html body .retail-ops-shell .retail-ops-product-code,
  html body .retail-ops-shell .retail-ops-product-name,
  html body .retail-ops-shell .retail-ops-table strong {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav .retail-ops-product-subnav-label {
    display: block !important;
    font-size: 0 !important;
    line-height: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav .retail-ops-product-subnav-label::after {
    content: attr(data-short) !important;
    display: block !important;
    font-size: 10.5px !important;
    font-weight: 950 !important;
    line-height: 1.05 !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav button small {
    font-size: 9.2px !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 760px) {
  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav,
  html body .retail-ops-shell .retail-ops-product-subnav {
    gap: 4px !important;
    padding: 4px !important;
  }

  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button,
  html body .retail-ops-shell .retail-ops-product-subnav button {
    min-width: 108px !important;
    min-height: 32px !important;
    padding: 3px 6px !important;
  }

  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button .retail-ops-product-subnav-label,
  html body .retail-ops-shell .retail-ops-product-subnav button .retail-ops-product-subnav-label {
    font-size: 0 !important;
    line-height: 1 !important;
  }

  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button .retail-ops-product-subnav-label::after,
  html body .retail-ops-shell .retail-ops-product-subnav button .retail-ops-product-subnav-label::after {
    font-size: 10px !important;
    line-height: 1.05 !important;
  }

  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button small,
  html body .retail-ops-shell .retail-ops-product-subnav button small {
    font-size: 8.3px !important;
    line-height: 1.05 !important;
    padding: 1px 3px !important;
  }
}

/* Role screens pass: keep primary module labels readable on narrow phones. */
@media (max-width: 760px) {
  html body .retail-ops-shell .retail-ops-nav {
    scroll-snap-type: x proximity !important;
  }

  html body .retail-ops-shell .retail-ops-nav button,
  html body .retail-ops-shell .retail-ops-nav button.retail-ops-nav-parent,
  html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button {
    flex: 0 0 auto !important;
    min-width: max-content !important;
    max-width: none !important;
    width: auto !important;
    padding-inline: 10px 12px !important;
    scroll-snap-align: start !important;
  }

  html body .retail-ops-shell .retail-ops-nav span {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }
}

/* Final shell authority: prevent the light grouped sidebar from flashing or winning. */
@media (min-width: 1181px) {
html body .retail-ops-shell {
  grid-template-columns: clamp(300px, 18.5vw, 358px) minmax(0, 1fr) !important;
}

html body .retail-ops-shell .retail-ops-sidebar {
  position: sticky !important;
  top: 0 !important;
  height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  padding: 22px 20px !important;
  overflow-y: auto !important;
  color: #fff !important;
  border-right: 1px solid rgba(255, 255, 255, .08) !important;
  background:
    radial-gradient(circle at 18% 4%, rgba(20, 184, 166, .28), transparent 30%),
    radial-gradient(circle at 112% 32%, rgba(37, 99, 235, .24), transparent 32%),
    linear-gradient(180deg, #061326 0%, #08192f 56%, #051120 100%) !important;
  box-shadow: 20px 0 52px rgba(5, 17, 32, .24) !important;
}

html body .retail-ops-shell .retail-ops-brand,
html body .retail-ops-shell .retail-ops-current-access {
  border: 1px solid rgba(255, 255, 255, .12) !important;
  background: rgba(255, 255, 255, .075) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .10) !important;
}

html body .retail-ops-shell .retail-ops-brand {
  grid-template-columns: 56px minmax(0, 1fr) !important;
  gap: 12px !important;
  min-height: 72px !important;
  padding: 12px !important;
  border-radius: 18px !important;
}

html body .retail-ops-shell .retail-ops-logo-mark,
html body .retail-ops-shell .retail-ops-brand > span {
  width: 56px !important;
  height: 56px !important;
  border-radius: 16px !important;
  background: #fff !important;
}

html body .retail-ops-shell .retail-ops-brand strong,
html body .retail-ops-shell .retail-ops-current-access strong,
html body .retail-ops-shell .retail-ops-nav span {
  color: inherit !important;
}

html body .retail-ops-shell .retail-ops-brand strong {
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 930 !important;
  line-height: 1.06 !important;
  text-transform: uppercase !important;
}

html body .retail-ops-shell .retail-ops-brand small,
html body .retail-ops-shell .retail-ops-current-access small,
html body .retail-ops-shell .retail-ops-nav small {
  color: rgba(226, 232, 240, .74) !important;
}

html body .retail-ops-shell .retail-ops-current-access {
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 82px !important;
  padding: 12px !important;
  border-radius: 18px !important;
  color: #fff !important;
}

html body .retail-ops-shell .retail-ops-current-access > svg,
html body .retail-ops-shell .retail-ops-current-access img,
html body .retail-ops-shell .retail-ops-current-access .retail-ops-user-photo {
  width: 46px !important;
  height: 46px !important;
  border-radius: 14px !important;
}

html body .retail-ops-shell .retail-ops-nav {
  display: grid !important;
  gap: 10px !important;
  padding: 0 2px !important;
  overflow-y: auto !important;
}

html body .retail-ops-shell .retail-ops-nav-group,
html body .retail-ops-shell .retail-ops-subnav {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

html body .retail-ops-shell .retail-ops-nav button.retail-ops-nav-parent {
  display: none !important;
}

html body .retail-ops-shell .retail-ops-nav button,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 62px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(255, 255, 255, .075) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .055) !important;
  color: rgba(226, 232, 240, .88) !important;
  text-align: left !important;
  box-shadow: none !important;
  transform: none !important;
}

html body .retail-ops-shell .retail-ops-nav button:hover,
html body .retail-ops-shell .retail-ops-nav button.is-active {
  color: #fff !important;
  border-color: rgba(255, 255, 255, .20) !important;
  background: linear-gradient(135deg, #2563eb 0%, #08a6b1 55%, #0f9f8b 100%) !important;
  box-shadow: 0 13px 28px rgba(5, 15, 30, .22), inset 0 1px 0 rgba(255, 255, 255, .18) !important;
}

html body .retail-ops-shell .retail-ops-nav button > svg {
  width: 42px !important;
  height: 42px !important;
  padding: 10px !important;
  border-radius: 14px !important;
  color: #bde3ff !important;
  background: rgba(255, 255, 255, .10) !important;
}

html body .retail-ops-shell .retail-ops-nav button:hover > svg,
html body .retail-ops-shell .retail-ops-nav button.is-active > svg {
  color: #fff !important;
  background: rgba(255, 255, 255, .22) !important;
}

html body .retail-ops-shell .retail-ops-nav span {
  overflow: hidden !important;
  font-size: 14px !important;
  font-weight: 880 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell .retail-ops-nav small {
  display: block !important;
  margin-top: 3px !important;
  overflow: hidden !important;
  font-size: 11px !important;
  font-weight: 740 !important;
  line-height: 1.1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell .retail-ops-sidebar-card {
  margin: auto 0 0 !important;
  padding: 18px !important;
  border: 1px solid rgba(125, 211, 252, .22) !important;
  border-radius: 18px !important;
  background: linear-gradient(145deg, rgba(0, 166, 255, .18), rgba(255, 255, 255, .06)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}

html body .retail-ops-shell .retail-ops-logout {
  margin-top: 0 !important;
  border-color: rgba(248, 113, 113, .34) !important;
  background: rgba(127, 29, 29, .20) !important;
  color: #fee2e2 !important;
}
}

html body .retail-ops-shell .retail-ops-nav button.retail-ops-nav-parent {
  display: none !important;
}

@media (max-width: 1180px) {
  html body .retail-ops-shell {
    grid-template-columns: 1fr !important;
  }
}

/* Mobile mission final: prevent narrow dashboard cards from returning on phones. */
@media (max-width: 1180px), (hover: none) and (pointer: coarse) {
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip article {
    height: auto !important;
    min-height: 104px !important;
    padding: 13px 14px !important;
    overflow: visible !important;
    border-radius: 16px !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi span,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi strong,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi small,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip span,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip strong,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip small {
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    -webkit-line-clamp: unset !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi strong,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip strong {
    margin-top: 8px !important;
    font-size: clamp(20px, 6vw, 28px) !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
  }
}

@media (max-width: 720px), (hover: none) and (pointer: coarse) and (max-width: 980px) {
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip {
    grid-template-columns: 1fr !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-insight-strip article {
    min-height: 96px !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-dashboard-actions,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-dashboard-dates {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 900px), (hover: none) and (pointer: coarse) and (max-width: 1180px) {
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi:nth-child(n) {
    grid-column: 1 / -1 !important;
    width: auto !important;
    min-width: 0 !important;
  }
}

@media (max-width: 900px), (hover: none) and (pointer: coarse) {
  html body .retail-ops-shell .retail-ops-nav,
  html body .retail-ops-shell .retail-ops-stock-ticker-viewport,
  html body .retail-ops-shell .retail-ops-stock-ticker-track,
  html body .retail-ops-shell .retail-ops-filter-strip,
  html body .retail-ops-shell .retail-ops-product-subnav,
  html body .retail-ops-shell .retail-ops-workbench-tabs,
  html body .retail-ops-shell .retail-ops-point-tabs {
    scrollbar-width: none !important;
  }

  html body .retail-ops-shell .retail-ops-nav::-webkit-scrollbar,
  html body .retail-ops-shell .retail-ops-stock-ticker-viewport::-webkit-scrollbar,
  html body .retail-ops-shell .retail-ops-stock-ticker-track::-webkit-scrollbar,
  html body .retail-ops-shell .retail-ops-filter-strip::-webkit-scrollbar,
  html body .retail-ops-shell .retail-ops-product-subnav::-webkit-scrollbar,
  html body .retail-ops-shell .retail-ops-workbench-tabs::-webkit-scrollbar,
  html body .retail-ops-shell .retail-ops-point-tabs::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }
}

/* Dashboard action lists: let dense financial/activity buttons grow instead of clipping text. */
@media (max-width: 1180px), (hover: none) and (pointer: coarse) {
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list {
    gap: 8px !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list button {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-content: center !important;
    gap: 3px !important;
    height: auto !important;
    min-height: 64px !important;
    padding: 10px 12px !important;
    overflow: visible !important;
    text-align: left !important;
    white-space: normal !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list button span,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list button strong,
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list button small {
    display: block !important;
    max-width: 100% !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.12 !important;
    -webkit-line-clamp: unset !important;
  }
}

@media (max-width: 640px), (hover: none) and (pointer: coarse) {
  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list button {
    min-height: 74px !important;
    padding: 9px 10px !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list button strong {
    font-size: 12px !important;
  }

  html body .retail-ops-shell .retail-ops-dashboard .retail-ops-soft-list button small {
    font-size: 10px !important;
  }
}

/* Dashboard responsive repair 20260705-02: final layer after the lazy module CSS. */
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard {
  gap: clamp(12px, 1.4vw, 18px) !important;
  min-width: 0 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(180px, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 12px !important;
  width: 100% !important;
  align-items: stretch !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi:nth-child(n) {
  grid-column: auto !important;
  grid-row: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 112px !important;
  padding: 14px 16px !important;
  overflow: visible !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi span,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi strong,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi small {
  max-width: 100% !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  -webkit-line-clamp: unset !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi span {
  font-size: 10.5px !important;
  line-height: 1.18 !important;
  letter-spacing: .04em !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi strong {
  margin-top: 8px !important;
  font-size: clamp(20px, 1.9vw, 28px) !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi small {
  margin-top: 7px !important;
  padding-top: 0 !important;
  font-size: 10.5px !important;
  line-height: 1.22 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-grid,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-grid-2,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-grid-3 {
  min-width: 0 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-panel {
  min-width: 0 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-dashboard-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: min(100%, 520px) !important;
  min-width: 0 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-dashboard-dates {
  grid-column: 1 / -1 !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 0 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-dashboard-actions .retail-ops-btn,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-dashboard-dates input {
  width: 100% !important;
  min-width: 0 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-dashboard-actions .retail-ops-btn {
  white-space: normal !important;
  text-align: center !important;
  line-height: 1.12 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard :is(.retail-ops-panel, .retail-ops-ranking-list, .retail-ops-soft-list, .retail-ops-point-summary-card) :is(span, strong, small, em, b, p, h2, dt, dd) {
  min-width: 0 !important;
}

@media (max-width: 1180px) {
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi:nth-child(n) {
    min-height: 108px !important;
  }
}

@media (max-width: 720px) {
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-insight-strip,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-grid,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-grid-2,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-grid-3 {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi:nth-child(n) {
    min-height: 104px !important;
    padding: 13px 14px !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-panel,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-panel:nth-child(n) {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-panel-title {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    align-items: start !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-soft-list {
    width: 100% !important;
    max-height: none !important;
    overflow-x: hidden !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-soft-list button {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    overflow: visible !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-chart,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .recharts-responsive-container,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard svg {
    max-width: 100% !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-dashboard-actions,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-dashboard-dates {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Responsive typography harmonization 20260727-03. */
html body .retail-ops-shell {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html body .retail-ops-shell :is(button, input, select, textarea) {
  font-family: Inter, Poppins, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell :is(h1, h2, h3, h4, p, span, strong, small, label, button, th, td, dt, dd) {
  min-width: 0 !important;
}

html body .retail-ops-shell :is(.retail-ops-topbar h1, .retail-ops-pagehead h1, .retail-ops-dashboard-hero h1, .retail-ops-guide-hero h1, .retail-ops-point-hero h1) {
  max-width: 100% !important;
  font-size: clamp(22px, 2.1vw, 32px) !important;
  font-weight: 860 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  overflow-wrap: anywhere !important;
}

html body .retail-ops-shell :is(.retail-ops-topbar p, .retail-ops-pagehead-main p, .retail-ops-dashboard-hero p, .retail-ops-guide-hero p, .retail-ops-point-hero p) {
  max-width: 68ch !important;
  font-size: 13px !important;
  font-weight: 640 !important;
  line-height: 1.38 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-nav button,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button {
  grid-template-columns: 36px minmax(0, 1fr) !important;
  gap: 10px !important;
  min-height: 54px !important;
  padding: 8px 10px !important;
  border-radius: 12px !important;
}

html body .retail-ops-shell .retail-ops-nav button > svg {
  width: 36px !important;
  height: 36px !important;
  padding: 8px !important;
  border-radius: 10px !important;
}

html body .retail-ops-shell .retail-ops-nav span {
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  font-size: 13px !important;
  font-weight: 820 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell .retail-ops-nav small {
  display: block !important;
  max-width: 100% !important;
  margin-top: 2px !important;
  overflow: hidden !important;
  font-size: 10.5px !important;
  font-weight: 640 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) {
  gap: 6px !important;
  min-height: 40px !important;
  padding: 5px !important;
  border-radius: 10px !important;
}

html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) button {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  min-height: 34px !important;
  padding: 0 11px !important;
  border-radius: 8px !important;
  font-size: 11.5px !important;
  font-weight: 790 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) button :is(span, strong, em, b),
html body .retail-ops-shell .retail-ops-product-subnav button .retail-ops-product-subnav-label {
  display: inline !important;
  overflow: visible !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell .retail-ops-product-subnav button .retail-ops-product-subnav-label {
  display: block !important;
  color: inherit !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  visibility: visible !important;
  -webkit-text-fill-color: currentColor !important;
}

html body .retail-ops-shell .retail-ops-product-subnav button .retail-ops-product-subnav-label::after {
  display: block !important;
  content: attr(data-short) !important;
  color: inherit !important;
  font-size: 11.5px !important;
  font-weight: 790 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) button small {
  display: inline !important;
  margin-left: 2px !important;
  padding: 0 !important;
  font-size: 10px !important;
  font-weight: 650 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell :is(.retail-ops-panel-title h2, .retail-ops-panel-title strong, .retail-ops-card h2, .retail-ops-card h3, .retail-ops-article-card h3, .retail-ops-point-card h3, .retail-ops-customer-order-card h3, .retail-ops-table-head h2) {
  font-size: clamp(15px, 1.15vw, 18px) !important;
  font-weight: 820 !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  overflow-wrap: anywhere !important;
}

html body .retail-ops-shell :is(.retail-ops-panel-title p, .retail-ops-panel-title small, .retail-ops-card p, .retail-ops-card small, .retail-ops-article-card p, .retail-ops-article-card small, .retail-ops-point-card p, .retail-ops-point-card small, .retail-ops-customer-order-card p, .retail-ops-customer-order-card small) {
  font-size: 12px !important;
  font-weight: 620 !important;
  line-height: 1.36 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-kpi span,
html body .retail-ops-shell .retail-ops-insight-strip span {
  font-size: 11px !important;
  font-weight: 760 !important;
  line-height: 1.18 !important;
  letter-spacing: .02em !important;
}

html body .retail-ops-shell .retail-ops-kpi strong,
html body .retail-ops-shell .retail-ops-insight-strip strong {
  font-size: clamp(20px, 1.55vw, 26px) !important;
  font-weight: 860 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-kpi small,
html body .retail-ops-shell .retail-ops-insight-strip small {
  font-size: 10.8px !important;
  font-weight: 620 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell :is(.retail-ops-btn, .retail-ops-file, .retail-ops-pagination button, .retail-ops-command-reset, .retail-ops-filter-strip button, .retail-ops-table-tools button, .retail-ops-top-actions select) {
  min-height: 38px !important;
  padding-inline: 12px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 820 !important;
  line-height: 1.16 !important;
  letter-spacing: 0 !important;
  white-space: normal !important;
}

html body .retail-ops-shell :is(input, select, textarea, .retail-ops-command-search) {
  font-size: 12.5px !important;
  font-weight: 640 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-table :is(th, td) {
  font-size: 12px !important;
  line-height: 1.32 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-table th {
  font-size: 11px !important;
  font-weight: 820 !important;
  letter-spacing: .02em !important;
}

html body .ui-offline-widget,
html body .ui-offline-widget * {
  font-size: 12px !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}

html body .ui-offline-widget {
  width: min(300px, calc(100vw - 20px)) !important;
}

html body .ui-offline-widget__panel {
  min-height: 42px !important;
  padding: 8px 9px !important;
  border-radius: 10px !important;
}

html body .ui-offline-widget__state strong {
  font-size: 12px !important;
  font-weight: 820 !important;
}

html body .ui-offline-widget__state span {
  font-size: 10.5px !important;
  font-weight: 620 !important;
}

@media (max-width: 1180px) {
  html body .retail-ops-shell .retail-ops-sidebar {
    display: grid !important;
    grid-template-columns: minmax(150px, .7fr) minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 0 !important;
    padding: 10px 12px !important;
    overflow: hidden !important;
  }

  html body .retail-ops-shell .retail-ops-brand {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  html body .retail-ops-shell .retail-ops-brand > span {
    width: 38px !important;
    height: 38px !important;
    border-radius: 11px !important;
  }

  html body .retail-ops-shell .retail-ops-brand strong {
    font-size: 12.8px !important;
    font-weight: 820 !important;
    line-height: 1.08 !important;
  }

  html body .retail-ops-shell .retail-ops-brand small,
  html body .retail-ops-shell .retail-ops-sidebar-card,
  html body .retail-ops-shell .retail-ops-nav small {
    display: none !important;
  }

  html body .retail-ops-shell .retail-ops-nav {
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 1px 0 3px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
    scroll-snap-type: x proximity !important;
    -webkit-overflow-scrolling: touch;
  }

  html body .retail-ops-shell .retail-ops-nav::-webkit-scrollbar {
    display: none !important;
  }

  html body .retail-ops-shell .retail-ops-nav-group,
  html body .retail-ops-shell .retail-ops-subnav {
    display: flex !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 0 !important;
  }

  html body .retail-ops-shell .retail-ops-nav button,
  html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button {
    grid-template-columns: 24px max-content !important;
    flex: 0 0 auto !important;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
    min-height: 38px !important;
    padding: 5px 9px !important;
    border-radius: 10px !important;
    scroll-snap-align: start !important;
  }

  html body .retail-ops-shell .retail-ops-nav button > svg {
    width: 24px !important;
    height: 24px !important;
    padding: 5px !important;
    border-radius: 8px !important;
  }

  html body .retail-ops-shell .retail-ops-nav span {
    overflow: visible !important;
    font-size: 11.6px !important;
    font-weight: 780 !important;
    line-height: 1.1 !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }

  html body .retail-ops-shell .retail-ops-main {
    padding: 14px !important;
  }

  html body .retail-ops-shell :is(.retail-ops-topbar h1, .retail-ops-pagehead h1, .retail-ops-dashboard-hero h1, .retail-ops-guide-hero h1, .retail-ops-point-hero h1) {
    font-size: 23px !important;
    line-height: 1.1 !important;
  }

  html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) {
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch;
  }

  html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"])::-webkit-scrollbar {
    display: none !important;
  }

  html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) button {
    min-height: 36px !important;
    padding-inline: 10px !important;
    font-size: 11px !important;
  }
}

@media (max-width: 640px) {
  html body .retail-ops-shell .retail-ops-sidebar {
    grid-template-columns: minmax(126px, 1fr) auto !important;
    gap: 8px !important;
    padding: 8px 10px 9px !important;
  }

  html body .retail-ops-shell .retail-ops-brand {
    grid-template-columns: 34px minmax(0, 1fr) !important;
  }

  html body .retail-ops-shell .retail-ops-brand > span {
    width: 34px !important;
    height: 34px !important;
  }

  html body .retail-ops-shell .retail-ops-brand strong {
    font-size: 11.8px !important;
    line-height: 1.08 !important;
  }

  html body .retail-ops-shell .retail-ops-logout {
    width: 36px !important;
    min-width: 36px !important;
    min-height: 34px !important;
  }

  html body .retail-ops-shell .retail-ops-nav {
    gap: 5px !important;
    padding-bottom: 1px !important;
  }

  html body .retail-ops-shell .retail-ops-nav-group,
  html body .retail-ops-shell .retail-ops-subnav {
    gap: 5px !important;
  }

  html body .retail-ops-shell .retail-ops-nav button,
  html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button {
    grid-template-columns: 22px max-content !important;
    gap: 6px !important;
    min-height: 34px !important;
    padding: 5px 8px !important;
    border-radius: 9px !important;
  }

  html body .retail-ops-shell .retail-ops-nav button > svg {
    width: 22px !important;
    height: 22px !important;
    padding: 5px !important;
  }

  html body .retail-ops-shell .retail-ops-nav span {
    font-size: 10.8px !important;
    font-weight: 760 !important;
  }

  html body .retail-ops-shell .retail-ops-main {
    padding: 10px !important;
  }

  html body .retail-ops-shell :is(.retail-ops-topbar h1, .retail-ops-pagehead h1, .retail-ops-dashboard-hero h1, .retail-ops-guide-hero h1, .retail-ops-point-hero h1) {
    font-size: 20px !important;
    line-height: 1.12 !important;
  }

  html body .retail-ops-shell :is(.retail-ops-topbar p, .retail-ops-pagehead-main p, .retail-ops-dashboard-hero p, .retail-ops-guide-hero p, .retail-ops-point-hero p) {
    font-size: 12px !important;
    line-height: 1.34 !important;
  }

  html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) {
    gap: 5px !important;
    min-height: 36px !important;
    padding: 4px !important;
  }

  html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) button {
    min-width: max-content !important;
    min-height: 32px !important;
    padding: 0 9px !important;
    border-radius: 8px !important;
    font-size: 10.8px !important;
  }

  html body .retail-ops-shell :is(.retail-ops-product-subnav, .retail-ops-workbench-tabs, .retail-ops-point-tabs, .retail-ops-report-tabs, .retail-ops-period-tabs, .retail-ops-sold-unit-filters, .retail-ops-status-filter, [role="tablist"]) button small {
    display: none !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav button .retail-ops-product-subnav-label {
    display: block !important;
    color: inherit !important;
    font-size: 0 !important;
    line-height: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
    -webkit-text-fill-color: currentColor !important;
  }

  html body .retail-ops-shell .retail-ops-product-subnav button .retail-ops-product-subnav-label::after {
    display: block !important;
    content: attr(data-short) !important;
    color: inherit !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    -webkit-text-fill-color: currentColor !important;
  }

  html body .retail-ops-shell :is(.retail-ops-panel-title h2, .retail-ops-panel-title strong, .retail-ops-card h2, .retail-ops-card h3, .retail-ops-article-card h3, .retail-ops-point-card h3, .retail-ops-customer-order-card h3, .retail-ops-table-head h2) {
    font-size: 14.5px !important;
    line-height: 1.18 !important;
  }

  html body .retail-ops-shell :is(.retail-ops-panel-title p, .retail-ops-panel-title small, .retail-ops-card p, .retail-ops-card small, .retail-ops-article-card p, .retail-ops-article-card small, .retail-ops-point-card p, .retail-ops-point-card small, .retail-ops-customer-order-card p, .retail-ops-customer-order-card small) {
    font-size: 11.2px !important;
    line-height: 1.34 !important;
  }

  html body .retail-ops-shell .retail-ops-kpi strong,
  html body .retail-ops-shell .retail-ops-insight-strip strong {
    font-size: 19px !important;
    line-height: 1.08 !important;
  }

  html body .retail-ops-shell :is(.retail-ops-btn, .retail-ops-file, .retail-ops-pagination button, .retail-ops-command-reset, .retail-ops-filter-strip button, .retail-ops-table-tools button, .retail-ops-top-actions select) {
    min-height: 36px !important;
    padding-inline: 10px !important;
    font-size: 11px !important;
  }

  html body .ui-offline-widget {
    right: 8px !important;
    left: auto !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    width: min(238px, calc(100vw - 16px)) !important;
  }

  html body .ui-offline-widget__panel {
    min-height: 36px !important;
    gap: 5px !important;
    padding: 6px 7px !important;
  }

  html body .ui-offline-widget__state strong {
    font-size: 10.8px !important;
  }

  html body .ui-offline-widget__state span {
    display: none !important;
  }

  html body .ui-offline-widget .ui-offline-sync-btn {
    max-width: 104px !important;
    min-height: 28px !important;
    padding: 0 8px !important;
    font-size: 9.8px !important;
  }

  html body .ui-offline-widget .ui-offline-widget__close {
    width: 22px !important;
    height: 22px !important;
    font-size: 11px !important;
  }
}

@media (max-width: 760px) {
  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav,
  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button {
    min-height: 36px !important;
  }

  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button {
    min-width: 122px !important;
    padding: 0 11px !important;
    font-size: 11.2px !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
  }

  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button .retail-ops-product-subnav-label,
  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav .retail-ops-product-subnav-label {
    display: block !important;
    color: inherit !important;
    font-size: 0 !important;
    line-height: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
    -webkit-text-fill-color: currentColor !important;
  }

  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav button .retail-ops-product-subnav-label::after,
  html body .retail-ops-shell.is-module-products .retail-ops-product-subnav .retail-ops-product-subnav-label::after {
    display: block !important;
    content: attr(data-short) !important;
    color: inherit !important;
    font-size: 11.2px !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    white-space: nowrap !important;
    -webkit-text-fill-color: currentColor !important;
  }
}

/* Layout polish 20260727-04: dashboard lists, finance and team pages. */
html body .retail-ops-shell:is(.is-module-dashboard, .is-module-finance, .is-module-admin, .is-module-guide) .retail-ops-command-left {
  display: none !important;
}

html body .retail-ops-shell:is(.is-module-dashboard, .is-module-finance, .is-module-admin, .is-module-guide) .retail-ops-commandbar {
  min-height: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .retail-ops-shell:is(.is-module-dashboard, .is-module-finance, .is-module-admin, .is-module-guide) .retail-ops-commandbar:not(:has(.retail-ops-database-status)) {
  display: none !important;
}

html body .retail-ops-shell:is(.is-module-dashboard, .is-module-finance, .is-module-admin, .is-module-guide) .retail-ops-stock-ticker {
  display: none !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi:nth-child(n) {
  min-height: 102px !important;
  padding: 13px 15px !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi strong {
  margin: 6px 0 3px !important;
  font-size: clamp(18px, 1.25vw, 22px) !important;
  font-weight: 850 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  overflow-wrap: anywhere !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi:nth-child(5) strong {
  font-size: clamp(16px, 1.05vw, 20px) !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi span,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi small {
  font-size: 10px !important;
  line-height: 1.22 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list {
  gap: 8px !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article {
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) minmax(94px, max-content) !important;
  grid-template-areas:
    "rank item metric"
    "rank item action" !important;
  align-items: center !important;
  gap: 2px 8px !important;
  min-height: 54px !important;
  padding: 8px 10px !important;
  overflow: hidden !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article > span:first-child {
  grid-area: rank !important;
  align-self: center !important;
  justify-self: center !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article > div {
  grid-area: item !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article > em {
  grid-area: metric !important;
  align-self: end !important;
  justify-self: end !important;
  margin: 0 !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article > b {
  grid-area: action !important;
  align-self: start !important;
  justify-self: end !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: max-content !important;
  max-width: 118px !important;
  min-height: 18px !important;
  margin: 0 !important;
  padding: 1px 6px !important;
  border: 1px solid rgba(15, 118, 110, .16) !important;
  border-radius: 999px !important;
  background: rgba(236, 253, 245, .88) !important;
  color: #087369 !important;
  font-size: 9.6px !important;
  font-weight: 850 !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-hr-layout {
  display: grid !important;
  grid-template-columns: minmax(280px, 390px) minmax(620px, 1fr) !important;
  align-items: start !important;
  gap: 16px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-rh-panel {
  order: 1 !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel {
  order: 2 !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-rh-panel,
html body .retail-ops-shell.is-module-admin .retail-ops-team-panel {
  min-height: 0 !important;
  padding: 16px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-rh-panel .retail-ops-panel-title,
html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-panel-title {
  margin-bottom: 14px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-rh-summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-rh-summary div {
  min-height: 74px !important;
  padding: 12px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-rh-summary span {
  font-size: 10px !important;
  line-height: 1.16 !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-rh-summary strong {
  margin-top: 8px !important;
  font-size: clamp(18px, 1.35vw, 24px) !important;
  line-height: 1.05 !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table-head {
  display: grid !important;
  grid-template-columns: minmax(240px, 1fr) auto auto !important;
  align-items: center !important;
  gap: 10px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table-state {
  justify-self: end !important;
  min-width: 76px !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  text-align: center !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-filter-strip {
  width: min(100%, 380px) !important;
  min-height: 0 !important;
  margin: 0 0 12px !important;
  padding: 10px 12px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table {
  min-width: 700px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table th,
html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table td {
  padding: 9px 10px !important;
  font-size: 11px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-workbench-tabs {
  margin-top: 0 !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-kpis {
  grid-template-columns: repeat(4, minmax(150px, 1fr)) !important;
  gap: 12px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-kpi {
  min-height: 96px !important;
  padding: 14px 16px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-kpi strong {
  font-size: clamp(19px, 1.35vw, 24px) !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-grid-2 {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 16px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-panel {
  padding: 16px !important;
  overflow: hidden !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-panel .retail-ops-table-head {
  align-items: center !important;
  margin-bottom: 12px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-filter-strip {
  width: min(100%, 620px) !important;
  min-height: 0 !important;
  margin-bottom: 14px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-ledger-table-wrap {
  overflow-x: auto !important;
  border-radius: 14px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-ledger-table {
  min-width: 720px !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-ledger-table th,
html body .retail-ops-shell.is-module-finance .retail-ops-ledger-table td {
  padding: 9px 11px !important;
  font-size: 11px !important;
  line-height: 1.24 !important;
}

@media (max-width: 1360px) {
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis,
  html body .retail-ops-shell.is-module-finance .retail-ops-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body .retail-ops-shell.is-module-admin .retail-ops-hr-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .retail-ops-shell.is-module-admin .retail-ops-team-panel,
  html body .retail-ops-shell.is-module-admin .retail-ops-rh-panel {
    order: initial !important;
  }
}

@media (max-width: 720px) {
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis,
  html body .retail-ops-shell.is-module-finance .retail-ops-kpis {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    grid-template-areas:
      "rank item"
      "rank metric"
      "rank action" !important;
  }

  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article > em,
  html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-ranking-list article > b {
    justify-self: start !important;
    text-align: left !important;
  }

  html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table-head {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table-state {
    justify-self: start !important;
  }

  html body .retail-ops-shell.is-module-finance .retail-ops-ledger-table,
  html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table {
    min-width: 640px !important;
  }
}

/* Empty states and finance KPI cleanup 20260727-04b. */
html body .retail-ops-shell.is-module-finance .retail-ops-kpi::before {
  inset: 14px auto 14px 0 !important;
  width: 4px !important;
  height: auto !important;
  border-radius: 0 999px 999px 0 !important;
  background: linear-gradient(180deg, #0f766e, #14b8a6) !important;
  box-shadow: none !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-kpi.is-alert::before,
html body .retail-ops-shell.is-module-finance .retail-ops-kpi:nth-child(2)::before,
html body .retail-ops-shell.is-module-finance .retail-ops-kpi:nth-child(3)::before {
  background: linear-gradient(180deg, #f59e0b, #ef4444) !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-kpi span {
  max-width: 100% !important;
  padding-left: 2px !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table-wrap:has(td[colspan]),
html body .retail-ops-shell.is-module-finance .retail-ops-panel .retail-ops-table-wrap:has(td[colspan]) {
  min-height: 112px !important;
  overflow: hidden !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table:has(td[colspan]),
html body .retail-ops-shell.is-module-finance .retail-ops-panel .retail-ops-table:has(td[colspan]) {
  display: block !important;
  min-width: 0 !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table:has(td[colspan]) thead,
html body .retail-ops-shell.is-module-finance .retail-ops-panel .retail-ops-table:has(td[colspan]) thead {
  display: none !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table:has(td[colspan]) tbody,
html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table:has(td[colspan]) tr,
html body .retail-ops-shell.is-module-admin .retail-ops-team-panel .retail-ops-table:has(td[colspan]) td,
html body .retail-ops-shell.is-module-finance .retail-ops-panel .retail-ops-table:has(td[colspan]) tbody,
html body .retail-ops-shell.is-module-finance .retail-ops-panel .retail-ops-table:has(td[colspan]) tr,
html body .retail-ops-shell.is-module-finance .retail-ops-panel .retail-ops-table:has(td[colspan]) td {
  display: block !important;
  width: 100% !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel td[colspan],
html body .retail-ops-shell.is-module-finance .retail-ops-panel td[colspan] {
  min-height: 110px !important;
  padding: 22px !important;
  border: 0 !important;
  background:
    linear-gradient(180deg, rgba(248, 252, 250, .96), rgba(255, 255, 255, .96)) !important;
  text-align: center !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel td[colspan] strong,
html body .retail-ops-shell.is-module-finance .retail-ops-panel td[colspan] strong {
  display: block !important;
  color: #0f2e43 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}

html body .retail-ops-shell.is-module-admin .retail-ops-team-panel td[colspan] small,
html body .retail-ops-shell.is-module-finance .retail-ops-panel td[colspan] small {
  display: block !important;
  margin-top: 5px !important;
  color: #65758a !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-panel:has(.retail-ops-ledger-table tbody:empty) .retail-ops-ledger-table-wrap {
  display: none !important;
}

html body .retail-ops-shell.is-module-finance .retail-ops-panel:has(.retail-ops-ledger-table tbody:empty)::after {
  content: "Aucune facture ouverte pour ce filtre." !important;
  display: grid !important;
  min-height: 86px !important;
  place-items: center !important;
  padding: 18px !important;
  border: 1px solid rgba(151, 181, 199, .62) !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, rgba(248, 252, 250, .96), rgba(255, 255, 255, .96)) !important;
  color: #65758a !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  text-align: center !important;
}

/* Advanced design pass 20260727-06: bottom status, 4D navigation, soft dashboard/catalogue and local Cameroon map. */
html body .retail-ops-shell {
  --ui-depth-navy: #071f33;
  --ui-depth-blue: #124f79;
  --ui-depth-teal: #11806f;
  --ui-surface: rgba(255, 255, 255, .96);
  --ui-surface-soft: rgba(248, 252, 250, .92);
  --ui-border-soft: rgba(124, 154, 178, .22);
  --ui-shadow-high: 0 22px 58px rgba(7, 31, 51, .14);
  --ui-shadow-mid: 0 14px 34px rgba(7, 31, 51, .10);
  --ui-shadow-low: 0 8px 20px rgba(7, 31, 51, .08);
  background:
    linear-gradient(135deg, rgba(239, 248, 244, .96), rgba(248, 251, 255, .98) 54%, rgba(241, 249, 252, .96)) !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-database-status {
  position: fixed !important;
  top: auto !important;
  left: auto !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  bottom: max(18px, env(safe-area-inset-bottom)) !important;
  z-index: 1000 !important;
  min-height: 42px !important;
  max-width: min(420px, calc(100vw - 36px)) !important;
  padding: 0 16px !important;
  border: 1px solid rgba(17, 128, 111, .20) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(239, 250, 247, .96)) !important;
  color: #08243a !important;
  box-shadow: 0 16px 44px rgba(7, 31, 51, .18), inset 0 1px 0 rgba(255, 255, 255, .95) !important;
  backdrop-filter: blur(14px) !important;
}

html body .retail-ops-shell .retail-ops-database-status svg {
  color: #11806f !important;
}

html body .retail-ops-shell:is(.is-module-dashboard, .is-module-finance, .is-module-admin, .is-module-guide) .retail-ops-commandbar:has(.retail-ops-database-status) {
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

@media (min-width: 1181px) {
  html body .retail-ops-shell .retail-ops-sidebar {
    gap: 12px !important;
    padding: 18px 18px 20px !important;
  }

  html body .retail-ops-shell .retail-ops-brand {
    order: 0 !important;
  }

  html body .retail-ops-shell .retail-ops-nav {
    order: 10 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding-right: 2px !important;
  }

  html body .retail-ops-shell .retail-ops-current-access {
    order: 20 !important;
    margin-top: 8px !important;
  }

  html body .retail-ops-shell .retail-ops-sidebar-card {
    order: 30 !important;
    margin: 0 !important;
  }

  html body .retail-ops-shell .retail-ops-logout {
    order: 40 !important;
  }
}

html body .retail-ops-shell .retail-ops-current-access,
html body .retail-ops-shell .retail-ops-sidebar-card {
  border-color: rgba(255, 255, 255, .14) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .045)) !important;
  box-shadow:
    0 10px 0 rgba(1, 11, 26, .24),
    0 22px 42px rgba(1, 11, 26, .26),
    inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}

html body .retail-ops-shell .retail-ops-current-access {
  min-height: 72px !important;
  border-radius: 20px !important;
}

html body .retail-ops-shell .retail-ops-sidebar-card {
  padding: 14px 16px !important;
  border-radius: 20px !important;
}

html body .retail-ops-shell .retail-ops-sidebar-card strong {
  margin: 5px 0 2px !important;
  font-size: clamp(24px, 1.7vw, 32px) !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-logout {
  min-height: 46px !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 0 rgba(79, 16, 28, .34), 0 18px 34px rgba(79, 16, 28, .18) !important;
}

html body .retail-ops-shell .retail-ops-nav button,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button {
  position: relative !important;
  isolation: isolate !important;
  min-height: 58px !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 18px !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .04)) !important;
  box-shadow:
    0 8px 0 rgba(1, 11, 26, .30),
    0 18px 34px rgba(1, 11, 26, .24),
    inset 0 1px 0 rgba(255, 255, 255, .16) !important;
  transform: translateY(0) !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease !important;
}

html body .retail-ops-shell .retail-ops-nav button::before,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button::before {
  content: "" !important;
  position: absolute !important;
  inset: 1px 1px auto 1px !important;
  height: 50% !important;
  border-radius: 17px 17px 11px 11px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .17), rgba(255, 255, 255, 0)) !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

html body .retail-ops-shell .retail-ops-nav button::after,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button::after {
  content: "" !important;
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  bottom: -9px !important;
  height: 10px !important;
  border-radius: 0 0 14px 14px !important;
  background: rgba(1, 11, 26, .28) !important;
  pointer-events: none !important;
  z-index: -2 !important;
}

html body .retail-ops-shell .retail-ops-nav button:hover,
html body .retail-ops-shell .retail-ops-nav button.is-active,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button:hover,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button.is-active {
  color: #fff !important;
  border-color: rgba(179, 255, 236, .38) !important;
  background:
    linear-gradient(145deg, #092846 0%, #10658b 44%, #11806f 100%) !important;
  box-shadow:
    0 10px 0 rgba(1, 11, 26, .36),
    0 24px 46px rgba(1, 11, 26, .32),
    inset 0 1px 0 rgba(255, 255, 255, .24) !important;
  transform: translateY(-2px) !important;
}

html body .retail-ops-shell .retail-ops-nav button:active,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button:active {
  box-shadow:
    0 4px 0 rgba(1, 11, 26, .36),
    0 12px 24px rgba(1, 11, 26, .26),
    inset 0 1px 0 rgba(255, 255, 255, .16) !important;
  transform: translateY(3px) !important;
}

html body .retail-ops-shell .retail-ops-nav button > svg,
html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button > svg {
  border: 1px solid rgba(255, 255, 255, .13) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .06)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14) !important;
}

html body .retail-ops-shell .retail-ops-nav span,
html body .retail-ops-shell .retail-ops-nav small {
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-main {
  padding-bottom: 76px !important;
}

html body .retail-ops-shell .retail-ops-panel,
html body .retail-ops-shell .retail-ops-kpi,
html body .retail-ops-shell .retail-ops-card,
html body .retail-ops-shell .retail-ops-article-card,
html body .retail-ops-shell .retail-ops-product-card,
html body .retail-ops-shell .retail-ops-stock-import-card,
html body .retail-ops-shell .retail-ops-point-summary-card {
  border-color: var(--ui-border-soft) !important;
  background:
    linear-gradient(180deg, var(--ui-surface), var(--ui-surface-soft)) !important;
  box-shadow: var(--ui-shadow-mid) !important;
}

html body .retail-ops-shell :is(.retail-ops-panel, .retail-ops-kpi, .retail-ops-card, .retail-ops-article-card, .retail-ops-product-card, .retail-ops-stock-import-card, .retail-ops-point-summary-card) :is(h1, h2, h3, p, span, strong, small, em, b, label, button) {
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .retail-ops-dashboard .retail-ops-kpis {
  gap: 14px !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi,
html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi:nth-child(n) {
  min-height: 112px !important;
  padding: 16px 18px !important;
  border-radius: 20px !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi::before {
  inset: 14px auto 14px 0 !important;
  width: 5px !important;
  height: auto !important;
  border-radius: 0 999px 999px 0 !important;
  background: linear-gradient(180deg, #11806f, #1d6fa4) !important;
  box-shadow: none !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-kpis > .retail-ops-kpi strong {
  font-size: clamp(20px, 1.5vw, 26px) !important;
  font-weight: 860 !important;
  line-height: 1.08 !important;
}

html body .retail-ops-shell.is-module-dashboard .retail-ops-dashboard .retail-ops-panel,
html body .retail-ops-shell.is-module-products .retail-ops-panel,
html body .retail-ops-shell.is-module-products .retail-ops-article-card,
html body .retail-ops-shell.is-module-products .retail-ops-product-card {
  border-radius: 20px !important;
}

html body .retail-ops-shell .retail-ops-chart,
html body .retail-ops-shell .recharts-responsive-container,
html body .retail-ops-shell .recharts-surface {
  border-radius: 18px !important;
}

html body .retail-ops-shell .retail-ops-chart {
  border: 1px solid rgba(124, 154, 178, .18) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(245, 251, 250, .96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85) !important;
}

html body .retail-ops-shell .recharts-wrapper text,
html body .retail-ops-shell .recharts-cartesian-axis-tick text,
html body .retail-ops-shell .recharts-legend-item-text {
  fill: #52657a !important;
  font-size: 11px !important;
  font-weight: 680 !important;
  letter-spacing: 0 !important;
}

html body .retail-ops-shell .recharts-cartesian-grid line {
  stroke: rgba(82, 101, 122, .14) !important;
}

html body .retail-ops-shell .retail-ops-product-subnav,
html body .retail-ops-shell .retail-ops-workbench-tabs,
html body .retail-ops-shell .retail-ops-point-tabs {
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .86) !important;
  box-shadow: var(--ui-shadow-low) !important;
}

html body .retail-ops-shell .retail-ops-product-subnav button,
html body .retail-ops-shell .retail-ops-workbench-tabs button,
html body .retail-ops-shell .retail-ops-point-tabs button {
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  transition: transform .16s ease, background .16s ease, box-shadow .16s ease !important;
}

html body .retail-ops-shell .retail-ops-product-subnav button:hover,
html body .retail-ops-shell .retail-ops-workbench-tabs button:hover,
html body .retail-ops-shell .retail-ops-point-tabs button:hover,
html body .retail-ops-shell .retail-ops-product-subnav button.is-active,
html body .retail-ops-shell .retail-ops-workbench-tabs button.is-active,
html body .retail-ops-shell .retail-ops-point-tabs button.is-active {
  border-color: rgba(17, 128, 111, .20) !important;
  background: linear-gradient(145deg, #092846, #11806f) !important;
  color: #fff !important;
  box-shadow: 0 8px 0 rgba(7, 31, 51, .18), 0 16px 32px rgba(7, 31, 51, .16) !important;
  transform: translateY(-1px) !important;
}

html body .retail-ops-shell .retail-ops-stock-import-board {
  gap: 16px !important;
}

html body .retail-ops-shell .retail-ops-stock-import-guide {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

html body .retail-ops-shell .retail-ops-stock-import-card {
  min-height: 102px !important;
  padding: 16px !important;
  border-radius: 18px !important;
}

html body .retail-ops-shell .retail-ops-stock-import-card > span:first-child,
html body .retail-ops-shell .retail-ops-badge {
  border-radius: 999px !important;
}

html body .retail-ops-shell .retail-ops-danger-inline,
html body .retail-ops-shell .retail-ops-danger-copy {
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(255, 247, 247, .98), rgba(255, 239, 239, .94)) !important;
}

html body .retail-ops-shell .retail-ops-cm-origin-map {
  grid-column: 1 / -1 !important;
  padding: clamp(16px, 1.4vw, 22px) !important;
  overflow: hidden !important;
}

html body .retail-ops-shell .retail-ops-cm-map-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 14px !important;
}

html body .retail-ops-shell .retail-ops-cm-map-head span {
  display: inline-flex !important;
  min-height: 24px !important;
  align-items: center !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  background: rgba(17, 128, 111, .10) !important;
  color: #0a6f61 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  text-transform: uppercase !important;
}

html body .retail-ops-shell .retail-ops-cm-map-head h2 {
  margin: 8px 0 4px !important;
  color: #08243a !important;
  font-size: clamp(18px, 1.4vw, 24px) !important;
  font-weight: 880 !important;
  line-height: 1.1 !important;
}

html body .retail-ops-shell .retail-ops-cm-map-head p {
  margin: 0 !important;
  max-width: 58ch !important;
  color: #617286 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.36 !important;
}

html body .retail-ops-shell .retail-ops-cm-map-head > strong {
  display: grid !important;
  min-width: 84px !important;
  min-height: 58px !important;
  place-items: center !important;
  padding: 8px 14px !important;
  border: 1px solid rgba(17, 128, 111, .18) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(236, 253, 245, .95), rgba(255, 255, 255, .92)) !important;
  color: #08243a !important;
  font-size: 24px !important;
  line-height: 1 !important;
}

html body .retail-ops-shell .retail-ops-cm-map-head > strong small {
  display: block !important;
  margin-top: 3px !important;
  color: #617286 !important;
  font-size: 10px !important;
  font-weight: 740 !important;
}

html body .retail-ops-shell .retail-ops-cm-map-grid {
  display: grid !important;
  grid-template-columns: minmax(340px, 430px) minmax(260px, 1fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
}

html body .retail-ops-shell .retail-ops-cm-map-shell {
  position: relative !important;
  justify-self: center !important;
  width: min(100%, 430px) !important;
  height: clamp(500px, 48vw, 650px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  touch-action: pan-y pinch-zoom !important;
  overscroll-behavior-y: auto !important;
  border: 1px solid rgba(124, 154, 178, .22) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 42% 35%, rgba(125, 211, 252, .24), transparent 34%),
    linear-gradient(135deg, rgba(8, 36, 58, .08), rgba(237, 250, 246, .96)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 18px 46px rgba(7, 31, 51, .12) !important;
  cursor: grab !important;
}

html body .retail-ops-shell .retail-ops-cm-map-shell:active {
  cursor: grabbing !important;
}

html body .retail-ops-shell .retail-ops-cm-map-controls {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 30 !important;
  display: grid !important;
  gap: 7px !important;
  pointer-events: auto !important;
}

html body .retail-ops-shell .retail-ops-cm-map-controls button {
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(17, 128, 111, .20) !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, .94) !important;
  color: #08243a !important;
  box-shadow: 0 10px 22px rgba(7, 31, 51, .12) !important;
  font-size: 18px !important;
  font-weight: 860 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

html body .retail-ops-shell .retail-ops-cm-map-controls button:hover {
  background: #11806f !important;
  color: #fff !important;
}

html body .retail-ops-shell .retail-ops-cm-map-stage {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 1 !important;
  width: auto !important;
  height: min(calc(100% - 32px), 540px) !important;
  aspect-ratio: 363 / 550 !important;
  transform: translate(-50%, -50%) translate3d(0, 0, 0) scale(1) !important;
  transform-origin: center center !important;
  transition: transform .18s ease !important;
  will-change: transform !important;
}

html body .retail-ops-shell .retail-ops-cm-map-image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: contain !important;
  user-select: none !important;
  border: 1px solid rgba(7, 31, 51, .16) !important;
  border-radius: 18px !important;
  background: #96adbb !important;
  box-shadow:
    0 22px 46px rgba(7, 31, 51, .20),
    0 0 0 10px rgba(255, 255, 255, .38),
    inset 0 1px 0 rgba(255, 255, 255, .72) !important;
}

html body .retail-ops-shell .retail-ops-cm-pin-layer {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  transform: none !important;
  pointer-events: none !important;
}

html body .retail-ops-shell .retail-ops-cm-pin,
html body .retail-ops-shell .retail-ops-cm-empty-pin {
  position: absolute !important;
  left: var(--pin-x) !important;
  top: var(--pin-y) !important;
  pointer-events: auto !important;
}

html body .retail-ops-shell .retail-ops-cm-pin {
  display: grid !important;
  place-items: center !important;
  width: var(--pin-size, 38px) !important;
  height: var(--pin-size, 38px) !important;
  padding: 0 !important;
  border: 3px solid rgba(255, 255, 255, .96) !important;
  border-radius: 999px !important;
  background: linear-gradient(145deg, #052b4a, #10a37f) !important;
  color: #fff !important;
  box-shadow:
    0 0 0 9px rgba(16, 163, 127, .18),
    0 12px 24px rgba(7, 31, 51, .30),
    inset 0 1px 0 rgba(255, 255, 255, .28) !important;
  font: inherit !important;
  cursor: pointer !important;
  isolation: isolate !important;
  transform: translate(-50%, calc(-100% - 10px)) !important;
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease !important;
}

html body .retail-ops-shell .retail-ops-cm-pin::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: calc(100% - 2px) !important;
  z-index: 0 !important;
  width: 14px !important;
  height: 14px !important;
  border-right: 3px solid rgba(255, 255, 255, .96) !important;
  border-bottom: 3px solid rgba(255, 255, 255, .96) !important;
  border-radius: 0 0 5px 0 !important;
  background: linear-gradient(145deg, #052b4a, #10a37f) !important;
  box-shadow: 8px 8px 18px rgba(7, 31, 51, .18) !important;
  transform: translate(-50%, -50%) rotate(45deg) !important;
  transform-origin: center !important;
}

html body .retail-ops-shell .retail-ops-cm-pin:hover,
html body .retail-ops-shell .retail-ops-cm-pin.is-focused {
  transform: translate(-50%, calc(-100% - 14px)) scale(1.06) !important;
  box-shadow:
    0 0 0 12px rgba(16, 163, 127, .22),
    0 18px 34px rgba(7, 31, 51, .38),
    inset 0 1px 0 rgba(255, 255, 255, .34) !important;
  filter: saturate(1.08) !important;
}

html body .retail-ops-shell .retail-ops-cm-pin span,
html body .retail-ops-shell .retail-ops-cm-empty-pin b {
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 920 !important;
  line-height: 1 !important;
  position: relative !important;
  z-index: 1 !important;
}

html body .retail-ops-shell .retail-ops-cm-pin small {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(100% + 8px) !important;
  display: block !important;
  max-width: 110px !important;
  padding: 5px 8px !important;
  border-radius: 999px !important;
  background: rgba(5, 24, 42, .92) !important;
  color: #fff !important;
  box-shadow: 0 10px 20px rgba(7, 31, 51, .18) !important;
  font-size: 9.5px !important;
  font-weight: 820 !important;
  line-height: 1.1 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  text-overflow: ellipsis !important;
  transform: translateX(-50%) translateY(4px) !important;
  transition: opacity .16s ease, transform .16s ease !important;
  white-space: nowrap !important;
}

html body .retail-ops-shell .retail-ops-cm-pin:hover small,
html body .retail-ops-shell .retail-ops-cm-pin.is-focused small {
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) !important;
}

html body .retail-ops-shell .retail-ops-cm-empty-pin {
  display: inline-grid !important;
  gap: 3px !important;
  min-width: 124px !important;
  padding: 9px 12px !important;
  border: 1px solid rgba(255, 255, 255, .78) !important;
  border-radius: 16px !important;
  background: rgba(8, 36, 58, .80) !important;
  box-shadow: 0 14px 26px rgba(7, 31, 51, .22) !important;
  text-align: center !important;
  transform: translate(-50%, -50%) !important;
}

html body .retail-ops-shell .retail-ops-cm-empty-pin small {
  color: rgba(255, 255, 255, .78) !important;
  font-size: 10px !important;
  font-weight: 760 !important;
}

html body .retail-ops-shell .retail-ops-cm-map-source {
  position: absolute !important;
  left: 18px !important;
  bottom: 18px !important;
  display: inline-flex !important;
  min-height: 28px !important;
  align-items: center !important;
  padding: 0 11px !important;
  border: 1px solid rgba(255, 255, 255, .70) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .82) !important;
  color: #08243a !important;
  box-shadow: 0 12px 24px rgba(7, 31, 51, .12) !important;
  font-size: 10px !important;
  font-weight: 820 !important;
  pointer-events: none !important;
}

html body .retail-ops-shell .retail-ops-cm-origin-list {
  display: grid !important;
  align-content: start !important;
  gap: 9px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

html body .retail-ops-shell .retail-ops-cm-origin-list li {
  display: grid !important;
  gap: 4px !important;
  padding: 12px 13px !important;
  border: 1px solid rgba(124, 154, 178, .18) !important;
  border-radius: 15px !important;
  background: rgba(255, 255, 255, .82) !important;
  box-shadow: 0 8px 18px rgba(7, 31, 51, .06) !important;
}

html body .retail-ops-shell .retail-ops-cm-origin-list strong {
  color: #08243a !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

html body .retail-ops-shell .retail-ops-cm-origin-list span {
  color: #617286 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1.3 !important;
}

@media (max-width: 1180px) {
  html body .retail-ops-shell .retail-ops-database-status {
    top: auto !important;
    left: auto !important;
    right: 12px !important;
    bottom: 12px !important;
    min-height: 38px !important;
    padding: 0 12px !important;
    font-size: 10.5px !important;
  }

  html body .retail-ops-shell .retail-ops-nav button,
  html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button {
    min-height: 46px !important;
    box-shadow: 0 5px 0 rgba(1, 11, 26, .20), 0 12px 24px rgba(1, 11, 26, .16) !important;
  }

  html body .retail-ops-shell .retail-ops-nav button::after,
  html body .retail-ops-shell .retail-ops-nav button.retail-ops-subnav-button::after {
    bottom: -6px !important;
    height: 7px !important;
  }

  html body .retail-ops-shell .retail-ops-stock-import-guide,
  html body .retail-ops-shell .retail-ops-cm-map-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .retail-ops-shell .retail-ops-cm-map-shell {
    width: min(100%, 430px) !important;
  }

  html body .retail-ops-shell .retail-ops-current-access,
  html body .retail-ops-shell .retail-ops-sidebar-card {
    display: none !important;
  }

  html body .retail-ops-shell .retail-ops-logout {
    position: fixed !important;
    top: auto !important;
    right: 12px !important;
    bottom: 62px !important;
    z-index: 1001 !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    color: #fee2e2 !important;
    font-size: 0 !important;
  }

  html body .retail-ops-shell .retail-ops-logout svg {
    width: 18px !important;
    height: 18px !important;
  }
}

@media (max-width: 720px) {
  html body .retail-ops-shell .retail-ops-cm-map-head {
    display: grid !important;
  }

  html body .retail-ops-shell .retail-ops-cm-map-head > strong {
    justify-self: start !important;
    min-height: 46px !important;
    font-size: 20px !important;
  }

  html body .retail-ops-shell .retail-ops-cm-map-shell {
    width: min(100%, 318px) !important;
    height: min(72vh, 430px) !important;
    min-height: 0 !important;
  }

  html body .retail-ops-shell .retail-ops-cm-map-controls {
    top: 12px !important;
    right: 28px !important;
  }

  html body .retail-ops-shell .retail-ops-cm-map-stage {
    height: min(calc(100% - 24px), 390px) !important;
  }

  html body .retail-ops-shell .retail-ops-cm-map-image,
  html body .retail-ops-shell .retail-ops-cm-pin-layer {
    height: 100% !important;
  }
}

/* Absolute final visual lock 20260727-09. */
html body .retail-ops-shell .retail-ops-database-status-source {
  display: none !important;
}

html body .retail-ops-database-status-portal {
  position: fixed !important;
  top: auto !important;
  left: auto !important;
  right: max(18px, env(safe-area-inset-right)) !important;
  bottom: max(18px, env(safe-area-inset-bottom)) !important;
  z-index: 1200 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 42px !important;
  max-width: min(430px, calc(100vw - 36px)) !important;
  padding: 0 16px !important;
  border: 1px solid rgba(17, 128, 111, .22) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(239, 250, 247, .97)) !important;
  color: #08243a !important;
  box-shadow: 0 16px 44px rgba(7, 31, 51, .18), inset 0 1px 0 rgba(255, 255, 255, .96) !important;
  backdrop-filter: blur(14px) !important;
  font-size: 10.8px !important;
  font-weight: 840 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

@media (min-width: 1181px) {
  html body .retail-ops-shell .retail-ops-sidebar {
    color: #fff !important;
    border-right: 1px solid rgba(255, 255, 255, .08) !important;
    background: linear-gradient(180deg, rgba(5, 18, 34, .99) 0%, rgba(8, 28, 51, .99) 54%, rgba(4, 14, 27, .99) 100%) !important;
    box-shadow: 20px 0 52px rgba(5, 17, 32, .24) !important;
  }

  html body .retail-ops-shell .retail-ops-brand,
  html body .retail-ops-shell .retail-ops-current-access,
  html body .retail-ops-shell .retail-ops-sidebar-card {
    color: #fff !important;
    border-color: rgba(255, 255, 255, .14) !important;
    background: linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .045)) !important;
  }

  html body .retail-ops-shell .retail-ops-brand strong,
  html body .retail-ops-shell .retail-ops-current-access strong,
  html body .retail-ops-shell .retail-ops-sidebar-card strong,
  html body .retail-ops-shell .retail-ops-nav span {
    color: #fff !important;
  }

  html body .retail-ops-shell .retail-ops-brand small,
  html body .retail-ops-shell .retail-ops-current-access small,
  html body .retail-ops-shell .retail-ops-sidebar-card small,
  html body .retail-ops-shell .retail-ops-sidebar-card span,
  html body .retail-ops-shell .retail-ops-nav small {
    color: rgba(226, 232, 240, .74) !important;
  }

  html body .retail-ops-shell .retail-ops-nav-group,
  html body .retail-ops-shell .retail-ops-subnav {
    border: 0 !important;
    background: transparent !important;
  }
}

@media (max-width: 720px) {
  html body .retail-ops-database-status-portal {
    right: 10px !important;
    bottom: 10px !important;
    max-width: min(260px, calc(100vw - 20px)) !important;
    min-height: 38px !important;
    padding: 0 12px !important;
    font-size: 10px !important;
  }
}

/* Round logo authority 20260728-01. */
html body .univers-login-brand img,
html body .public-order-brand img,
html body .retail-ops-shell .retail-ops-logo-mark,
html body .retail-ops-shell .retail-ops-brand > span {
  border-radius: 999px !important;
  overflow: hidden !important;
}

html body .univers-login-brand img,
html body .public-order-brand img,
html body .retail-ops-shell .retail-ops-logo-mark img,
html body img[src*="univers-informatique-logo-round"] {
  aspect-ratio: 1 / 1 !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  overflow: hidden !important;
  background: #fff !important;
}

/* Cameroon location assistant 20260728-02. */
html body .ui-cm-location-host {
  align-content: start !important;
  overflow: visible !important;
}

html body .retail-ops-checkout-context {
  align-items: start !important;
}

html body .retail-ops-checkout-context > label {
  align-content: start !important;
}

html body .ui-cm-location-assistant {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(126px, 1fr)) minmax(156px, 1fr) auto !important;
  gap: 8px !important;
  align-items: end !important;
  margin: 8px 0 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(17, 128, 111, .18) !important;
  border-radius: 14px !important;
  background: rgba(241, 250, 248, .72) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82) !important;
}

html body .ui-cm-location-assistant.is-compact {
  grid-template-columns: repeat(auto-fit, minmax(106px, 1fr)) !important;
  width: 100% !important;
  margin-top: 8px !important;
  padding: 7px !important;
  gap: 6px !important;
  border-color: rgba(17, 128, 111, .16) !important;
  border-radius: 12px !important;
  background: rgba(241, 250, 248, .68) !important;
}

html body .retail-ops-checkout-context > .ui-cm-location-assistant.is-compact.is-checkout-row {
  grid-column: 1 / -1 !important;
  grid-template-columns: repeat(3, minmax(136px, 1fr)) auto minmax(142px, .8fr) !important;
  align-items: end !important;
  margin: -2px 0 2px !important;
  padding: 8px 10px !important;
  border-color: rgba(17, 128, 111, .20) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(246, 252, 250, .98), rgba(235, 249, 245, .92)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .96), 0 10px 24px rgba(7, 31, 51, .06) !important;
}

html body .ui-cm-location-assistant label {
  box-sizing: border-box !important;
  display: grid !important;
  gap: 4px !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  align-content: start !important;
  color: #08243a !important;
  font-size: 9px !important;
  font-weight: 820 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

html body .ui-cm-location-assistant select,
html body .ui-cm-location-assistant input {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 1px solid rgba(124, 154, 178, .28) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .96) !important;
  color: #08243a !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .92) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

html body .ui-cm-location-assistant.is-compact select,
html body .ui-cm-location-assistant.is-compact input {
  min-height: 30px !important;
  padding: 0 8px !important;
  border-radius: 9px !important;
  font-size: 11px !important;
}

html body .ui-cm-location-assistant.is-compact label {
  gap: 3px !important;
  font-size: 8.5px !important;
}

html body .ui-cm-location-assistant.is-compact label.is-custom {
  display: none !important;
  grid-column: 1 / -1 !important;
}

html body .ui-cm-location-assistant.is-compact.is-adding label.is-custom {
  display: grid !important;
}

html body .ui-cm-location-assistant button {
  box-sizing: border-box !important;
  min-height: 34px !important;
  padding: 0 11px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: linear-gradient(145deg, #052b4a, #11806f) !important;
  color: #fff !important;
  box-shadow: 0 3px 0 rgba(3, 28, 43, .30), 0 8px 16px rgba(7, 31, 51, .12) !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

html body .ui-cm-location-assistant.is-compact button {
  align-self: end !important;
  min-height: 30px !important;
  padding: 0 9px !important;
  border-radius: 9px !important;
  font-size: 10.5px !important;
  min-width: 0 !important;
  white-space: normal !important;
  line-height: 1.08 !important;
}

html body .ui-cm-location-assistant button:active {
  transform: translateY(2px) !important;
  box-shadow: 0 1px 0 rgba(3, 28, 43, .30), 0 5px 12px rgba(7, 31, 51, .12) !important;
}

html body .ui-cm-location-assistant [data-ui-cm-status] {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  color: #0a6f61 !important;
  font-size: 10.5px !important;
  font-weight: 740 !important;
  line-height: 1.3 !important;
  min-height: 14px !important;
}

html body .ui-cm-location-assistant.is-compact [data-ui-cm-status] {
  grid-column: 1 / -1 !important;
  display: block !important;
  min-height: 0 !important;
  margin: -2px 0 0 !important;
  font-size: 9.5px !important;
  line-height: 1.15 !important;
}

html body .retail-ops-checkout-context > .ui-cm-location-assistant.is-compact.is-checkout-row [data-ui-cm-status] {
  grid-column: auto !important;
  align-self: center !important;
  margin: 0 !important;
  color: #0b7665 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

@media (max-width: 1180px) {
  html body .ui-cm-location-assistant {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body .ui-cm-location-assistant.is-compact {
    grid-template-columns: repeat(auto-fit, minmax(106px, 1fr)) !important;
  }

  html body .retail-ops-checkout-context > .ui-cm-location-assistant.is-compact.is-checkout-row {
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto !important;
  }

  html body .retail-ops-checkout-context > .ui-cm-location-assistant.is-compact.is-checkout-row [data-ui-cm-status] {
    grid-column: 1 / -1 !important;
  }

  html body .ui-cm-location-assistant.is-compact label.is-custom {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 720px) {
  html body .ui-cm-location-assistant {
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 10px !important;
  }

  html body .ui-cm-location-assistant button {
    width: 100% !important;
    white-space: normal !important;
  }

  html body .ui-cm-location-assistant.is-compact {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html body .retail-ops-checkout-context > .ui-cm-location-assistant.is-compact.is-checkout-row {
    grid-template-columns: minmax(0, 1fr) !important;
    margin-top: 0 !important;
  }

  html body .ui-cm-location-assistant.is-compact label.is-custom {
    grid-column: auto !important;
  }
}