/* Native-safe phone shell. The same file is harmless in browsers: safe-area
   variables resolve to zero where no display cutout or system bar exists. */
:root {
  --o-safe-top: max(env(safe-area-inset-top, 0px), var(--safe-area-inset-top, 0px));
  --o-safe-right: max(env(safe-area-inset-right, 0px), var(--safe-area-inset-right, 0px));
  --o-safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--safe-area-inset-bottom, 0px));
  --o-safe-left: max(env(safe-area-inset-left, 0px), var(--safe-area-inset-left, 0px));
}

.o_navbar {
  height: calc(56px + var(--o-safe-top));
  padding-top: var(--o-safe-top);
  padding-right: max(18px, var(--o-safe-right));
  padding-left: max(18px, var(--o-safe-left));
}

.o_notification_manager {
  top: calc(56px + var(--o-safe-top));
  right: max(12px, var(--o-safe-right));
}

.o_system_hold {
  padding-top: max(clamp(24px, 6vw, 72px), var(--o-safe-top));
  padding-right: max(clamp(24px, 6vw, 72px), var(--o-safe-right));
  padding-bottom: max(clamp(24px, 6vw, 72px), var(--o-safe-bottom));
  padding-left: max(clamp(24px, 6vw, 72px), var(--o-safe-left));
}

@media (max-width: 720px) {
  .o_navbar {
    position: relative;
    height: calc(50px + var(--o-safe-top));
    padding: var(--o-safe-top) max(9px, var(--o-safe-right)) 5px max(9px, var(--o-safe-left));
  }
  .o_notification_manager { top: calc(50px + var(--o-safe-top)); }
}

@media (max-width: 480px) {
  .o_login_wrap {
    min-height: calc(100dvh - 50px - var(--o-safe-top));
    padding: 24px max(12px, var(--o-safe-right)) calc(24px + var(--o-safe-bottom)) max(12px, var(--o-safe-left));
  }
  .o_login_card { width: 100%; max-width: none; padding-inline: 22px; }
  .o_login_kicker { flex-wrap: wrap; row-gap: 0; font-size: 10px; }
}

/* This file is the final phone contract. Route CSS is inserted before it so
   workspace-specific desktop rules cannot make a later screen wide again. */
.o_workspace_nav_select,
.o_workspace_nav_home,
.o_settings_mobile_back { display: none; }
.o_workspace_nav_buttons { display: flex; align-items: center; gap: 3px; min-width: 0; }

.o_connection_notice {
  position: fixed; z-index: 1600; top: calc(62px + var(--o-safe-top)); left: 50%;
  display: flex; align-items: center; gap: 8px; max-width: calc(100vw - 24px);
  min-height: 36px; padding: 7px 12px; border: 1px solid #d7dfd3; border-radius: 999px;
  background: rgba(255,255,255,.97); color: #4b574d; box-shadow: 0 8px 24px rgba(28,43,30,.14);
  font-size: 12px; font-weight: 700; transform: translateX(-50%);
}
.o_connection_notice[hidden] { display: none; }
.o_connection_notice_pulse {
  width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%;
  background: linear-gradient(135deg, #459945 0 50%, #d05a91 50%);
  animation: o-connection-pulse 1.1s ease-in-out infinite alternate;
}
@keyframes o-connection-pulse { to { opacity: .35; transform: scale(.78); } }

/* A slow screen is not an outage. Keep the current view usable and show one
   quiet operational signal while its foreground requests are still working. */
.o_console_loading {
  position: fixed; z-index: 1590;
  top: calc(56px + var(--o-safe-top)); left: 0; right: 0;
  height: 3px; overflow: hidden; pointer-events: none;
  background: rgba(69,153,69,.12);
}
.o_console_loading[hidden] { display: none; }
.o_console_loading span {
  position: absolute; inset: 0 auto 0 -38%; width: 38%; border-radius: 999px;
  background: linear-gradient(90deg, #459945 0%, #78a85f 47%, #d05a91 100%);
  animation: o-console-loading 1.15s cubic-bezier(.55,.15,.35,.9) infinite;
}
@keyframes o-console-loading {
  from { transform: translateX(0); }
  to { transform: translateX(365%); }
}

@media (max-width: 720px) {
  html, body {
    width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto;
    background: linear-gradient(110deg, #eef8ec 0%, #fbfcfa 52%, #fff0f6 100%);
    overscroll-behavior: none;
  }
  .o_web_client { height: 100dvh; max-width: 100vw; overflow: hidden; background: var(--o-ground); }
  .o_navbar {
    box-sizing: border-box; width: 100%; max-width: 100vw; flex: 0 0 auto;
    gap: 7px; padding-right: max(8px, var(--o-safe-right));
    padding-left: max(8px, var(--o-safe-left));
    background: linear-gradient(100deg, rgba(69,153,69,.18) 0%, #fbfcfa 50%, rgba(208,90,145,.15) 100%);
    backdrop-filter: none; -webkit-backdrop-filter: none;
  }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-rows: 44px;
    height: calc(50px + var(--o-safe-top));
    column-gap: 7px; row-gap: 0;
  }
  .o_navbar.o_navbar_warehouse_task {
    display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-rows: 44px;
    height: calc(50px + var(--o-safe-top)); min-height: calc(50px + var(--o-safe-top));
    transition: height .16s ease, min-height .16s ease, padding-top .16s ease;
  }
  .o_navbar_warehouse_task .o_console_brand_lockup { grid-column:1;align-self:center;justify-self:start; }
  .o_navbar_warehouse_task .o_price_notice { grid-column:2;align-self:center; }
  .o_navbar_warehouse_task .o_user_menu { grid-column:3;align-self:center; }
  .o_navbar_warehouse_task .o_workspace_nav,.o_navbar_warehouse_task .o_navbar_spacer { display:none !important; }
  .o_navbar.o_navbar_warehouse_task.is-focus-collapsed {
    height: var(--o-safe-top); min-height: var(--o-safe-top); padding-top: var(--o-safe-top);
    border-bottom-color: transparent; padding-bottom: 0; overflow: hidden;
  }
  .o_navbar_warehouse_task.is-focus-collapsed>* { opacity:0; pointer-events:none; }
  body:has(.o_navbar_warehouse_task) .o_console_loading { top:calc(50px + var(--o-safe-top)); }
  body:has(.o_navbar_warehouse_task.is-focus-collapsed) .o_console_loading { top:var(--o-safe-top); }
  body:has(.o_navbar_warehouse_task) .o_connection_notice { top:calc(56px + var(--o-safe-top)); }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) .o_console_brand_lockup {
    grid-column: 1; grid-row: 1; align-self: center; justify-self: start;
  }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) .o_price_notice {
    grid-column: 2; grid-row: 1; align-self: center;
  }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) .o_user_menu {
    grid-column: 3; grid-row: 1; align-self: center;
  }
  /* Place chat/account columns after the base three-column assignments. */
  .o_navbar:has(> .o_chat_notice):not(.o_navbar_landing):not(.o_navbar_warehouse) {
    grid-template-columns: minmax(0, 1fr) auto auto auto;
  }
  .o_navbar:has(> .o_chat_notice):not(.o_navbar_landing):not(.o_navbar_warehouse) > .o_chat_notice {
    grid-column: 3; grid-row: 1; align-self: center;
  }
  .o_navbar:has(> .o_chat_notice):not(.o_navbar_landing):not(.o_navbar_warehouse) > .o_user_menu {
    grid-column: 4; grid-row: 1;
  }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) .o_workspace_nav {
    display: none;
  }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) .o_navbar_spacer { display: none !important; }
  body:has(.o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task)) .o_console_loading {
    top: calc(50px + var(--o-safe-top));
  }
  body:has(.o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task)) .o_connection_notice {
    top: calc(56px + var(--o-safe-top));
  }
  .o_console_loading { top: calc(50px + var(--o-safe-top)); }
  .o_navbar::after {
    content: ''; position: absolute; left: 0; right: 0;
    top: auto; bottom: -1px; height: 2px; pointer-events: none;
    background: linear-gradient(90deg, rgba(69,153,69,.68), rgba(69,153,69,.12) 42%, rgba(201,90,143,.12) 58%, rgba(201,90,143,.62));
  }
  .o_navbar_warehouse_task.is-focus-collapsed::after { display: none; }
  .o_navbar_spacer { display: block !important; flex: 1 1 auto; min-width: 2px; }
  .o_console_brand_lockup { flex: 0 1 auto; min-width: 0; padding-right: 0; border-right: 0; }
  .o_price_notice, .o_user_menu { flex: 0 0 auto; }
  .o_price_notice_trigger, .o_user_menu_trigger { min-width: 44px; min-height: 44px; }
  .o_user_menu_trigger { max-width: 44px; padding-inline: 8px; }
  .o_user_dropdown {
    position: fixed; right: max(8px, var(--o-safe-right)); left: auto;
    width: min(320px, calc(100vw - max(16px, var(--o-safe-left) + var(--o-safe-right))));
    max-width: none;
  }
  body:has(.o_navbar_landing) .o_user_dropdown { top: calc(56px + var(--o-safe-top)); }
  body:has(.o_navbar_warehouse_task) .o_user_dropdown { top: calc(56px + var(--o-safe-top)); }
  body:has(.o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task)) .o_user_dropdown {
    top: calc(56px + var(--o-safe-top));
  }
  .o_workspace_nav { flex: 0 1 156px; overflow: visible; }
  .o_workspace_nav_buttons { display: none; }
  .o_workspace_nav_select {
    display: block; width: 100%; min-width: 0; min-height: 44px; padding: 7px 26px 7px 10px;
    border: 1px solid rgba(94,139,91,.24); border-radius: 10px; background: rgba(255,255,255,.78);
    color: #23652d; font: inherit; font-size: 12px; font-weight: 800; text-overflow: ellipsis;
  }
  .o_workspace_nav_home {
    display: flex; align-items: center; justify-content: center; width: 100%; min-width: 0;
    min-height: 44px; padding: 7px 10px; border: 1px solid rgba(94,139,91,.24);
    border-radius: 10px; background: rgba(255,255,255,.78); color: #23652d;
    font: inherit; font-size: 12px; font-weight: 800; white-space: nowrap;
  }
  .o_workspace_nav_home + .o_workspace_nav_select { display: none; }
  .o_action_manager { flex: 1 1 auto; min-width: 0; min-height: 0; overflow: hidden; }
  .o_action_manager > .o_content { height: 100%; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; }
  .o_control_panel { flex-wrap: wrap; min-width: 0; max-width: 100vw; padding: 8px 10px; }
  .o_control_panel.cs-control-panel {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr) 86px;
    grid-template-areas:
      "back title recent"
      "search search search"
      "buttons buttons buttons";
    gap: 8px; align-items: center;
  }
  .cs-control-panel > .o_recent_menu { grid-area: recent; justify-self: end; }
  .cs-control-panel > .o_cp_context { display: contents; }
  .cs-control-panel .o_cp_back { grid-area: back; justify-self: start; }
  .o_control_panel .o_cp_back, .o_control_panel .o_recent_trigger {
    min-width: 44px; min-height: 44px;
  }
  .o_control_panel .o_cp_back {
    border: 0; border-radius: 999px; background: transparent; color: #23652d;
    font-size: 28px; line-height: 1; padding: 0;
  }
  .cs-control-panel .o_breadcrumb {
    grid-area: title; justify-self: center; max-width: 100%; text-align: center;
  }
  .cs-control-panel > .cs-header-search {
    grid-area: search; width: 100%; max-width: none; margin: 0;
  }
  .cs-control-panel > .o_cp_buttons { grid-area: buttons; }
  .o_control_panel.cs-compact-control-panel {
    grid-template-columns: 44px minmax(0, 1fr) 44px 44px;
    grid-template-areas: "back title search recent";
    gap: 6px; padding-block: 6px;
  }
  .o_control_panel.cs-compact-control-panel:has(> .o_cp_buttons > :not(.cs-quick-create)) {
    grid-template-areas:
      "back title search recent"
      "buttons buttons buttons buttons";
  }
  .o_control_panel.cs-compact-control-panel:has(.cs-header-search.is-open) {
    grid-template-areas:
      "back title search recent"
      "search-open search-open search-open search-open";
  }
  .o_control_panel.cs-compact-control-panel:has(.cs-header-search.is-open):has(> .o_cp_buttons > :not(.cs-quick-create)) {
    grid-template-areas:
      "back title search recent"
      "search-open search-open search-open search-open"
      "buttons buttons buttons buttons";
  }
  .cs-compact-control-panel > .o_cp_buttons:not(:has(> :not(.cs-quick-create))) { display: none; }
  .cs-compact-control-panel .o_recent_trigger {
    justify-content: center; width: 44px; padding-inline: 0; color: #23652d;
  }
  .cs-compact-control-panel .o_recent_trigger > svg { width: 20px; height: 20px; }
  .cs-compact-control-panel .o_recent_label,
  .cs-compact-control-panel .o_recent_chevron { display: none; }
  .cs-compact-control-panel > .cs-header-search.is-collapsible {
    width: 44px; justify-self: end;
  }
  .cs-compact-control-panel > .cs-header-search.is-collapsible.is-open {
    grid-area: search-open; width: 100%;
  }
  .cs-search-toggle {
    display: flex; align-items: center; justify-content: center; width: 44px; min-width: 44px; min-height: 44px;
    padding: 0; border: 0; border-radius: 999px;
    background: transparent; color: #23652d; font: inherit; font-size: 23px; cursor: pointer;
  }
  .cs-compact-control-panel .o_recent_trigger {
    border-color: transparent; border-radius: 999px; background: transparent;
  }
  /* Pages that ARE a search (Products) keep the bar open under the title. */
  .o_control_panel.cs-compact-control-panel.cs-search-expanded-control-panel {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    grid-template-areas: "back title recent" "search search search" "buttons buttons buttons";
  }
  .o_control_panel.cs-compact-control-panel.cs-search-expanded-control-panel:has(> .o_cp_buttons > :not(.cs-quick-create)) {
    grid-template-areas: "back title recent" "search search search" "buttons buttons buttons";
  }
  .cs-search-expanded-control-panel > .cs-header-search { grid-area: search; width: 100%; min-width: 0; justify-self: stretch; }
  .cs-control-panel .cs-header-search .o_kbd { display: none; }
  .cs-control-panel .cs-header-search .cs-global-search { min-height: 46px; border-radius: 8px; padding-inline: 12px; }
  .cs-control-panel .cs-header-search .cs-global-search input { min-height: 44px; font-size: 16px; }
  .cs-search-expanded-control-panel > .cs-ribbon-filter,
  .cs-search-expanded-control-panel > .cs-full-filters { grid-column: 1 / -1; }
  /* iOS zooms the page when a focused field's text is under 16px and the zoom
     sticks until the app is relaunched (Tom, 2026-09-12). Keep every field at
     16px on phones; the shell also caps the viewport scale. */
  input[type="search"], input[type="text"], input[type="number"], input[type="email"],
  input[type="tel"], input[type="date"], input[type="password"], input:not([type]),
  select, textarea, .o_input, .cs-header-search .cs-global-search input,
  .cs-global-search input { font-size: 16px; }
  /* Product cards (Products page on phones). */
  .cs-product-cards { display: grid; gap: 9px; }
  .cs-product-card {
    position: relative; display: grid; gap: 8px; width: 100%; min-width: 0; padding: 12px 36px 12px 14px;
    border: 1px solid #dce4da; border-radius: 14px; background: #fff; color: #15231a; text-align: left;
    box-shadow: 0 3px 10px rgba(35,61,37,.055); font: inherit; cursor: pointer;
  }
  .cs-product-card:active { background: #f1f7ef; }
  .cs-product-card-main { display: grid; gap: 2px; min-width: 0; }
  .cs-product-card-main strong { font-size: 15px; line-height: 1.3; overflow-wrap: anywhere; }
  .cs-product-card-main small { color: #7b867e; font-size: 12px; font-variant-numeric: tabular-nums; }
  .cs-product-card-prices { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
  .cs-product-card-price { display: inline-flex; align-items: baseline; gap: 4px; font-size: 15px; font-weight: 800; font-variant-numeric: tabular-nums; }
  .cs-product-card-price small { font-size: 10px; font-weight: 850; letter-spacing: .06em; }
  .cs-product-card-price.is-nature { color: #2f7838; }
  .cs-product-card-price.is-motherhood { color: #9a3d6f; }
  .cs-product-card-stock { margin-left: auto; padding: 2px 8px; border-radius: 999px; background: #eaf3ea; color: #2f7838; font-size: 11px; font-weight: 750; }
  .cs-product-card-stock.is-out { background: #f6eceb; color: #9a3934; }
  .cs-product-card-open { position: absolute; top: 12px; right: 12px; color: #839087; font-size: 24px; line-height: 1; }
  .cs-header-search.is-collapsible .cs-global-search { display: none; }
  .cs-header-search.is-collapsible.is-open .cs-search-toggle { display: none; }
  .cs-header-search.is-collapsible.is-open .cs-global-search { display: flex; }
  .o_control_panel.o-mobile-compact-control-panel {
    display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px;
    grid-template-areas: "back title recent";
    align-items: center; gap: 6px; padding-block: 6px;
  }
  .o_control_panel.o-mobile-compact-control-panel:has(> .o_cp_buttons) {
    grid-template-areas: "back title recent" "buttons buttons buttons";
  }
  .o-mobile-compact-control-panel > .o_cp_context { display: contents; }
  .o-mobile-compact-control-panel .o_cp_back { grid-area: back; justify-self: start; }
  .o-mobile-compact-control-panel .o_breadcrumb {
    grid-area: title; justify-self: center; max-width: 100%; text-align: center;
  }
  .o-mobile-compact-control-panel > .o_recent_menu { grid-area: recent; justify-self: end; }
  .o-mobile-compact-control-panel > .o_cp_buttons { grid-area: buttons; }
  .o-mobile-compact-control-panel .o_recent_trigger {
    justify-content: center; width: 44px; min-width: 44px; padding-inline: 0; color: #23652d;
    border-color: transparent; border-radius: 999px; background: transparent;
  }
  .o-mobile-compact-control-panel .o_recent_trigger > svg { width: 20px; height: 20px; }
  .o-mobile-compact-control-panel .o_recent_label,
  .o-mobile-compact-control-panel .o_recent_chevron { display: none; }
  .o_cp_context { flex: 1 1 auto; min-width: 0; }
  .o_cp_spacer { display: none; }
  .o_breadcrumb { min-width: 0; white-space: nowrap; text-overflow: ellipsis; }
  .o_breadcrumb > :not(.active) { display: none; }
  .o_breadcrumb .active {
    display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .o_control_panel .o_breadcrumb {
    display: flex; flex-wrap: nowrap; gap: 5px; overflow-x: auto; overflow-y: hidden;
    max-width: 100%; scrollbar-width: none; text-overflow: clip;
  }
  .o_control_panel .o_breadcrumb::-webkit-scrollbar { display: none; }
  .o_control_panel .o_breadcrumb > :not(.active) { display: inline; }
  .o_control_panel .o_breadcrumb > * { flex: 0 0 auto; }
  .o_control_panel .o_breadcrumb .active { display: inline; overflow: visible; }
  .o_control_panel.cs-control-panel .o_breadcrumb,
  .o_control_panel.o-mobile-compact-control-panel .o_breadcrumb {
    grid-area: title; justify-self: stretch; text-align: left; width: 100%;
  }
  .o_cp_buttons {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px; width: 100%; overflow: visible; padding: 0;
  }
  .o_cp_buttons > * { min-width: 0; width: 100%; min-height: 44px; }
  .o_cp_buttons .cs-quick-create { display: none; }
  .cs-home-control-panel .o_cp_buttons .cs-quick-create { display: inline-flex; }
  .cs-home-control-panel .o_cp_buttons {
    display: flex; flex-wrap: nowrap; max-width: 100%; gap: 5px;
    overflow-x: auto; overscroll-behavior-x: contain;
  }
  .cs-home-control-panel .o_cp_buttons .cs-quick-create {
    flex: 0 0 auto; width: auto; min-height: 44px; padding: 8px 12px; font-size: 0;
  }
  .cs-home-control-panel .o_cp_buttons .cs-quick-create::after {
    content: "+ " attr(data-mobile-label); font-size: 12px; font-weight: 750;
  }
  .cs-header-search { order: 3; flex-basis: 100%; min-width: 0; }
  .cs-header-search input { min-width: 0; }

  /* Home: one compact status block and one unambiguous next action. */
  .o_landing { height: 100%; overflow-y: auto; overscroll-behavior-y: contain; }
  .o_landing_inner { padding: 22px 14px calc(42px + var(--o-safe-bottom)); }
  .o_launch_header { display: grid; gap: 14px; padding: 0; border: 0; }
  .o_launch_welcome h1 { margin: 0; font-size: clamp(28px, 8vw, 36px); line-height: 1.05; }
  .o_landing_lead { margin-top: 6px; font-size: 14px; }
  .o_launch_actions { display: grid; width: 100%; gap: 10px; align-items: stretch; }
  .o_launch_datetime {
    display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 4px 12px;
    padding: 13px 14px; border: 1px solid #dbe5d8; border-radius: 14px; background: rgba(255,255,255,.82);
  }
  .o_launch_time { grid-row: 1 / 3; align-self: center; font-size: 24px; }
  .o_launch_date { font-size: 12px; line-height: 1.3; }
  .o_launch_continue {
    width: 100%; min-height: 50px; justify-content: space-between; padding: 11px 14px;
    border-radius: 13px; background: #078533; color: #fff; box-shadow: 0 5px 14px rgba(7,133,51,.13);
  }
  .o_launch_context {
    width: 100%; min-height: 42px; margin: 9px 0 14px; padding: 9px 12px;
    border: 1px solid #dfe7dc; border-radius: 12px; background: rgba(255,255,255,.62);
  }
  .o_app_update_notice { flex-wrap: wrap; border-radius: 12px; }
  .o_area_grid_primary, .o_area_grid_standard { grid-template-columns: 1fr; gap: 9px; }
  .o_app_downloads { margin-top: 20px; padding-top: 16px; }
  .o_app_downloads_list { grid-template-columns: 1fr; gap: 8px; }
  .o_app_download { min-height: 72px; border-radius: 13px; }
  .o_area_card, .o_area_card_standard { min-height: 92px; padding: 14px; border-radius: 14px; }

  /* Generic records become native-width cards across phone workspaces. */
  .cs-check-fields { grid-template-columns: 1fr; }
  .cs-balance-lines.o_list_view { overflow: visible; border: 0; background: transparent; box-shadow: none; }
  .cs-balance-lines .o_mobile_card_table { display: block; width: 100%; }
  .cs-balance-lines .o_mobile_card_table thead { display: none; }
  .cs-balance-lines .o_mobile_card_table tbody { display: grid; gap: 9px; }
  .cs-balance-lines .o_mobile_card_table tr {
    display: grid; grid-template-columns: 24px minmax(0, 1fr) auto;
    gap: 7px 10px; padding: 12px; border: 1px solid #dce4da;
    border-radius: 12px; background: #fff;
  }
  .cs-balance-lines .o_mobile_card_table td {
    display: block; min-width: 0; height: auto; padding: 0; border: 0;
    font-size: 12px; white-space: normal; overflow-wrap: anywhere;
  }
  .cs-balance-lines .o_mobile_card_table td::before { display: block; margin-bottom: 2px; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(1) { grid-column: 1; grid-row: 1; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(1)::before { display: none; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(2) { grid-column: 2 / 4; grid-row: 1; font-weight: 700; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(2)::before { display: none; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(3) { grid-column: 2; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(4) { grid-column: 2 / 4; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(5) { grid-column: 2; }
  .cs-balance-lines .o_mobile_card_table td:nth-child(6) { grid-column: 3; text-align: right; }
  .o_mobile_card_table { border-collapse: separate; border-spacing: 0; }
  .cs-home-panel, .cs-full-list-body, .o_users_wrap, .cs-work-page,
  .cs-customer-tab-body, .cs-order-documents, .cs-subscription-generated,
  .cs-subscription-combo, .cs-products-results { max-width: 100%; overflow: visible; }
  .cs-home-panel .o_list_view, .cs-full-list-body .o_list_view, .cs-work-page .o_list_view,
  .o_users_wrap .o_list_view, .cs-customer-tab-body .o_list_view,
  .cs-order-documents .o_list_view, .cs-subscription-generated .o_list_view,
  .cs-subscription-combo .o_list_view, .cs-products-results .o_list_view { overflow: visible; border: 0; background: transparent; box-shadow: none; }
  .cs-home-panel .o_mobile_card_table,
  .cs-full-list-body .o_mobile_card_table,
  .cs-work-page .o_mobile_card_table,
  .o_users_wrap .o_mobile_card_table,
  .cs-customer-tab-body .o_mobile_card_table,
  .cs-order-documents .o_mobile_card_table,
  .cs-subscription-generated .o_mobile_card_table,
  .cs-subscription-combo .o_mobile_card_table,
  .cs-products-results .o_mobile_card_table { display: block; width: 100%; }
  .cs-home-panel .o_mobile_card_table thead,
  .cs-full-list-body .o_mobile_card_table thead,
  .cs-work-page .o_mobile_card_table thead,
  .o_users_wrap .o_mobile_card_table thead,
  .cs-customer-tab-body .o_mobile_card_table thead,
  .cs-order-documents .o_mobile_card_table thead,
  .cs-subscription-generated .o_mobile_card_table thead,
  .cs-subscription-combo .o_mobile_card_table thead,
  .cs-products-results .o_mobile_card_table thead { display: none; }
  .cs-home-panel .o_mobile_card_table tbody,
  .cs-full-list-body .o_mobile_card_table tbody,
  .cs-work-page .o_mobile_card_table tbody,
  .o_users_wrap .o_mobile_card_table tbody,
  .cs-customer-tab-body .o_mobile_card_table tbody,
  .cs-order-documents .o_mobile_card_table tbody,
  .cs-subscription-generated .o_mobile_card_table tbody,
  .cs-subscription-combo .o_mobile_card_table tbody,
  .cs-products-results .o_mobile_card_table tbody { display: grid; gap: 9px; }
  .cs-home-panel .o_mobile_card_table tr,
  .cs-full-list-body .o_mobile_card_table tr,
  .cs-work-page .o_mobile_card_table tr,
  .o_users_wrap .o_mobile_card_table tr,
  .cs-customer-tab-body .o_mobile_card_table tr,
  .cs-order-documents .o_mobile_card_table tr,
  .cs-subscription-generated .o_mobile_card_table tr,
  .cs-subscription-combo .o_mobile_card_table tr,
  .cs-products-results .o_mobile_card_table tr {
    position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 14px; min-width: 0; padding: 14px; border: 1px solid #dce4da;
    border-radius: 14px; background: #fff; box-shadow: 0 3px 10px rgba(35,61,37,.055);
  }
  .o_mobile_card_action::after {
    content: '›'; position: absolute; top: 14px; right: 12px;
    color: #839087; font-size: 24px; line-height: 1;
  }
  .o_mobile_card_action { cursor: pointer; padding-right: 36px !important; }
  .o_mobile_card_action:active { background: #f1f7ef !important; transform: translateY(1px); }
  .cs-home-panel .o_mobile_card_table td,
  .cs-full-list-body .o_mobile_card_table td,
  .cs-work-page .o_mobile_card_table td,
  .o_users_wrap .o_mobile_card_table td,
  .cs-customer-tab-body .o_mobile_card_table td,
  .cs-order-documents .o_mobile_card_table td,
  .cs-subscription-generated .o_mobile_card_table td,
  .cs-subscription-combo .o_mobile_card_table td,
  .cs-products-results .o_mobile_card_table td {
    display: grid; align-content: start; gap: 2px; min-width: 0; height: auto;
    max-width: none; padding: 0; border: 0; color: #334039; font-size: 13px;
    text-align: left; white-space: normal; overflow-wrap: anywhere;
  }
  .o_mobile_card_table td::before {
    content: attr(data-label); color: #7b867e; font-size: 9px; font-weight: 850;
    letter-spacing: .06em; line-height: 1.2; text-transform: uppercase;
  }
  .o_mobile_card_table td[data-mobile-order="0"],
  .o_mobile_card_table td[data-mobile-order="1"] { grid-column: 1 / -1; }
  .o_mobile_card_table td[data-mobile-order="0"] { color: #15231a; font-size: 16px; font-weight: 800; }
  .o_mobile_card_table td[data-label=""]:empty { display: none; }
  .o_mobile_card_table td.num { text-align: left; }
  .o_mobile_card_table td.num::before { text-align: left; }

  /* Customer Service shell and work lists. */
  .cs-home-workbench, .cs-full-list, .cs-products-page { padding: 10px 10px calc(50px + var(--o-safe-bottom)); }
  /* The shared control panel already names the current workspace. Put live work
     first instead of repeating desktop page titles and explanatory copy. */
  .cs-home-intro { display: none; }
  .cs-home-refresh { justify-content: flex-end; }
  .cs-panel-head-actions { gap: 5px; margin-left: auto; }
  .cs-panel-recent .cs-panel-meta, .cs-live-detail { display: none; }
  .cs-panel-recent .cs-live-state { gap: 4px; white-space: nowrap; }
  .cs-panel-recent .cs-refresh { min-height: 40px; padding-inline: 4px; }
  .cs-full-list-head { display: none; }
  .cs-products-heading { display: block; margin-bottom: 9px; }
  .cs-products-heading > :first-child { display: none; }
  .cs-global-search { min-height: 50px; }
  .cs-global-search input { min-height: 44px; }
  .o_content input[type="search"] { min-height: 44px; }
  .o_content .btn,
  .o_content .cs-assignee-button,
  .o_content .cs-customer-actions-menu > button,
  .o_content .whc-chip,
  .o_action_manager .whc-chip { min-height: 44px; }
  .o_content .cs-labeled > .o_input { min-height: 44px; }
  .o_notification .o_close {
    display: inline-grid; place-items: center; min-width: 44px; min-height: 44px;
    margin: -8px -10px -8px 0; padding: 0;
  }
  .cs-home-grid { gap: 12px; }
  .cs-home-grid > .cs-home-panel:not(.cs-panel-recent) { display: none; }
  .cs-panel-recent { display: block; }
  .cs-recent-feed { display: grid; padding: 4px 10px 10px; }
  .cs-recent-item {
    display: grid; grid-template-columns: 38px minmax(0, 1fr) auto 12px; align-items: center; gap: 10px;
    min-width: 0; min-height: 64px; padding: 8px 4px; border: 0; border-bottom: 1px solid #e6ece4;
    background: transparent; color: #18231b; text-align: left; cursor: pointer;
  }
  .cs-recent-item:last-child { border-bottom: 0; }
  .cs-recent-mark {
    display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px;
    background: #e8f4e6; color: #078533; font-size: 13px; font-weight: 850;
  }
  .cs-recent-subscription .cs-recent-mark { background: #fbe8f1; color: #aa356e; }
  .cs-recent-ticket .cs-recent-mark { background: #edf4f7; color: #21677b; }
  .cs-recent-work .cs-recent-mark { background: #fff3db; color: #986000; }
  .cs-recent-copy, .cs-recent-meta { display: grid; min-width: 0; gap: 2px; }
  .cs-recent-copy strong, .cs-recent-copy span {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .cs-recent-copy strong { font-size: 14px; }
  .cs-recent-copy span, .cs-recent-meta span { color: #68736a; font-size: 10px; }
  .cs-recent-meta { justify-items: end; text-align: right; }
  .cs-recent-meta strong { font-size: 12px; }
  .cs-recent-chevron { color: #8a968d; font-size: 22px; }
  .cs-home-panel { border-radius: 14px; }
  .cs-panel-head, .cs-panel-foot, .cs-panel-body { min-width: 0 !important; }
  .cs-panel-head { align-items: flex-start; flex-wrap: wrap; padding: 14px; }
  .cs-panel-filters, .cs-full-filters { width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
  .cs-panel-filters .cs-filter, .cs-full-filters .cs-filter {
    min-width: 44px; min-height: 44px; padding-inline: 12px;
  }
  .o_content .cs-inline-check { min-height: 44px; }
  .cs-panel-body { padding: 0 10px 10px; }
  .cs-panel-foot { padding-inline: 12px; }
  .cs-full-list-count { margin-bottom: 9px; }
  .cs-products-results { overflow: visible; }
  .cs-products-results > .o_list_view { min-width: 0; }

  /* Work Queue: one contained queue chooser and native-width work cards. */
  .cs-worklist-workspace { padding: 10px 9px calc(50px + var(--o-safe-bottom)); }
  .cs-worklist-hero { display: block; margin-bottom: 9px; }
  .cs-worklist-hero > :first-child { display: none; }
  .cs-work-queues { display: none; }
  .cs-work-queue-select {
    display: block; width: 100%; min-height: 48px; margin: 0 0 10px; padding: 8px 38px 8px 13px;
    border: 1px solid #c8d7c6; border-radius: 12px; background: #fff; color: #245a24;
    font: inherit; font-size: 14px; font-weight: 800;
  }
  .cs-work-card { overflow: visible; border-radius: 14px; }
  .cs-work-toolbar { align-items: stretch; }
  .cs-work-owner-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: visible; }
  .cs-work-owner-filter { justify-content: center; min-width: 0; min-height: 42px; }
  .cs-work-actions .btn, .cs-work-actions .cs-assignee-button { min-height: 44px; }
  .cs-work-page .o_list_view { min-width: 0; overflow: visible; }
  .cs-work-page .o_mobile_card_table { min-width: 0 !important; }
  .cs-work-page .cs-work-record { min-width: 0; }

  /* Tickets: contained progress, useful two-column facts, and full-width actions. */
  .tk-workspace { padding: 14px 9px calc(48px + var(--o-safe-bottom)); }
  .tk-header { gap: 13px; padding-bottom: 13px; }
  .tk-identity h1 { font-size: 24px; }
  .tk-header-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tk-header-actions .btn { width: 100%; min-height: 44px; }
  .tk-header-actions .tk-primary { grid-column: 1 / -1; }
  .tk-stage-rail {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); overflow: hidden;
  }
  .tk-stage { min-width: 0; min-height: 54px; padding: 9px 4px; font-size: 9px; line-height: 1.15; }
  .tk-stage::after { inset-inline: 7px; }
  .tk-facts, .tk-special-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 14px; }
  .tk-facts .tk-info:nth-child(2) { grid-column: 1 / -1; }
  .tk-info > strong, .tk-info > .tk-link, .tk-info > select { font-size: 13px; }
  .tk-info > .tk-link { display: inline-flex; align-items: center; min-height: 44px; }
  .tk-inline-select { width: 100%; max-width: none; min-height: 38px; }
  .tk-panel-body { padding: 15px 13px; }
  .tk-activity { grid-template-columns: 12px minmax(0, 1fr); }
  .tk-activity .btn { grid-column: 2; width: fit-content; min-height: 40px; }
  .tk-compose-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tk-compose-tabs button { min-height: 40px; }
  .tk-composer textarea { min-height: 112px; font-size: 14px; }

  /* Customer detail: readable identity, actions and tabs without side-scroll. */
  .cs-customer-workspace { padding: 16px 10px calc(50px + var(--o-safe-bottom)); }
  .cs-customer-header { align-items: stretch; flex-direction: column; gap: 12px; padding: 4px 2px 14px; }
  .cs-customer-identity h1 { font-size: 27px; line-height: 1.08; }
  .cs-customer-header-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
  .cs-customer-primary { width: 100%; min-height: 48px; }
  .cs-gift-sale-grid { grid-template-columns: 1fr; }
  .cs-gift-sale-catalogs button, .cs-gift-sale-delivery button { min-height: 50px; }
  .cs-customer-actions > summary { display: inline-flex; align-items: center; min-height: 48px; }
  .cs-customer-balance-strip { grid-template-columns: 1fr; border-radius: 14px; }
  .cs-customer-balance, .cs-customer-balance-action { min-height: 72px; }
  .cs-customer-balance-action .btn, .cs-customer-panel-actions .btn { min-height: 44px; }
  .cs-customer-overview { grid-template-columns: 1fr; gap: 10px; }
  .cs-customer-tab-headers { display: none; }
  .cs-customer-tab-select {
    display: block; width: calc(100% - 20px); min-height: 48px; margin: 10px; padding: 8px 38px 8px 13px;
    border: 1px solid #c8d7c6; border-radius: 12px; background: #fff; color: #245a24;
    font: inherit; font-size: 14px; font-weight: 800;
  }
  .cs-customer-tab-body { padding: 10px; }
  .cs-account-toolbar, .cs-activity-toolbar, .cs-tab-intro {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 9px;
  }
  .cs-account-toolbar .grow { display: none; }
  .cs-account-toolbar .cs-inline-check, .cs-tab-intro > :first-child { grid-column: 1 / -1; }
  .cs-account-toolbar .cs-labeled { width: auto; min-width: 0; }
  .cs-account-toolbar .btn { width: 100%; min-height: 42px; }

  /* Sales-order and subscription details use cards rather than a squeezed grid. */
  .cs-order-view, .cs-subscription-content .o_form_view { padding-top: 8px; }
  .cs-order-sheet, .cs-subscription-sheet { padding: 17px 12px 24px 16px; }
  .cs-order-title-row, .cs-subscription-title-row { gap: 9px; }
  .cs-order-title h1, .cs-subscription-title h1 { font-size: 23px; }
  .cs-order-title-actions, .cs-subscription-title-actions { width: 100%; }
  .cs-order-title-actions .btn, .cs-subscription-title-actions .btn { min-height: 44px; }
  .cs-order-view .o_form_statusbar { padding: 7px 4px; overflow: hidden; }
  .cs-order-progress-wrap, .cs-order-progress { width: 100%; min-width: 0; max-width: none; }
  .cs-order-step { gap: 3px; font-size: 0; }
  .cs-order-step-label::after {
    content: attr(data-short-label); font-size: clamp(7px, 2.25vw, 9px); line-height: 1.1;
  }
  .cs-order-step-mark { width: 12px; height: 12px; }
  .cs-order-addresses, .cs-order-notes, .cs-order-documents { grid-template-columns: 1fr; gap: 12px; }
  .cs-order-activity-heading { align-items: center; }
  .cs-order-activity-heading p { display: none; }
  .cs-finance-strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cs-finance-strip > div { padding: 8px 10px; border-left: 0; border-top: 1px solid #e1e7df; }
  .cs-finance-strip > div:first-child,
  .cs-finance-strip > div:nth-child(2) { border-top: 0; }
  .cs-finance-strip > div:nth-child(even) { border-left: 1px solid #e1e7df; }
  .cs-activity-row {
    grid-template-columns: 28px minmax(0, 1fr); align-items: start; padding: 8px 0;
  }
  .cs-activity-row.is-nested { margin-left: 10px; }
  .cs-activity-content { padding-right: 0; }
  .cs-activity-title { align-items: flex-start; justify-content: space-between; }
  .cs-out-inline { gap: 5px 7px; }
  .cs-out-inline-label { display: none; }
  .cs-out-tracking { max-width: min(100%, 190px); }
  .cs-activity-meta span { white-space: normal; }
  .cs-activity-actions {
    grid-column: 2; justify-content: flex-start; margin: 2px 0 0 -4px;
  }
  .cs-activity-actions .btn { min-height: 44px; }
  .cs-duplicate-order { width: 44px; min-width: 44px; height: 44px; border-radius: 9px; }
  .cs-policy-toggle button { min-height: 40px; padding: 7px 10px; }
  .cs-duplicate-subscription { width: 44px; min-width: 44px; height: 44px; border-radius: 9px; }
  .cs-subscription-content .cs-subscription-meta .cs-policy-toggle button {
    min-height: 40px; padding: 7px 10px; font-size: 11px;
  }
  .cs-subscription-meta-edit { min-height: 40px; padding: 7px 9px; }
  .cs-delivery-card .o_section_title.flex {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 4px 8px;
  }
  .cs-delivery-card .o_section_title.flex > .grow { grid-column: 1 / -1; }
  .cs-delivery-card .o_section_title.flex > .btn {
    min-height: 44px; padding: 7px 8px; border: 1px solid #dce4da; border-radius: 9px; text-align: center;
  }
  .cs-out-item { gap: 10px; }
  .cs-out-item-name { display: grid; gap: 1px; }
  .cs-order-footer { align-items: stretch; flex-direction: column; gap: 16px; }
  .cs-order-footer .o_totals { width: 100%; min-width: 0; }
  .cs-order-lines { overflow: visible; border: 0; background: transparent; }
  .cs-order-line-table { display: block; width: 100%; }
  .cs-order-line-table thead { display: none; }
  .cs-order-line-table tbody { display: grid; gap: 10px; }
  .cs-order-line-table tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 12px;
    padding: 14px; border: 1px solid #dce4da; border-radius: 14px; background: #fff;
  }
  .cs-order-line-table td {
    display: grid; gap: 2px; min-width: 0; height: auto !important; padding: 0;
    border: 0; text-align: left; white-space: normal; overflow-wrap: anywhere;
  }
  .cs-order-line-table td::before {
    content: attr(data-label); color: #7b867e; font-size: 9px; font-weight: 850;
    letter-spacing: .05em; text-transform: uppercase;
  }
  .cs-order-line-product { grid-column: 1 / -1; font-size: 15px; line-height: 1.35; }
  .cs-line-availability { grid-column: 1 / -1; display: flex !important; align-items: center; }
  .cs-line-availability::before { margin-right: 8px; }
  .cs-order-line-table td.num { text-align: left; }
  .cs-order-line-table td input { width: 100%; min-height: 42px; }
  .cs-order-line-actions { align-content: end !important; justify-items: end; }
  .cs-subscription-meta { flex-wrap: wrap; white-space: normal; }
  .cs-subscription-composition-table { display: block; width: 100%; }
  .cs-subscription-composition-table thead { display: none; }
  .cs-subscription-composition-table tbody { display: grid; gap: 9px; }
  .cs-subscription-composition-table tr:not(.cs-subscription-table-section):not(.cs-subscription-next-empty) {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px 12px;
    padding: 13px; border: 1px solid #dce4da; border-radius: 13px; background: #fff;
  }
  .cs-subscription-composition-table tr.cs-subscription-combo-line { margin-left: 12px; background: #fbfdfb; }
  .cs-subscription-composition-table td {
    display: grid; gap: 2px; min-width: 0; height: auto !important; padding: 0 !important;
    border: 0; text-align: left; white-space: normal; overflow-wrap: anywhere;
  }
  .cs-subscription-composition-table td::before {
    content: attr(data-label); color: #7b867e; font-size: 9px; font-weight: 850;
    letter-spacing: .05em; text-transform: uppercase;
  }
  .cs-subscription-composition-table td:nth-child(2) { grid-column: 1 / -1; font-size: 15px; line-height: 1.35; }
  .cs-subscription-composition-table td:nth-child(7) { align-content: end; justify-items: end; }
  .cs-subscription-composition-table input.num { width: 100%; min-height: 42px; }
  .cs-subscription-table-section, .cs-subscription-next-empty { display: block; }
  .cs-subscription-table-section td, .cs-subscription-next-empty td {
    display: block; padding: 10px 12px !important; border-radius: 10px;
  }
  .cs-subscription-table-section td::before, .cs-subscription-next-empty td::before { display: none; }
  .cs-subscription-combo-grid { grid-template-columns: 1fr; }
  .cs-subscription-financials { align-items: stretch; flex-direction: column; }
  .cs-subscription-coupon { max-width: none; }
  .cs-subscription-totals { width: 100%; margin-left: 0; }

  /* iOS-style Settings index on phones; desktop remains split navigation/detail. */
  .o_settings_control_room { padding: 16px 10px calc(42px + var(--o-safe-bottom)); }
  .o_settings_titlebar { margin-bottom: 12px; }
  .o_settings_titlebar h1 { font-size: 27px; }
  .o_settings_layout { display: block; }
  .o_settings_section_nav {
    display: grid; gap: 0; overflow: hidden; padding: 0;
    border: 1px solid #dbe4d9; border-radius: 14px; background: #fff;
  }
  .o_settings_section_nav button {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    flex: none; min-height: 62px; padding: 10px 14px; border: 0; border-bottom: 1px solid #e7ece5;
    border-radius: 0; background: #fff;
  }
  .o_settings_section_nav button:last-child { border-bottom: 0; }
  .o_settings_section_nav button.active { border-color: #e7ece5; box-shadow: none; }
  .o_settings_nav_copy { display: grid; gap: 2px; min-width: 0; }
  .o_settings_section_nav strong { font-size: 15px; }
  .o_settings_section_nav span { font-size: 11px; }
  .o_settings_nav_chevron { color: #8b958d !important; font-size: 25px !important; }
  .o_settings_layout.is-mobile-index .o_settings_panel_host { display: none; }
  .o_settings_layout.is-mobile-detail .o_settings_section_nav { display: none; }
  .o_settings_mobile_back {
    display: inline-flex; align-items: center; min-height: 44px; margin: 0 0 8px -5px; padding: 6px 8px;
    border: 0; background: transparent; color: #167735; font: inherit; font-size: 15px; font-weight: 750;
  }
  .o_settings_panel { border-radius: 14px; }
  .o_settings_panel_header { padding: 16px 14px; }
  .o_settings_panel_header h2 { font-size: 20px; }
  .o_settings_panel_header p { font-size: 12px; }
  .o_settings_metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .o_settings_metric { min-height: 84px; padding: 13px; }
  .o_settings_metric > strong { font-size: 24px; }
  .o_settings_metric > span, .o_settings_metric > small { font-size: 10px; }
  .o_settings_rule, .o_settings_form_row { padding: 14px; }
  .o_settings_rule strong, .o_settings_form_row strong { font-size: 14px; }
  .o_settings_rule p, .o_settings_form_row small { font-size: 11px; }
  .o_settings_table_wrap { overflow: visible; padding: 10px; }
  .o_settings_table { display: block; }
  .o_settings_table thead { display: none; }
  .o_settings_table tbody { display: grid; gap: 8px; }
  .o_settings_table tr { display: grid; gap: 6px; padding: 12px; border: 1px solid #e0e7de; border-radius: 12px; }
  .o_settings_table td { display: block; padding: 0; border: 0; font-size: 11px; overflow-wrap: anywhere; }
  .o_settings_table td strong { font-size: 14px; }
  .o_settings_table code { white-space: normal; overflow-wrap: anywhere; }
  .o_settings_helpdesk_table td:nth-child(2)::before,
  .o_settings_helpdesk_table td:nth-child(3)::before {
    display: block; margin-bottom: 2px; color: #7b867e; font-size: 9px;
    font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
  }
  .o_settings_helpdesk_table td:nth-child(2)::before { content: 'Open tickets'; }
  .o_settings_helpdesk_table td:nth-child(3)::before { content: 'Console users'; }

  /* Warehouse: keep the two selectors, but remove duplicated workspace/status chrome. */
  body:has(.o_navbar_warehouse) { --o-chat-top: calc(98px + var(--o-safe-top)); }
  .o_navbar_warehouse {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-rows: 44px 44px;
    min-height: calc(98px + var(--o-safe-top)); height: calc(98px + var(--o-safe-top));
    align-content: start; column-gap: 7px; row-gap: 10px;
    padding-top: var(--o-safe-top); padding-bottom: 0;
  }
  .o_navbar_warehouse::after {
    top: calc(48px + var(--o-safe-top)); bottom: auto;
  }
  .o_navbar_warehouse .o_console_brand_lockup {
    grid-column: 1; grid-row: 1; align-self: center; justify-self: start;
  }
  .o_navbar_warehouse .o_console_brand_nw { width: 96px; }
  .o_navbar_warehouse .o_console_brand_ms { width: 30px; height: 20px; }
  .o_navbar_warehouse .o_price_notice { grid-column: 2; grid-row: 1; align-self: center; }
  .o_navbar_warehouse .o_user_menu { grid-column: 3; grid-row: 1; align-self: center; }
  .o_navbar_warehouse .o_workspace_nav {
    display: none;
  }
  .o_navbar_warehouse .o_navbar_spacer { display: none !important; }
  .o_warehouse_context_host {
    grid-column: 1 / -1; grid-row: 2; order: initial;
    width: 100%; min-width: 0; max-width: none; height: 44px;
  }
  body:has(.o_navbar_warehouse) .o_user_dropdown { top: calc(56px + var(--o-safe-top)); }
  body:has(.o_navbar_warehouse) .o_console_loading { top: calc(98px + var(--o-safe-top)); }
  body:has(.o_navbar_warehouse) .o_connection_notice { top: calc(104px + var(--o-safe-top)); }
  .o_warehouse_context_host .wh-context-strip {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px;
    width: 100%; height: 44px; overflow: visible;
  }
  .o_warehouse_context_host .wh-context-item {
    min-width: 0; min-height: 36px; padding: 3px 8px; overflow: hidden;
    border: 1px solid rgba(77,105,78,.16); border-radius: 8px; background: rgba(255,255,255,.78);
  }
  .o_warehouse_context_host .wh-context-item:nth-child(1),
  .o_warehouse_context_host .wh-context-item:nth-child(2) {
    display: grid; grid-column: span 1; grid-template-columns: auto minmax(0, 1fr);
    align-items: center; gap: 5px; min-height: 44px; padding: 2px 6px;
  }
  .o_warehouse_context_host .wh-context-label { margin: 0; font-size: 7px; line-height: 1; }
  .o_warehouse_context_host .wh-context-select {
    width: 100%; min-width: 0; min-height: 40px; padding-block: 0; font-size: 11px;
  }
  .o_warehouse_context_host .wh-context-item.is-status {
    display: none;
  }
  .o_warehouse_context_host .wh-context-item.is-status::before {
    position: static; flex: 0 0 7px; width: 7px; height: 7px;
  }
  .o_warehouse_context_host .wh-context-item.is-status .wh-context-label { display: none; }
  .o_warehouse_context_host .wh-context-item.is-status .wh-context-value {
    position: static; width: auto; height: auto; padding: 0;
    overflow: hidden; clip-path: none; color: #26332a; font-size: 9px; line-height: 1; text-overflow: ellipsis;
  }
  .o_warehouse_context_host .wh-context-item.is-operator .wh-context-value { font-size: 0; }
  .o_warehouse_context_host .wh-context-item.is-operator .wh-context-value::after {
    content: attr(data-compact-value); font-size: 9px;
  }
  .o_warehouse_context_host .wh-context-status-icon { display: none; }
  .wh-context-notice .wh-setup-alert {
    min-height: 0; margin-bottom: 8px; padding: 8px 10px; border-radius: 9px;
  }
  .wh-context-notice .wh-setup-alert strong { font-size: 12px; }
  .wh-context-notice .wh-setup-alert p { margin-top: 2px; font-size: 11px; line-height: 1.25; }
  .wh-console { overflow-y: auto; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; }
  .wh-console-inner { padding: 12px 10px calc(32px + var(--o-safe-bottom)); }
  .wh-process-group { padding: 12px; border-radius: 14px; }
  .wh-home-processes .wh-process-grid,
  .wh-process-group[class*="wh-section-"] .wh-process-grid,
  .wh-process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .wh-home-processes .wh-process-door,
  .wh-process-group[class*="wh-section-"] .wh-process-door,
  .wh-process-door {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto;
    align-content: center; gap: 8px; min-height: 116px; padding: 13px;
    border-width: 1px; border-top: 4px solid var(--o-brand); border-radius: 13px;
  }
  .wh-home-processes .wh-process-icon,
  .wh-process-group[class*="wh-section-"] .wh-process-icon,
  .wh-process-icon { width: 43px; height: 43px; border-radius: 11px; font-size: 22px; }
  .wh-process-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .wh-process-door:disabled { opacity: .48; cursor: not-allowed; filter: grayscale(.35); }
  .wh-home-processes .wh-process-copy,
  .wh-process-group[class*="wh-section-"] .wh-process-copy,
  .wh-process-copy { grid-column: 1 / -1; }
  .wh-home-processes .wh-process-copy strong,
  .wh-process-group[class*="wh-section-"] .wh-process-copy strong,
  .wh-process-copy strong { font-size: 16px; line-height: 1.14; }
  .wh-home-processes .wh-process-copy span,
  .wh-process-group[class*="wh-section-"] .wh-process-copy span { display: none; }
  .wh-process-count { align-self: start; min-width: 29px; height: 27px; font-size: 12px; }
  .wh-process-open { display: none; }
  .rail-cold { border-top-color: var(--wh-cold); }
  .rail-transfer { border-top-color: var(--wh-transfer); }
  .rail-dispatch { border-top-color: var(--wh-dispatch); }
  .whp-run-header, .whp-finish-bar { backdrop-filter: none; -webkit-backdrop-filter: none; background: #fff; }
  .whp-active-step.wh-brand-nature, .whp-active-step.wh-brand-motherhood,
  .whp-run-header.wh-brand-nature, .whp-run-header.wh-brand-motherhood {
    box-shadow: none; background: #fff;
  }
  .whp-active-step.wh-brand-mixed, .whp-run-header.wh-brand-mixed {
    box-shadow: none; background: #fff;
  }
  .wh-catalog-badge {
    display: inline-flex; width: fit-content; margin: 0 0 9px; padding: 4px 8px;
    border-radius: 999px; background: var(--wh-doc-soft, #eef6ec); color: var(--wh-doc-brand, #357a35);
    font-size: 10px; font-weight: 850; letter-spacing: .02em;
  }
  .whp-work-main { min-height: 82px; padding: 12px 14px; }
  .whp-work-top > strong { font-size: 16px; }
  .whp-work-customer { font-size: 13px; }
  .whp-work-meta { font-size: 11px; }
  .whp-active-location strong { font-size: clamp(22px, 6.4vw, 28px); }
  .whp-active-product h2 { font-size: clamp(22px, 6vw, 28px); }
  .wh-pack-row, .wh-recv-row { min-height: 80px; border-radius: 14px; }
  .wh-pack-row strong, .wh-recv-row-main strong { font-size: 15px; }
  .wh-van-route, .wh-bag-row, .wh-inv-row, .wh-inv-card, .wh-inv-count-row { border-radius: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .o_console_loading span { animation-duration: 2.4s; }
}

@media (max-width: 390px) {
  .o_console_brand_nw { width: 86px; }
  .o_console_brand_ms { width: 27px; height: 18px; }
  .o_workspace_nav { flex-basis: 132px; }
  .o_workspace_nav_select { padding-left: 8px; font-size: 11px; }
  .wh-home-processes .wh-process-door,
  .wh-process-group[class*="wh-section-"] .wh-process-door,
  .wh-process-door { min-height: 108px; padding: 11px; }
}

@media (min-width: 721px) {
  .cs-panel-recent { display: none; }
  .cs-work-queue-select { display: none; }
  .cs-customer-tab-select { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .o_connection_notice_pulse { animation: none; }
}
/* Keep Customer Service creation actions available on compact list pages. */
@media (max-width: 720px) {
  .o_control_panel.cs-compact-control-panel {
    grid-template-areas: "back title search recent" "buttons buttons buttons buttons";
  }
  .o_control_panel.cs-compact-control-panel:has(.cs-header-search.is-open) {
    grid-template-areas: "back title search recent" "search-open search-open search-open search-open" "buttons buttons buttons buttons";
  }
  .cs-compact-control-panel > .o_cp_buttons:not(:has(> :not(.cs-quick-create))) { display: flex; }
  .cs-control-panel > .cs-full-filters, .cs-control-panel > .cs-ribbon-filter { grid-column: 1 / -1; }
}
/* Wrap creation actions into readable touch targets on narrow screens. */
@media (max-width: 720px) {
  .cs-home-control-panel > .o_cp_buttons,
  .cs-compact-control-panel > .o_cp_buttons,
  .cs-compact-control-panel > .o_cp_buttons:not(:has(> :not(.cs-quick-create))) {
    display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px; width: 100%; max-width: 100%; overflow: visible;
  }
  .cs-home-control-panel .o_cp_buttons .cs-quick-create,
  .cs-compact-control-panel .o_cp_buttons .cs-quick-create {
    display: inline-flex; justify-content: center; min-width: 0; width: 100%;
    grid-column: span 2; min-height: 44px; padding: 8px 6px; font-size: 0; white-space: nowrap;
  }
  .cs-home-control-panel .o_cp_buttons .cs-quick-create::after,
  .cs-compact-control-panel .o_cp_buttons .cs-quick-create::after {
    content: '+ ' attr(data-mobile-label); font-size: 13px;
    font-weight: 650; line-height: 1.2;
  }
  .cs-control-panel .o_cp_buttons .cs-quick-create:nth-child(n+4) { grid-column: span 3; }
  .cs-home-control-panel > .o_cp_buttons > :not(.cs-quick-create),
  .cs-compact-control-panel > .o_cp_buttons > :not(.cs-quick-create) { grid-column: 1 / -1; }
}

/* Customer Service tools share the existing role-filtered desktop routes. */
.o_mobile_tools_select { display: none; }
@media (max-width: 720px) {
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task):has(> .o_customer_tools) {
    grid-template-columns: minmax(0, 1fr) 76px auto auto auto;
  }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) > .o_workspace_nav.o_customer_tools {
    display: block; grid-column: 2; grid-row: 1; min-width: 0;
  }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task):has(> .o_customer_tools) > .o_price_notice { grid-column: 3; }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task):has(> .o_customer_tools) > .o_chat_notice { grid-column: 4; }
  .o_navbar:not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task):has(> .o_customer_tools) > .o_user_menu { grid-column: 5; }
  .o_customer_tools .o_workspace_nav_home,
  .o_customer_tools .o_workspace_nav_select { display: none; }
  .o_mobile_tools_select {
    display: block; width: 76px; min-height: 44px; padding: 6px;
    border: 1px solid #d7e0d5; border-radius: 10px;
    background: rgba(255,255,255,.85); color: #23652d;
    font: inherit; font-size: 13px; font-weight: 700;
  }
}

/* Landing pages have no workspace nav to absorb spare tablet/desktop width. */
@media (min-width: 721px) {
  .o_navbar_landing > .o_navbar_spacer { display: block; flex: 1 1 auto; }
}

@media (max-width: 720px) {
  /* Warehouse home has a second selector row: chat must stay in the first. */
  .o_navbar_warehouse:has(> .o_chat_notice) {
    grid-template-columns: minmax(0, 1fr) auto auto auto;
  }
  .o_navbar_warehouse > .o_chat_notice { grid-column: 3; grid-row: 1; align-self: center; }
  .o_navbar_warehouse:has(> .o_chat_notice) > .o_user_menu { grid-column: 4; grid-row: 1; }
}

/* Phone, Messages, Notifications, account stay together on every phone screen. */
@media (max-width:720px) {
  .o_web_client .o_navbar:has(> .o_header_actions):not(.o_navbar_landing) { grid-template-columns:minmax(0,1fr) auto; }
  .o_navbar > .o_header_actions { grid-column:-2; grid-row:1; gap:5px; margin-left:auto; }
  .o_header_actions .o_header_phone { display:inline-grid; }
  .o_header_actions .o_header_phone, .o_header_actions .o_chat_trigger,
  .o_header_actions .o_price_notice_trigger { width:44px; height:44px; min-width:44px; }
  /* Unread counts stay within their tap targets, below the safe-area border. */
  .o_header_actions .o_chat_trigger > .o_chat_badge,
  .o_header_actions .o_price_notice_trigger > .o_price_notice_badge { top:1px; right:1px; }
  .o_navbar:has(> .o_header_actions):has(> .o_customer_tools):not(.o_navbar_landing):not(.o_navbar_warehouse):not(.o_navbar_warehouse_task) {
    grid-template-columns:minmax(0,1fr) 76px auto;
  }
  .o_navbar:has(> .o_header_actions) .o_mobile_tools_select { width:76px; }
  .o_navbar:has(> .o_header_actions) .o_console_brand_lockup { min-width:0; max-width:100%; }
  .o_navbar:has(> .o_header_actions) .o_console_brand_nw { min-width:0; max-width:calc(100% - 30px); object-fit:contain; }
  .o_navbar:has(> .o_header_actions) .o_console_brand_ms { width:24px; min-width:24px; max-width:24px; object-fit:contain; }
}

/* Dialogs share the Console surface and leave room for system safe areas. */
@media (max-width:720px) {
  .o_dialog_backdrop { padding: max(12px, var(--o-safe-top)) max(12px, var(--o-safe-right)) max(12px, var(--o-safe-bottom)) max(12px, var(--o-safe-left)); }
  .o_dialog { max-height: calc(100dvh - max(12px, var(--o-safe-top)) - max(12px, var(--o-safe-bottom))); }
  .o_dialog_header { padding: 14px 16px 6px; gap: 10px; }
  .o_dialog_header h4 { font-size: 19px; }
  .o_dialog_header .o_close { flex-basis: 44px; width: 44px; height: 44px; }
  .o_dialog_body { padding: 12px 16px 16px; }
  .o_dialog_footer { padding: 4px 16px 16px; }
  .o_dialog > .alert { margin: 0 16px 12px; }
  .o_dialog .btn { min-height: 44px; }
  .o_dialog input:not([type="checkbox"]):not([type="radio"]), .o_dialog select, .o_dialog textarea { font-size: 16px; }
}

/* Warehouse context now sits inside its content; retain one app header row. */
@media (max-width:720px) {
  .o_web_client .o_navbar.o_navbar_warehouse { grid-template-rows:44px; min-height:calc(50px + var(--o-safe-top)); height:calc(50px + var(--o-safe-top)); row-gap:0; }
  .o_navbar.o_navbar_warehouse::after { top:auto; bottom:0; }
  body:has(.o_navbar_warehouse) { --o-chat-top:calc(50px + var(--o-safe-top)); }
  body:has(.o_navbar_warehouse) .o_console_loading { top:calc(50px + var(--o-safe-top)); }
  body:has(.o_navbar_warehouse) .o_connection_notice { top:calc(56px + var(--o-safe-top)); }
}

/* Keep the entire Console path together and reachable on phone screens. */
@media (max-width:720px) {
  .o_control_panel.cs-home-control-panel {
    grid-template-areas: "back . recent" "title title title" "search search search" "buttons buttons buttons";
  }
  .o_control_panel.cs-compact-control-panel {
    grid-template-areas: "back . search recent" "title title title title" "buttons buttons buttons buttons";
  }
  .o_control_panel.cs-compact-control-panel:has(.cs-header-search.is-open) {
    grid-template-areas: "back . search recent" "title title title title" "search-open search-open search-open search-open" "buttons buttons buttons buttons";
  }
  .o_control_panel.cs-compact-control-panel.cs-search-expanded-control-panel {
    grid-template-areas: "back . recent" "title title title" "search search search" "buttons buttons buttons";
  }
  .o_control_panel.cs-compact-control-panel:has(> input[aria-label="Search mail"]) {
    grid-template-areas: "back . . recent" "title title title title" "search-open search-open search-open search-open" "buttons buttons buttons buttons";
  }
  .cs-mail-workspace .o_control_panel > input[aria-label="Search mail"] { grid-area: search-open; }
  .o_control_panel.o-mobile-compact-control-panel {
    grid-template-areas: "back . recent" "title title title";
  }
  .o_control_panel.o-mobile-compact-control-panel:has(> .o_cp_buttons) {
    grid-template-areas: "back . recent" "title title title" "buttons buttons buttons";
  }
}

/* Desktop overflow keeps every workspace reachable as a real link. */
.o_workspace_overflow_menu { display: none; }
@media (min-width: 721px) {
  .o_workspace_nav { overflow: visible; min-width: 0; }
  .o_workspace_nav.is-overflowing .o_workspace_nav_buttons { display: none; }
  .o_workspace_nav.is-overflowing .o_workspace_overflow_menu { display: block; position: relative; min-width: 0; max-width: 100%; }
  .o_workspace_overflow_menu summary { cursor: pointer; padding: 8px 12px; border: 1px solid var(--o-border); border-radius: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .o_workspace_overflow_links { position: absolute; top: calc(100% + 6px); left: 0; z-index: 1500; width: 240px; max-width: calc(100vw - 24px); max-height: min(70vh, 540px); overflow-y: auto; background: var(--o-sheet); border: 1px solid var(--o-border); border-radius: 8px; box-shadow: 0 8px 24px #0002; padding: 6px; }
  .o_workspace_overflow_links a { display: block; padding: 9px 12px; text-decoration: none; color: var(--o-text); border-radius: 5px; }
  .o_workspace_overflow_links a:hover, .o_workspace_overflow_links a[aria-current="page"] { background: var(--o-brand-soft, #e8f3e8); }
}
@media (min-width: 721px) {
  .o_navbar:not(:has(.o_workspace_nav)) > .o_navbar_spacer { flex: 1 1 auto; }
}

/* Keep creation shortcuts compact; Products has one search/filter row. */
@media (max-width:720px) {
  .cs-control-panel .cs-create-actions { grid-column: 1 / -1; justify-self: end; }
  .cs-control-panel .cs-create-dropdown .cs-quick-create { display: flex; width: auto; font-size: 13px; padding: 10px; }
  .cs-control-panel .cs-create-dropdown .cs-quick-create::after { content: none; }
  .o_control_panel.cs-products-control-panel { display: flex; flex-wrap: nowrap; gap: 6px; padding: 6px 8px; }
  .cs-products-control-panel > .o_recent_menu,
  .cs-products-control-panel > .o_cp_context { display: none; }
  .cs-products-control-panel > .cs-header-search { order: 0; flex: 1 1 0; min-width: 0; width: auto; }
  .cs-products-control-panel > .cs-product-view-filter { flex: 0 1 90px; }
  .cs-products-control-panel > .o_cp_buttons { display: flex; width: auto; flex: 0 0 auto; }
  .cs-products-control-panel .cs-create-menu summary { padding: 10px 6px; }
  .cs-products-control-panel .camera-search-button { font-size: 0; padding: 6px; }
}

/* Three real recent-page links: never scroll the oldest link out of sight. */
.o_control_panel .o_breadcrumb.o_recent_trail {
  display:flex; flex-wrap:wrap; overflow:visible; gap:4px; white-space:normal;
}
.o_control_panel .o_breadcrumb.o_recent_trail > a {
  display:block; flex:0 1 auto; min-width:0; max-width:100%; padding:5px 7px;
  border:1px solid var(--o-border-light); border-radius:5px; font-size:12px;
  white-space:normal; overflow-wrap:anywhere; text-decoration:none;
}
.o_control_panel .o_breadcrumb.o_recent_trail > a.active {
  background:var(--o-ground); border-color:var(--o-muted); font-weight:600;
}
.o_recent_trail > a:focus-visible { outline:2px solid currentColor; outline-offset:2px; }
@media(min-width:721px) {
  .cs-control-panel > .o_cp_context:has(.o_recent_trail) { flex:0 1 430px; overflow:visible; }
}