:root {
  /* Boot aliases stay tiny; the single Design System token owner is the M4/M6 semantic block below. */
  --bg: #ffffff;
  --text: #1f2937;
  --muted: #667085;
  --line: #d9e0e7;
  --blue: #2a7aaf;
  --blue-dark: #22638e;
  --shadow: 0 8px 24px rgba(31, 41, 55, 0.12);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { box-sizing: border-box; }

html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--text);
  background: #f3f4f6;
  -webkit-tap-highlight-color: transparent;
}

#map {
  position: fixed;
  inset: 0;
  z-index: 1;
  background: #e5e7eb;
}

.top-panel {
  position: fixed;
  left: 10px;
  right: 10px;
  top: calc(10px + var(--safe-top));
  z-index: 900;
  display: flex;
  gap: 8px;
  align-items: center;
  pointer-events: none;
}

.search-wrap {
  flex: 1;
  height: 48px;
  background: rgba(255,255,255,0.97);
  border-radius: 999px;
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  padding: 0 8px 0 14px;
  pointer-events: auto;
  border: 1px solid rgba(229,231,235,0.9);
}

#searchInput {
  flex: 1;
  height: 44px;
  border: 0;
  outline: none;
  font-size: 16px;
  background: transparent;
  min-width: 0;
  color: var(--text);
}

button.is-report-loading {
  cursor: wait;
  opacity: 1;
  pointer-events: none;
  white-space: nowrap;
}
button.is-report-loading::before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 9px;
  border: 2px solid rgba(255, 255, 255, 0.42);
  border-top-color: currentColor;
  border-radius: 50%;
  vertical-align: -2px;
  animation: salesmap-login-spin .72s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  button.is-report-loading::before { animation: none; }
}

.round-btn {
  width: 48px;
  height: 48px;
  border-radius: var(--salesmap-ds-radius-md);
  border: 0;
  background: rgba(255,255,255,0.97);
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  cursor: pointer;
  pointer-events: auto;
  color: var(--text);
}

.mini-btn {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 0;
  background: #f3f4f6;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  cursor: pointer;
  color: var(--text);
}

/* HTML hidden is a layout invariant. Keep it in an important cascade layer so
   component-level display:* !important rules can never resurrect hidden UI. */
@layer salesmap-html-invariants {
  [hidden] {
    display: none !important;
  }
}

#resultPanel {
  position: fixed;
  left: 10px;
  right: 10px;
  top: calc(59px + var(--safe-top));
  max-height: 45vh;
  overflow: auto;
  background: rgba(255,255,255,0.98);
  border-radius: 16px;
  box-shadow: var(--shadow);
  z-index: 920;
  display: none;
  border: 1px solid rgba(229,231,235,0.95);
}

.result-item {
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  background: #fff;
}

.result-item:active { background: #eff6ff; }

.result-code-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.result-code {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.2px;
}

.result-name {
  margin-top: 3px;
  font-size: 14px;
  color: #374151;
  line-height: 1.25;
}

.result-meta {
  margin-top: 4px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.25;
}

.status-pill {
  position: fixed;
  left: 12px;
  bottom: calc(14px + var(--safe-bottom));
  z-index: 830;
  max-width: calc(100vw - 24px);
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(17,24,39,0.82);
  color: white;
  font-size: 12px;
  box-shadow: 0 5px 18px rgba(0,0,0,0.18);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}

.sheet-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.28);
  z-index: 990;
  display: none;
}

.bottom-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  background: var(--bg);
  border-radius: 22px 22px 0 0;
  box-shadow: 0 -8px 30px rgba(0,0,0,0.22);
  transform: translateY(110%);
  transition: transform 160ms ease-out;
  padding: 10px 16px calc(16px + var(--safe-bottom));
  max-height: 78vh;
  overflow: auto;
}

.bottom-sheet.open { transform: translateY(0); }
.sheet-backdrop.open { display: block; }

.sheet-handle {
  width: 44px;
  height: 5px;
  background: #d1d5db;
  border-radius: 999px;
  margin: 0 auto 10px;
}

.sheet-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 8px;
}

.sheet-title {
  display: inline-block;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.1;
  letter-spacing: 0.4px;
  color: #334155;
  background: #eef1f3;
  border: 1px solid #d8dee4;
  border-radius: 999px;
  padding: 7px 11px;
  word-break: break-word;
}

.sheet-subtitle {
  color: #1f2937;
  font-size: 18px;
  font-weight: 850;
  margin-top: 9px;
  line-height: 1.22;
  word-break: break-word;
}

.badge-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin: 10px 0;
}

.badge {
  padding: 5px 8px;
  border-radius: 999px;
  background: #f3f4f6;
  color: #374151;
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.customer-owner-badge {
  --customer-owner-role-color: var(--salesmap-ds-color-role-salesperson);
  background: color-mix(in srgb, var(--customer-owner-role-color) 10%, var(--salesmap-ds-color-surface));
  color: var(--customer-owner-role-color);
}

.customer-owner-badge.is-supervisor {
  --customer-owner-role-color: var(--salesmap-ds-color-role-supervisor);
}

.customer-area-badge {
  background: var(--salesmap-ds-color-area-soft);
  color: var(--salesmap-ds-color-area);
}

.badge.active {
  background: #dcfce7;
  color: #166534;
}

.badge.inactive {
  background: #111827;
  color: #ffffff;
}

.badge.special {
  background: #f3eadf;
  color: #7c5f47;
}

.info-grid {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 8px 10px;
  font-size: 14px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.info-label { color: var(--muted); }
.info-value { color: var(--text); word-break: break-word; }

.main-action {
  display: block;
  width: 100%;
  margin-top: 16px;
  padding: 14px 16px;
  border-radius: 14px;
  font-size: 17px;
  text-align: center;
  text-decoration: none;
  border: 0;
}

/* M6: Primary active state is owned by the shared semantic action layer. */

.secondary-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 10px;
}

.secondary-action {
  display: block;
  padding: 11px 12px;
  border-radius: 12px;
  text-decoration: none;
  text-align: center;
  font-size: 14px;
}

.filter-row { margin: 12px 0; }

.filter-label {
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
  margin-bottom: 6px;
}

.filter-select {
  width: 100%;
  height: 46px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-control-bg);
  color: var(--salesmap-ds-control-text);
  font-family: var(--salesmap-ds-font-family-sans);
  font-size: 15px;
  font-weight: var(--salesmap-ds-font-weight-regular);
  outline: none;
}

.filter-select:focus {
  border-color: var(--salesmap-ds-control-focus);
  box-shadow: 0 0 0 3px var(--salesmap-ds-state-focus-ring);
}

.filter-select:disabled {
  border-color: transparent;
  background: var(--salesmap-ds-state-disabled-bg);
  color: var(--salesmap-ds-state-disabled-text);
}

.checkbox-list {
  max-height: 210px;
  overflow: auto;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #ffffff;
  padding: 6px;
}

.checkbox-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 9px;
  border-radius: 10px;
  font-size: 14px;
  color: #111827;
}

.checkbox-item:active { background: #eff6ff; }

.checkbox-item input {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.area-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 8px;
}

.small-filter-btn {
  height: 36px;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  background: #f9fafb;
  color: #111827;
  font-size: 13px;
  font-weight: 800;
}

.filter-actions {
  margin-top: 16px;
}

.btn-primary,
.btn-light,
.btn-danger {
  height: 46px;
  border-radius: 13px;
  border: 0;
  font-size: 15px;
  cursor: pointer;
}

/* M6: Primary fill/text is owned by the shared semantic action layer. */

/* M6: Secondary fill/text is owned by the shared semantic action layer. */

.pending-actions {
  margin-top: 10px;
}

.danger-light {
  color: #7f1d1d;
  background: #fef2f2;
  border: 1px solid #fee2e2;
}

.file-box {
  position: fixed;
  left: 12px;
  right: 12px;
  top: calc(76px + var(--safe-top));
  z-index: 940;
  display: none;
  padding: 14px;
  background: rgba(255,255,255,0.98);
  border-radius: 16px;
  box-shadow: var(--shadow);
  border: 1px solid var(--line);
  font-size: 13px;
  line-height: 1.35;
}

.file-box input {
  margin-top: 10px;
  width: 100%;
}

.legend-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  display: inline-block;
  flex: 0 0 auto;
  border: 1px solid rgba(255,255,255,0.85);
  box-shadow: 0 1px 4px rgba(0,0,0,0.25);
}

.custom-pin {
  width: 22px;
  height: 22px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  border: 1.5px solid rgba(255,255,255,0.9);
  box-shadow: 0 2px 7px rgba(0,0,0,0.48);
  background: var(--pin-color, #6f8296);
}

.custom-pin.selected {
  width: 30px;
  height: 30px;
  border: 1.5px solid rgba(255,255,255,0.95);
  filter: brightness(1.28) saturate(1.12);
  box-shadow:
    0 0 0 2px rgba(255,255,255,0.95),
    0 0 14px rgba(255,255,255,0.85),
    0 4px 14px rgba(0,0,0,0.42);
}

.sp-cluster {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: var(--cluster-color, #6f8296);
  border: 1.5px solid rgba(255,255,255,0.9);
  color: white;
  font-size: 14px;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,0.38);
  text-shadow: 0 1px 3px rgba(0,0,0,0.35);
}

.sp-cluster.large {
  width: 50px;
  height: 50px;
  font-size: 15px;
}

.sp-cluster.huge {
  width: 58px;
  height: 58px;
  font-size: 16px;
}

.leaflet-control-attribution {
  font-size: 10px !important;
}

.leaflet-control-zoom {
  display: none !important;
}

@media (min-width: 800px) {
  .top-panel {
    left: 18px;
    right: auto;
    width: 560px;
  }

  #resultPanel {
    left: 18px;
    right: auto;
    width: 560px;
  }

  .bottom-sheet {
    left: 50%;
    right: auto;
    width: 520px;
    transform: translate(-50%, 110%);
  }

  .bottom-sheet.open {
    transform: translate(-50%, 0);
  }

  .status-pill {
    left: 18px;
  }
}

/* v2.7 edit form / tools */
.form-row {
  margin: 12px 0;
}

.form-label {
  display: block;
  font-size: 13px;
  margin-bottom: 6px;
}

.form-input,
.form-textarea {
  width: 100%;
  border-radius: 12px;
  font-size: 15px;
  padding: 10px 12px;
  outline: none;
}

.form-input {
  height: 44px;
}

.form-textarea {
  min-height: 92px;
  resize: vertical;
  line-height: 1.35;
}

/* M6: shared field focus is owned by the M4 semantic form layer. */

.two-col-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.danger-text {
  color: #8a3f3b;
}

/* M6: Danger fill/text is owned by the shared semantic action layer. */


/* M6: shared disabled/read-only appearance is owned by the M4 semantic form layer. */

.permission-hint {
  margin-top: 6px;
  font-size: 12px;
  color: #6b7280;
  line-height: 1.3;
}

.tools-subtitle {
  font-size: 14px;
  font-weight: 700;
  color: #6b7280;
}

.tools-summary {
  margin-top: 12px;
  padding: 14px;
  border-radius: 14px;
  background: var(--theme-surface-soft);
  border: 0;
  box-shadow: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.tools-summary-label {
  font-size: 13px;
  color: #6b7280;
  font-weight: 800;
}

.tools-summary-value {
  font-size: 20px;
  font-weight: 900;
  color: #334155;
}

.tools-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 14px;
}


/* v2.9.2 menu / settings / mode pill */
.mode-pill {
  position: fixed;
  right: 12px;
  bottom: calc(14px + var(--safe-bottom));
  z-index: 832;
  padding: 8px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,0.94);
  color: #334155;
  border: 1px solid rgba(229,231,235,0.95);
  box-shadow: 0 5px 18px rgba(0,0,0,0.16);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.35px;
  pointer-events: none;
}

.mode-pill.admin {
  color: #334155;
}

.mode-pill.user {
  color: #6f8296;
}

.menu-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 14px;
}

.menu-row {
  position: relative;
  min-height: 52px;
  width: 100%;
  border-radius: 15px;
  border: 0;
  background: var(--theme-surface);
  color: var(--theme-ink);
  text-align: left;
  padding: 0 42px 0 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.menu-row:active {
  background: #f3f4f6;
}

.menu-row-main {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.15;
}

.menu-row-sub {
  font-size: 12px;
  color: #6b7280;
  line-height: 1.2;
}

.menu-chevron {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 26px;
  color: #9ca3af;
}

.muted-action .menu-row-main {
  color: #4b5563;
}

.danger-light {
  background: #f3e8e6 !important;
  color: #8a3f3b !important;
  border-color: #e8d2ce !important;
}

.danger-light .menu-row-sub,
.danger-light .menu-chevron {
  color: #9b6a68;
}

@media (min-width: 800px) {
  .mode-pill {
    right: 18px;
  }
}

/* v2.9.1 custom message sheet */
.message-sheet {
  z-index: 1100;
}

.message-subtitle {
  font-size: 13px;
  font-weight: 700;
  color: var(--theme-muted);
}

.message-body {
  font-size: 15px;
  line-height: 1.45;
  color: var(--theme-ink);
  background: var(--theme-surface-soft);
  border: 0;
  border-radius: 14px;
  padding: 12px;
  white-space: pre-wrap;
}


/* v2.9.2 cleanup */
.permission-hint, .tools-subtitle, .menu-row-sub {
  display: none !important;
}

.status-toggle-btn {
  width: 100%;
  height: 42px;
  border-radius: 12px;
  border: 1px solid #d8dee4;
  background: #eef1f3;
  color: #334155;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
}

.status-toggle-btn.non-active {
  background: #111827;
  color: #ffffff;
  border-color: #111827;
}

.status-toggle-btn:disabled {
  background: #f3f4f6;
  color: #6b7280;
  border-color: #e5e7eb;
  cursor: default;
}

.soft-danger-btn {
  width: 100%;
  margin-top: 10px;
  height: 42px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

/* M6: Danger active state stays inside the shared semantic action layer. */


/* v2.9.3 export badge / header clear */
.menu-badge {
  position: absolute;
  right: 34px;
  top: 50%;
  transform: translateY(-50%);
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: #b85c5a;
  color: #ffffff;
  font-size: 11px;
  font-weight: 900;
  display: none;
  align-items: center;
  justify-content: center;
  line-height: 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.18);
}

.header-clear-btn {
  min-width: 58px;
  height: 36px;
  padding: 0 12px;
  border-radius: var(--salesmap-ds-radius-md);
  border: 0;
  background: var(--salesmap-ds-action-danger-soft);
  color: var(--salesmap-ds-action-danger-text);
  font-size: 13px;
  font-weight: var(--salesmap-ds-font-weight-semibold);
  cursor: pointer;
  box-shadow: none;
}

.header-clear-btn:active {
  background: var(--salesmap-ds-action-danger-bg);
  color: var(--salesmap-ds-primitive-neutral-0);
}


/* v2.9.4 draft review */
.menu-badge-button {
  cursor: pointer;
  pointer-events: auto;
}

.menu-badge-button:active {
  transform: translateY(-50%) scale(0.94);
}

.tools-summary-button {
  width: 100%;
  cursor: pointer;
  text-align: left;
}

.tools-summary-button:active {
  background: #eef1f3;
}

/* Draft Review intentionally has no local-change count helper row. */

.draft-review-list {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin-top: 4px;
  max-height: 48vh;
  overflow: auto;
}
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */
/* CUT F: Draft Review card anatomy is owned by the shared draft-cloud semantic renderer. */

.draft-empty {
  padding: 18px 12px;
  text-align: center;
  color: #6b7280;
  background: #f9fafb;
  border: 1px dashed #d1d5db;
  border-radius: 14px;
  font-size: 14px;
  font-weight: 800;
}


/* v2.9.7 add customer */
.location-box {
  margin-top: 12px;
  padding: 12px;
  border-radius: 14px;
  border: 0;
  background: var(--theme-surface-soft);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.location-label {
  font-size: 12px;
  font-weight: 900;
  color: #6b7280;
}

.location-value {
  margin-top: 3px;
  font-size: 13px;
  font-weight: 800;
  color: #334155;
}

.location-btn {
  flex: 0 0 auto;
  border: 1px solid #d8dee4;
  background: #ffffff;
  color: #334155;
  border-radius: 999px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}

.location-btn:active {
  background: #eef1f3;
}


/* v2.9.8 map picker */
.location-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.map-picker-crosshair {
  position: fixed;
  left: 50%;
  top: 50%;
  width: 30px;
  height: 30px;
  transform: translate(-50%, -100%);
  z-index: 4920;
  display: none;
  pointer-events: none;
}

/* Browser reuses the Android pick indicator so map selection looks identical on every platform. */
.map-picker-crosshair::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0;
  width: 22px;
  height: 22px;
  transform: translateX(-50%) rotate(45deg);
  border-radius: 50% 50% 50% 0;
  background: #b85c5a;
  border: 2px solid #ffffff;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35);
}

.map-picker-crosshair::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 7px;
  width: 8px;
  height: 8px;
  transform: translateX(-50%);
  border-radius: 999px;
  background: #ffffff;
}

.map-picker-bar {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(18px + var(--safe-bottom));
  z-index: 921;
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(229,231,235,0.96);
  box-shadow: 0 8px 28px rgba(0,0,0,0.22);
}

.map-picker-title {
  font-size: 14px;
  font-weight: 900;
  color: #111827;
}

.map-picker-coords {
  margin-top: 3px;
  font-size: 12px;
  font-weight: 800;
  color: #6b7280;
}

.map-picker-actions {
  display: flex;
  gap: 8px;
  flex: 0 0 auto;
}

.picker-light,
.picker-primary {
  min-width: 66px;
  height: 38px;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}

.picker-light {
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #374151;
}

.picker-primary {
  border: 1px solid #334155;
  background: #334155;
  color: #ffffff;
}

.map-pick-active .top-panel,
.map-pick-active .status-pill,
.map-pick-active .gps-float-btn,
.map-pick-active .mode-pill {
  display: none;
}

.map-pick-active .map-picker-crosshair,
.map-pick-active .map-picker-bar {
  display: flex;
}


/* v2.9.9 GPS */
.gps-round-btn {
  font-size: 20px;
  font-weight: 900;
}

.user-location-dot {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: #2563eb;
  border: 3px solid #ffffff;
  box-shadow: 0 3px 14px rgba(37,99,235,0.45);
}

.gps-loading {
  opacity: 0.65;
  pointer-events: none;
}

@media (max-width: 430px) {
  .map-picker-bar {
    align-items: flex-start;
  }

  .map-picker-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .picker-light,
  .picker-primary {
    min-width: 58px;
    padding: 0 10px;
  }
}


/* v2.10.0 UI polish / user accounts */
.gps-float-btn {
  position: fixed;
  right: 12px;
  bottom: calc(58px + var(--safe-bottom));
  z-index: 834;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  border: 1px solid rgba(229,231,235,0.95);
  background: rgba(255,255,255,0.96);
  color: #334155;
  box-shadow: 0 5px 18px rgba(0,0,0,0.16);
  font-size: 22px;
  font-weight: 900;
  cursor: pointer;
}

.gps-float-btn:active {
  background: #eef1f3;
}

.location-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  min-width: 210px;
}

.location-btn {
  width: 100%;
  min-width: 0;
  height: 38px;
  text-align: center;
}

.map-pick-active .gps-float-btn {
  display: none;
}

/* Make bottom sheets feel lighter on Android WebView */
.bottom-sheet {
  transform: translate3d(0, 110%, 0);
  will-change: transform;
  backface-visibility: hidden;
  contain: none;
}

.bottom-sheet.open {
  transform: translate3d(0, 0, 0);
}

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

.user-account-summary {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  color: #334155;
  font-size: 14px;
  font-weight: 900;
}

.user-account-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
  max-height: 42vh;
  overflow: auto;
}

.user-account-row {
  border: 0;
  background: var(--theme-surface);
  border-radius: 15px;
  padding: 12px;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-directory-scroll {
  display: block;
  max-height: none;
  overflow: visible;
  overscroll-behavior: auto;
  padding: 0 1px max(1px, env(safe-area-inset-bottom));
}

html[data-runtime="android-webview"] #userAccountList {
  display: block;
  max-height: none;
  margin-top: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}

html[data-runtime="android-webview"] #userAccountSheet .search-wrap > #userAccountSearchInput {
  padding-left: 39px !important;
}

html[data-runtime="android-webview"] #userAccountSearchInput::-webkit-search-cancel-button,
html[data-runtime="android-webview"] #userAccountSearchInput::-webkit-search-decoration {
  display: none;
  appearance: none;
  -webkit-appearance: none;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-create-btn {
  width: 100%;
  min-height: 44px;
  margin: 10px 0 0;
  border-radius: 14px;
}

html[data-runtime="android-webview"] #userAccountList > .draft-empty {
  margin: 10px;
}

html[data-runtime="android-webview"] #userAccountSheet :is(
  .user-account-tree,
  .user-account-tree ul
) {
  margin: 0;
  padding: 0;
  list-style: none;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-groups {
  display: grid;
  gap: 10px;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-org-card {
  overflow: hidden;
  border: 1px solid var(--theme-line);
  border-radius: 16px;
  background: var(--theme-surface);
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-row {
  --user-tree-indent: calc(var(--user-tree-depth, 0) * 18px);
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  min-height: 58px;
  padding-left: var(--user-tree-indent);
  border-bottom: 1px solid var(--theme-line);
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-row.is-expandable {
  grid-template-columns: minmax(0, 1fr) 44px;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-row:not(.is-expandable) .user-account-tree-toggle-spacer {
  display: none;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-row.is-nested {
  background: transparent;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-row.is-search-match {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--theme-primary-line) 68%, var(--theme-line));
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-user {
  min-height: 58px;
  min-width: 0;
  padding: 8px 8px 8px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  text-align: left;
  touch-action: manipulation;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-user:active {
  background: var(--theme-surface-soft);
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-user:focus-visible {
  outline: 2px solid var(--theme-primary-dark);
  outline-offset: -2px;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-identity {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-code {
  color: var(--theme-ink);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) :is(
  .user-account-tree-role,
  .user-account-tree-site,
  .user-account-tree-status
) {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  min-height: 19px;
  padding: 2px 7px;
  border: 1px solid var(--theme-line);
  border-radius: 999px;
  background: var(--theme-surface-soft);
  color: var(--theme-muted);
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-site {
  border-color: var(--theme-primary-line);
  background: var(--salesmap-ds-color-primary-soft);
  color: var(--salesmap-ds-color-primary-active);
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-site.is-unassigned {
  border-color: var(--theme-line);
  background: var(--theme-surface-soft);
  color: var(--theme-muted);
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-role.is-supervisor {
  --user-account-role-color: var(--salesmap-ds-color-role-supervisor);
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-role.is-management-viewer {
  --user-account-role-color: var(--salesmap-ds-color-role-management-viewer);
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-role.is-salesperson {
  --user-account-role-color: var(--salesmap-ds-color-role-salesperson);
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-role.is-driver {
  --user-account-role-color: var(--salesmap-ds-color-role-driver);
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-role.is-merchandiser {
  --user-account-role-color: var(--salesmap-ds-color-role-merchandiser);
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-role {
  text-transform: uppercase;
}

html[data-runtime="android-webview"] :is(#userAccountSheet, #userAccountDetailSheet) .user-account-tree-role:is(
  .is-supervisor,
  .is-management-viewer,
  .is-salesperson,
  .is-driver,
  .is-merchandiser
) {
  border-color: color-mix(in srgb, var(--user-account-role-color) 36%, var(--theme-line));
  background: color-mix(in srgb, var(--user-account-role-color) 10%, var(--theme-surface));
  color: var(--user-account-role-color);
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-status.is-inactive {
  border-color: color-mix(in srgb, var(--salesmap-ds-color-danger) 32%, var(--theme-line));
  background: var(--salesmap-ds-color-danger-soft);
  color: var(--salesmap-ds-color-danger);
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-name {
  display: block;
  margin-top: 3px;
  color: var(--theme-muted);
  font-size: 11px;
  font-weight: var(--salesmap-ds-font-weight-semibold);
  line-height: 1.25;
  overflow-wrap: anywhere;
}

html[data-runtime="android-webview"] #userAccountSheet :is(
  .user-account-tree-toggle,
  .user-account-tree-toggle-spacer
) {
  width: 44px;
  height: 44px;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-toggle {
  position: relative;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--theme-ink);
  touch-action: manipulation;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-toggle::before {
  content: '';
  position: absolute;
  top: 16px;
  left: 17px;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 120ms ease;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-toggle[aria-expanded="false"]::before {
  transform: rotate(-45deg);
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-toggle:active {
  background: var(--theme-surface-soft);
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-toggle:focus-visible {
  outline: 2px solid var(--theme-primary-dark);
  outline-offset: -2px;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-toggle-spacer {
  display: block;
}

html[data-runtime="android-webview"] #userAccountSheet .user-account-tree-notice {
  margin: 10px;
  padding: 10px 12px;
  border: 1px dashed var(--theme-line);
  border-radius: 14px;
  background: var(--theme-surface-soft);
  color: var(--theme-muted);
  font-size: 12px;
  font-weight: 800;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-card {
  overflow: hidden;
  border: 1px solid var(--theme-line);
  border-radius: 16px;
  background: var(--theme-surface);
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-bottom: 1px solid var(--theme-line);
  background: var(--theme-surface-soft);
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-identity {
  min-width: 0;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-heading strong {
  display: block;
  color: var(--theme-ink);
  font-size: 16px;
  font-weight: 950;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-heading span {
  display: block;
  margin-top: 4px;
  color: var(--theme-muted);
  font-size: 12px;
  font-weight: 800;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-support-chip {
  justify-self: end;
  border-color: var(--salesmap-ds-action-primary-bg) !important;
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-support-chip:disabled {
  opacity: 0.52;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 36px;
  padding: 6px 12px;
  border-bottom: 1px solid var(--theme-line);
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-row:last-child {
  border-bottom: 0;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-label {
  color: var(--theme-muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-detail-value {
  min-width: 0;
  color: var(--theme-ink);
  font-size: 13px;
  font-weight: 850;
  overflow-wrap: anywhere;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-reports-to-value {
  display: flex;
  align-items: baseline;
  gap: 4px;
  flex-wrap: wrap;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-reports-to-code {
  color: var(--theme-ink);
  font-size: 13px;
  font-weight: 900;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-reports-to-name {
  color: var(--theme-muted);
  font-size: 11px;
  font-weight: var(--salesmap-ds-font-weight-semibold);
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-action-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

html[data-runtime="android-webview"] #userAccountDetailSheet .user-account-action-row > button {
  min-width: 0;
  min-height: 44px;
  padding-inline: 8px;
}

.user-account-code {
  font-size: 15px;
  font-weight: 900;
  color: #334155;
}

.user-account-name {
  margin-top: 3px;
  font-size: 13px;
  font-weight: 800;
  color: #6b7280;
}

.user-account-tag {
  display: inline-block;
  margin-top: 7px;
  padding: 4px 8px;
  border-radius: 999px;
  background: #eef1f3;
  color: #334155;
  font-size: 11px;
  font-weight: 900;
}


/* v2.10.1 roles + edit location options */
.location-actions.single {
  display: block;
  min-width: 118px;
}

.location-actions.single .location-btn {
  width: 100%;
}

.role-tag-admin {
  background: #eef1f3;
  color: #334155;
}

.role-tag-supervisor {
  background: #fff7ed;
  color: #9a3412;
}

.role-tag-sp {
  background: #eff6ff;
  color: #1d4ed8;
}

.role-tag-driver {
  background: #f3f4f6;
  color: #4b5563;
}


/* v2.10.3 driver mode simplification */
#settingsBtn .menu-row-main {
  transition: opacity 120ms ease-out;
}


/* v2.10.6 location change review */
.location-old {
  color: var(--salesmap-ds-color-danger);
  text-decoration: line-through;
  text-decoration-thickness: 2px;
}

.location-new {
  margin-top: 4px;
  color: var(--salesmap-ds-color-success);
}

.location-current {
  color: var(--salesmap-ds-color-text);
}
/* M6: duplicate location-actions.single declarations removed; orders 169/170 remain no-op bundle slots. */
/* M6: duplicate child-width declaration removed; canonical owner is orders 159/160. */


/* v2.10.8 cleaner pin picker */
.map-picker-bar {
  left: auto;
  right: 14px;
  bottom: calc(124px + var(--safe-bottom));
  width: 112px;
  padding: 0;
  gap: 8px;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.map-picker-actions {
  display: contents;
}

.map-picker-title,
.map-picker-coords {
  display: none;
}

.picker-light,
.picker-primary {
  width: 100%;
  min-width: 0;
  height: 44px;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 14px;
}

.picker-primary {
  box-shadow: 0 5px 16px rgba(15,23,42,0.26);
}

.picker-light {
  box-shadow: 0 5px 16px rgba(15,23,42,0.16);
}

.map-pick-active .map-picker-bar {
  display: flex;
}

/* reduce location text repaint jank a bit */
#editLatLngText {
  contain: content;
}

.location-old,
.location-new,
.location-current {
  font-family: var(--salesmap-ds-font-family-sans);
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}


/* v2.11.0 DSR local check-in */
.dsr-main-action {
  width: 100%;
  margin-top: 8px;
  text-decoration: none;
}

.dsr-gps-box {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 12px;
  margin: 10px 0 12px;
}

.dsr-card {
  border: 0;
  background: var(--theme-surface);
  border-radius: 15px;
  padding: 12px;
  margin-bottom: 8px;
}

.dsr-card-code {
  font-size: 15px;
  font-weight: 950;
  color: #334155;
}

.dsr-card-name {
  margin-top: 3px;
  font-size: 13px;
  font-weight: 800;
  color: #4b5563;
}

.dsr-card-meta {
  margin-top: 7px;
  font-size: 12px;
  font-weight: 800;
  color: #6b7280;
  line-height: 1.35;
}

.dsr-card-remark {
  margin-top: 7px;
  font-size: 13px;
  color: #111827;
  line-height: 1.35;
  white-space: pre-wrap;
}

.dsr-empty {
  padding: var(--salesmap-ds-spacing-card-padding-mobile);
  border: 1px dashed var(--salesmap-ds-color-line);
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-color-surface-soft);
  color: var(--salesmap-ds-color-text-muted);
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}


/* v2.11.1 DSR check-out + activity chips */
.compact-textarea {
  min-height: 74px;
}

.dsr-action-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.dsr-action-chip {
  border: 1px solid #d8dee4;
  background: #ffffff;
  color: #334155;
  border-radius: 999px;
  min-height: 38px;
  padding: 0 13px;
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 2px 7px rgba(15,23,42,0.06);
}

.dsr-action-chip.selected {
  background: #334155;
  border-color: #334155;
  color: #ffffff;
}

.dsr-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.dsr-mini-chip {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef1f3;
  color: #334155;
  font-size: 11px;
  font-weight: 950;
}

.dsr-mini-chip.open {
  background: #fff7ed;
  color: #9a3412;
}

.dsr-mini-chip.done {
  background: #dcfce7;
  color: #166534;
}

.dsr-main-action.open-visit {
  background: #9a3412;
}


/* v2.11.2 DSR flow + UI fixes */
#dsrCheckInSheet .dsr-gps-box,
#dsrCheckOutSheet .dsr-gps-box {
  display: block;
}

#dsrCheckInSheet .dsr-gps-box .location-btn,
#dsrCheckOutSheet .dsr-gps-box .location-btn {
  width: 100%;
  margin-top: 10px;
  min-height: 42px;
}

#dsrCheckInSheet .filter-actions,
#dsrCheckOutSheet .filter-actions {
  position: sticky;
  bottom: 0;
  background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0.92));
  padding-top: 10px;
}

.dsr-record-action {
  margin-top: 10px;
  width: 100%;
  height: 40px;
  border-radius: 999px;
  border: 0;
  background: #9a3412;
  color: #ffffff;
  font-size: 14px;
  font-weight: 950;
}

.badge.open-dsr {
  background: #fff7ed;
  color: #9a3412;
}


/* v2.11.3 DSR floating action */
.dsr-float-btn {
  position: fixed;
  right: 12px;
  bottom: calc(112px + var(--safe-bottom));
  z-index: 835;
  min-width: 58px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(229,231,235,0.95);
  background: #334155;
  color: #ffffff;
  box-shadow: 0 5px 18px rgba(0,0,0,0.18);
  font-size: 13px;
  font-weight: 950;
  letter-spacing: 0.3px;
  cursor: pointer;
}

.dsr-float-btn.open-visit {
  background: #9a3412;
}

.dsr-float-btn:active {
  transform: translateY(1px);
}

.map-pick-active .dsr-float-btn {
  display: none;
}


/* v2.11.5 DSR amount + action groups */
.amount-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.amount-input {
  text-align: right;
  font-weight: 950;
}

.dsr-action-section {
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  background: #f8fafc;
}

.dsr-action-title {
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.3px;
  color: #64748b;
  text-transform: uppercase;
  margin-bottom: 7px;
}

.dsr-action-chip.conflict {
  animation: chipWiggle 160ms ease-in-out;
}

@keyframes chipWiggle {
  0% { transform: translateX(0); }
  35% { transform: translateX(-2px); }
  70% { transform: translateX(2px); }
  100% { transform: translateX(0); }
}


/* v2.11.6 DSR readability + edit tools */
.three-actions {
  grid-template-columns: 1fr 1fr 1fr;
}

.btn-danger {
  min-height: 46px;
  border-radius: 14px;
  border: 1px solid #fecaca;
  background: #fee2e2;
  color: #991b1b;
  font-size: 14px;
  font-weight: 950;
}

.dsr-card {
  padding: 14px;
}

.dsr-card[data-dsr-record-id] {
  cursor: pointer;
}

.dsr-card-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}

.dsr-status-pill {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 950;
}

.dsr-status-pill.open {
  background: #fff7ed;
  color: #9a3412;
}

.dsr-status-pill.done {
  background: #dcfce7;
  color: #166534;
}

.dsr-timeline {
  margin-top: 11px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 8px;
  align-items: center;
  padding: 10px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
}

.dsr-time-label {
  font-size: 10px;
  font-weight: 950;
  color: #64748b;
  letter-spacing: 0.4px;
}

.dsr-time-value {
  margin-top: 2px;
  font-size: 15px;
  font-weight: 950;
  color: #111827;
  line-height: 1.2;
}

.dsr-time-date {
  font-size: 11px;
  color: #64748b;
  font-weight: 850;
}

.dsr-timeline-arrow {
  color: #94a3b8;
  font-weight: 950;
}

.dsr-card-footer-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}

.dsr-small-action {
  height: 38px;
  border-radius: 999px;
  border: 1px solid #d8dee4;
  background: #ffffff;
  color: #334155;
  font-size: 13px;
  font-weight: 950;
}

.dsr-small-action.danger {
  border-color: #fecaca;
  background: #fff1f2;
  color: #991b1b;
}

.dsr-small-action.primary {
  border-color: #334155;
  background: #334155;
  color: #ffffff;
}

@media (max-width: 430px) {
  .dsr-time-value {
    font-size: 13px;
  }
}


/* v2.11.7 DSR daily summary + cleaner customer card */
.hidden-action,
#copyCodeBtn {
  display: none !important;
}

.dsr-daily-title {
  font-size: 17px;
  font-weight: 950;
  color: #111827;
}

.dsr-summary-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 8px 0 12px;
}

.dsr-summary-item {
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 10px;
  background: #f8fafc;
}

.dsr-summary-label {
  font-size: 11px;
  font-weight: 950;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .3px;
}

.dsr-summary-value {
  margin-top: 3px;
  font-size: 17px;
  font-weight: 950;
  color: #111827;
}

.dsr-amount-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}

.dsr-amount-box {
  border-radius: 14px;
  padding: 10px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
}

.dsr-amount-label {
  font-size: 10px;
  font-weight: 950;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .3px;
}

.dsr-amount-value {
  margin-top: 3px;
  font-size: 18px;
  font-weight: 950;
  color: #111827;
}

.dsr-amount-value.sales {
  color: #166534;
}

.dsr-amount-value.return {
  color: #991b1b;
}


/* v2.11.8 DSR wallet amount + WhatsApp contacts + clear sheet */
.dsr-amount-value.sales,
.dsr-amount-value.return {
  color: #111827;
}

.dsr-summary-value.sales {
  color: #166534;
}

.dsr-summary-value.return {
  color: #991b1b;
}

.whatsapp-link {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 9px;
  margin: 2px 5px 2px 0;
  border-radius: 999px;
  background: #ecfdf5;
  color: #047857;
  text-decoration: none;
  font-weight: 950;
}

.danger-box {
  background: #fff1f2;
  border: 1px solid #fecdd3;
  border-radius: 16px;
  padding: 12px;
  margin: 8px 0 12px;
}

.danger-title {
  color: #991b1b;
  font-size: 14px;
  font-weight: 950;
}

.danger-text {
  margin-top: 6px;
  color: #7f1d1d;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}


/* v2.11.9 OUT card + softer Check-Out + cleaner WhatsApp + remark UI */
.dsr-main-action.open-visit {
  background: #8a5a44;
  border-color: #8a5a44;
  box-shadow: 0 5px 16px rgba(138,90,68,0.22);
}

.dsr-record-action,
.dsr-small-action.primary {
  background: #6f5a4a;
  border-color: #6f5a4a;
  color: #ffffff;
}

.whatsapp-link {
  background: #ecfdf5;
  color: #047857;
  padding: 0 10px;
}

.dsr-remark-box {
  margin-top: 10px;
  padding: 10px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
}

.dsr-remark-label {
  font-size: 10px;
  font-weight: 950;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: .35px;
}

.dsr-remark-text {
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.4;
  color: #111827;
  font-weight: 750;
  white-space: pre-wrap;
}


/* v2.11.11 safer DSR delete + cleaner close UX */
#closeDsrBottomBtn,
#cancelDsrCheckInBtn,
#cancelDsrCheckOutBtn,
#cancelDsrEditBtn,
#cancelDsrDeleteBtn {
  display: none !important;
}

.bottom-sheet.swipe-dragging {
  transition: none !important;
}

.sheet-handle {
  touch-action: none;
}


/* v2.11.12 action layout + full-card swipe */
.filter-actions {
  display: flex !important;
  gap: 10px;
}

.filter-actions > button {
  flex: 1 1 0;
  min-width: 0;
}

.bottom-sheet {
  touch-action: pan-y;
  will-change: transform;
}

.bottom-sheet.swipe-dragging {
  transition: none !important;
}

.bottom-sheet.swipe-dragging * {
  user-select: none;
}


/* v2.11.13 DSR date + PDF export */
.dsr-today-date {
  margin-top: 3px;
  font-size: 13px;
  color: #64748b;
  font-weight: 850;
}

#dsrSheet .dsr-time-date {
  display: none;
}

#dsrSheet .dsr-timeline {
  grid-template-columns: 1fr 32px 1fr;
}

#dsrSheet .dsr-time-value {
  font-size: 18px;
}


/* v2.11.16 final DSR export lock */
#cancelDsrExportBtn {
  display: none !important;
}

.final-export-box {
  margin: 8px 0 12px;
  padding: 12px;
  border: 1px solid var(--salesmap-ds-color-warning, #d97706);
  border-radius: 16px;
  background: var(--salesmap-ds-color-warning-soft, #fffbeb);
}

.final-export-title,
.final-export-text {
  color: var(--theme-warning-dark, #92400e);
}

.final-export-title {
  font-size: 14px;
  font-weight: 950;
}

.final-export-text {
  margin-top: 6px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}

.dsr-status-pill.locked {
  background: #e2e8f0;
  color: #334155;
}

#exportDsrBtn {
  font-weight: 950;
}


/* Test-tool unlock button styling. */
.test-unlock-btn {
  border-color: #cbd5e1;
  color: #475569;
  background: #f8fafc;
}


/* v2.11.19 DSR Calendar / History */
.dsr-action-row {
  flex-wrap: wrap;
}

.dsr-action-row > button {
  min-width: 92px;
}

.dsr-calendar-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 10px 0 8px;
}

.month-nav-btn {
  width: 38px;
  height: 34px;
  border-radius: 14px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  color: #334155;
  font-size: 22px;
  font-weight: 900;
}

.dsr-calendar-month {
  font-size: 16px;
  font-weight: 950;
  color: #1e293b;
}

.dsr-calendar-weekdays,
.dsr-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.dsr-calendar-weekdays {
  margin-bottom: 6px;
}

.dsr-calendar-weekdays > div {
  text-align: center;
  font-size: 11px;
  font-weight: 900;
  color: #64748b;
}

.dsr-calendar-day {
  min-height: 46px;
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #334155;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  font-weight: 950;
}

.dsr-calendar-day.empty {
  visibility: hidden;
}

.dsr-calendar-day small {
  font-size: 10px;
  font-weight: 900;
  color: #64748b;
}

.dsr-calendar-day.has-records {
  background: #eef6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

.dsr-calendar-day.today {
  border-color: #94a3b8;
}


.dsr-calendar-day.selected small {
  color: #dbeafe;
}

.dsr-calendar-day.locked::after {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 99px;
  background: #475569;
}

.dsr-history-head {
  margin: 14px 0 10px;
  padding: 12px;
  border-radius: 18px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.dsr-history-date {
  font-size: 15px;
  font-weight: 950;
  color: #1e293b;
}

.dsr-history-note {
  margin-top: 2px;
  font-size: 12px;
  color: #64748b;
  font-weight: 750;
}

.small-share-btn {
  min-width: 96px;
  white-space: nowrap;
}

.history-card {
  cursor: pointer;
}


/* v2.11.20 History cleanup, search, range */
.hidden-history-subtitle,
.hidden-history-close,
.hidden-history-bottom-close {
  display: none !important;
}

.dsr-calendar-day small {
  display: none !important;
}

.dsr-history-tools {
  margin: 12px 0 10px;
  display: grid;
  gap: 8px;
}

.dsr-history-search {
  height: 42px;
  border-radius: 16px;
  font-weight: 850;
}

.dsr-history-mode-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}

.compact-mode-btn {
  min-width: 0;
  padding-left: 8px;
  padding-right: 8px;
  font-size: 12px;
  font-weight: 950;
}

.compact-mode-btn.active-mode {
  background: #1e293b;
  border-color: #1e293b;
  color: #fff;
}

.dsr-history-range-label {
  justify-self: start;
  padding: 7px 10px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
}

.compact-history-summary {
  margin-top: 8px;
}

.compact-history-summary .dsr-summary-label {
  font-size: 11px;
}

.compact-history-summary .dsr-summary-value {
  font-size: 15px;
}

.dsr-calendar-day.in-range {
  background: #dbeafe;
  border-color: #93c5fd;
  color: #1d4ed8;
}

.dsr-calendar-day.range-start,
.dsr-calendar-day.range-end {
  background: #1e293b;
  border-color: #1e293b;
  color: #fff;
}

.history-date-separator {
  margin: 10px 2px 6px;
  font-size: 12px;
  font-weight: 950;
  color: #64748b;
}

.history-visit-row,
.history-search-result {
  margin-bottom: 8px;
  padding: 12px;
  border-radius: 18px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
}

.history-visit-row.focus-record {
  border-color: #1d4ed8;
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.13);
}

.history-visit-main,
.history-search-result {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.history-visit-code,
.history-search-code {
  font-size: 14px;
  font-weight: 950;
  color: #1e293b;
}

.history-visit-name,
.history-search-name {
  margin-top: 2px;
  font-size: 12px;
  color: #475569;
  font-weight: 850;
}

.history-visit-meta,
.history-search-time {
  margin-top: 7px;
  font-size: 12px;
  font-weight: 850;
  color: #64748b;
}

.history-search-time {
  text-align: right;
  margin-top: 0;
  white-space: nowrap;
}

.history-visit-money {
  margin-top: 8px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.history-visit-money span {
  padding: 5px 8px;
  border-radius: 999px;
  background: #f8fafc;
  font-size: 12px;
  font-weight: 950;
  color: #334155;
}

.history-visit-actions {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.history-visit-actions span {
  padding: 4px 7px;
  border-radius: 999px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 11px;
  font-weight: 850;
}

.history-visit-remark {
  margin-top: 8px;
  padding: 8px;
  border-radius: 12px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 750;
}


/* DSR History test-data control row. */
.dsr-history-test-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.test-data-btn {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #9a3412;
}


/* v2.11.23 Calendar UI polish */
.dsr-history-search::placeholder {
  color: #94a3b8;
  opacity: 1;
  font-weight: 800;
}

.dsr-calendar-day {
  position: relative;
  overflow: visible;
  background: #ffffff;
  border-color: #e2e8f0;
  color: #334155;
}

.dsr-calendar-day.has-records {
  background: #ffffff;
  border-color: #cbd5e1;
  color: #334155;
}

.dsr-calendar-day.has-records::before {
  content: "";
  position: absolute;
  bottom: 6px;
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: #2563eb;
}

.dsr-calendar-day.today {
  border-color: #0f172a;
  box-shadow: inset 0 0 0 1px #0f172a;
}



.dsr-calendar-day.in-range,
.dsr-calendar-day.range-start,
.dsr-calendar-day.range-end {
  background: #fef3c7;
  border-color: #f59e0b;
  color: #92400e;
  box-shadow: none;
}

.dsr-calendar-day.in-range::before,
.dsr-calendar-day.range-start::before,
.dsr-calendar-day.range-end::before {
  background: #92400e;
}

.dsr-calendar-day.locked::after {
  content: none !important;
}

.dsr-calendar-day.in-range.today {
  box-shadow: inset 0 0 0 2px #92400e;
}

/* M6 compatibility aliases for legacy fog reads; no independent Foggy palette remains. */
:root {
  --fog-ink: var(--salesmap-ds-color-text);
  --fog-muted: var(--salesmap-ds-color-text-muted);
  --fog-soft: var(--salesmap-ds-color-surface-soft);
  --fog-soft-2: var(--salesmap-ds-color-surface-soft);
  --fog-line: var(--salesmap-ds-color-line);
  --fog-blue: var(--salesmap-ds-color-primary);
  --fog-blue-soft: var(--salesmap-ds-color-primary-soft);
  --fog-sage: var(--salesmap-ds-color-surface-soft);
  --fog-sage-line: var(--salesmap-ds-color-line);
  --fog-sage-ink: var(--salesmap-ds-color-text-muted);
}

.btn-primary,
button.btn-primary,
.compact-mode-btn.active-mode {
  background: var(--fog-blue) !important;
  border-color: var(--fog-blue) !important;
  color: #ffffff !important;
}

.btn-primary:active,
button.btn-primary:active {
  background: #607589 !important;
}

.btn-light,
button.btn-light,
.location-btn,
.month-nav-btn {
  background: var(--fog-soft-2) !important;
  border-color: var(--fog-line) !important;
  color: var(--fog-ink) !important;
}

.btn-light:active,
button.btn-light:active,
.location-btn:active,
.month-nav-btn:active {
  background: var(--fog-soft) !important;
}

.menu-list.app-menu-list {
  gap: 9px;
  margin-top: 8px;
}

.app-menu-list .menu-row {
  min-height: 56px;
  border-radius: 18px;
  border: 0;
  background: var(--theme-surface);
  box-shadow: none;
}

.app-menu-list .menu-row:active {
  background: var(--fog-soft);
}

.app-menu-list .menu-row-main {
  color: #17212b;
  letter-spacing: -0.2px;
}

.app-menu-list .menu-row-primary {
  background: linear-gradient(135deg, #edf4f8, #e2ebf1);
  border-color: #c6d4df;
}

.app-menu-list .menu-row-primary .menu-row-main {
  color: var(--fog-ink);
}

.app-menu-list .menu-chevron {
  color: #8fa0ad;
}

.menu-badge {
  background: var(--fog-blue) !important;
  color: #fff !important;
}

/* Calendar hierarchy:
   - data day = clean white with small foggy blue dot
   - selected single day = foggy blue, not dark
   - range = foggy sage, same color for all cells
   - today = foggy blue border */
.dsr-calendar-day {
  background: #ffffff !important;
  border-color: var(--fog-line) !important;
  color: var(--fog-ink) !important;
  box-shadow: none !important;
}

.dsr-calendar-day.has-records::before {
  background: var(--fog-blue) !important;
}

.dsr-calendar-day.today {
  border-color: var(--fog-blue) !important;
  box-shadow: inset 0 0 0 1.5px var(--fog-blue) !important;
}

.dsr-calendar-day.selected {
  background: var(--fog-blue-soft) !important;
  border-color: #aab9c7 !important;
  color: var(--fog-ink) !important;
}

.dsr-calendar-day.selected::before {
  background: var(--fog-blue) !important;
}

.dsr-calendar-day.in-range,
.dsr-calendar-day.range-start,
.dsr-calendar-day.range-end {
  background: var(--fog-blue-soft) !important;
  border-color: #aab9c7 !important;
  color: var(--fog-ink) !important;
  box-shadow: none !important;
}

.dsr-calendar-day.in-range::before,
.dsr-calendar-day.range-start::before,
.dsr-calendar-day.range-end::before {
  background: var(--fog-blue) !important;
}

.dsr-calendar-day.in-range.today,
.dsr-calendar-day.range-start.today,
.dsr-calendar-day.range-end.today {
  border-color: var(--fog-blue) !important;
  box-shadow: inset 0 0 0 1.8px var(--fog-blue) !important;
}

.dsr-history-search::placeholder {
  color: #8fa0ad !important;
  opacity: 1;
  font-weight: 800;
}

.dsr-history-search {
  color: var(--fog-ink);
}


/* v2.11.25 smoother sheets + no X close buttons */
.bottom-sheet .sheet-header .mini-btn {
  display: none !important;
}

.bottom-sheet {
  will-change: transform;
  contain: none;
  transition: transform 130ms ease-out;
  box-shadow: 0 -6px 22px rgba(52, 73, 90, 0.16);
}

.sheet-backdrop {
  transition: opacity 120ms ease-out;
}

/* Keep message action buttons outside containment. */
#messageSheet button {
  contain: none;
}


/* v2.11.26 Local login + status marquee */
.login-overlay {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background:
    radial-gradient(circle at top left, rgba(111, 130, 150, 0.24), transparent 34%),
    linear-gradient(135deg, rgba(247, 249, 251, 0.96), rgba(229, 236, 242, 0.96));
  backdrop-filter: blur(8px);
}

.login-overlay.open {
  display: flex;
}

.login-card {
  width: min(380px, 100%);
  border-radius: var(--salesmap-ds-radius-lg);
  background: var(--salesmap-ds-color-surface);
  border: 0;
  box-shadow: none;
  padding: 24px 22px 20px;
}

.login-title {
  font-size: 28px;
  font-weight: 950;
  letter-spacing: -0.6px;
  color: #34495a;
}

.login-subtitle {
  margin-top: 3px;
  margin-bottom: 18px;
  font-size: 13px;
  font-weight: 850;
  color: #6f8296;
}

.login-field {
  display: grid;
  gap: 6px;
  margin-bottom: 12px;
}

.login-field label {
  font-size: 12px;
  font-weight: 900;
  color: #6f8296;
}

/* Stage 8: Login controls use .form-input; preserve semantic bundle order. */
.login-remember {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.login-remember input[type="checkbox"] {
  margin: 0;
  accent-color: var(--salesmap-ds-color-primary-active);
}

/* Shared field feedback keeps helper and validation copy on one Forms grammar. */
.form-help-text,
.form-error-text {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.4;
}

.form-help-text {
  color: var(--salesmap-ds-color-text-muted);
}

.form-error-text {
  color: var(--salesmap-ds-color-danger);
  font-weight: var(--salesmap-ds-font-weight-semibold);
}

.login-btn {
  width: 100%;
  height: 48px;
  margin-top: 4px;
  border-radius: 18px;
  border: 1px solid #6f8296;
  background: #6f8296;
  color: #fff;
  font-size: 15px;
  font-weight: 950;
}

.login-btn.is-loading {
  cursor: wait;
  opacity: 1;
  pointer-events: none;
}

.login-btn.is-loading::before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 9px;
  vertical-align: -2px;
  border: 2px solid rgba(255, 255, 255, 0.42);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: salesmap-login-spin 0.72s linear infinite;
}

@keyframes salesmap-login-spin {
  to { transform: rotate(360deg); }
}

.login-error {
  min-height: 18px;
  margin-top: 10px;
  color: #9b6a68;
  font-size: 12px;
  font-weight: 900;
  text-align: center;
}

.login-hint {
  margin-top: 5px;
  color: #8fa0ad;
  font-size: 11px;
  font-weight: 800;
  text-align: center;
}

.status-pill.marquee {
  max-width: min(86vw, 420px);
  text-overflow: clip;
}

.status-pill.marquee span {
  display: inline-block;
  padding-left: 100%;
  animation: statusMarquee 9s linear infinite;
}

@keyframes statusMarquee {
  0% { transform: translateX(0); }
  12% { transform: translateX(0); }
  88% { transform: translateX(calc(-100% - 100vw)); }
  100% { transform: translateX(calc(-100% - 100vw)); }
}


/* v2.11.27 clean local login */
.login-subtitle,
.login-hint {
  display: none !important;
}

.first-login-field {
  margin-top: 18px;
}

.driver-login-btn {
  width: 100%;
  height: 44px;
  margin-top: 8px;
  border-radius: 18px;
  border: 1px solid #d7e0e7;
  background: #f7f9fb;
  color: #34495a;
  font-size: 14px;
  font-weight: 950;
}

.driver-login-btn:active {
  background: #eef3f6;
}

.login-card {
  padding-top: 26px;
}

.login-error {
  margin-top: 8px;
}


/* v2.11.28 DSR viewer filter */
.dsr-viewer-filter {
  margin-top: 8px;
}

.dsr-viewer-select {
  height: 38px;
  border-radius: 16px;
  background: #f7f9fb;
  border-color: #d7e0e7;
  color: #34495a;
  font-size: 13px;
  font-weight: 900;
}

#dsrHistoryViewerFilterWrap {
  margin-top: 0;
}


/* v2.11.30 cleanup/performance */
.bottom-sheet {
  transition-duration: 115ms;
  content-visibility: visible;
}

.result-item {
  touch-action: manipulation;
}


/* v2.11.34 compact bottom-left status */
.status-pill {
  max-width: clamp(160px, 48vw, 240px);
  min-height: 18px;
  padding: 7px 11px;
  background: rgba(17,24,39,0.74);
}

.status-pill.marquee {
  max-width: clamp(160px, 48vw, 240px);
  text-overflow: clip;
}

.status-pill.marquee span {
  display: inline-block;
  padding-left: 0;
  min-width: max-content;
  animation: statusMarqueeCompact 8.5s linear infinite;
}

@keyframes statusMarqueeCompact {
  0% { transform: translateX(0); }
  18% { transform: translateX(0); }
  82% { transform: translateX(-55%); }
  100% { transform: translateX(-55%); }
}


/* v2.11.36 Supervisor/Admin DSR Daily Summary */
.summary-date-nav {
  display: grid;
  grid-template-columns: 42px 1fr 1fr 42px;
  gap: 7px;
  margin-top: 8px;
}

.summary-date-btn {
  height: 36px;
  border-radius: 14px;
  border: 1px solid #d7e0e7;
  background: #f7f9fb;
  color: #34495a;
  font-size: 12px;
  font-weight: 950;
}

.summary-date-btn:active {
  background: #eef3f6;
}

#prevDsrSummaryDateBtn,
#nextDsrSummaryDateBtn {
  font-size: 22px;
  line-height: 1;
}

.manager-summary-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 10px 0 12px;
}

.manager-overview-card {
  border: 1px solid #d7e0e7;
  border-radius: 18px;
  background: #f7f9fb;
  padding: 10px 8px;
  text-align: center;
}

.manager-overview-card.warn {
  background: #fff7ed;
  border-color: #fed7aa;
}

.manager-overview-card.wide {
  grid-column: span 2;
}

.manager-overview-label {
  font-size: 10px;
  font-weight: 950;
  color: #6f8296;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.manager-overview-value {
  margin-top: 5px;
  font-size: 17px;
  font-weight: 950;
  color: #34495a;
}

.manager-summary-list {
  display: grid;
  gap: 9px;
}

.manager-summary-row {
  width: 100%;
  border: 1px solid #d7e0e7;
  background: #ffffff;
  border-radius: 20px;
  padding: 12px;
  text-align: left;
  box-shadow: 0 6px 16px rgba(52, 73, 90, 0.045);
}

.manager-summary-row.uploaded {
  border-color: #cfe4d6;
}

.manager-summary-row.pending {
  background: #fff7ed;
  border-color: #fed7aa;
}

.manager-summary-row.empty {
  background: #f7f9fb;
  opacity: 0.82;
}

.manager-summary-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.manager-summary-code {
  font-size: 16px;
  font-weight: 950;
  color: #34495a;
}

.manager-summary-status {
  margin-top: 3px;
  font-size: 12px;
  font-weight: 900;
  color: #6f8296;
}

.manager-summary-sales {
  white-space: nowrap;
  font-size: 15px;
  font-weight: 950;
  color: #52685d;
}

.manager-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 10px;
}

.manager-summary-grid div {
  min-width: 0;
  border-radius: 14px;
  background: #f7f9fb;
  border: 1px solid #e3e9ee;
  padding: 7px 8px;
}

.manager-summary-grid span {
  display: block;
  color: #7c8a96;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.25px;
}

.manager-summary-grid b {
  display: block;
  margin-top: 3px;
  color: #34495a;
  font-size: 12px;
  font-weight: 950;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.manager-summary-report {
  margin-top: 9px;
  padding-top: 8px;
  border-top: 1px dashed #d7e0e7;
  color: #6f8296;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.35;
}

@media (max-width: 380px) {
  .manager-summary-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .manager-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* v2.11.37 Summary flow + native date picker */
.summary-date-nav {
  grid-template-columns: 38px 1fr 1fr 1fr 38px;
}

.summary-test-row {
  display: flex;
  margin-top: 8px;
}

.summary-test-row .test-data-btn {
  width: 100%;
}

.hidden-date-input {
  position: fixed;
  left: -1000px;
  top: -1000px;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

#dsrSheet.from-summary #closeDsrBottomBtn {
  display: inline-flex !important;
}


#dsrHistorySheet.from-summary .hidden-history-bottom-close {
  display: flex !important;
}

#dsrHistorySheet.from-summary #closeDsrHistoryBottomBtn {
  display: inline-flex !important;
}

#dsrSheet.from-summary .dsr-action-row,
#dsrHistorySheet.from-summary .filter-actions {
  padding-bottom: 2px;
}


/* v2.11.38 Cleaner DSR Summary */
.summary-date-nav {
  grid-template-columns: 42px 1fr 1fr 42px;
}

.manager-overview-card.wide {
  grid-column: auto;
}


/* v2.11.39 customer card and custom select UI */
.map-link-value {
  display: inline-flex;
  align-items: center;
  color: #34495a;
  font-weight: 900;
  text-decoration: none;
  border-bottom: 0;
}

.map-link-value::after {
  content: '↗';
  margin-left: 6px;
  font-size: 11px;
  color: #6f8296;
}

.custom-select-sheet {
  flex-direction: column;
  max-height: 72vh;
  max-height: 72dvh;
  overflow: hidden;
}

.custom-select-sheet.open {
  display: flex;
}

.custom-select-sheet > :is(.sheet-handle, .sheet-header, .custom-select-bulk-actions) {
  flex: 0 0 auto;
}

.custom-select-list {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  gap: 8px;
  padding-top: 4px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
  scroll-padding-block-end: 14px;
}

.custom-select-option {
  width: 100%;
  min-height: 52px;
  padding: 12px 14px;
  border: 0;
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-control-bg);
  color: var(--salesmap-ds-control-text);
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
  font-weight: var(--salesmap-ds-font-weight-semibold);
  text-align: left;
}

.custom-select-option.selected {
  background: var(--salesmap-ds-color-primary-soft);
  color: var(--salesmap-ds-color-primary-active);
}

.custom-select-option:active {
  background: var(--salesmap-ds-state-selected-bg);
}

.custom-select-option:disabled {
  opacity: 0.45;
}

.custom-select-check {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  border: 2px solid transparent;
  border-radius: 6px;
  background: var(--salesmap-ds-color-primary);
  color: var(--salesmap-ds-primitive-neutral-0);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: var(--salesmap-ds-font-weight-strong);
}

.custom-select-option:not(.selected) .custom-select-check {
  background: var(--salesmap-ds-color-surface);
  border-color: var(--salesmap-ds-color-line);
  color: transparent;
}


/* v2.11.40 compact Area picker in Map Filter */
.hidden-area-checkboxes {
  display: none !important;
}

.filter-select-button {
  width: 100%;
  min-height: 46px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-control-bg);
  color: var(--salesmap-ds-control-text);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 15px;
  font-weight: var(--salesmap-ds-font-weight-regular);
  text-align: left;
}

.filter-select-button:disabled {
  opacity: 0.55;
}

.area-picker-sheet {
  max-height: 76vh;
}

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */


/* v2.11.41 filter picker polish */
#areaPickerText {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-select-sheet .filter-actions {
  flex: 0 0 auto;
  margin-top: 12px;
  position: sticky;
  bottom: 0;
  background: var(--bg);
  padding-top: 8px;
}

#settingsBtn {
  background: #fff1f2;
  border-color: #f0c4c7;
}

#settingsBtn .menu-row-main,
#settingsBtn .menu-chevron {
  color: #9b6a68;
}

#settingsBtn:active {
  background: #f8e5e7;
}

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

.filter-select-chevron {
  color: var(--salesmap-ds-control-placeholder);
  font-size: 18px;
  line-height: 1;
  flex: 0 0 auto;
  transform: translateY(-1px);
}

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */


/* v2.11.46 local notification center */
.notification-badge {
  min-width: 24px;
}

.notification-list {
  display: grid;
  gap: 9px;
}

.notification-item {
  width: 100%;
  border: 0;
  background: var(--theme-surface);
  border-radius: 18px;
  padding: 12px;
  text-align: left;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  box-shadow: none;
}

.notification-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: var(--theme-primary);
}

.notification-item.warning .notification-dot {
  background: var(--salesmap-ds-color-warning);
}

.notification-item.danger .notification-dot {
  background: var(--salesmap-ds-color-danger);
}

.notification-main {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.notification-title {
  color: var(--theme-ink);
  font-size: 14px;
  font-weight: 700;
}

.notification-detail {
  color: var(--theme-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
}

.notification-action {
  padding: 7px 10px;
  border-radius: 999px;
  background: #eef3f6;
  color: #34495a;
  font-size: 12px;
  font-weight: 950;
  white-space: nowrap;
}

/* Customer-change Review is a compact secondary action; warning colour stays on the card indicator. */
html[data-runtime="android-webview"][data-app-theme]
  .notification-item[data-notification-type="changes"] .notification-action {
  align-self: center;
  background: var(--salesmap-ds-action-secondary-bg);
  color: var(--salesmap-ds-action-secondary-text);
  box-shadow: none;
}

html[data-runtime="android-webview"][data-app-theme]
  .notification-item[data-notification-type="changes"]:active .notification-action {
  background: var(--salesmap-ds-action-primary-bg);
  color: var(--salesmap-ds-action-primary-text);
}

.notification-empty {
  padding: 16px;
  border-radius: 18px;
  background: color-mix(in srgb, var(--salesmap-ds-color-success) 10%, var(--theme-surface));
  border: 0;
  color: var(--salesmap-ds-color-success);
  font-size: 13px;
  font-weight: 900;
  text-align: center;
}


/* v2.11.48 Supabase DSR upload test */
.cloud-upload-btn {
  border-color: #b8c6d1;
  color: #34495a;
  background: #eef3f6;
  font-weight: 950;
}


/* v2.11.49 Add Customer Google Maps link */
.google-link-form-row {
  margin-top: 4px;
}

.google-link-input-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
  align-items: stretch;
}

.google-link-input {
  min-height: 60px;
  resize: none;
  font-size: 13px;
  line-height: 1.35;
  word-break: break-all;
}

.google-link-find-btn {
  min-width: 72px;
  border-radius: 14px;
  border: 1px solid #cbd5e1;
  background: #eef3f6;
  color: #334155;
  font-size: 13px;
  font-weight: 950;
  padding: 0 14px;
}

.google-link-find-btn:disabled {
  opacity: 0.58;
  pointer-events: none;
}

.google-link-status {
  margin-top: 7px;
  min-height: 18px;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 750;
  color: #64748b;
}

.google-link-status.working {
  color: #6b7280;
}

.google-link-status.success {
  color: #166534;
}

.google-link-status.error {
  color: #991b1b;
}

.location-missing {
  color: #9a3412;
  font-weight: 900;
}

@media (max-width: 390px) {
  .google-link-input-row {
    grid-template-columns: 1fr;
  }

  .google-link-find-btn {
    min-height: 40px;
  }
}

/* v2.11.50 Add Customer persistent form draft */
.required-mark { color:var(--salesmap-ds-primitive-danger-600); font-weight:950; }
.required-select.has-placeholder { color:#7c8795; }
#addDraftStatusText.draft-saved { color:#64748b; }
#addDraftStatusText.draft-restored { color:#166534; }


/* Shared bottom-sheet overflow hint using a translucent circular affordance around the chevron. */
.sheet-scroll-hint {
  position: fixed;
  left: 50%;
  bottom: calc(68px + var(--safe-bottom));
  z-index: 6800;
  width: 34px;
  height: 34px;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--theme-map-control-line) 70%, transparent);
  border-radius: 50%;
  background: color-mix(in srgb, var(--theme-surface) 68%, transparent);
  color: transparent;
  box-shadow: 0 3px 10px color-mix(in srgb, var(--theme-ink) 12%, transparent);
  transform: translateX(-50%);
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
}

.sheet-scroll-hint[hidden] { display: none !important; }
.sheet-scroll-hint.show:not([hidden]) {
  display: inline-flex;
  animation: sheetMoreBounceV21211 1.25s ease-in-out infinite;
}

@keyframes sheetMoreBounce {
  0%, 100% { transform: translate(-50%, 0); }
  50% { transform: translate(-50%, 4px); }
}

.sheet-handle {
  min-height: 14px;
  background-clip: content-box;
  padding: 4px 0 5px;
  cursor: grab;
}

.sheet-handle:active {
  cursor: grabbing;
}

/* v2.11.51 DSR Today clearer visual hierarchy */
.dsr-record-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 16px 2px 9px;
  padding-top: 13px;
  border-top: 1px solid #d8dee4;
  color: #334155;
  font-size: 13px;
  font-weight: 950;
  letter-spacing: 0.28px;
  text-transform: uppercase;
}

#dsrSheet .dsr-summary-grid {
  gap: 7px;
  margin-bottom: 4px;
}

#dsrSheet .dsr-summary-item {
  background: #eef1f3;
  border-color: #d8dee4;
  box-shadow: none;
}

#dsrList.dsr-record-list {
  padding: 1px 1px 4px;
}

#dsrList .dsr-card {
  position: relative;
  margin-bottom: 13px;
  padding: 14px 13px 13px;
  background: var(--theme-surface);
  border: 0;
  border-left: 4px solid var(--theme-primary);
  border-radius: 17px;
  box-shadow: none;
}

#dsrList .dsr-card.open-record {
  background: var(--theme-primary-soft);
  border-left-color: var(--theme-primary);
}

#dsrList .dsr-card.locked-record {
  background: var(--theme-surface-soft);
  border-left-color: var(--theme-muted);
}

#dsrList .dsr-card-code {
  display: inline-flex;
  align-items: center;
  min-height: 29px;
  padding: 0 9px;
  border-radius: 999px;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
  font-size: 14px;
}

#dsrList .open-record .dsr-card-code {
  background: var(--theme-primary-soft);
  color: var(--theme-primary-dark);
}

#dsrList .locked-record .dsr-card-code {
  background: #e2e7eb;
  color: #44515e;
}

#dsrList .dsr-card-name {
  margin-top: 6px;
  font-size: 14px;
  line-height: 1.3;
  color: #27313b;
}

#dsrList .dsr-timeline {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(203, 213, 225, 0.92);
}

#dsrList .dsr-amount-box {
  background: rgba(255, 255, 255, 0.82);
  border-color: rgba(203, 213, 225, 0.88);
}

#dsrList .dsr-card-meta {
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 12px;
  background: rgba(238, 241, 243, 0.72);
  color: #6b7280;
  font-size: 11px;
  line-height: 1.45;
  font-weight: 750;
}

#dsrList .dsr-mini-chip {
  background: #e8ece9;
  color: #3f5149;
}

#dsrList .dsr-status-pill.done {
  background: #dfe9e3;
  color: #365d47;
}

#dsrList .dsr-status-pill.open {
  background: #f4e5d2;
  color: #7a4a20;
}

/* v2.11.53 cloud DSR summary */
.summary-test-row { gap: 8px; }
.cloud-summary-btn {
  border-color:#b8c6d1;
  background:#eaf0f3;
  color:#34495a;
  font-weight:950;
}
.cloud-summary-btn:disabled { opacity:.58; }
.cloud-summary-status {
  margin-top:7px;
  font-size:11px;
  line-height:1.35;
  font-weight:850;
  color:#64748b;
}
.cloud-summary-status.loading { color:#6b7280; }
.cloud-summary-status.success { color:#166534; }
.cloud-summary-status.error { color:#991b1b; }


/* v2.11.55 Supabase Auth test */
.login-cloud-note {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 850;
  color: #64748b;
}

#loginBtn:disabled {
  opacity: 0.62;
}


/* v2.11.61 Online-only login */
.login-error {
  min-height: 42px;
  line-height: 1.4;
}

.login-cloud-note {
  color: #475569;
}


/* v2.11.66 map marker labels */
.map-label-mode-btn {
  position: fixed;
  left: 14px;
  top: calc(66px + var(--safe-top));
  z-index: 905;
  height: 28px;
  min-width: 92px;
  padding: 0 11px;
  border: 1px solid rgba(209, 213, 219, 0.95);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.14);
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
  cursor: pointer;
  pointer-events: auto;
}

.map-label-mode-btn.active {
  color: #0f172a;
  border-color: rgba(148, 163, 184, 0.95);
  background: rgba(255, 255, 255, 0.98);
}

/* Android keeps layout.css's canonical 68px search-results offset so results cover map quick controls. */
html[data-runtime="browser-desktop"] #resultPanel {
  top: calc(100px + var(--safe-top));
}

.leaflet-tooltip.salesmap-marker-label {
  padding: 2px 6px;
  border: 1px solid rgba(148, 163, 184, 0.75);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 2px 7px rgba(15, 23, 42, 0.18);
  color: #0f172a;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
  pointer-events: none;
}

.leaflet-tooltip.salesmap-marker-label::before {
  display: none;
}


/* v2.11.68 map styles */
.map-quick-controls {
  position: fixed;
  left: 14px;
  top: calc(66px + var(--safe-top));
  z-index: 905;
  display: flex;
  gap: 6px;
  align-items: center;
  pointer-events: none;
}

.map-quick-controls .map-label-mode-btn,
.map-quick-controls .map-style-mode-btn {
  position: static;
  pointer-events: auto;
}

.map-style-mode-btn {
  height: 28px;
  min-width: 98px;
  padding: 0 11px;
  border: 1px solid rgba(209, 213, 219, 0.95);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.14);
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
  cursor: pointer;
}

#map.map-style-minimal .leaflet-tile-pane {
  filter: saturate(0.34) brightness(1.12) contrast(0.88);
}

#map.map-style-street .leaflet-tile-pane,
#map.map-style-satellite .leaflet-tile-pane {
  filter: none;
}

#map.map-style-satellite .leaflet-tooltip.salesmap-marker-label {
  background: rgba(255, 255, 255, 0.96);
  border-color: rgba(71, 85, 105, 0.9);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.38);
}

.map-label-mode-btn {
  position: static;
}


/* v2.11.69 preferences, filters, card polish */
#map .leaflet-tile-pane,
#map.map-style-minimal .leaflet-tile-pane {
  filter: saturate(0.34) brightness(1.12) contrast(0.88);
}

.map-quick-controls {
  max-width: calc(100vw - 28px);
}

.map-filter-quick-btn {
  height: 28px;
  min-width: 72px;
  padding: 0 11px;
  border: 1px solid rgba(209, 213, 219, 0.95);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.14);
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
  cursor: pointer;
  pointer-events: auto;
}

.search-wrap {
  padding-right: 5px;
}

#searchInput {
  padding-right: 4px;
}

.customer-card-heading {
  flex: 1;
  min-width: 0;
}

.customer-code-row {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.card-edit-btn {
  flex: 0 0 auto;
  height: 29px;
  padding: 0 10px;
  border: 1px solid #d5dce2;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}

.copyable-text {
  cursor: copy;
  -webkit-user-select: none;
  user-select: none;
  touch-action: manipulation;
}

.info-grid {
  align-items: center;
}

.info-label,
.info-value {
  min-height: 24px;
  display: flex;
  align-items: center;
  line-height: 1.35;
}

.info-value .whatsapp-link {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
}

.pin-visual {
  position: relative;
  width: 26px;
  height: 28px;
}

.pin-visual .custom-pin {
  position: absolute;
  left: 2px;
  top: 2px;
}

.pin-visual.selected {
  width: 34px;
  height: 36px;
}

.pin-visual.selected .custom-pin {
  left: 2px;
  top: 2px;
}

/* DSR Today and History intentionally share the base .custom-pin frame. */

.pin-dsr-check {
  position: absolute;
  top: -7px;
  right: -7px;
  z-index: 3;
  width: 17px;
  height: 17px;
  border-radius: 999px;
  background: #22c55e;
  border: 2px solid white;
  color: white;
  font-size: 11px;
  font-weight: 900;
  line-height: 13px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
}

/* DSR Today and History share chronological visit-number badges; two-digit numbers expand to a pill. */
.pin-dsr-check.visit-order {
  box-sizing: border-box;
  width: auto;
  min-width: 19px;
  padding: 0 4px;
  background: #52685d;
  font-size: 10px;
  line-height: 13px;
}

.settings-sheet {
  max-height: 86vh;
}

.settings-section {
  margin-top: 12px;
  padding: 12px;
  border: 0;
  border-radius: 16px;
  background: var(--theme-surface);
}

.settings-section-title {
  color: var(--theme-ink);
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.settings-section-note {
  margin-top: 3px;
  color: var(--theme-muted);
  font-size: 12px;
}

.settings-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.settings-row {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 54px;
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid var(--theme-line);
  background: transparent;
  color: var(--theme-ink);
  font: inherit;
  text-align: left;
}

.settings-row:last-child {
  border-bottom: 0;
}

.settings-row[hidden] {
  display: none;
}

.settings-row-title {
  display: block;
  color: var(--theme-ink);
  font-size: 14px;
  font-weight: 600;
}

.settings-row-subtitle {
  display: block;
  margin-top: 3px;
  color: var(--theme-muted);
  font-size: 12px;
  line-height: 1.3;
}

.settings-select {
  flex: 0 0 auto;
  max-width: 142px;
  min-height: 36px;
  padding: 5px 30px 5px 9px;
  border: 1px solid var(--theme-line);
  border-radius: 10px;
  background: var(--theme-surface);
  color: var(--theme-ink);
  font-size: 13px;
  font-weight: 700;
}

.settings-toggle-row {
  cursor: pointer;
}

.settings-toggle-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.settings-toggle-ui {
  position: relative;
  flex: 0 0 auto;
  width: 44px;
  height: 25px;
  border-radius: 999px;
  background: var(--theme-disabled-line);
  transition: background 140ms ease;
}

.settings-toggle-ui::after {
  content: '';
  position: absolute;
  left: 3px;
  top: 3px;
  width: 19px;
  height: 19px;
  border-radius: 999px;
  background: var(--theme-surface);
  box-shadow: 0 1px 4px rgba(15,23,42,0.25);
  transition: transform 140ms ease;
}

.settings-toggle-input:checked + .settings-toggle-ui {
  background: var(--theme-primary);
}

.settings-toggle-input:checked + .settings-toggle-ui::after {
  transform: translateX(19px);
}

.area-color-list {
  display: grid;
  gap: 6px;
  max-height: 280px;
  overflow: auto;
  margin-top: 8px;
}

.area-color-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px 68px;
  gap: 8px;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid #e2e8f0;
}

.area-color-row:last-child {
  border-bottom: 0;
}

.area-color-name {
  overflow: hidden;
  color: #334155;
  font-size: 13px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.area-color-input {
  width: 42px;
  height: 32px;
  padding: 2px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: white;
}

.area-color-reset {
  height: 30px;
  border: 1px solid #d8dee5;
  border-radius: 9px;
  background: white;
  color: #64748b;
  font-size: 11px;
  font-weight: 800;
}

.settings-danger-row {
  width: 100%;
  min-height: 46px;
  margin-top: 8px;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: #b91c1c;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  font-weight: 850;
}

.app-toast {
  position: fixed;
  left: 50%;
  bottom: calc(88px + var(--safe-bottom));
  z-index: 2000;
  max-width: calc(100vw - 40px);
  padding: 9px 14px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.92);
  color: white;
  font-size: 13px;
  font-weight: 750;
  text-align: center;
  box-shadow: 0 5px 18px rgba(15, 23, 42, 0.28);
  opacity: 0;
  transform: translate(-50%, 10px);
  pointer-events: none;
  transition: opacity 140ms ease, transform 140ms ease;
}

.app-toast.show {
  opacity: 1;
  transform: translate(-50%, 0);
}


/* v2.11.71 menu, filter and settings polish */
.notification-float-btn {
  position: fixed;
  right: 13px;
  top: calc(68px + var(--safe-top));
  z-index: 906;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(216, 222, 228, 0.96);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  color: #425466;
  box-shadow: 0 4px 12px rgba(52, 73, 90, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.notification-float-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.notification-float-btn .menu-badge {
  position: absolute;
  right: -4px;
  top: -5px;
  transform: none;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border: 2px solid white;
  border-radius: 999px;
  line-height: 14px;
  font-size: 10px;
  text-align: center;
}

.app-menu-list {
  gap: 8px;
}

.app-menu-list {
  gap: 0 !important;
}

.app-menu-list .menu-row,
.app-menu-list .menu-row-primary,
#settingsBtn {
  min-height: 54px;
  border: 0 !important;
  border-bottom: 1px solid var(--theme-line) !important;
  border-radius: 0;
  background: var(--theme-surface) !important;
  color: var(--fog-ink) !important;
  box-shadow: none;
}

.app-menu-list .menu-row .menu-row-main,
.app-menu-list .menu-row .menu-chevron,
#settingsBtn .menu-row-main,
#settingsBtn .menu-chevron {
  color: var(--fog-ink) !important;
}

.app-menu-list .menu-row:active,
#settingsBtn:active {
  background: var(--fog-soft) !important;
}

.menu-section-label {
  margin: 12px 4px 0;
  color: #7b8c99;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.55px;
  text-transform: uppercase;
}

.filter-sheet {
  max-height: 78vh;
  max-height: 78dvh;
}

.filter-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.filter-section-heading .filter-label {
  margin-bottom: 0;
}

/* Map Filter compact-flow styling is owned by theme-status-and-map-filter.css. */

.inline-area-actions {
  display: flex;
  gap: 6px;
  margin: 0;
}

.inline-area-actions .small-filter-btn {
  height: 31px;
  padding: 0 9px;
  font-size: 11px;
}

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

.area-colour-button {
  width: 42px;
  min-height: 46px;
  padding: 0;
  border: 1px solid #d3dbe2;
  border-radius: 13px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
}

.area-colour-swatch {
  width: 25px;
  height: 25px;
  border: 3px solid white;
  border-radius: 8px;
  box-shadow: 0 0 0 1px rgba(52, 73, 90, 0.28);
}

.inline-colour-palette {
  grid-column: 1 / -1;
  margin: 1px 0 4px;
  padding: 10px;
  border: 1px solid #d7e0e7;
  border-radius: 14px;
  background: #f8fafb;
}

.colour-palette-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 7px;
  aspect-ratio: 1 / 1;
}

.colour-palette-choice {
  width: 100%;
  aspect-ratio: 1;
  min-height: 28px;
  padding: 0;
  border: 3px solid white;
  border-radius: 8px;
  box-shadow: 0 0 0 1px rgba(52, 73, 90, 0.2);
}

.colour-palette-choice.selected {
  box-shadow:
    0 0 0 2px #34495a,
    0 0 0 4px white;
}

.colour-palette-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 9px;
}

.colour-palette-default {
  height: 31px;
  padding: 0 10px;
  border: 1px solid #d3dbe2;
  border-radius: 9px;
  background: white;
  color: #526575;
  font-size: 11px;
  font-weight: 850;
}

.sticky-filter-actions {
  position: sticky;
  bottom: 0;
  padding-top: 10px;
  background: var(--bg);
}

.settings-row-main {
  min-width: 0;
  flex: 1 1 auto;
}

.settings-row-title {
  max-width: none;
}

.settings-logout-action {
  display: block;
  width: 100%;
  margin-top: 14px;
  text-align: center;
}

.settings-logout-action:not(.btn-danger) {
  min-height: 48px;
  border: 0;
  border-radius: 14px;
  background: var(--salesmap-ds-action-danger-bg);
  font-size: 16px;
  font-weight: 600;
  box-shadow: none;
}

/* Filled danger colours, including active, remain owned by Buttons. */

/* The old native colour inputs are no longer used. */
.area-color-list,
.settings-danger-row {
  display: none !important;
}


/* v2.11.72 final UI adjustments */
#modePill {
  background: rgba(15, 23, 42, 0.92) !important;
  color: #ffffff !important;
  border: 0 !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.24);
  font-size: 12px;
  font-weight: 800;
}

.gps-float-btn {
  background: rgba(15, 23, 42, 0.92) !important;
  color: #ffffff !important;
  border: 0 !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.24);
  font-size: 27px !important;
  line-height: 1;
}

.menu-section-label {
  margin-top: 14px;
}

.settings-cycle-row {
  width: 100%;
  cursor: pointer;
}

.settings-cycle-value {
  min-width: 0;
  max-width: 58%;
  flex: 0 1 auto;
  white-space: normal;
  overflow-wrap: anywhere;
}

.settings-cycle-value:not(.small-filter-btn) {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--theme-muted);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  text-align: right;
}

.settings-cycle-value.small-filter-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

.area-colour-button {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.area-colour-swatch {
  width: 27px;
  height: 27px;
  border-radius: 7px;
}

.inline-colour-palette {
  padding: 0;
  border: 0;
  background: transparent;
}

.colour-palette-grid {
  grid-template-columns: repeat(8, 1fr);
  gap: 0;
  aspect-ratio: auto;
  padding: 4px;
  border-radius: 18px;
  background: #f7f7f7;
}

.colour-palette-choice {
  position: relative;
  width: 100%;
  min-height: 0;
  aspect-ratio: 1;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  clip-path: polygon(
    25% 6.7%,
    75% 6.7%,
    100% 50%,
    75% 93.3%,
    25% 93.3%,
    0% 50%
  );
  transform: scale(1.08);
}

.colour-palette-choice:nth-child(16n + 9),
.colour-palette-choice:nth-child(16n + 10),
.colour-palette-choice:nth-child(16n + 11),
.colour-palette-choice:nth-child(16n + 12),
.colour-palette-choice:nth-child(16n + 13),
.colour-palette-choice:nth-child(16n + 14),
.colour-palette-choice:nth-child(16n + 15),
.colour-palette-choice:nth-child(16n + 16) {
  transform: translateX(50%) scale(1.08);
}

.colour-palette-choice.selected {
  filter: brightness(1.08);
  outline: 3px solid #111827;
  outline-offset: -3px;
  z-index: 2;
}

.colour-palette-footer {
  margin-top: 6px;
}

.modal-lock-sheet {
  z-index: 1200;
}


/* v2.11.73 UI adjustments */
.location-float-btn {
  position: fixed;
  right: 13px;
  top: calc(112px + var(--safe-top));
  z-index: 906;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(216,222,228,.96);
  border-radius: 999px;
  background: rgba(255,255,255,.96);
  color: #425466;
  box-shadow: 0 4px 12px rgba(52,73,90,.16);
  display: flex;
  align-items: center;
  justify-content: center;
}
.location-float-btn svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dsr-float-btn {
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.97) !important;
  color: #425466 !important;
  border: 1px solid rgba(216,222,228,.96) !important;
  box-shadow: 0 4px 12px rgba(52,73,90,.16) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 !important;
}
.dsr-float-btn svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#modePill {
  background: rgba(255,255,255,.94) !important;
  color: #6b7280 !important;
  border: 1px solid rgba(216,222,228,.96) !important;
  box-shadow: 0 3px 10px rgba(52,73,90,.12);
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

.menu-heading-label {
  margin: 4px 0 0 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .55px;
  text-transform: uppercase;
  color: #7b8c99 !important;
}

.inline-area-actions {
  min-width: 222px;
}
.inline-area-actions .small-filter-btn {
  flex: 1;
  white-space: nowrap;
  min-width: 104px;
  padding: 0 12px;
}

.area-colour-button {
  border: 1px solid var(--salesmap-ds-color-primary) !important;
  background: var(--salesmap-ds-color-surface) !important;
  box-shadow: var(--salesmap-ds-elevation-card) !important;
}
.area-colour-swatch {
  width: 27px;
  height: 27px;
  border-radius: 7px;
}

.palette-sheet {
  max-height: 72vh;
}
.hex-palette-shell {
  padding: 8px 2px 20px;
}
.hex-palette-grid {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 0;
  padding: 4px 12px 24px;
}
.hex-colour-choice {
  width: 100%;
  aspect-ratio: 1;
  border: 0;
  padding: 0;
  background: var(--hex-colour);
  clip-path: polygon(25% 6.7%,75% 6.7%,100% 50%,75% 93.3%,25% 93.3%,0% 50%);
  transform: scale(1.13);
}
.hex-colour-choice:nth-child(16n + 9),
.hex-colour-choice:nth-child(16n + 10),
.hex-colour-choice:nth-child(16n + 11),
.hex-colour-choice:nth-child(16n + 12),
.hex-colour-choice:nth-child(16n + 13),
.hex-colour-choice:nth-child(16n + 14),
.hex-colour-choice:nth-child(16n + 15),
.hex-colour-choice:nth-child(16n + 16) {
  transform: translateX(50%) scale(1.13);
}
.hex-colour-choice.selected {
  filter: brightness(1.08);
  box-shadow: inset 0 0 0 3px white;
}

.copyable-phone {
  cursor: copy;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.location-method-card {
  padding: 12px;
  border: 0;
  border-radius: 16px;
  background: var(--theme-surface-soft);
}
.location-method-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 8px 0 10px;
}
.location-method-btn {
  min-height: 40px;
  border: 1px solid #d5dde4;
  border-radius: 12px;
  background: white;
  color: #425466;
  font-size: 13px;
  font-weight: 800;
}
.location-link-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: stretch;
}
.location-link-row .google-link-input {
  min-height: 44px;
  height: 44px;
  resize: none;
}
.unified-location-value {
  margin-top: 9px;
  padding: 9px 10px;
  border-radius: 10px;
  background: white;
  border: 1px solid #e2e8f0;
}


/* v2.11.74 final UI fixes */
.card-edit-btn {
  height: 36px !important;
  min-width: 58px;
  padding: 0 14px !important;
  font-size: 13px !important;
  border-radius: 999px;
}

.phone-value-row {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.phone-links {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

.phone-copy-btn {
  flex: 0 0 auto;
  width: 31px;
  height: 31px;
  padding: 0;
  border: 1px solid #d8dee4;
  border-radius: 9px;
  background: #f8fafc;
  color: #526575;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.phone-copy-btn svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dsr-float-btn {
  bottom: calc(62px + var(--safe-bottom)) !important;
}

#menuSheet .sheet-header {
  margin-bottom: 15px;
}

#menuSheet .menu-heading-label {
  margin-top: 9px !important;
}

.hex-palette-shell {
  display: flex;
  justify-content: center;
  padding: 10px 6px 24px;
}

.hex-palette-grid {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: min(92vw, 430px);
  padding: 0 !important;
}

.hex-palette-row {
  display: flex;
  justify-content: center;
  gap: 0;
  height: clamp(37px, 9.5vw, 47px);
}

.hex-colour-choice {
  width: clamp(42px, 11vw, 54px) !important;
  height: clamp(42px, 11vw, 54px) !important;
  flex: 0 0 auto;
  aspect-ratio: 1;
  margin-left: -3px;
  border: 0;
  padding: 0;
  background: var(--hex-colour);
  clip-path: polygon(
    25% 6.7%,
    75% 6.7%,
    100% 50%,
    75% 93.3%,
    25% 93.3%,
    0% 50%
  );
  transform: none !important;
}

.hex-palette-row:nth-child(even) {
  transform: translateX(0);
}

.hex-colour-choice.selected {
  filter: brightness(1.08);
  outline: 3px solid #111827;
  outline-offset: -4px;
  z-index: 2;
}

#settingsSheet.modal-lock-sheet {
  z-index: 1000;
}


/* v2.11.75 logout confirmation layering */
.message-sheet {
  z-index: 1500 !important;
}

/* H6B themed text input uses the existing message-sheet component rather than native prompt(). */
.message-input-field {
  display: grid;
  gap: 6px;
  margin-top: 10px;
  color: var(--theme-muted);
  font-size: 13px;
  font-weight: 850;
}

.message-input-field[hidden] {
  display: none;
}

.message-input-field input {
  width: 100%;
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid var(--theme-line);
  border-radius: 12px;
  background: var(--theme-surface);
  color: var(--theme-ink);
  padding: 9px 11px;
  font: inherit;
  outline: none;
}

.message-input-field input:focus {
  border-color: var(--theme-primary);
  box-shadow: 0 0 0 3px var(--theme-focus-ring);
}

#messageSheet.open {
  z-index: 1500 !important;
}

#settingsSheet {
  z-index: 1000 !important;
}

#areaPaletteSheet {
  z-index: 1100 !important;
}


/* v2.11.76 backdrop and Add Customer interaction fixes */
.sheet-backdrop.open {
  display: block;
  pointer-events: auto !important;
  touch-action: none;
  z-index: 899;
}

.bottom-sheet.open {
  z-index: 900;
}

#settingsSheet.open {
  z-index: 900 !important;
}

.location-method-btn {
  position: relative;
  z-index: 1;
  pointer-events: auto;
}


/* v2.11.78 picker and startup state */
.role-pending {
  visibility: hidden !important;
}

.hidden-native-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

.custom-select-button {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
  cursor: pointer;
}


/* v2.11.81 unified dropdowns, multi-Salesperson filter, gradient palette */
.filter-select-chevron {
  display: none !important;
}

/* Native single-select anatomy is owned by components/forms.css. */

/* Themed buttons use one drawn arrow; disable inherited background arrows. */
button.custom-select-button {
  background-image: none !important;
  padding-right: 14px !important;
}

button.custom-select-button::after {
  content: "";
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin-left: auto;
  border-right: 2px solid var(--salesmap-ds-control-placeholder);
  border-bottom: 2px solid var(--salesmap-ds-control-placeholder);
  transform: rotate(45deg) translateY(-2px);
  transform-origin: center;
}

button.custom-select-button:disabled::after {
  opacity: 0.45;
}

.custom-select-bulk-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}

.custom-select-bulk-actions[hidden] {
  display: none !important;
}

#spFilterPickerBtn {
  min-height: 46px;
  width: 100%;
}

#spFilterPickerText {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Continuous colour field built inside the WebView. */
.gradient-palette-shell {
  padding: 8px 2px 4px;
}

.area-gradient-picker {
  position: relative;
  width: 100%;
  height: min(58vw, 260px);
  min-height: 190px;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid #d7e0e7;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.32),
    0 8px 20px rgba(52,73,90,0.10);
  background:
    linear-gradient(
      to bottom,
      rgba(128,128,128,0) 0%,
      rgba(128,128,128,0.10) 45%,
      #808080 100%
    ),
    linear-gradient(
      to right,
      #ff0000 0%,
      #ffff00 16.666%,
      #00ff00 33.333%,
      #00ffff 50%,
      #0000ff 66.666%,
      #ff00ff 83.333%,
      #ff0000 100%
    );
  touch-action: none;
  cursor: crosshair;
}

.area-gradient-cursor {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 3px solid #ffffff;
  box-shadow:
    0 0 0 1px rgba(15,23,42,0.75),
    0 3px 9px rgba(15,23,42,0.32);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.gradient-palette-preview-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  margin-top: 10px;
  padding: 8px 10px;
  border: 1px solid #e1e7ec;
  border-radius: 14px;
  background: #f8fafc;
}

.gradient-palette-preview {
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  border-radius: 9px;
  border: 1px solid rgba(15,23,42,0.18);
  background: #7c8a96;
}

.gradient-palette-value {
  color: #526775;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.4px;
}

/* Edit location now matches Add Customer. */
#editSheet .location-method-card {
  margin-top: 12px;
}

#editSheet .location-method-btn:disabled,
#editSheet .google-link-find-btn:disabled {
  opacity: 0.48;
}

/* DSR Summary cards now share the report visual hierarchy. */
.manager-summary-row.dsr-card {
  width: 100%;
  margin: 0;
  padding: 14px;
  text-align: left;
  border-radius: 17px;
  border-width: 1px;
  box-shadow: 0 7px 18px rgba(52,73,90,0.075);
}

.manager-summary-row.uploaded {
  border-left: 5px solid #58a673;
}

.manager-summary-row.pending {
  border-left: 5px solid #d98c36;
  background: #fffdf9;
}

.manager-summary-row.empty {
  border-left: 5px solid #94a3b8;
  background: #f8fafc;
  opacity: 1;
}

.manager-summary-row .dsr-timeline {
  margin-top: 10px;
}

.manager-summary-row .dsr-amount-panel {
  margin-top: 9px;
}

.manager-summary-grid-prominent {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.manager-summary-grid-prominent div {
  background: #eef3f6;
  border-color: #dbe4ea;
}

.manager-summary-grid-prominent b {
  font-size: 13px;
}

.manager-overview-card {
  background: #ffffff;
  border-radius: 15px;
  box-shadow: 0 5px 14px rgba(52,73,90,0.06);
}

@media (max-width: 430px) {
  .manager-summary-grid-prominent {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* v2.11.82 modal UX, Settings tools and form polish */
.sheet-backdrop.open {
  display: block !important;
  z-index: 1990 !important;
  pointer-events: auto !important;
  touch-action: none !important;
}

.bottom-sheet.open,
#settingsSheet.open,
#areaPaletteSheet.open {
  z-index: 2000 !important;
}

#messageSheet.open {
  z-index: 2100 !important;
}

body.sheet-open .top-panel,
body.sheet-open .notification-float-btn,
body.sheet-open .location-float-btn,
body.sheet-open .map-quick-controls,
body.sheet-open .dsr-float-btn,
body.sheet-open #modePill {
  pointer-events: none !important;
}

.settings-action-section,
.settings-test-section {
  display: grid;
  gap: 9px;
}

.settings-neutral-action {
  width: 100%;
}

.settings-neutral-action:not(.small-filter-btn),
.settings-test-action,
.settings-clear-test-action {
  min-height: 46px;
  border-radius: 13px;
  font-size: 14px;
  font-weight: 900;
}

.settings-neutral-action:not(.btn-light) {
  border: 0;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
}

.settings-test-section {
  border-style: dashed;
  background: #fffaf0;
}

.settings-test-label {
  text-transform: uppercase;
}

.settings-test-action {
  border: 0;
  background: color-mix(in srgb, var(--salesmap-ds-color-warning) 14%, var(--theme-surface));
  color: var(--salesmap-ds-color-warning);
}

.settings-clear-test-action {
  border: 0;
  background: var(--salesmap-ds-action-danger-soft);
  color: var(--salesmap-ds-color-danger);
}

.status-toggle-btn:not(.non-active) {
  border-color: var(--salesmap-ds-color-success) !important;
  background: var(--salesmap-ds-color-success) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
  box-shadow: 0 4px 10px rgba(30, 133, 73, 0.22);
}

.status-toggle-btn.non-active {
  box-shadow: none;
}

.card-edit-btn {
  border-color: #4e7fa8 !important;
  background: #527fa3 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 10px rgba(55, 96, 130, 0.24);
}

.card-edit-btn:active {
  background: #3f6e94 !important;
  transform: translateY(1px);
}


/* v2.11.83 driver identity + confirmation stack */
.bottom-sheet:not(.open) {
  pointer-events: none !important;
}

.bottom-sheet.open {
  pointer-events: auto !important;
}


/* v2.11.85 GPS resilience */
.gps-sampling-status {
  margin-top: 8px;
  padding: 9px 11px;
  border-radius: 11px;
  background: #eef3f6;
  color: #526775;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}

.gps-override-box {
  margin-top: 10px;
  padding: 12px;
  border: 1px solid #e5a35e;
  border-radius: 14px;
  background: #fff8ef;
}

.gps-override-box[hidden] {
  display: none !important;
}

.gps-override-title {
  color: #9a4f11;
  font-size: 14px;
  font-weight: 950;
}

.gps-override-note {
  margin: 4px 0 9px;
  color: #8a623f;
  font-size: 12px;
  line-height: 1.35;
}


/* v2.11.86 menu alignment and driver mode */
:is(#menuSheet, #settingsSheet) .menu-section-label {
  box-sizing: border-box;
  width: 100%;
  margin-left: 0 !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  text-align: left;
}

body.driver-mode #dsrFloatBtn,
body.driver-mode #mapFilterQuickBtn,
body.driver-mode #mapLabelModeBtn,
body.driver-mode .notification-float-btn {
  display: none !important;
}

body.driver-mode #menuSheet .menu-section-label,
body.driver-mode #menuSheet #dsrBtn,
body.driver-mode #menuSheet #dsrHistoryMenuBtn,
body.driver-mode #menuSheet #dsrDailySummaryBtn,
body.driver-mode #menuSheet #addCustomerBtn,
body.driver-mode #menuSheet #exportChangesBtn,
body.driver-mode #menuSheet #notificationsBtn,
body.driver-mode #menuSheet #menuFilterBtn {
  display: none !important;
}

/* Driver Settings visibility is owned by configureWorkspaceMenu(); keep this bundle slot as a no-op. */

body.driver-mode #settingsTestToolsSection,
body.driver-mode #fakeDsrToolsGroup,
body.driver-mode #supportLocationToolsGroup,
body.driver-mode #generateFakeDataBtn,
body.driver-mode #clearFakeDataBtn,
body.driver-mode #supportLocationToggleBtn {
  display: none !important;
}


/* v2.11.88 account-scoped settings + SV DSR summary table */
.dsr-viewer-picker-btn {
  width: 100%;
  min-height: 42px;
}

.manager-summary-table-wrap {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #dce4ea;
  border-radius: 15px;
  background: #ffffff;
}

.manager-summary-table {
  min-width: 980px;
}

.manager-summary-table-head,
.manager-summary-table-row {
  display: grid;
  grid-template-columns:
    90px 92px 92px 120px 120px 82px 78px 110px 96px;
  align-items: center;
}

.manager-summary-table-head {
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: 44px;
  background: #e8eef2;
  color: #405563;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: 0.25px;
  text-transform: uppercase;
}

.manager-summary-table-head span,
.manager-summary-table-row .summary-cell {
  padding: 10px 9px;
  border-right: 1px solid #e4eaee;
}

.manager-summary-table-head span:last-child,
.manager-summary-table-row .summary-cell:last-child {
  border-right: 0;
}

.manager-summary-table-row {
  width: 100%;
  min-height: 52px;
  border: 0;
  border-top: 1px solid #e7ecef;
  background: #ffffff;
  color: #263845;
  text-align: left;
}

.manager-summary-table-row:nth-child(even) {
  background: #f8fafb;
}

.manager-summary-table-row:active {
  background: #eaf2f7;
}

.summary-cell {
  min-width: 0;
  font-size: 12px;
  font-weight: 750;
}

.summary-cell.summary-sp {
  color: #315f7d;
  font-size: 13px;
  font-weight: 950;
}

.summary-cell.summary-money {
  font-variant-numeric: tabular-nums;
}

.summary-cell.summary-status {
  color: #526775;
  font-weight: 900;
}


/* v2.11.89 Customer Management */
.customer-management-sheet {
  padding-bottom: 108px;
}

.customer-management-header {
  margin-bottom: 8px;
}

.customer-management-search-row {
  margin-bottom: 10px;
}

.customer-management-search {
  width: 100%;
}

.customer-management-filter-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
  margin-bottom: 10px;
}

.customer-management-select-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.customer-management-list {
  display: grid;
  gap: 8px;
}

.customer-management-card {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 9px;
  width: 100%;
  padding: 11px;
  border: 1px solid #dce4e8;
  border-radius: 14px;
  background: #ffffff;
  color: #273944;
  text-align: left;
}

.customer-management-card.selected {
  border-color: #64869a;
  background: #edf4f7;
  box-shadow: 0 0 0 2px rgba(100, 134, 154, 0.14);
}

.customer-management-checkbox {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 2px solid #9cabb3;
  border-radius: 7px;
  background: #ffffff;
  color: #456f86;
  font-size: 15px;
  font-weight: 1000;
}

.customer-management-card.selected
.customer-management-checkbox {
  border-color: #64869a;
  background: #dbeaf0;
}

.customer-management-card-content {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.customer-management-code-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.customer-management-code-row b {
  min-width: 0;
  overflow: hidden;
  color: #315f78;
  font-size: 14px;
  font-weight: 1000;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-management-status {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 950;
}

.customer-management-status.active {
  background: #d8f5df;
  color: #16733a;
}

.customer-management-status.inactive {
  background: #e9ecef;
  color: #46515a;
}

.customer-management-name {
  overflow: hidden;
  font-size: 13px;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-management-meta,
.customer-management-contact {
  overflow: hidden;
  color: #687982;
  font-size: 11px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-management-bulk-bar {
  position: sticky;
  bottom: 0;
  z-index: 4;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid #cddbe2;
  border-radius: 15px;
  background: rgba(246, 249, 250, 0.97);
  box-shadow: 0 -5px 18px rgba(38, 58, 70, 0.1);
  backdrop-filter: blur(12px);
}

.customer-management-bulk-bar[hidden] {
  display: none !important;
}

.customer-management-bulk-count {
  margin-bottom: 8px;
  color: #405762;
  font-size: 12px;
}

.customer-management-bulk-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.customer-management-bulk-btn {
  min-height: 42px;
  padding: 8px 7px;
  border: 0;
  border-radius: 11px;
  background: #dfe9ed;
  color: #345565;
  font-size: 11px;
  font-weight: 950;
}

.customer-bulk-preview {
  margin: 12px 0;
  padding: 13px;
  border: 1px solid #dce4e8;
  border-radius: 14px;
  background: #f8fafb;
}

.customer-bulk-preview-title {
  margin-bottom: 5px;
  color: #385666;
  font-size: 12px;
  font-weight: 1000;
}

.customer-bulk-preview-summary {
  margin-bottom: 7px;
  color: #273944;
  font-size: 13px;
  font-weight: 900;
}

.customer-bulk-preview-codes {
  color: #687982;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.45;
}

/* Summary UI remains card-based. The horizontal table is PDF-only. */
.manager-summary-list {
  display: grid;
  gap: 12px;
}

#dsrDailySummarySheet .manager-summary-table-wrap,
#dsrDailySummarySheet .manager-summary-table {
  display: none;
}


/* v2.11.90 Customer Management Phase 2 */
.customer-management-filter-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-management-card {
  grid-template-columns: 28px minmax(0, 1fr) 48px;
  align-items: center;
}

.customer-management-card-content {
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}

.customer-management-view-btn {
  min-height: 38px;
  padding: 7px 6px;
  border: 0;
  border-radius: 10px;
  background: #e4edf1;
  color: #365d70;
  font-size: 10px;
  font-weight: 950;
}

.customer-management-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-height: 15px;
}

.customer-management-flags span {
  padding: 2px 6px;
  border-radius: 999px;
  background: #e9eff2;
  color: #526874;
  font-size: 9px;
  font-weight: 900;
}

.customer-management-flags span.warning {
  background: #fff0d9;
  color: #9a5a13;
}

.customer-management-load-more {
  width: 100%;
  min-height: 44px;
  margin-top: 10px;
  border: 1px solid #cbd9df;
  border-radius: 13px;
  background: #f2f6f8;
  color: #426276;
  font-size: 12px;
  font-weight: 950;
}

.customer-management-load-more[hidden] {
  display: none !important;
}

.customer-bulk-new-area-wrap {
  margin-top: 11px;
  padding: 11px;
  border: 1px dashed #bfcdd4;
  border-radius: 13px;
  background: #f7fafb;
}

.customer-bulk-new-area-wrap[hidden] {
  display: none !important;
}

.customer-bulk-or-text {
  margin-bottom: 7px;
  color: #637681;
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: 0.35px;
}

.customer-bulk-area-help {
  margin-top: 7px;
  color: #71818a;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.4;
}

@media (max-width: 390px) {
  .customer-management-filter-grid {
    grid-template-columns: 1fr;
  }

  .customer-management-bulk-actions {
    grid-template-columns: 1fr;
  }
}




/* v2.13.5.5 top pills + quick cluster button */
.status-pill,
.mode-pill {
  min-height: 32px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
}

.map-quick-controls .map-cluster-quick-btn {
  position: static;
  pointer-events: auto;
}

.map-cluster-quick-btn {
  height: 28px;
  min-width: 84px;
  padding: 0 11px;
  border: 1px solid rgba(209, 213, 219, 0.95);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.14);
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  line-height: 26px;
  text-align: center;
  cursor: pointer;
  pointer-events: auto;
}

html[data-app-theme] .map-cluster-quick-btn {
  color: var(--salesmap-ds-action-secondary-text) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  border-color: transparent !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-app-theme] .map-cluster-quick-btn.active {
  color: #ffffff !important;
  background: var(--theme-primary) !important;
  border-color: transparent !important;
}
/* v2.11.91 Customer / Area Management Phase 3 */
.customer-bulk-operation-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  padding: 11px;
  border: 1px solid #d4e0e5;
  border-radius: 14px;
  background: #f1f6f8;
}

.customer-bulk-operation-panel[hidden] {
  display: none !important;
}

.customer-bulk-operation-label {
  color: #66808e;
  font-size: 9px;
  font-weight: 1000;
  letter-spacing: 0.4px;
}

.customer-bulk-operation-title {
  margin-top: 2px;
  color: #334e5d;
  font-size: 12px;
  font-weight: 950;
}

.customer-bulk-operation-meta {
  margin-top: 2px;
  color: #73848d;
  font-size: 10px;
  font-weight: 700;
}

.customer-bulk-undo-btn {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 8px 12px;
  border: 0;
  border-radius: 10px;
  background: #eadfdb;
  color: #824d42;
  font-size: 11px;
  font-weight: 950;
}

.area-management-sheet {
  padding-bottom: 24px;
}

.area-create-guide-btn {
  width: 100%;
  min-height: 44px;
  margin: 10px 0 7px;
  border: 1px dashed #9eb4bf;
  border-radius: 13px;
  background: #f1f6f8;
  color: #3f687c;
  font-size: 12px;
  font-weight: 950;
}

.area-management-help {
  margin-bottom: 11px;
  color: #71818a;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.45;
}

.area-management-list {
  display: grid;
  gap: 10px;
}

.area-management-card {
  padding: 12px;
  border: 0;
  border-radius: 15px;
  background: var(--theme-surface);
}

.area-management-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.area-management-name {
  color: #315d73;
  font-size: 14px;
  font-weight: 1000;
}

.area-management-sp {
  margin-top: 3px;
  color: #70818a;
  font-size: 10px;
  font-weight: 750;
}

.area-management-total {
  display: grid;
  place-items: center;
  min-width: 38px;
  height: 30px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e4eef2;
  color: #3f6678;
  font-size: 12px;
  font-weight: 1000;
}

.area-management-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin: 10px 0;
}

.area-management-stats span {
  padding: 8px;
  border-radius: 10px;
  background: #f5f8f9;
  color: #6c7d86;
  font-size: 9px;
  font-weight: 800;
}

.area-management-stats b {
  display: block;
  margin-top: 2px;
  color: #304b59;
  font-size: 13px;
}

.area-management-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.area-management-actions button {
  min-height: 38px;
  padding: 7px 5px;
  border: 0;
  border-radius: 10px;
  background: #e5edf1;
  color: #385d6f;
  font-size: 10px;
  font-weight: 950;
}


/* v2.11.92 Database Control */
.database-control-sheet {
  padding-bottom: 34px;
}

.database-control-overview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.database-control-overview > div {
  min-width: 0;
  padding: 11px;
  border: 1px solid #dce4e8;
  border-radius: 13px;
  background: #f8fafb;
}

.database-control-overview span {
  display: block;
  margin-bottom: 4px;
  color: #71818a;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.35px;
  text-transform: uppercase;
}

.database-control-overview b {
  display: block;
  overflow: hidden;
  color: #304f60;
  font-size: 14px;
  font-weight: 1000;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.database-control-warning {
  margin-top: 10px;
  padding: 10px 11px;
  border: 1px solid #efcf9e;
  border-radius: 12px;
  background: #fff7e9;
  color: #835b21;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.4;
}

.database-control-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}

.database-control-primary,
.database-control-secondary {
  min-height: 44px;
  padding: 9px;
  border: 0;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 950;
}

.database-control-primary {
  background: #627f91;
  color: #ffffff;
}

.database-control-secondary {
  background: #e3ebef;
  color: #35586a;
}

.database-control-section-title {
  margin: 17px 0 8px;
  color: #405d6c;
  font-size: 12px;
  font-weight: 1000;
  letter-spacing: 0.2px;
}

.database-snapshot-list,
.database-audit-list {
  display: grid;
  gap: 8px;
}

.database-snapshot-card,
.database-audit-card {
  padding: 11px;
  border: 1px solid #dbe3e7;
  border-radius: 13px;
  background: #ffffff;
}

.database-snapshot-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.database-snapshot-title,
.database-audit-title {
  color: #304f60;
  font-size: 12px;
  font-weight: 1000;
}

.database-snapshot-meta,
.database-audit-meta {
  margin-top: 4px;
  color: #75848c;
  font-size: 9px;
  font-weight: 750;
}

.database-snapshot-count {
  display: grid;
  place-items: center;
  min-width: 30px;
  height: 30px;
  border-radius: 999px;
  background: #e5eef2;
  color: #3d6174;
  font-size: 11px;
  font-weight: 1000;
}

.database-snapshot-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-top: 10px;
}

.database-snapshot-actions button {
  min-height: 38px;
  border: 0;
  border-radius: 10px;
  background: #e4edf1;
  color: #355b6e;
  font-size: 10px;
  font-weight: 950;
}

.database-snapshot-actions button.danger {
  background: #f5e4e2;
  color: #9a433d;
}

.database-audit-detail {
  margin-top: 4px;
  color: #5f717b;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.35;
}

@media (max-width: 380px) {
  .database-control-actions {
    grid-template-columns: 1fr;
  }
}


/* v2.11.93 role workspaces */
.admin-float-btn {
  position: fixed;
  right: 12px;
  bottom: calc(112px + var(--safe-bottom));
  z-index: 836;
  display: none;
  width: 54px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(229, 231, 235, 0.96);
  border-radius: 999px;
  background: #536f80;
  color: #ffffff;
  box-shadow: 0 5px 18px rgba(0, 0, 0, 0.18);
}

.admin-float-btn svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}

body.admin-mode #dsrFloatBtn,
body.admin-mode #dsrCheckInBtn {
  display: none !important;
}

body.admin-mode #adminFloatBtn {
  display: grid !important;
  place-items: center;
}

body.driver-mode #adminFloatBtn {
  display: none !important;
}

.admin-dashboard-overview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.admin-dashboard-overview > div {
  min-width: 0;
  padding: 11px;
  border: 1px solid #dce5e9;
  border-radius: 13px;
  background: #f7fafb;
}

.admin-dashboard-overview span {
  display: block;
  margin-bottom: 4px;
  color: #71828c;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.35px;
  text-transform: uppercase;
}

.admin-dashboard-overview b {
  display: block;
  overflow: hidden;
  color: #304f60;
  font-size: 15px;
  font-weight: 1000;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-dashboard-section-title {
  margin: 16px 0 8px;
  color: #405e6d;
  font-size: 12px;
  font-weight: 1000;
  letter-spacing: 0.2px;
}

.admin-dashboard-actions {
  display: grid;
  gap: 8px;
}

.admin-dashboard-actions button {
  display: grid;
  gap: 3px;
  width: 100%;
  min-height: 58px;
  padding: 11px 13px;
  border: 1px solid #dbe4e8;
  border-radius: 14px;
  background: #ffffff;
  color: #304f60;
  text-align: left;
}

.admin-dashboard-actions b {
  font-size: 13px;
  font-weight: 1000;
}

.admin-dashboard-actions span {
  color: #6c7f89;
  font-size: 10px;
  font-weight: 750;
}

.user-management-note {
  margin-bottom: 11px;
  padding: 10px 11px;
  border: 1px solid #ead3a8;
  border-radius: 12px;
  background: #fff8ec;
  color: #795b2a;
  font-size: 10px;
  font-weight: 750;
  line-height: 1.4;
}

body.admin-mode #menuSheet .menu-heading-label {
  color: #536f80;
}

body.admin-mode #menuSheet #dsrDailySummaryBtn {
  border-color: #ccdce4 !important;
  background: #f4f8fa !important;
}


/* v2.11.96 separated Fake DSR and Support Location tools */
.settings-test-group {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
  border: 0;
  border-radius: 13px;
  background: var(--theme-surface-soft);
}

.settings-test-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.settings-test-group-head span {
  color: #435e6c;
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: 0.35px;
}

.settings-test-group-head small {
  color: #74838b;
  font-size: 9px;
  font-weight: 800;
  text-align: right;
}

.settings-support-location-action {
  min-height: 43px;
  border: 0;
  border-radius: 12px;
  background: #dfe9ee;
  color: #34586b;
  font-size: 12px;
  font-weight: 950;
}

.settings-support-location-action.enabled {
  background: #f2dfb8;
  color: #79531c;
  box-shadow: inset 0 0 0 1px rgba(151, 103, 33, 0.18);
}

.settings-test-help {
  color: #70808a;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.45;
}


/* v2.11.97 Include Today + driver Test Tools cleanup */
.settings-test-checkbox-row {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 9px;
  padding: 9px 10px;
  border: 1px solid #e4d4af;
  border-radius: 11px;
  background: #fffdf7;
  cursor: pointer;
}

.settings-test-checkbox-row input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.settings-test-checkbox-box {
  position: relative;
  display: block;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  border: 2px solid #ae8d4d;
  border-radius: 6px;
  background: #ffffff;
}

.settings-test-checkbox-row input:checked
+ .settings-test-checkbox-box {
  border-color: #9b6c18;
  background: #dcae4b;
}

.settings-test-checkbox-row input:checked
+ .settings-test-checkbox-box::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.settings-test-checkbox-copy {
  display: grid;
  gap: 2px;
}

.settings-test-checkbox-copy b {
  color: #5f491c;
  font-size: 11px;
  font-weight: 950;
}

.settings-test-checkbox-copy small {
  color: #806b43;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.35;
}


/* v2.12.02 clean rebuild — no keyboard/viewport experiments */
.status-cycle-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  text-align: left;
}
.status-cycle-button small {
  color: currentColor;
  font-size: 9px;
  font-weight: 800;
  opacity: 0.68;
}
.status-cycle-button.status-all {
  border-color: #d2dbe0;
  background: #f5f7f8;
  color: #526773;
}
.status-cycle-button.status-active {
  border-color: #b8d4c3;
  background: #edf7f0;
  color: #397052;
}
.status-cycle-button.status-inactive {
  border-color: #d7c2c0;
  background: #f7eeee;
  color: #87504c;
}

.customer-card-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.customer-card-heading {
  flex: 1 1 auto;
  min-width: 0;
}
.card-edit-btn {
  margin-left: auto;
}

.dsr-checkout-code {
  margin-top: 9px;
  color: #64748b;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: 0.35px;
}
.dsr-edit-time-grid {
  display: grid;
  grid-template-columns: 1.25fr 1fr 1fr;
  gap: 8px;
  margin: 10px 0 4px;
}
.dsr-edit-time-grid[hidden] {
  display: none !important;
}
.dsr-edit-time-card {
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid #dde4e8;
  border-radius: 12px;
  background: #f7f9fa;
}
.dsr-edit-time-card span {
  display: block;
  margin-bottom: 3px;
  color: #73828a;
  font-size: 9px;
  font-weight: 950;
  text-transform: uppercase;
}
.dsr-edit-time-card b {
  display: block;
  overflow: hidden;
  color: #334b59;
  font-size: 12px;
  font-weight: 1000;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#menuDsrBadge {
  pointer-events: none;
}


/* v2.12.03 Android WebView repaint fix
   Bottom-sheet content must stay painted while the keyboard is open. */
.bottom-sheet,
.bottom-sheet.open {
  content-visibility: visible !important;
  contain: none !important;
  backface-visibility: visible !important;
  will-change: auto !important;
}

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Shared Check-Out / Edit DSR visit-record card. */
.dsr-shared-sheet-header {
  margin-bottom: 10px;
}

.dsr-editor-record-card {
  padding: 14px;
  border: 1px solid #d9e0df;
  border-left: 7px solid #7f9e91;
  border-radius: 18px;
  background: #fbfaf6;
}

.dsr-editor-record-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.dsr-editor-code-pill,
.dsr-editor-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 13px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 1000;
}

.dsr-editor-code-pill {
  max-width: 70%;
  overflow: hidden;
  background: #e7eeeb;
  color: #294239;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dsr-editor-status-pill.done {
  background: #e6f0e9;
  color: #315d43;
}

.dsr-editor-status-pill.open {
  background: #fff1dd;
  color: #9a5a12;
}

.dsr-editor-company {
  margin-top: 12px;
  color: #17212b;
  font-size: 17px;
  font-weight: 1000;
  line-height: 1.25;
}

.dsr-editor-date {
  margin-top: 5px;
  color: #72808b;
  font-size: 11px;
  font-weight: 850;
}

.dsr-editor-timeline {
  display: grid;
  grid-template-columns: 1fr 34px 1fr;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid #d4dce2;
  border-radius: 16px;
  background: #ffffff;
}

.dsr-editor-time-block span {
  display: block;
  color: #697684;
  font-size: 10px;
  font-weight: 950;
}

.dsr-editor-time-block b {
  display: block;
  margin-top: 2px;
  color: #111827;
  font-size: 22px;
  font-weight: 1000;
}

.dsr-editor-time-arrow {
  color: #8ba0b1;
  font-size: 25px;
  font-weight: 1000;
  text-align: center;
}

#dsrGetCheckOutGpsBtn[hidden],
#deleteDsrCheckoutEditBtn[hidden] {
  display: none !important;
}

#dsrCheckOutGpsBox {
  margin-top: 12px;
}


/* v2.12.04 plain-sheet rendering
   Copy the stable main-search approach: no translated parent around inputs. */
.bottom-sheet {
  display: none !important;
  transform: none !important;
  transition: none !important;
  will-change: auto !important;
  backface-visibility: visible !important;
  contain: none !important;
  animation: none !important;
}

.bottom-sheet.open {
  display: block !important;
  transform: none !important;
}

.bottom-sheet.swipe-dragging {
  transform: none !important;
}

@media (min-width: 800px) {
  /* Keep legacy centered modal sheets, but let Browser-owned full workspaces define their responsive geometry. */
  .bottom-sheet:not(.desktop-fill-sheet) {
    left: 50% !important;
    right: auto !important;
    width: 520px !important;
    margin-left: -260px !important;
    transform: none !important;
  }

  .bottom-sheet.open:not(.desktop-fill-sheet) {
    transform: none !important;
  }
}

/* Compact, unified read-only form used by Check-Out and Edit DSR. */
.dsr-form-summary {
  display: grid;
  gap: 10px;
  margin: 8px 0 12px;
}

.dsr-form-readonly-row,
.dsr-form-readonly-field {
  border: 1px solid #d8e0e5;
  border-radius: 12px;
  background: #f8fafb;
}

.dsr-form-readonly-row {
  padding: 10px 12px;
}

.dsr-form-customer {
  display: grid;
  gap: 2px;
}

.dsr-form-customer b {
  color: #415765;
  font-size: 13px;
  font-weight: 950;
}

.dsr-form-customer span {
  color: #17212b;
  font-size: 14px;
  font-weight: 850;
  line-height: 1.25;
}

.dsr-form-readonly-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.dsr-form-readonly-field {
  padding: 9px 10px;
}

.dsr-form-readonly-field span {
  display: block;
  margin-bottom: 3px;
  color: #71808a;
  font-size: 10px;
  font-weight: 850;
}

.dsr-form-readonly-field b {
  display: block;
  color: #2e4350;
  font-size: 13px;
  font-weight: 950;
}

#dsrEditorStatusPill {
  color: #526f60;
}

/* Single-record delete keeps its behavior; visual Danger role is owned by the shared semantic action layer. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */

/* Map Filter-specific visual ownership is centralized in theme-status-and-map-filter.css. */


/* v2.12.05 DSR overnight, date limits, Settings and summary polish */

/* One card containing Today date plus four DSR metrics. */
#dsrSheet .dsr-summary-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid #d8dee4;
  border-radius: 15px;
  background: #eef1f3;
}

#dsrSheet .dsr-summary-item {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 10px 11px;
}

#dsrSheet .dsr-summary-item:nth-child(odd) {
  border-right: 1px solid #d8dee4;
}

#dsrSheet .dsr-summary-item:nth-child(-n + 2) {
  border-bottom: 1px solid #d8dee4;
}

/* DSR visit-record section heading. */
.dsr-record-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}


/* One muted DSR-card red family for delete actions. */
.btn-danger,
.settings-clear-test-action,
.draft-remove-btn,
.dsr-small-action.danger,
#confirmDsrDeleteBtn,
#deleteDsrRecordBtn {
  border-color: #dfc3bf !important;
  background: #f7ebea !important;
  color: #874d48 !important;
  box-shadow: none !important;
}

.btn-danger:active,
.settings-clear-test-action:active,
.draft-remove-btn:active,
.dsr-small-action.danger:active {
  background: #f1ddda !important;
}

/* Overnight resolution. */
.overnight-dsr-warning {
  padding: 11px 12px;
  border: 1px solid #e4c4bf;
  border-radius: 13px;
  background: #f8eeee;
  color: #7d4a45;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.4;
}

.overnight-dsr-note {
  margin-top: 8px;
  color: #6f7d86;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.4;
}

/* Today is the hard upper date boundary. */
.summary-date-btn:disabled,
.month-nav-btn:disabled,
.dsr-calendar-day:disabled {
  opacity: 0.34;
  cursor: default;
}

.dsr-calendar-day.future {
  border-color: transparent !important;
  background: transparent !important;
  color: #aeb7bf !important;
  box-shadow: none !important;
}

/* More intuitive History selection text. */
.dsr-history-range-label {
  min-height: 36px;
  padding: 9px 11px;
  border: 1px solid #d9e1e6;
  border-radius: 12px;
  background: #f7f9fa;
  color: #536674;
  font-size: 11px;
  font-weight: 850;
  line-height: 1.35;
}

/* SV History Back button. */
#dsrHistorySheet.from-summary
.hidden-history-bottom-close {
  grid-template-columns: 1fr !important;
  margin-top: 12px;
}

#dsrHistorySheet.from-summary
#closeDsrHistoryBottomBtn {
  width: 100%;
  min-height: 46px;
  border: 1px solid #bac9d4;
  border-radius: 13px;
  background: #eaf0f4;
  color: #405767;
  font-size: 14px;
  font-weight: 950;
}

/* Driver Settings only keeps Navigation app and Logout. */
body.driver-mode #dsrHighlightSettingRow,
body.driver-mode #resetSettingsSection {
  display: none !important;
}


/* v2.12.06 DSR layout, History Back and summary palette */

/* Explicit 2x2 DSR form layout:
   Date | Status
   Check In | Check Out */
#dsrCheckOutSheet .dsr-form-readonly-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-flow: row;
}

#dsrCheckOutSheet .dsr-form-readonly-field {
  min-width: 0;
}

/* Today summary uses the same warm palette as Visit Record cards. */
#dsrSheet .dsr-summary-grid {
  border-color: #d9d3ca !important;
  background: #fbfaf7 !important;
  box-shadow: 0 5px 15px rgba(51, 65, 85, 0.08);
}

#dsrSheet .dsr-summary-item {
  background: transparent !important;
}

#dsrSheet .dsr-summary-item:nth-child(odd) {
  border-right-color: #ded8cf !important;
}

#dsrSheet .dsr-summary-item:nth-child(-n + 2) {
  border-bottom-color: #ded8cf !important;
}

#dsrSheet .dsr-summary-label {
  color: #756f67;
}

#dsrSheet .dsr-summary-value {
  color: #2f4039;
}

#dsrSheet .dsr-summary-value.sales {
  color: #3f6a52;
}

#dsrSheet .dsr-summary-value.return {
  color: #8a5a4d;
}

/* Supervisor History always has a visible, styled bottom Back button. */
#dsrHistorySheet.supervisor-history
.hidden-history-bottom-close,
#dsrHistorySheet.from-summary
.hidden-history-bottom-close {
  display: flex !important;
  grid-template-columns: 1fr !important;
  margin-top: 12px;
}

#dsrHistorySheet.supervisor-history
#closeDsrHistoryBottomBtn,
#dsrHistorySheet.from-summary
#closeDsrHistoryBottomBtn {
  display: inline-flex !important;
  width: 100%;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid #bac9d4;
  border-radius: 13px;
  background: #eaf0f4;
  color: #405767;
  font-size: 14px;
  font-weight: 950;
}


/* v2.12.07 completed-DSR map filter */
.map-quick-controls .map-dsr-highlight-btn {
  position: static;
  pointer-events: auto;
}

.map-dsr-highlight-btn {
  height: 28px;
  min-width: 98px;
  padding: 0 10px;
  border: 0;
  /* Preserve the initial radius previously produced by the undefined variable. */
  border-radius: initial;
  background: var(--salesmap-ds-action-secondary-bg);
  box-shadow: none;
  color: var(--salesmap-ds-action-secondary-text);
  font-size: 11px;
  font-weight: var(--salesmap-ds-font-weight-semibold);
  line-height: 26px;
  text-align: center;
  white-space: nowrap;
}

.map-dsr-highlight-btn.active {
  border-color: #9fc4ad;
  background: rgba(229, 241, 233, 0.98);
  color: #315d43;
}

#dsrHighlightSettingRow,
#settingDsrHighlightToggle {
  display: none !important;
}

/* Explicit layout, backed up by JS DOM normalization:
   Date | Status
   Check In | Check Out */
#dsrCheckOutSheet .dsr-form-readonly-grid {
  grid-template-areas:
    "date status"
    "checkin checkout";
}

#dsrCheckOutSheet .dsr-date-field {
  grid-area: date;
}

#dsrCheckOutSheet .dsr-status-field {
  grid-area: status;
}

#dsrCheckOutSheet .dsr-checkin-field {
  grid-area: checkin;
}

#dsrCheckOutSheet .dsr-checkout-field {
  grid-area: checkout;
}

/* Team Summary overview uses the same single-card Visit Record palette. */
#dsrDailySummarySheet .manager-summary-overview {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
  border: 1px solid #d9d3ca;
  border-left: 5px solid #7d8f87;
  border-radius: 17px;
  background: #fbfaf7;
  box-shadow: 0 5px 15px rgba(51, 65, 85, 0.09);
}

#dsrDailySummarySheet .manager-overview-card {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  padding: 11px 10px;
}

#dsrDailySummarySheet
.manager-overview-card:nth-child(odd) {
  border-right: 1px solid #ded8cf;
}

#dsrDailySummarySheet
.manager-overview-card:nth-child(-n + 2) {
  border-bottom: 1px solid #ded8cf;
}

#dsrDailySummarySheet .manager-overview-label {
  color: #756f67;
}

#dsrDailySummarySheet .manager-overview-value {
  color: #2f4039;
}

#dsrDailySummarySheet
.manager-overview-card:nth-child(1)
.manager-overview-value {
  color: #3f6a52;
}

#dsrDailySummarySheet
.manager-overview-card:nth-child(3)
.manager-overview-value {
  color: #3f6a52;
}

#dsrDailySummarySheet
.manager-overview-card:nth-child(4)
.manager-overview-value {
  color: #8a5a4d;
}

/* Historical records are not LIVE. */
.manager-summary-row.historical {
  background: #fbfaf7;
  border-color: #d9d3ca;
  border-left-color: #8a918d;
}

.dsr-status-pill.history {
  background: #e8ece9;
  color: #4b5d54;
}


/* v2.12.08 Team Summary date focus */
.summary-selected-date-card {
  margin-top: 8px;
  padding: 10px 12px;
  border: 1px solid #b9c8bf;
  border-left: 5px solid #6f8f7a;
  border-radius: 14px;
  background: #f2f7f3;
}

.summary-selected-date-card > span {
  display: block;
  color: #68766f;
  font-size: 9px;
  font-weight: 950;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}
/* Retired selected-date card styles; the shared calendar owns Android Summary selection. */
/* Retired selected-date animation; the shared calendar paints selection state. */

@keyframes summaryDateChanged {
  0% {
    opacity: 0.25;
    transform: translateX(-5px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

#todayDsrSummaryBtn {
  border-color: #d7e0e7;
  background: #f7f9fb;
  color: #667784;
}

#todayDsrSummaryBtn.active-date {
  border-color: #91ad9b;
  background: #dfeae2;
  color: #315d43;
}

#prevDsrSummaryDateBtn,
#nextDsrSummaryDateBtn {
  border-color: #aebdc7;
  background: #eaf0f4;
  color: #34495a;
}

/* Remove the stray separator under Navigation app. */
#navigationPreferenceBtn {
  border-bottom: 0 !important;
}

/* History selected-date map view */
.dsr-history-selection-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.dsr-history-selection-row
.dsr-history-range-label {
  justify-self: stretch;
  min-width: 0;
  border-radius: 12px;
}

.history-show-map-btn {
  min-height: 36px;
  padding: 0 11px;
  border-radius: 12px !important;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 950;
}

.history-show-map-btn[hidden] {
  display: none !important;
}

.history-show-map-btn:disabled {
  opacity: 0.45;
}

.history-map-back-btn {
  position: fixed;
  left: 14px;
  top: calc(108px + var(--safe-top));
  z-index: 940;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid #aebdc7;
  border-radius: 999px;
  background: rgba(234, 240, 244, 0.98);
  color: #34495a;
  box-shadow: 0 5px 16px rgba(15, 23, 42, 0.20);
  font-size: 12px;
  font-weight: 950;
}

.history-map-back-btn[hidden] {
  display: none !important;
}

body.history-map-view
.map-quick-controls {
  display: none !important;
}

body.history-map-view
#notificationsBtn {
  display: none !important;
}

.pin-visual.dsr-history-visited
.pin-dsr-check {
  background: #52685d;
}

/* Bell numeric badge */
#notificationBadge {
  position: absolute;
  right: -5px;
  top: -6px;
  z-index: 2;
  min-width: 19px;
  height: 19px;
  padding: 0 4px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: #b85c5a;
  color: #ffffff;
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 1000;
  line-height: 15px;
  transform: none;
}

/* Summary Report wording button can breathe on narrow screens. */
#openDsrSummaryPdfBtn {
  min-width: 132px;
}


/* v2.12.09 strong History map action */
.dsr-history-selection-row {
  grid-template-columns: minmax(0, 1fr);
}

.history-show-map-btn {
  display: inline-flex !important;
  width: 100%;
  min-height: 44px;
  padding: 0 15px;
  align-items: center;
  justify-content: center;
  border: 1px solid #617d70 !important;
  border-radius: 13px !important;
  background: #6f8f7a !important;
  color: #ffffff !important;
  box-shadow: 0 5px 14px rgba(55, 78, 66, 0.22) !important;
  font-size: 13px;
  font-weight: 1000;
  letter-spacing: 0.1px;
  line-height: 1.2;
}

.history-show-map-btn::before {
  content: none;
}

.history-show-map-btn:active {
  background: #5f7d69 !important;
  transform: translateY(1px);
}

.history-show-map-btn:disabled {
  border-color: #cad4cf !important;
  background: #e5eae7 !important;
  color: #8b9991 !important;
  box-shadow: none !important;
  opacity: 1;
}

/* DSR Done and History map views always use individual pins. */
body.history-map-view
.leaflet-marker-pane,
body.dsr-completed-only-view
.leaflet-marker-pane {
  visibility: visible;
}


/* v2.12.10 measured bottom-left marquee */
.status-pill.marquee {
  text-overflow: clip !important;
}

.status-pill.marquee > span {
  display: inline-block !important;
  min-width: max-content;
  padding-right: 28px;
  animation:
    statusMarqueeMeasured
    var(--status-marquee-duration, 9s)
    ease-in-out
    infinite
    alternate !important;
}

@keyframes statusMarqueeMeasured {
  0%,
  14% {
    transform: translateX(0);
  }

  86%,
  100% {
    transform:
      translateX(
        calc(
          -1 *
          var(
            --status-marquee-distance,
            80px
          )
        )
      );
  }
}


/* Shared fragment chip: one geometry + selected-state contract for DSR actions, Android Photo View and Map Filter fragments. */
html[data-app-theme] button.salesmap-fragment-chip,
html[data-runtime="android-webview"][data-app-theme] button.dsr-photo-view-action {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 0 10px !important;
  border: 1px solid var(--salesmap-ds-color-line) !important;
  border-radius: var(--salesmap-ds-radius-pill) !important;
  background: var(--salesmap-ds-color-surface) !important;
  color: var(--salesmap-ds-color-text) !important;
  box-shadow: none !important;
  font-family: var(--salesmap-ds-font-family-sans) !important;
  font-size: var(--salesmap-ds-font-size-xs) !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  outline: 0 !important;
  transform: none !important;
  transition: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

html[data-app-theme] button.salesmap-fragment-chip:is(
  .selected,
  [aria-pressed="true"],
  [data-fragment-state="selected"]
),
html[data-runtime="android-webview"][data-app-theme] button.dsr-photo-view-action {
  border-color: color-mix(in srgb, var(--salesmap-ds-color-primary) 28%, var(--salesmap-ds-color-line)) !important;
  background: var(--salesmap-ds-state-selected-bg) !important;
  color: var(--salesmap-ds-color-primary-active) !important;
}

html[data-app-theme] button.salesmap-fragment-chip:active,
html[data-runtime="android-webview"][data-app-theme] button.dsr-photo-view-action:active {
  border-color: color-mix(in srgb, var(--salesmap-ds-color-primary) 28%, var(--salesmap-ds-color-line)) !important;
  background: var(--salesmap-ds-state-selected-bg) !important;
  color: var(--salesmap-ds-color-primary-active) !important;
}

html[data-app-theme] button.salesmap-fragment-chip:is(:focus, :focus-visible),
html[data-runtime="android-webview"][data-app-theme] button.dsr-photo-view-action:is(:focus, :focus-visible) {
  outline: 0 !important;
  box-shadow: none !important;
}

/* The uploaded candy artwork is used only when Login is shown. */
.login-overlay {
  background-color: #fffdf7 !important;
  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.10),
      rgba(255, 255, 255, 0.10)
    ),
    url("salesmap_login_background.png?v=2.12.14") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  backdrop-filter: none !important;
}

.sheet-scroll-hint[data-ui-icon="scroll-down"] { font-size: 0; }


/* v2.12.11 session-restore boot screen
   The Login form stays hidden until restoreAuthenticatedProfile finishes. */
body.app-booting {
  overflow: hidden;
}

body.app-booting .login-overlay {
  display: none !important;
}

body.app-booting::before {
  content: "SalesMap";
  position: fixed;
  inset: 0;
  z-index: 7000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f7f8f6;
  color: #40574d;
  font-size: 25px;
  font-weight: 1000;
  letter-spacing: -0.3px;
}

.sheet-scroll-hint[data-ui-icon="scroll-down"]::before { pointer-events: none; }

.sheet-scroll-hint:focus-visible { outline: 2px solid var(--theme-primary-dark); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .sheet-scroll-hint.show:not([hidden]) { animation: none; }
}

@keyframes sheetMoreBounceV21211 {
  0%,
  100% {
    transform:
      translate(-50%, 0) !important;
  }

  50% {
    transform:
      translate(-50%, 5px) !important;
  }
}


/* Admin dashboard floating button:
   lower position and white map-control styling. */
.admin-float-btn {
  bottom: calc(58px + var(--safe-bottom)) !important;
  border: 1px solid rgba(203, 213, 225, 0.98) !important;
  background: rgba(255, 255, 255, 0.97) !important;
  color: #455f6f !important;
  box-shadow:
    0 5px 16px rgba(15, 23, 42, 0.18) !important;
}

.admin-float-btn:active {
  background: #eef3f6 !important;
  transform: translateY(1px);
}

/* Admin does not use Check-In, so the completed-DSR-only control is absent. */
body.admin-mode #mapDsrHighlightBtn {
  display: none !important;
}


/* v2.12.14 lightweight startup + candy login background */

/* Fast startup:
   no large image decode while restoring an existing session. */
body.app-booting::before {
  content: "SalesMap" !important;
  background: #f7f8f6 !important;
  background-image: none !important;
  color: #40574d !important;
  font-size: 25px !important;
  font-weight: 1000 !important;
  letter-spacing: -0.3px !important;
}


.sheet-scroll-hint:not(.show) { visibility: hidden; }

/* Login card visual ownership is canonical at order 362; the legacy glass override is retired. */


/* v2.12.15 Driver Labels + deliberate DSR pin navigation */
body.driver-mode #mapLabelModeBtn {
  display: inline-flex !important;
}

.dsr-card[data-dsr-record-id],
.history-visit-row[data-dsr-history-record-id] {
  cursor: default !important;
}

.dsr-card-head-actions {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
}

.dsr-pin-map-btn {
  min-width: 58px;
  height: 29px;
  padding: 0 9px;
  border: 1px solid #aebdc7;
  border-radius: 999px;
  background: #eef3f6;
  color: #405767;
  font-size: 11px;
  font-weight: 950;
  line-height: 27px;
  text-align: center;
  white-space: nowrap;
}

.dsr-pin-map-btn:active {
  background: #dfe8ed;
  transform: translateY(1px);
}

.history-visit-main {
  align-items: flex-start;
}

/* Report buttons use one compact wording. */
#shareDsrHistoryPdfBtn,
#openDsrSummaryPdfBtn {
  min-width: 96px;
}




/* DSR History summary uses the shared salesmap-summary-list contract. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */
/* Obsolete 2x2 summary rule retired by shared summary-list-system.css. */


/* M6 compatibility bridge: legacy aliases resolve to the single Bright + Flat semantic palette. */
html[data-app-theme] {
  --fog-ink: var(--theme-ink);
  --fog-muted: var(--theme-muted);
  --fog-soft: var(--theme-surface-soft);
  --fog-soft-2: var(--theme-surface-soft);
  --fog-line: var(--theme-line);
  --fog-blue: var(--theme-primary);
  --fog-blue-soft: var(--theme-primary-soft);
  --fog-sage: var(--theme-surface-soft);
  --fog-sage-line: var(--theme-line);
  --fog-sage-ink: var(--theme-muted);
  --bg: var(--theme-surface);
  --text: var(--theme-ink);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --blue: var(--theme-primary);
  --blue-dark: var(--theme-primary-dark);
}

/* M6: retired Theme-specific declarations removed; shared compatibility aliases live in order 1032. */

/* Shared Bright + Flat application keeps legacy selector chrome on one semantic palette. */
html[data-app-theme] body {
  color: var(--theme-ink);
  background-color: var(--theme-page);
}

html[data-app-theme] .bottom-sheet,
html[data-app-theme] .side-sheet {
  color: var(--theme-ink);
  background-color: var(--theme-page);
}

html[data-app-theme] .sheet-title {
  color: var(--theme-title-ink);
  background: var(--theme-title-bg);
  border-color: var(--theme-title-line);
}

html[data-app-theme] .sheet-subtitle,
html[data-app-theme] .form-label,
html[data-app-theme] .location-label,
html[data-app-theme] .settings-row-title,
html[data-app-theme] .dsr-action-title,
html[data-app-theme] .admin-dashboard-section-title,
html[data-app-theme] .database-control-section-title,
html[data-app-theme] .settings-section-title,
html[data-app-theme] .dsr-record-section-title,
html[data-app-theme] .menu-heading-label {
  color: var(--theme-ink);
}

html[data-app-theme] .sheet-handle {
  background: var(--theme-primary-line);
}

html[data-app-theme] .mini-btn,
html[data-app-theme] .round-btn,
html[data-app-theme] .month-nav-btn {
  color: var(--salesmap-ds-action-secondary-text);
  background: var(--salesmap-ds-action-secondary-bg);
  border-color: transparent;
}

html[data-app-theme] :is(.mini-btn, .round-btn, .month-nav-btn):active {
  color: #ffffff;
  background: var(--theme-primary);
  border-color: transparent;
}

html[data-app-theme] .menu-section-label {
  color: var(--theme-menu-section);
}

html[data-app-theme] .app-menu-list .menu-row,
html[data-app-theme] .settings-section,
html[data-app-theme] .settings-cycle-row {
  color: var(--theme-ink);
  background: var(--theme-surface);
  border-color: var(--theme-line);
}

html[data-app-theme] .app-menu-list .menu-row-primary {
  background: linear-gradient(135deg, var(--theme-surface), var(--theme-primary-soft));
  border-color: var(--theme-primary-line);
}

html[data-app-theme] .app-menu-list .menu-row-main,
html[data-app-theme] .menu-row-main {
  color: var(--theme-ink);
}

html[data-app-theme] .menu-chevron,
html[data-app-theme] .settings-cycle-value,
html[data-app-theme] .sheet-scroll-hint {
  color: var(--theme-icon-ink);
}

html[data-app-theme] .permission-hint,
html[data-app-theme] .tools-subtitle,
html[data-app-theme] .menu-row-sub,
html[data-app-theme] .settings-row-subtitle,
html[data-app-theme] .settings-section-note,
html[data-app-theme] .dsr-history-note,
html[data-app-theme] .user-management-note,
html[data-app-theme] .location-value {
  color: var(--theme-muted);
}

/* Specialty picker buttons use the same semantic filled-control surface as native fields. */
html[data-app-theme] .custom-select-button {
  color: var(--salesmap-ds-control-text);
  background-color: var(--salesmap-ds-control-bg);
  border-color: transparent;
}

html[data-app-theme] .settings-cycle-value {
  color: var(--theme-ink);
  background-color: var(--theme-surface);
  border-color: var(--theme-line);
}

/* Specialty picker focus uses the shared semantic field boundary. */
html[data-app-theme] .custom-select-button:focus {
  border-color: var(--salesmap-ds-control-focus) !important;
  box-shadow: 0 0 0 2px var(--salesmap-ds-state-focus-ring);
}

/* M6: shared Primary button anatomy is owned by components/buttons.css. */
html[data-app-theme] .compact-mode-btn.active-mode,
html[data-app-theme] .menu-badge {
  background: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
}

/* M6: shared Primary active state is owned by components/buttons.css. */

html[data-app-theme] .dsr-pin-map-btn {
  color: var(--salesmap-ds-action-secondary-text);
  background: var(--salesmap-ds-action-secondary-bg);
  border-color: transparent;
}

html[data-app-theme] .dsr-pin-map-btn:active {
  color: #ffffff;
  background: var(--theme-primary);
  border-color: transparent;
}

html[data-app-theme] .history-visit-money span {
  color: var(--theme-chip-ink);
  background: var(--theme-chip-bg);
}

html[data-app-theme] .history-visit-actions span {
  color: var(--theme-action-ink);
  background: var(--theme-action-bg);
}

html[data-app-theme] .history-visit-remark {
  color: var(--theme-ink);
  background: var(--theme-remark-bg);
}

#themePreferenceValue {
  border-color: var(--theme-primary-line);
  background: var(--theme-primary-soft);
  color: var(--theme-title-ink);
}

/* Retired duplicate last-row border override; preserve semantic bundle order. */

#themePreferenceValue {
  border-color: var(--theme-primary-line);
  background: var(--theme-primary-soft);
  color: var(--fog-ink);
}

#dsrHistorySheet {
  background: var(--theme-page) !important;
}

#dsrHistorySheet > .sheet-header {
  margin-bottom: 8px;
}

.history-section {
  margin: 11px 0;
  padding: 13px;
  border: 1px solid;
  border-radius: 20px;
  box-shadow: 0 5px 16px rgba(52, 73, 90, 0.07);
}

.history-section-heading {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 11px;
}

.history-step-badge {
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--theme-primary);
  color: #ffffff;
  font-size: 13px;
  font-weight: 1000;
}

.history-section-title {
  color: var(--fog-ink);
  font-size: 15px;
  font-weight: 1000;
  line-height: 1.15;
}

.history-section-help {
  margin-top: 3px;
  color: var(--fog-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.3;
}

.history-calendar-section {
  border-color: var(--theme-calendar-line);
  background: var(--theme-calendar-bg);
}

.history-calendar-section .history-step-badge {
  background: var(--theme-primary);
}

.history-calendar-section .dsr-calendar-nav {
  margin: 4px 0 9px;
  padding: 7px 8px;
  border: 1px solid var(--theme-primary-line);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.78);
}

.history-calendar-section .month-nav-btn {
  background: var(--theme-primary-soft) !important;
  border-color: var(--theme-primary-line) !important;
  color: var(--fog-ink) !important;
}

.history-calendar-section .dsr-calendar-month {
  color: var(--fog-ink);
  font-size: 17px;
}

.history-calendar-section .dsr-calendar-weekdays > div {
  color: var(--fog-muted);
}

#dsrHistorySheet .dsr-calendar-day {
  min-height: 45px;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.92) !important;
}

#dsrHistorySheet .dsr-calendar-day.selected {
  background: var(--theme-primary) !important;
  border-color: var(--theme-primary-dark) !important;
  color: #ffffff !important;
}

#dsrHistorySheet .dsr-calendar-day.selected::before {
  background: #ffffff !important;
}

#dsrHistorySheet .dsr-calendar-day.in-range,
#dsrHistorySheet .dsr-calendar-day.range-start,
#dsrHistorySheet .dsr-calendar-day.range-end {
  background: var(--theme-primary) !important;
  border-color: var(--theme-primary-dark) !important;
  color: #ffffff !important;
}

.history-filter-section {
  border-color: var(--theme-filter-line);
  background: var(--theme-filter-bg);
}

.history-filter-section .history-step-badge {
  background: #b78a4f;
}
/* Retired Theme-specific history badge override removed; Bright + Flat owns this state. */

.history-filter-section .history-section-title {
  color: var(--theme-filter-ink);
}

.history-filter-section .history-section-help {
  color: #8a714c;
}

.dsr-history-tools {
  margin: 0;
  gap: 9px;
}

.history-search-wrap {
  display: grid;
  gap: 5px;
}

.history-control-label {
  color: var(--theme-filter-ink);
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: 0.55px;
  text-transform: uppercase;
}

#dsrHistorySheet .dsr-history-search,
#dsrHistorySheet .dsr-viewer-picker-btn {
  min-height: 45px;
  border: 1px solid var(--theme-filter-line) !important;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.94) !important;
  color: var(--fog-ink);
  box-shadow: 0 3px 9px rgba(92, 70, 40, 0.06);
}

#dsrHistorySheet .dsr-history-search:focus {
  border-color: #b98b4d !important;
  box-shadow: 0 0 0 3px rgba(185, 139, 77, 0.15);
  outline: none;
}

.dsr-history-mode-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

#dsrHistorySheet .compact-mode-btn {
  min-height: 41px;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.88) !important;
  border-color: var(--theme-filter-line) !important;
  color: var(--theme-filter-ink) !important;
}

#dsrHistorySheet .compact-mode-btn.active-mode {
  background: var(--theme-primary) !important;
  border-color: var(--theme-primary-dark) !important;
  color: #ffffff !important;
}

#dsrHistorySheet .dsr-history-range-label {
  width: 100%;
  min-height: 37px;
  padding: 9px 11px;
  border: 1px dashed var(--theme-filter-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.64);
  color: var(--theme-filter-ink);
  line-height: 1.25;
}

.dsr-history-action-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

#dsrHistorySheet .history-show-map-btn,
#dsrHistorySheet .history-report-btn {
  width: 100%;
  min-height: 46px;
  margin: 0;
  border-radius: 14px !important;
  font-size: 12px;
  font-weight: 1000;
}

#dsrHistorySheet .history-show-map-btn {
  border-color: var(--theme-accent-dark) !important;
  background: var(--theme-accent) !important;
  color: #ffffff !important;
  box-shadow: 0 5px 13px rgba(76, 96, 78, 0.20) !important;
}

#dsrHistorySheet .history-show-map-btn:active {
  background: var(--theme-accent-dark) !important;
}

#dsrHistorySheet .history-report-btn {
  border: 1px solid var(--theme-primary-dark) !important;
  background: var(--theme-primary) !important;
  color: #ffffff !important;
  box-shadow: 0 5px 13px rgba(70, 92, 112, 0.18);
}

#dsrHistorySheet .history-show-map-btn:disabled {
  border-color: #c8cfcc !important;
  background: #e4e8e6 !important;
  color: #8b9690 !important;
  box-shadow: none !important;
}

.history-results-section {
  min-height: 120px;
  border-color: var(--theme-results-line);
  background: var(--theme-results-bg);
}

.history-results-section .history-step-badge {
  background: var(--theme-results-ink);
}

.history-results-section .history-section-title {
  color: var(--theme-results-ink);
}

#dsrHistorySheet .compact-history-summary {
  margin: 2px 0 12px;
  border-color: var(--theme-primary-line);
  border-left-color: var(--theme-primary);
  background: var(--theme-surface);
  box-shadow: 0 4px 12px rgba(52, 73, 90, 0.08);
}

#dsrHistorySheet .compact-history-summary:empty {
  display: none;
}

#dsrHistorySheet .compact-history-summary .dsr-summary-value {
  color: var(--theme-results-ink);
}

.history-results-list {
  display: grid;
  gap: 9px;
}

#dsrHistorySheet .history-date-separator {
  margin: 7px 0 1px;
  padding: 7px 10px;
  border-left: 4px solid var(--theme-primary);
  border-radius: 8px;
  background: var(--theme-primary-soft);
  color: var(--theme-results-ink);
  font-size: 12px;
}

#dsrHistorySheet .history-visit-row,
#dsrHistorySheet .history-search-result {
  margin-bottom: 0;
  border: 1px solid var(--theme-results-line);
  border-left: 4px solid var(--theme-primary-line);
  border-radius: 15px;
  background: var(--theme-surface);
  box-shadow: 0 4px 12px rgba(52, 73, 90, 0.07);
}

#dsrHistorySheet .dsr-empty {
  padding: 17px 13px;
  border: 1px dashed var(--theme-results-line, var(--theme-line));
  border-radius: 14px;
  background: var(--theme-surface);
  color: var(--fog-muted);
  text-align: center;
}

#dsrHistorySheet :is(.team-history-no-salesperson, .team-history-no-visits, .history-no-visits) {
  min-height: 96px;
  display: grid;
  place-items: center;
  border: 1px dashed var(--theme-line);
  background: transparent;
}

@media (max-width: 390px) {
  .history-section {
    padding: 11px;
  }

  .dsr-calendar-weekdays,
  .dsr-calendar-grid {
    gap: 4px;
  }

  #dsrHistorySheet .dsr-calendar-day {
    min-height: 42px;
    border-radius: 11px;
  }

  .dsr-history-action-row {
    grid-template-columns: 1fr;
  }
}

/* v2.12.27 History card density + full theme coverage */
.history-section {
  box-shadow: var(--theme-card-shadow);
}

.history-section-heading {
  margin-bottom: 9px;
}

#dsrHistorySheet .history-visit-row {
  padding: 12px;
  border-color: var(--theme-results-line);
  border-left-color: var(--theme-primary-line);
  background: var(--theme-surface);
  box-shadow: var(--theme-card-shadow);
}

#dsrHistorySheet .history-visit-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 9px;
}

#dsrHistorySheet .history-visit-identity {
  flex: 1 1 auto;
  min-width: 0;
}

#dsrHistorySheet .history-visit-code-row {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

#dsrHistorySheet .history-visit-code {
  min-width: 0;
  color: var(--theme-ink);
  font-size: 15px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

:is(#dsrList, #dsrHistoryList) .history-pin-icon-btn {
  width: 28px;
  min-width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--theme-icon-ink);
  background: var(--theme-icon-bg);
  border-color: var(--theme-icon-line);
  font-size: 17px;
  line-height: 1;
}

:is(#dsrList, #dsrHistoryList) .history-status-pill {
  flex: 0 0 auto;
  align-self: flex-start;
  margin-top: 0;
}

#dsrHistorySheet .history-visit-name {
  margin-top: 2px;
  color: var(--theme-muted);
  line-height: 1.2;
}

#dsrHistorySheet .history-visit-meta {
  margin-top: 4px;
  color: var(--theme-muted);
  line-height: 1.2;
}

#dsrHistorySheet .history-visit-gps {
  margin-top: 4px;
  color: var(--theme-muted);
  font-size: 11px;
  font-weight: 750;
  line-height: 1.2;
}

#dsrHistorySheet .history-visit-money {
  margin-top: 7px;
}

#dsrHistorySheet .history-visit-actions,
#dsrHistorySheet .history-visit-remark {
  margin-top: 7px;
}

#dsrHistorySheet .history-show-map-btn:disabled {
  border-color: var(--theme-disabled-line) !important;
  background: var(--theme-disabled-bg) !important;
  color: var(--theme-disabled-ink) !important;
}

/* Settings utility actions use the shared secondary-action grammar; location buttons are owned below with the rest of that family. */
html[data-app-theme] .settings-neutral-action,
html[data-app-theme] .settings-test-action,
html[data-app-theme] .settings-fake-gps-action {
  color: var(--salesmap-ds-action-secondary-text);
  background: var(--salesmap-ds-action-secondary-bg);
  border-color: transparent;
}

html[data-app-theme] :is(.settings-neutral-action, .settings-test-action, .settings-fake-gps-action):active {
  color: #ffffff;
  background: var(--theme-primary);
  border-color: transparent;
}

html[data-app-theme] .dsr-calendar-month,
html[data-app-theme] .dsr-history-date,
html[data-app-theme] .history-visit-code,
html[data-app-theme] .history-search-code {
  color: var(--theme-ink);
}

html[data-app-theme] .dsr-calendar-weekdays > div,
html[data-app-theme] .history-visit-name,
html[data-app-theme] .history-search-name,
html[data-app-theme] .history-visit-meta,
html[data-app-theme] .history-search-time {
  color: var(--theme-muted);
}

/* Theme the remaining informational headings and neutral helper text. */
html[data-app-theme] .tools-summary-value,
html[data-app-theme] .login-title,
html[data-app-theme] .map-picker-title,
html[data-app-theme] .dsr-daily-title,
html[data-app-theme] .notification-title,
html[data-app-theme] .customer-bulk-preview-title,
html[data-app-theme] .customer-bulk-preview-summary,
html[data-app-theme] .customer-bulk-operation-title,
html[data-app-theme] .database-snapshot-title,
html[data-app-theme] .database-audit-title {
  color: var(--theme-ink);
}

html[data-app-theme] .tools-summary-label,
html[data-app-theme] .message-subtitle,
html[data-app-theme] .login-cloud-note,
html[data-app-theme] .map-picker-coords,
html[data-app-theme] .dsr-time-label,
html[data-app-theme] .dsr-summary-label,
html[data-app-theme] .dsr-amount-label,
html[data-app-theme] .dsr-remark-label,
html[data-app-theme] .manager-overview-label,
html[data-app-theme] .notification-detail,
html[data-app-theme] .customer-bulk-operation-label,
html[data-app-theme] .customer-bulk-operation-meta,
html[data-app-theme] .database-snapshot-meta,
html[data-app-theme] .database-audit-meta,
html[data-app-theme] .overnight-dsr-note {
  color: var(--theme-muted);
}

/* Login keeps the shared Forms typography/feedback semantics instead of legacy page-local overrides. */
html[data-app-theme] .login-field .form-label {
  color: var(--salesmap-ds-color-text-muted);
  font-size: var(--salesmap-ds-type-label-size);
  font-weight: var(--salesmap-ds-type-label-weight);
  line-height: var(--salesmap-ds-type-label-line-height);
}

html[data-app-theme] .login-cloud-note {
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-type-helper-weight);
  line-height: var(--salesmap-ds-type-helper-line-height);
}

html[data-app-theme] .login-error {
  color: var(--salesmap-ds-color-danger);
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-font-weight-semibold);
  line-height: var(--salesmap-ds-type-helper-line-height);
}

/* Login title carries the app theme while the existing shared field focus grammar remains unchanged. */
html[data-runtime="android-webview"][data-app-theme] .login-title {
  color: var(--theme-primary-dark);
}

html[data-runtime="android-webview"][data-app-theme] .login-card {
  box-shadow: 0 8px 24px rgba(53, 46, 42, 0.14) !important;
}

html[data-app-theme] .tools-summary,
html[data-app-theme] .message-body {
  color: var(--theme-ink);
  background: var(--theme-surface-soft);
  border-color: var(--theme-line);
}

html[data-app-theme] .menu-heading-label {
  color: var(--theme-menu-section) !important;
}


/* Shared Bright + Flat map chrome.
   Decorative UI lives on semantic variables above. Status/danger colours,
   inactive black pins and Admin/Supervisor multi-Salesperson palettes stay separate. */
html[data-app-theme] #map {
  background: var(--theme-map-surface);
}

/* Search/result containers keep a real boundary; floating/action controls stay borderless. */
html[data-app-theme] .top-panel .search-wrap,
html[data-app-theme] #resultPanel,
html[data-app-theme] .result-item {
  color: var(--theme-map-control-ink) !important;
  background: var(--theme-surface) !important;
  border-color: var(--theme-line) !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-app-theme] :is(
  .map-label-mode-btn,
  .map-cluster-quick-btn,
  .map-filter-quick-btn,
  .map-style-mode-btn,
  .map-dsr-highlight-btn,
  .notification-float-btn,
  .location-float-btn,
  .dsr-float-btn,
  .admin-float-btn,
  .mode-pill
) {
  color: var(--salesmap-ds-action-secondary-text) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  border-color: transparent !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-app-theme] :is(
  .map-label-mode-btn,
  .map-cluster-quick-btn,
  .map-filter-quick-btn,
  .map-style-mode-btn,
  .map-dsr-highlight-btn,
  .notification-float-btn,
  .location-float-btn,
  .dsr-float-btn,
  .admin-float-btn,
  .mode-pill
):active {
  color: #ffffff !important;
  background: var(--theme-primary) !important;
  border-color: transparent !important;
}

html[data-app-theme] .history-map-back-btn {
  color: #fff !important;
  background: var(--theme-primary) !important;
  border-color: transparent !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-app-theme] .map-label-mode-btn.active,
html[data-app-theme] .map-dsr-highlight-btn.active {
  color: #ffffff !important;
  background: var(--theme-primary) !important;
  border-color: transparent !important;
}

html[data-app-theme] .status-pill {
  color: var(--theme-status-ink);
  background: var(--theme-status-bg);
  box-shadow: var(--theme-map-control-shadow);
}

html[data-app-theme] .leaflet-tooltip.salesmap-marker-label {
  color: var(--theme-ink);
  background: var(--theme-map-control-bg);
  border-color: var(--theme-map-control-line);
  box-shadow: var(--theme-map-control-shadow);
}

html[data-app-theme] .location-method-card,
html[data-app-theme] .draft-review-summary,
html[data-app-theme] .draft-card,
html[data-app-theme] .draft-empty,
html[data-app-theme] .location-box {
  color: var(--theme-ink);
  background: var(--theme-surface);
  border-color: var(--theme-line);
}

html[data-app-theme] .draft-field {
  color: var(--theme-ink);
  background: var(--theme-surface-soft);
  border-color: var(--theme-line);
}


/* Android Edit Customer keeps form boundaries visible without changing shared field semantics. */
html[data-runtime="android-webview"][data-app-theme] #editSheet #editSheetName:empty {
  display: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet :is(.form-input, .form-textarea) {
  border: 1px solid var(--theme-line) !important;
  background: var(--theme-surface) !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet :is(.form-input, .form-textarea):focus {
  border-color: var(--salesmap-ds-control-focus) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-primary) 12%, transparent) !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet :is(.form-input, .form-textarea):disabled {
  border-color: var(--theme-line) !important;
  background: var(--theme-surface-soft) !important;
  color: var(--theme-muted) !important;
  -webkit-text-fill-color: var(--theme-muted) !important;
  opacity: 1 !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet #editCodeInput:disabled {
  color: var(--theme-ink) !important;
  -webkit-text-fill-color: var(--theme-ink) !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet .location-method-card {
  border: 1px solid var(--theme-line) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet :is(.location-method-btn, .google-link-find-btn) {
  border: 0 !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet #editLatLngText {
  border: 1px solid var(--theme-line) !important;
  background: var(--theme-surface-soft) !important;
  color: var(--theme-ink) !important;
}


/* Android Submitted History uses collapsed month zones while preserving the existing request-card semantics. */
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-change-history-list {
  display: grid !important;
  gap: 10px !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-toggle {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 50px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 0 12px !important;
  border: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-lg) !important;
  background: var(--theme-surface) !important;
  color: var(--theme-ink) !important;
  box-shadow: none !important;
  font: inherit !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  text-align: left !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-toggle:active {
  background: var(--theme-primary-soft) !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-chevron {
  position: relative !important;
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}

/* Submitted History follows Menu's self-drawn chevron grammar: right when collapsed, down when expanded. */
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-chevron::before {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  border-right: 2px solid var(--theme-primary-dark);
  border-bottom: 2px solid var(--theme-primary-dark);
  transform: rotate(-45deg);
  transform-origin: center;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-toggle[aria-expanded="true"] .submitted-history-month-chevron::before {
  transform: rotate(45deg);
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-content {
  display: grid !important;
  gap: 10px !important;
  padding: 10px 0 0 !important;
  border-top: 0 !important;
  background: transparent !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-content[hidden] {
  display: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .draft-cloud-status-card {
  margin: 0 !important;
  padding: 12px !important;
  border: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-md) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
}

html[data-app-theme] .location-method-btn,
html[data-app-theme] .google-link-find-btn,
html[data-app-theme] .unified-location-value,
html[data-app-theme] .location-btn,
html[data-app-theme] .btn-light,
html[data-app-theme] .secondary-action,
html[data-app-theme] .small-filter-btn {
  color: var(--salesmap-ds-action-secondary-text);
  background: var(--salesmap-ds-action-secondary-bg);
  border-color: transparent;
}

html[data-app-theme] .location-method-btn:active,
html[data-app-theme] .google-link-find-btn:active,
html[data-app-theme] .location-btn:active,
html[data-app-theme] .btn-light:active,
html[data-app-theme] .secondary-action:active,
html[data-app-theme] .small-filter-btn:active {
  color: #ffffff;
  background: var(--theme-primary);
  border-color: transparent;
}

html[data-app-theme] .google-link-status,
html[data-app-theme] .draft-meta,
html[data-app-theme] .draft-field-name,
html[data-app-theme] .draft-empty,
html[data-app-theme] .result-meta,
html[data-app-theme] .result-name {
  color: var(--theme-muted);
}

/* Customer Location feedback follows semantic helper/status text without taking any layout ownership. */
html[data-runtime="android-webview"][data-app-theme] .google-link-status {
  color: var(--salesmap-ds-color-text-muted);
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-type-helper-weight);
  line-height: var(--salesmap-ds-type-helper-line-height);
}

html[data-runtime="android-webview"][data-app-theme] .google-link-status.working {
  color: var(--salesmap-ds-color-primary);
}

html[data-runtime="android-webview"][data-app-theme] .google-link-status.success {
  color: var(--salesmap-ds-color-success);
}

html[data-runtime="android-webview"][data-app-theme] .google-link-status.error {
  color: var(--salesmap-ds-color-danger);
}

html[data-app-theme] .draft-code,
html[data-app-theme] .draft-name,
html[data-app-theme] .draft-field-value,
html[data-app-theme] .location-value,
html[data-app-theme] .result-code {
  color: var(--theme-ink);
}

html[data-app-theme] .draft-card {
  background: var(--theme-surface);
  box-shadow: var(--theme-card-shadow);
}

html[data-app-theme] .draft-field {
  background: var(--theme-surface-soft);
}

html[data-app-theme] .card-edit-btn {
  color: #ffffff !important;
  background: var(--theme-primary) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-app-theme] .card-edit-btn:active {
  background: var(--theme-primary-dark) !important;
}

html[data-app-theme] .badge:not(.active):not(.inactive):not(.special):not(.open-dsr):not(.customer-owner-badge):not(.customer-area-badge) {
  color: var(--theme-ink);
  background: var(--theme-surface-soft);
}

html[data-app-theme] .info-grid {
  border-top-color: var(--theme-line);
}

html[data-app-theme] .info-label {
  color: var(--theme-muted);
}

html[data-app-theme] .info-value,
html[data-app-theme] .phone-links,
html[data-app-theme] .copyable-text {
  color: var(--theme-ink);
}

html[data-app-theme] .sheet-backdrop {
  background: rgba(47, 43, 41, 0.25);
}

html[data-app-theme] .bottom-sheet {
  box-shadow: 0 -8px 30px rgba(53, 46, 42, 0.18);
}
/* Retired Cool map-tile filter removed; map styling is Theme-independent. */
/* Retired Warm map-tile filter removed; map styling is Theme-independent. */

html[data-app-theme] .notification-float-btn .menu-badge,
html[data-app-theme] #notificationBadge {
  border-color: var(--theme-surface) !important;
}

/* Keep only the Use Pin and Cancel pills; the picker action stack itself has no panel backing. */
html[data-app-theme] .map-picker-bar {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

html[data-app-theme] .picker-light {
  color: var(--salesmap-ds-action-secondary-text);
  background: var(--salesmap-ds-action-secondary-bg);
  border-color: transparent;
}

html[data-app-theme] .picker-primary {
  color: #ffffff;
  background: var(--theme-primary);
  border-color: transparent;
}

html[data-app-theme] .picker-primary:active {
  background: var(--theme-primary-dark);
}

/* Remaining high-specificity neutral controls use the same borderless secondary-action state. */
html[data-app-theme] #modePill {
  color: var(--salesmap-ds-action-secondary-text) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  border-color: transparent !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

/* Android Customer card semantics: matching-color outlines and a neutral Inactive state. */
html[data-runtime="android-webview"][data-app-theme] #customerSheet :is(
  .badge.active,
  .badge.inactive,
  .badge.special,
  .badge.open-dsr,
  .customer-owner-badge,
  .customer-area-badge,
  .whatsapp-link
) {
  border: 1px solid color-mix(in srgb, currentColor 32%, var(--salesmap-ds-color-surface));
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet #cardBadges .badge {
  padding: 4px 7px;
  font-size: 11px;
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet .customer-area-badge {
  border-color: var(--salesmap-ds-color-area-line);
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet .customer-card-emphasis-value {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  justify-self: start;
  padding: 3px 9px;
  border: 1px solid var(--salesmap-ds-color-line);
  border-radius: 999px;
  background: var(--salesmap-ds-color-surface-soft);
  color: var(--salesmap-ds-color-text-muted);
  font-weight: 900;
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet #cardInfo .info-value {
  font-size: 14px;
  line-height: 1.25;
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet .phone-value-row {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 2px;
  width: fit-content;
  max-width: 100%;
  justify-self: start;
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet .phone-links {
  min-width: 0;
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet .badge.inactive {
  color: var(--salesmap-ds-color-text-muted);
  background: var(--salesmap-ds-color-surface-soft);
  border-color: var(--salesmap-ds-color-line);
}

html[data-runtime="android-webview"][data-app-theme] #customerSheet .phone-copy-btn,
html[data-runtime="android-webview"][data-app-theme] #customerSheet .phone-copy-btn:is(:hover, :active, :focus-visible) {
  color: var(--theme-primary) !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}


/* v2.13.0 Data Version Foundation */
.data-version-section {
  padding: 14px 16px;
  border: 1px solid var(--theme-line);
  background: var(--theme-surface-soft);
}

.data-version-heading {
  margin-bottom: 10px;
  color: var(--theme-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.data-version-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 7px 0;
  color: var(--theme-ink);
  font-size: 13px;
}

.data-version-row strong {
  color: var(--theme-primary-dark);
  font-size: 13px;
}

.data-version-mode {
  margin-top: 7px;
  padding: 9px 10px;
  border: 1px solid var(--theme-primary-line);
  border-radius: 10px;
  background: var(--theme-primary-soft);
  color: var(--theme-primary-dark);
  font-size: 12px;
  font-weight: 750;
}

.data-version-mode.warning {
  border-color: #d8c49e;
  background: #f4ecdd;
  color: #7b6847;
}
/* CUT F: Legacy Draft Review-only card/detail styling retired; shared draft-cloud owner is canonical. */


/* v2.13.1 Admin Mobile Viewer */
body.admin-mobile-viewer-mode #adminFloatBtn,
body.admin-mobile-viewer-mode #editInfoBtn,
body.admin-mobile-viewer-mode #addCustomerBtn,
body.admin-mobile-viewer-mode #exportChangesBtn,
body.admin-mobile-viewer-mode #customerManagementBtn,
body.admin-mobile-viewer-mode #areaManagementBtn,
body.admin-mobile-viewer-mode #databaseControlBtn {
  display: none !important;
}

body.admin-mobile-viewer-mode #modePill {
  min-width: 98px;
}

/* Retired inline-row geometry; .settings-row now owns Settings row anatomy. */

.settings-reset-inline-btn {
  width: auto !important;
}

.settings-reset-inline-btn.small-filter-btn {
  min-width: 64px;
  padding: 0 9px;
}

.settings-reset-inline-btn:not(.small-filter-btn) {
  min-width: 88px;
  min-height: 38px !important;
  padding: 7px 16px;
  border-radius: 11px !important;
  font-size: 13px !important;
}

.search-result-summary {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 9px 14px;
  border-bottom: 1px solid var(--theme-line, var(--line));
  background: var(--theme-surface-soft, #f3f4f6);
  color: var(--theme-muted, var(--muted));
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.15px;
}

html[data-app-theme] body.admin-mobile-viewer-mode .app-menu-list .menu-row-primary {
  color: var(--theme-ink) !important;
  border-color: transparent !important;
  background: var(--theme-primary-soft) !important;
}

html[data-app-theme] .settings-reset-inline-row,
html[data-app-theme] .settings-reset-inline-btn,
html[data-app-theme] .search-result-summary,
html[data-app-theme] .dsr-summary-item,
html[data-app-theme] .dsr-amount-box,
html[data-app-theme] .manager-summary-row,
html[data-app-theme] .manager-summary-row.dsr-card,
html[data-app-theme] .manager-summary-grid div,
html[data-app-theme] .manager-summary-grid-prominent div,
html[data-app-theme] .manager-overview-card,
html[data-app-theme] .summary-selected-date-card,
html[data-app-theme] .summary-date-btn {
  color: var(--theme-ink);
  border-color: var(--theme-line);
  background: var(--theme-surface);
}

html[data-app-theme] .manager-summary-row.empty,
html[data-app-theme] .manager-summary-grid div,
html[data-app-theme] .manager-summary-grid-prominent div,
html[data-app-theme] .dsr-summary-item,
html[data-app-theme] .dsr-amount-box {
  background: var(--theme-surface-soft) !important;
  border-color: var(--theme-line) !important;
}

html[data-app-theme] #dsrDailySummarySheet .manager-summary-overview {
  border-color: var(--theme-line) !important;
  border-left-color: var(--theme-primary) !important;
  background: var(--theme-surface) !important;
  box-shadow: var(--theme-card-shadow) !important;
}

html[data-app-theme] #dsrDailySummarySheet .manager-overview-card:nth-child(odd),
html[data-app-theme] #dsrDailySummarySheet .manager-overview-card:nth-child(-n + 2) {
  border-color: var(--theme-line) !important;
}

html[data-app-theme] .manager-summary-code,
html[data-app-theme] .manager-summary-grid b,
html[data-app-theme] .manager-overview-value,
html[data-app-theme] .dsr-summary-value {
  color: var(--theme-ink);
}

html[data-app-theme] .manager-summary-status,
html[data-app-theme] .manager-summary-grid span,
html[data-app-theme] .manager-summary-report,
html[data-app-theme] .dsr-summary-label,
html[data-app-theme] .dsr-amount-label {
  color: var(--theme-muted);
}

html[data-app-theme] .sheet-scroll-hint {
  color: var(--theme-map-control-ink) !important;
  border-color: color-mix(in srgb, var(--theme-map-control-line) 72%, transparent) !important;
  background: color-mix(in srgb, var(--theme-surface) 68%, transparent) !important;
  box-shadow: 0 3px 10px color-mix(in srgb, var(--theme-ink) 12%, transparent) !important;
}

/* v2.13.3 component alignment and complete Morandi theme coverage */
html[data-app-theme] :is(
  #filterSheet,
  #customSelectSheet,
  #menuSheet,
  #settingsSheet,
  #dsrDailySummarySheet
) {
  color: var(--theme-ink) !important;
  background: var(--theme-page) !important;
}

/* Map Filter visuals moved to theme-status-and-map-filter.css; retain the unrelated shared surfaces here. */
html[data-app-theme] body.admin-mobile-viewer-mode #menuSheet :is(
  .menu-row,
  .menu-row-primary
),
html[data-app-theme] #customSelectSheet :is(
  .custom-select-option,
  .custom-select-bulk-actions button
),
html[data-app-theme] #dsrDailySummarySheet :is(
  .manager-summary-row,
  .manager-summary-row.dsr-card,
  .manager-summary-grid div,
  .manager-summary-grid-prominent div,
  .manager-overview-card,
  .manager-summary-table-row
) {
  color: var(--theme-ink) !important;
  border-color: var(--theme-line) !important;
  background: var(--theme-surface) !important;
  box-shadow: var(--theme-card-shadow) !important;
}

/* Map Filter status-chip state is owned by theme-status-and-map-filter.css. */
html[data-app-theme] #customSelectSheet .custom-select-option.selected,
html[data-app-theme] body.admin-mobile-viewer-mode #menuSheet .menu-row-primary {
  color: var(--theme-primary-dark) !important;
  border-color: var(--theme-primary-line) !important;
  background: var(--theme-primary-soft) !important;
}

/* Map Filter-specific visual state is owned by theme-status-and-map-filter.css. */

/* Map Filter-specific visual state is owned by theme-status-and-map-filter.css. */

/* Map Filter-specific visual state is owned by theme-status-and-map-filter.css. */

/* Area check visuals moved to the Map Filter owner; custom-select keeps its own check styling. */
html[data-app-theme] #customSelectSheet .custom-select-check {
  border-color: var(--theme-accent-dark) !important;
  background: var(--theme-accent) !important;
  color: #fff !important;
}

/* Area check visuals moved to the Map Filter owner; custom-select keeps its own unselected state. */
html[data-app-theme] #customSelectSheet .custom-select-option:not(.selected) .custom-select-check {
  border-color: var(--theme-primary-line) !important;
  background: var(--theme-surface) !important;
  color: transparent !important;
}

html[data-app-theme] #dsrDailySummarySheet .manager-summary-row.empty,
html[data-app-theme] #dsrDailySummarySheet .manager-summary-grid div,
html[data-app-theme] #dsrDailySummarySheet .manager-summary-grid-prominent div {
  background: var(--theme-surface-soft) !important;
}

html[data-app-theme] :is(
  .settings-row,
  .settings-cycle-row,
  .settings-reset-inline-row
) {
  box-sizing: border-box;
  min-height: 54px;
  align-items: center !important;
}

html[data-app-theme] :is(
  .settings-row-title,
  .settings-cycle-value,
  .filter-label,
  .menu-row-main,
  .custom-select-option
) {
  line-height: 1.2 !important;
}

html[data-app-theme] :is(
  .btn-light,
  .btn-primary,
  .small-filter-btn,
  .settings-reset-inline-btn,
  .custom-select-button,
  .filter-select-button
) {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.1 !important;
}

html[data-app-theme] .filter-actions > button {
  min-height: 48px;
}

html[data-app-theme] #filterSheet .sticky-filter-actions,
html[data-app-theme] #customSelectSheet .filter-actions {
  border-top-color: var(--theme-line) !important;
  background: var(--theme-page) !important;
}

/* Map Filter-specific visual state is owned by theme-status-and-map-filter.css. */

/* Map Filter-specific visual state is owned by theme-status-and-map-filter.css. */


/* v2.13.4 inactive reason audit picker */
.inactive-reason-sheet .sheet-subtitle { max-width: 520px; }
.inactive-reason-options { display: grid; gap: 10px; padding: 4px 0 14px; }
.inactive-reason-options label {
  min-height: 52px; display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 10px;
  padding: 10px 13px; border: 1px solid var(--theme-line); border-radius: 12px;
  background: var(--theme-surface-soft); color: var(--theme-ink); font-size: 13px; font-weight: 800; cursor: pointer;
}
.inactive-reason-options input { width: 18px; height: 18px; accent-color: var(--theme-primary); }
.inactive-reason-error { min-height: 20px; color: var(--danger); font-size: 11px; font-weight: 800; }
html[data-runtime="browser-desktop"] #inactiveReasonSheet,
html[data-runtime="browser-desktop"] #inactiveReasonSheet.open {
  left: 50% !important; right: auto !important; top: 50% !important; bottom: auto !important;
  width: min(520px, calc(100vw - 48px)) !important; max-width: 520px !important; height: auto !important;
  max-height: calc(100vh - 80px) !important; padding: 0 22px 20px !important;
  border: 1px solid var(--theme-line) !important; border-radius: 18px !important;
  transform: translate(-50%, -50%) !important; overflow: auto !important;
}
html[data-runtime="browser-desktop"] #inactiveReasonSheet > .sheet-header { margin: 0 -22px 16px !important; padding: 16px 22px !important; }


/* Settings zones share one compact layout grammar across Android and Browser. */
html[data-runtime="browser-desktop"][data-app-theme] .settings-general-section {
  display: grid;
  gap: 0;
}

html[data-app-theme] .settings-cycle-row,
html[data-app-theme] .settings-reset-inline-row {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 56px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-top: 1px solid color-mix(in srgb, var(--theme-line) 72%, transparent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-app-theme] .settings-row-title {
  max-width: none !important;
  min-width: 0;
  display: block;
  margin: 0;
  line-height: 1.2 !important;
}

/* Passive Settings values stay text; only true action values use button chrome. */
html[data-app-theme] .settings-cycle-value {
  align-self: center !important;
  justify-self: end !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--theme-muted) !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  line-height: 1.2 !important;
  text-align: right !important;
}

html[data-app-theme] #settingsSheet :is(
  #navigationPreferenceBtn,
  #openChangePasswordBtn
) .settings-cycle-value,
html[data-app-theme] .settings-reset-inline-btn {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;
  justify-self: end !important;
  width: auto !important;
  min-width: 108px !important;
  height: var(--salesmap-ds-density-touch-target) !important;
  min-height: var(--salesmap-ds-density-touch-target) !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: var(--salesmap-ds-radius-md) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

html[data-app-theme] .settings-section {
  padding: 8px 0 !important;
  border: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-lg) !important;
  background: var(--theme-surface) !important;
  box-shadow: var(--theme-card-shadow) !important;
  overflow: hidden !important;
}

html[data-runtime="browser-desktop"][data-app-theme] .settings-section .settings-category-heading {
  padding: 4px 12px 8px !important;
  color: var(--theme-muted) !important;
}

html[data-app-theme] .settings-section .settings-category-heading + .settings-cycle-row,
html[data-app-theme] .settings-section .settings-category-heading + .settings-reset-inline-row,
html[data-app-theme] #settingsSheet .settings-account-section #settingsChangePasswordRow .settings-cycle-row {
  border-top-color: transparent !important;
}

html[data-app-theme] #settingsSheet .settings-section :is(.settings-cycle-row, .settings-reset-inline-row):active {
  background: var(--theme-primary-soft) !important;
}

html[data-app-theme] #settingsSheet :is(
  #navigationPreferenceBtn,
  #openChangePasswordBtn
):active .settings-cycle-value,
html[data-app-theme] #settingsSheet .settings-section .settings-reset-inline-btn:not([data-salesmap-action-role]):active {
  background: var(--theme-primary) !important;
  color: #ffffff !important;
}

/* Mascot state is expressed by its On/Off copy; pressing it must not flash success green. */
html[data-app-theme] #settingsSheet #mascotEnabledToggle:active {
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
}

.edit-inactive-reason-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.edit-inactive-reason-heading {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: flex-start;
  flex: 0 0 100%;
}

.edit-inactive-reason-heading small {
  display: none;
}

.edit-inactive-reason-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.edit-inactive-reason-options button {
  min-height: 34px;
  padding: 7px 12px;
  border: 0;
  border-radius: 999px;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
  font-size: 12px;
  font-weight: var(--salesmap-ds-font-weight-semibold);
  line-height: 1.1;
  white-space: nowrap;
  box-shadow: none;
}

.edit-inactive-reason-options button.selected {
  border-color: var(--theme-primary-dark);
  background: var(--theme-primary-soft);
  color: var(--theme-primary-dark);
  box-shadow: none;
}

.edit-inactive-reason-row .inactive-reason-error {
  flex: 0 0 100%;
  min-height: 16px;
  margin-top: -2px;
}
/* CUT F: Legacy Draft Review-only card/detail styling retired; shared draft-cloud owner is canonical. */
/* CUT F: Legacy Draft Review-only card/detail styling retired; shared draft-cloud owner is canonical. */

/* Soft-danger compatibility consumers only. Filled destructive buttons stay with the shared Button semantic owner. */
html[data-app-theme] :is(.soft-danger-btn, .settings-clear-test-action, .dsr-small-action.danger, .draft-remove-btn, .database-snapshot-actions button.danger) {
  background: var(--salesmap-ds-action-danger-soft) !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-action-danger-text) !important;
  box-shadow: none !important;
}

html[data-app-theme] :is(.soft-danger-btn, .settings-clear-test-action, .dsr-small-action.danger, .draft-remove-btn, .database-snapshot-actions button.danger):active {
  background: color-mix(in srgb, var(--salesmap-ds-action-danger-soft) 84%, var(--salesmap-ds-action-danger-text)) !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-action-danger-text) !important;
}

html[data-app-theme] .draft-remove-btn {
  background: var(--salesmap-ds-action-danger-soft) !important;
}
/* Retired Dark Theme override removed; semantic state styling is runtime-independent. */


/* Settings density is owned by orders 1226-1231; keep this bundle slot as a no-op. */

/* Settings row density is owned by order 1227. */

/* Settings typography is shared across runtimes; no Browser-only override is required. */

/* Settings action height is shared by order 1229. */

html[data-app-theme] #dsrHistorySheet .history-section,
html[data-app-theme] #dsrHistorySheet .history-search-result,
html[data-app-theme] #dsrHistorySheet .history-visit-row {
  background: var(--theme-surface) !important;
  border-color: var(--theme-line) !important;
  box-shadow: var(--theme-card-shadow) !important;
}

html[data-app-theme] #dsrHistorySheet .history-visit-row.focus-record {
  border-color: var(--salesmap-ds-control-focus) !important;
  box-shadow: 0 0 0 2px var(--theme-focus-ring), var(--theme-card-shadow) !important;
}

html[data-app-theme] #dsrHistorySheet :is(.history-search-code, .history-visit-code) {
  color: var(--theme-ink) !important;
}

html[data-app-theme] #dsrHistorySheet :is(.history-search-name, .history-visit-name, .history-search-time, .history-visit-meta) {
  color: var(--theme-muted) !important;
}

html[data-app-theme] #dsrHistorySheet .history-search-result {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

html[data-app-theme] #dsrHistorySheet .history-status-pill {
  border-color: var(--theme-primary-line) !important;
  background: var(--theme-primary-soft) !important;
  color: var(--theme-primary-dark) !important;
}

html[data-app-theme] #dsrHistorySheet .history-control-label,
html[data-app-theme] #dsrHistorySheet .history-section-title,
html[data-app-theme] #dsrHistorySheet .history-filter-hint {
  color: var(--theme-ink) !important;
}

html[data-app-theme] #dsrHistorySheet .history-search-input,
html[data-app-theme] #dsrHistorySheet .history-date-input,
html[data-app-theme] #dsrHistorySheet .history-filter-select {
  background: var(--theme-surface) !important;
  border-color: var(--theme-line) !important;
  color: var(--theme-ink) !important;
}

html[data-app-theme] #dsrHistorySheet .history-filter-btn {
  background: var(--salesmap-ds-action-secondary-bg) !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
}

html[data-app-theme] #dsrHistorySheet .history-filter-btn.active {
  background: var(--theme-primary) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

html[data-app-theme] #dsrHistorySheet .history-show-map-btn:not(:disabled) {
  background: var(--theme-primary) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: none !important;
}


/* Danger palette is owned by theme-palette-and-base.css; keep this bundle slot as a no-op. */

/* Settings section layout is owned by orders 1226 and 1230. */

/* Browser Settings rows use the shared settings-row owner. */

/* Browser Settings titles use the shared typography owner. */

/* Browser Settings actions use the shared action height and borderless secondary grammar. */

/* Settings pressed-state styling is shared by order 1231. */
/* Android DSR History and Settings keep compact actions on one semantic hierarchy. */
html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet .history-today-chip,
html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet .history-report-btn,
html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet .history-show-map-btn:not(:disabled) {
  border: 0 !important;
  box-shadow: none !important;
}

/* Android History keeps flat elevation but restores visible region boundaries. */
html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet .history-section {
  border-color: var(--theme-line) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet :is(
  .history-search-result,
  .history-visit-row
) {
  border-color: var(--theme-line) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet .history-visit-row.focus-record {
  border-color: var(--salesmap-ds-control-focus) !important;
  box-shadow: 0 0 0 2px var(--theme-focus-ring) !important;
}

html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet .history-show-map-btn[data-ui-icon]::before {
  content: none !important;
  display: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #dsrHistorySheet .dsr-photo-view-action {
  min-height: 30px !important;
  padding: 0 11px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--theme-primary) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  font-size: 11px !important;
  font-weight: 900 !important;
}

html[data-runtime="android-webview"][data-app-theme] #settingsSheet #settingsChangePasswordRow {
  display: contents;
}

/* Android Settings uses the shared zone container owner above; no runtime reset layer is needed. */

/* Android Settings ordinary rows now use the shared .app-menu-list .menu-row geometry. */
html[data-runtime="android-webview"][data-app-theme] #settingsSheet .settings-section {
  padding: 6px 0 !important;
  box-shadow: none !important;
}

/* Android Settings deliberately gives action and status values identical chip geometry for visual alignment. */
html[data-runtime="android-webview"][data-app-theme] #settingsSheet :is(
  #navigationPreferenceBtn,
  #openChangePasswordBtn,
  #pendingSyncSettingsBtn,
  #clientDiagnosticsSettingsBtn,
  #aboutSalesMapBtn
) .settings-cycle-value,
html[data-runtime="android-webview"][data-app-theme] #settingsSheet .settings-reset-inline-btn {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: end !important;
  width: 96px !important;
  min-width: 96px !important;
  max-width: 96px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: var(--salesmap-ds-radius-pill) !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Density owns geometry only; explicit action roles keep the shared Button palette. */
html[data-runtime="android-webview"][data-app-theme] #settingsSheet :is(
  #navigationPreferenceBtn,
  #openChangePasswordBtn,
  #pendingSyncSettingsBtn,
  #clientDiagnosticsSettingsBtn,
  #aboutSalesMapBtn
) .settings-cycle-value,
html[data-runtime="android-webview"][data-app-theme] #settingsSheet .settings-reset-inline-btn:not([data-salesmap-action-role]) {
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
}

/* English menu labels use title case without changing locale copy or value casing. */
html[data-runtime="android-webview"]:lang(en) #settingsSheet .settings-row-main {
  text-transform: capitalize;
}

/* About keeps a protected right value column so long release text wraps inside the zone. */
html[data-runtime="android-webview"][data-app-theme] #aboutSalesMapSheet .data-version-section {
  padding: 8px 12px !important;
}

html[data-runtime="android-webview"][data-app-theme] #aboutSalesMapSheet .data-version-section .data-version-heading {
  padding: 4px 0 8px !important;
}

html[data-runtime="android-webview"][data-app-theme] #aboutSalesMapSheet .data-version-row {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 8px 0;
}

html[data-runtime="android-webview"][data-app-theme] #aboutSalesMapSheet .data-version-row strong {
  justify-self: end;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  text-align: right;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

/* Android Settings pressed rows use the shared pressed-state owner. */

/* Account rows use the same shared Settings row grid. */

/* Account row pressed state is shared by order 1231. */

/* Account values use the same shared Settings action/value grammar. */

html[data-runtime="android-webview"][data-app-theme] #settingsSheet .settings-support-location-action {
  height: var(--salesmap-ds-density-touch-target) !important;
  min-height: var(--salesmap-ds-density-touch-target) !important;
  border: 0 !important;
  border-radius: var(--salesmap-ds-radius-md) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #settingsSheet .settings-support-location-action.enabled {
  background: var(--theme-warning-soft) !important;
  color: var(--theme-warning-dark) !important;
}

html[data-runtime="android-webview"][data-app-theme] #settingsSheet #settingsLogoutBtn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: var(--salesmap-ds-density-touch-target) !important;
  min-height: var(--salesmap-ds-density-touch-target) !important;
  border: 0 !important;
  border-radius: var(--salesmap-ds-radius-md) !important;
  background: var(--salesmap-ds-action-danger-bg) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
}

html[data-runtime="android-webview"][data-app-theme] #settingsSheet #settingsLogoutBtn:active {
  background: color-mix(in srgb, var(--salesmap-ds-action-danger-bg) 84%, #000000) !important;
  color: #ffffff !important;
}

/* Destructive class styling is owned by theme-settings-and-history.css; keep this bundle slot as a no-op. */

/* Destructive pressed styling is owned by the canonical danger owner. */


/* Main menu button chrome is owned by orders 1281-1282. */

/* Main menu pressed state is owned by order 1282. */

/* Settings section layout is owned by theme-settings-and-history.css. */

/* Settings row layout is owned by theme-settings-and-history.css. */

/* Settings row typography is owned by theme-settings-and-history.css. */

/* Settings action/value geometry is owned by theme-settings-and-history.css. */

/* Settings button appearance is owned by theme-settings-and-history.css. */

html[data-app-theme] .draft-field {
  box-sizing: border-box;
  grid-template-columns: 108px minmax(0, 1fr) !important;
  align-items: start;
  column-gap: 10px !important;
}

html[data-app-theme] .draft-field-name,
html[data-app-theme] .draft-field-value {
  min-width: 0;
  line-height: 1.25 !important;
}

html[data-app-theme] .draft-field-inactive-reason .draft-field-name {
  overflow-wrap: normal;
  word-break: normal;
  white-space: normal;
}

/* Legacy destructive IDs bridge into the shared soft-danger action grammar. */
html[data-app-theme] body :is(
  #deleteDsrRecordBtn,
  #clearDraftsBtn,
  #clearAddCustomerDraftBtn,
  #clearAreasBtn,
  #customSelectClearBtn,
  #clearFakeDataBtn,
  #clearMyTestWorkspaceBtn,
  #resetBulkImportBtn
) {
  background: var(--salesmap-ds-action-danger-soft) !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-action-danger-text) !important;
  box-shadow: none !important;
}

html[data-app-theme] body :is(
  #deleteDsrRecordBtn,
  #clearDraftsBtn,
  #clearAddCustomerDraftBtn,
  #clearAreasBtn,
  #customSelectClearBtn,
  #clearFakeDataBtn,
  #clearMyTestWorkspaceBtn,
  #resetBulkImportBtn
):active {
  background: color-mix(in srgb, var(--salesmap-ds-action-danger-soft) 84%, var(--salesmap-ds-action-danger-text)) !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-action-danger-text) !important;
}

html[data-app-theme] body #deleteOvernightDsrBtn {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-danger-bg) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
  box-shadow: none !important;
}

html[data-app-theme] body #deleteOvernightDsrBtn:active {
  background: color-mix(in srgb, var(--salesmap-ds-action-danger-bg) 84%, #000) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
}

html[data-runtime="android-webview"] .sheet-handle {
  min-height: 18px;
  background-clip: content-box !important;
  padding-top: 6px;
  padding-bottom: 7px;
  margin-top: -4px;
  touch-action: none !important;
  cursor: grab;
}

html[data-runtime="android-webview"] .bottom-sheet.swipe-dragging {
  display: block !important;
  transform: translate3d(0, var(--sheet-drag-y, 0px), 0) !important;
  transition: none !important;
  will-change: transform, opacity !important;
}


/* v2.13.4 UI hotfix 5 — responsive settings controls and exact theme matching */
html[data-app-theme] #settingsSheet :is(
  #navigationPreferenceBtn,
  #clusterPreferenceBtn,
  #themePreferenceBtn,
  #resetUserSettingsBtn
) {
  touch-action: manipulation !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* Main menu button uses the same white floating-control surface as Android map actions. */
html[data-runtime="android-webview"][data-app-theme] #menuBtn {
  color: var(--theme-primary-dark) !important;
  background: #ffffff !important;
  border: 1px solid var(--theme-line) !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-app-theme] #menuBtn:active {
  color: #ffffff !important;
  background: var(--theme-primary) !important;
  border-color: transparent !important;
  box-shadow: var(--theme-map-control-shadow) !important;
  opacity: 1;
}

/* Admin Mobile Viewer uses the same Menu zone-row owner as every other visible entry. */

/* Admin Mobile Viewer row text inherits the shared Menu row grammar. */

/* Admin Mobile Viewer pressed state inherits the shared Menu row grammar. */

/* All three DSR History step badges use one consistent theme colour. */
html[data-app-theme] #dsrHistorySheet :is(
  .history-calendar-section,
  .history-filter-section,
  .history-results-section
) .history-step-badge {
  color: #ffffff !important;
  background: var(--theme-primary) !important;
  border-color: var(--theme-primary-dark) !important;
}


/* Settings visual transition ownership moved to theme-settings-and-history.css. */

/* Settings pressed-state ownership moved to theme-settings-and-history.css. */

/* FIRST IN / LAST OUT uses the same active theme as its monitoring card. */
html[data-app-theme] #dsrDailySummarySheet .manager-summary-row .dsr-timeline {
  background: var(--theme-surface-soft) !important;
  border-color: var(--theme-line) !important;
  box-shadow: none !important;
}

html[data-app-theme] #dsrDailySummarySheet .manager-summary-row .dsr-time-label {
  color: var(--theme-muted) !important;
}

html[data-app-theme] #dsrDailySummarySheet .manager-summary-row .dsr-time-value {
  color: var(--theme-ink) !important;
}

html[data-app-theme] #dsrDailySummarySheet .manager-summary-row .dsr-timeline-arrow {
  color: var(--theme-primary-dark) !important;
}


/* Settings focus/transition ownership moved to theme-settings-and-history.css. */

/* Settings focus ownership moved to theme-settings-and-history.css. */

/* Settings visual state ownership stays in theme-settings-and-history.css. */

/* Only the irreversible DSR confirmation uses the strong danger fill. */
html[data-app-theme] #confirmDsrDeleteBtn {
  background: var(--salesmap-ds-action-danger-bg) !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
}

html[data-app-theme] #confirmDsrDeleteBtn:active {
  background: var(--theme-danger-dark) !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
}

/* Android Menu and Settings share one compact section-card grammar. */
html[data-runtime="android-webview"][data-app-theme] :is(#menuSheet, #settingsSheet) .app-menu-list {
  gap: 0 !important;
  margin-top: 8px !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(#menuSheet, #settingsSheet) .menu-section-label {
  margin: 10px 0 0 !important;
  padding: 8px 12px 5px !important;
  border: 1px solid var(--theme-line) !important;
  border-bottom: 0 !important;
  border-radius: var(--salesmap-ds-radius-lg) var(--salesmap-ds-radius-lg) 0 0 !important;
  background: var(--theme-surface) !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(#menuSheet, #settingsSheet) .app-menu-list .menu-row {
  min-height: 48px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-left: 1px solid var(--theme-line) !important;
  border-right: 1px solid var(--theme-line) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--theme-line) 82%, transparent) !important;
  border-radius: 0 !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
}

/* Menu rows alone reserve a trailing chevron column; Settings actions align to the card edge. */
html[data-runtime="android-webview"][data-app-theme] #menuSheet .app-menu-list .menu-row {
  padding-right: 40px !important;
}

/* The semantic last row closes each zone so the outer boundary stays rounded instead of ending square. */
html[data-runtime="android-webview"][data-app-theme] #menuSheet :is(
  #androidScheduleMenuBtn,
  #androidTeamScheduleMenuBtn,
  #keyAccountDsrSummaryBtn,
  #submittedHistoryBtn,
  #dataVersionControlBtn,
  #settingsBtn
) {
  border-radius: 0 0 var(--salesmap-ds-radius-lg) var(--salesmap-ds-radius-lg) !important;
  overflow: hidden !important;
}

/* Team Schedule is role-gated; when hidden, Team DSR History closes that zone instead. */
html[data-runtime="android-webview"][data-app-theme] #menuSheet #teamDsrHistoryMenuBtn:has(+ #androidTeamScheduleMenuBtn[hidden]) {
  border-radius: 0 0 var(--salesmap-ds-radius-lg) var(--salesmap-ds-radius-lg) !important;
  overflow: hidden !important;
}

/* When role filtering leaves Settings as a standalone row, restore its missing top edge and corners. */
html[data-runtime="android-webview"][data-app-theme] #menuSheet #settingsMenuLabel[hidden] + #settingsBtn {
  border-top: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-lg) !important;
}

/* Settings semantic group wrappers mark the final row of each shared section card. */
html[data-runtime="android-webview"][data-app-theme] #settingsSheet .settings-menu-section > .menu-row:last-child {
  border-radius: 0 0 var(--salesmap-ds-radius-lg) var(--salesmap-ds-radius-lg) !important;
  overflow: hidden !important;
}

html[data-runtime="android-webview"][data-app-theme] #menuSheet .app-menu-list .menu-row:active {
  background: var(--theme-primary-soft) !important;
  border-left-color: var(--theme-line) !important;
  border-right-color: var(--theme-line) !important;
  border-bottom-color: var(--theme-line) !important;
}

/* Settings rows are containers for their own controls; a pressed child must not tint the whole row. */
html[data-runtime="android-webview"][data-app-theme] #settingsSheet .app-menu-list .menu-row:active {
  background: var(--theme-surface) !important;
  border-left-color: var(--theme-line) !important;
  border-right-color: var(--theme-line) !important;
  border-bottom-color: var(--theme-line) !important;
}


/* Submitted History keeps its padded audit-card shell; Draft Review inherits Approval Center card geometry. */
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .change-request-card {
  margin: 0 !important;
  padding: 12px !important;
  border: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-md) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-review-list {
  display: grid !important;
  gap: 10px !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-card-header {
  gap: 12px !important;
  align-items: flex-start !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-fields {
  margin-top: 10px !important;
  border-top: 1px solid var(--theme-line) !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-field {
  min-height: 42px !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--theme-line) 78%, transparent) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-field:last-child {
  border-bottom: 0 !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-field-change {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  text-align: left !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-field-before {
  color: var(--theme-muted) !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-field-arrow {
  color: var(--theme-primary-dark) !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-field-after {
  color: var(--theme-ink) !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet .draft-remove-btn {
  min-height: 30px !important;
  padding: 0 11px !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet #closeDraftReviewBottomBtn {
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #draftReviewSheet #closeDraftReviewBottomBtn:active {
  background: var(--theme-primary) !important;
  color: #ffffff !important;
}

html[data-app-theme] .data-version-mode {
  margin-top: 8px !important;
  padding: 8px 10px 8px 12px !important;
  border: 1px solid var(--theme-line) !important;
  border-left: 4px solid var(--theme-primary-line) !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: var(--theme-muted) !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}

html[data-app-theme] .data-version-mode.warning {
  border-color: #d8c49e !important;
  border-left-color: #c7ae7f !important;
  background: transparent !important;
  color: #7b6847 !important;
}

html[data-app-theme] .summary-selected-date-card {
  border: 1px solid var(--theme-line) !important;
  border-left: 4px solid var(--theme-primary-line) !important;
  background: var(--theme-surface) !important;
  color: var(--theme-ink) !important;
  box-shadow: none !important;
}

html[data-app-theme] .summary-selected-date-card > span {
  color: var(--theme-muted) !important;
}

html[data-app-theme] #dsrDailySummaryDateText {
  color: var(--theme-ink) !important;
}

html[data-app-theme] :is(#prevDsrSummaryDateBtn, #todayDsrSummaryBtn, #pickDsrSummaryDateBtn, #nextDsrSummaryDateBtn) {
  border: 1px solid var(--theme-line) !important;
  background: var(--theme-surface) !important;
  color: var(--theme-ink) !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
  outline: 0 !important;
}

html[data-app-theme] #todayDsrSummaryBtn.active-date {
  border-color: var(--theme-primary-line) !important;
  background: var(--theme-primary-soft) !important;
  color: var(--theme-primary-dark) !important;
}

html[data-app-theme] :is(#prevDsrSummaryDateBtn, #todayDsrSummaryBtn, #pickDsrSummaryDateBtn, #nextDsrSummaryDateBtn):disabled {
  border-color: var(--theme-disabled-line) !important;
  background: var(--theme-disabled-bg) !important;
  color: var(--theme-disabled-ink) !important;
}

html[data-app-theme] :is(#prevDsrSummaryDateBtn, #todayDsrSummaryBtn, #pickDsrSummaryDateBtn, #nextDsrSummaryDateBtn):is(:active, :focus, :focus-visible) {
  outline: 0 !important;
  box-shadow: none !important;
}

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */


/* v2.13.5.6 notifications empty state follows active theme */
html[data-app-theme] .notification-empty {
  background: var(--theme-surface) !important;
  border-color: var(--theme-line) !important;
  color: var(--theme-ink) !important;
  box-shadow: var(--theme-card-shadow) !important;
}

/* Android notification cards stay neutral; the border and trailing fragment carry urgency. */
html[data-runtime="android-webview"][data-app-theme] #notificationSheet .notification-item {
  background: var(--theme-surface) !important;
  border: 0 !important;
  border-left: 4px solid var(--theme-primary) !important;
  box-shadow: none !important;
}
html[data-runtime="android-webview"][data-app-theme] #notificationSheet .notification-item.warning {
  border-left-color: var(--theme-warning) !important;
}
html[data-runtime="android-webview"][data-app-theme] #notificationSheet .notification-item.danger {
  border-left-color: var(--theme-danger) !important;
}
html[data-runtime="android-webview"][data-app-theme] #notificationSheet .notification-item.success {
  border-left-color: var(--theme-success) !important;
}

/* The trailing verb remains inside the one clickable row; action intent is independent of stripe urgency. */
html[data-app-theme] #notificationSheet .notification-action {
  align-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 0 11px;
  border: 0 !important;
  border-radius: 999px;
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
  font-weight: var(--salesmap-ds-font-weight-semibold);
  line-height: 1;
  white-space: nowrap;
}

html[data-app-theme] #notificationSheet .notification-action[data-notification-action-role="secondary"] {
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
}

html[data-app-theme] #notificationSheet .notification-action[data-notification-action-role="status"] {
  border: 1px solid var(--theme-line) !important;
  background: var(--theme-surface-soft) !important;
  color: var(--theme-muted) !important;
}


/* v2.13.5.7 final filter + quick control + bottom pill corrections */
html[data-app-theme] #status.status-pill,
html[data-app-theme] #modePill.mode-pill {
  box-sizing: border-box !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
}

/* Android bottom information pills use the neutral secondary fill without button framing. */
html[data-runtime="android-webview"][data-app-theme] #status.status-pill,
html[data-runtime="android-webview"][data-app-theme] #modePill.mode-pill {
  border: 0 !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
  box-shadow: none !important;
}

html[data-app-theme] #status.status-pill {
  justify-content: flex-start !important;
}

html[data-app-theme] #modePill.mode-pill {
  justify-content: center !important;
}

html[data-app-theme] #status.status-pill > span {
  line-height: 1 !important;
}

/* Android map toggles remain independent fragment buttons; each state is readable without a shared segmented frame. */
html[data-runtime="android-webview"][data-app-theme] .map-quick-controls {
  gap: 6px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* The Android hamburger is map chrome, not a secondary action: keep its white control surface. */
html[data-runtime="android-webview"][data-app-theme] #menuBtn.round-btn {
  border-color: transparent !important;
  background: var(--theme-map-control-bg) !important;
  color: var(--theme-primary-dark) !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-app-theme] :is(#mapLabelModeBtn, #mapOwnCustomersBtn, #mapClusterQuickBtn, #mapDsrHighlightBtn) {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  min-width: 0 !important;
  padding: 0 11px !important;
  border: 1px solid var(--theme-map-control-line) !important;
  border-radius: 999px !important;
  color: var(--theme-map-control-ink) !important;
  background: var(--theme-map-control-bg) !important;
  box-shadow: var(--theme-map-control-shadow) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  outline: 0 !important;
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

html[data-app-theme] :is(#mapLabelModeBtn, #mapOwnCustomersBtn, #mapClusterQuickBtn, #mapDsrHighlightBtn):is(.active, [aria-pressed="true"]) {
  color: var(--theme-primary-dark) !important;
  background: var(--theme-primary-soft) !important;
  border-color: var(--theme-primary-line) !important;
}

/* Android On-state fragments use the neutral secondary action fill while Off stays white. */
html[data-runtime="android-webview"][data-app-theme] :is(
  #mapLabelModeBtn,
  #mapOwnCustomersBtn,
  #mapClusterQuickBtn,
  #mapDsrHighlightBtn
):is(.active, [aria-pressed="true"]) {
  color: var(--salesmap-ds-action-secondary-text) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  border-color: transparent !important;
}

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Superseded Map Filter rule retained as an empty semantic chunk; final ownership is in chunk 1324. */

/* Map Filter final owner: one compact fragment grammar for Status, All area, and every Area. */
html[data-app-theme] #filterSheet .area-filter-section {
  display: block;
  max-height: none;
  overflow: visible;
  padding: 0;
}

/* The dialog body owns vertical touch scrolling; fragment cards stay in normal document flow. */
html[data-app-theme] #filterSheet .map-filter-fragment-scroll {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: flex-start;
  gap: 8px;
  width: 100%;
  min-height: 0;
  max-height: none;
  overflow: visible !important;
  overscroll-behavior: auto;
  touch-action: pan-y;
  box-sizing: border-box;
  padding: 0 2px 0 0;
}

html[data-app-theme] #filterSheet .area-filter-section .filter-section-heading,
html[data-app-theme] #filterSheet .area-filter-section .inline-area-actions,
html[data-app-theme] #filterSheet .area-filter-section .filter-area-list {
  display: contents;
}

html[data-app-theme] #filterSheet .area-filter-section .hidden-area-checkboxes {
  display: none !important;
}

/* AREA uses the same full-width zone-title hierarchy as Customer Owner before its fragments begin. */
html[data-app-theme] #filterSheet .area-filter-section .filter-section-heading > .filter-label {
  display: block !important;
  flex: 0 0 100%;
  width: 100%;
}

/* State and District fragments wrap with the standard control gap instead of collapsing row-to-row. */
html[data-app-theme] #filterSheet .area-filter-section .area-hierarchy-level {
  display: flex;
  flex: 0 0 100%;
  flex-wrap: wrap;
  width: 100%;
}

html[data-app-theme] #filterSheet .area-filter-section .area-hierarchy-level + .area-hierarchy-level {
  margin-top: var(--salesmap-ds-spacing-control-gap, 8px);
}

html[data-app-theme] #filterSheet .area-filter-section .area-hierarchy-level > .filter-area-list {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  column-gap: var(--salesmap-ds-spacing-control-gap, 8px);
  row-gap: var(--salesmap-ds-spacing-control-gap, 8px);
  width: 100%;
}

html[data-app-theme] #filterSheet .area-filter-section .filter-area-list .area-picker-row {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  width: auto;
  overflow: visible;
  border: 0;
  border-radius: var(--salesmap-ds-radius-pill);
  background: transparent;
  box-shadow: none;
}

html[data-app-theme] #filterSheet .area-filter-section .inline-area-actions > .salesmap-fragment-chip {
  flex: 0 0 auto !important;
}

html[data-app-theme] #filterSheet .area-filter-section .filter-area-list .area-picker-option {
  width: auto !important;
  max-width: 100%;
  justify-content: center;
}

html[data-app-theme] #filterSheet .area-filter-section .filter-area-list .area-picker-option-main {
  gap: 0;
}

html[data-app-theme] #filterSheet .area-filter-section .filter-area-list .area-picker-check,
html[data-app-theme] #filterSheet .area-filter-section .filter-area-list .area-colour-button {
  display: none !important;
}

/* Status, All area, and Area fragment visuals are owned by components/chips.css. */

html[data-app-theme] #filterSheet #activeFilterPickerText,
html[data-app-theme] #filterSheet .area-filter-section .filter-area-list .area-picker-name {
  border-color: transparent !important;
  background: transparent !important;
  color: inherit !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

html[data-app-theme] #filterSheet #activeFilterPickerText {
  text-transform: uppercase;
}

html[data-app-theme] #filterSheet .filter-status-cycle-row::before,
html[data-app-theme] #filterSheet .filter-status-cycle-row::after {
  content: none !important;
}

/* Android Map Filter follows the shared bottom-sheet scroll owner so its handle,
   header, actions and safe-area padding move as one normal document. */
html[data-runtime="android-webview"][data-app-theme] #filterSheet.salesmap-dialog-sheet.open {
  display: block !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet.salesmap-dialog-sheet .map-filter-dialog-body {
  min-height: 0;
  overflow: visible !important;
  overscroll-behavior: auto;
  touch-action: pan-y;
  gap: var(--salesmap-ds-spacing-section-gap) !important;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .map-filter-zone {
  margin: 0 !important;
  padding: 10px 11px !important;
  border: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-lg) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* A personal Salesperson scope still filters internally, but never renders a redundant selector. */
html[data-runtime="android-webview"][data-app-theme] #filterSheet .map-filter-zone.is-salesperson-scope-hidden {
  display: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .map-filter-zone-title {
  margin: 0 0 8px !important;
  color: var(--theme-primary-dark) !important;
  font-size: var(--salesmap-ds-type-label-size) !important;
  font-weight: var(--salesmap-ds-type-label-weight) !important;
  line-height: var(--salesmap-ds-type-label-line-height) !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .supervisor-team-sp-filter-chips {
  display: grid;
  gap: 10px;
  min-height: 0;
  max-height: none;
  overflow: visible !important;
  overscroll-behavior: auto;
  touch-action: pan-y;
  padding: 0 2px 0 0;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .supervisor-team-sp-filter-chips[hidden] {
  display: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .supervisor-team-sp-filter-all,
html[data-runtime="android-webview"][data-app-theme] #filterSheet .supervisor-team-sp-filter-group-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .supervisor-team-sp-filter-group {
  display: grid;
  gap: 6px;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .supervisor-team-sp-filter-group-label,
html[data-runtime="android-webview"][data-app-theme] #filterSheet .area-hierarchy-level > .map-filter-zone-title {
  color: var(--theme-muted) !important;
  font-size: var(--salesmap-ds-font-size-xs, 11px) !important;
  font-weight: var(--salesmap-ds-font-weight-semibold, 800) !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .salesmap-dialog-actions.sticky-filter-actions {
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin-top: var(--salesmap-ds-spacing-section-gap) !important;
  padding-top: 10px !important;
  background: var(--theme-surface) !important;
}

html[data-runtime="android-webview"][data-app-theme] #filterSheet .map-filter-dialog-body > .salesmap-dialog-actions {
  position: static !important;
  bottom: auto !important;
  z-index: auto;
  flex: 0 0 auto;
  margin-top: 0 !important;
  padding-bottom: var(--salesmap-ds-spacing-sticky-footer-bottom);
  background: transparent !important;
}

/* Reset exposes its real in-flight lifecycle while the filter and marker projection are rebuilt. */
html[data-runtime="android-webview"][data-app-theme] #filterSheet #resetFilterBtn[aria-busy="true"]::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-inline-end: 8px;
  vertical-align: -0.14em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: salesmapMapFilterResetSpin 700ms linear infinite;
}

/* Quick chips use available width first; they wrap only when their intrinsic labels no longer fit. */
html[data-runtime="android-webview"][data-app-theme] .map-quick-controls,
html[data-runtime="android-webview"][data-app-theme] body.management_viewer-mode .map-quick-controls {
  max-width: calc(100vw - 28px) !important;
  flex-wrap: wrap !important;
  align-content: flex-start !important;
  column-gap: 6px !important;
  row-gap: 5px !important;
}

html[data-runtime="android-webview"][data-app-theme] .map-quick-controls > button {
  width: auto !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

/* The status pill reserves the bottom-right identity pill and scrolls its full measured overflow instead of clipping it. */
html[data-runtime="android-webview"][data-app-theme] #status.status-pill,
html[data-runtime="android-webview"][data-app-theme] body.management_viewer-mode #status.status-pill {
  max-width: max(145px, calc(100vw - 44px - min(38vw, 170px))) !important;
  overflow: hidden !important;
}

html[data-runtime="android-webview"][data-app-theme] #status.status-pill.marquee {
  justify-content: flex-start !important;
  text-overflow: clip !important;
}

html[data-runtime="android-webview"][data-app-theme] #status.status-pill.marquee > span {
  display: inline-flex !important;
  flex: 0 0 auto;
  min-width: max-content !important;
  will-change: transform;
  animation-name: salesmapStatusMarqueeMeasured !important;
  animation-duration: var(--status-marquee-duration, 9s) !important;
  animation-timing-function: linear !important;
  animation-iteration-count: infinite !important;
  animation-direction: normal !important;
}

html[data-runtime="android-webview"][data-app-theme] #status.status-pill.marquee > span::after {
  content: attr(data-marquee-copy);
  padding-left: 28px;
}

@keyframes salesmapStatusMarqueeMeasured {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(0px - var(--status-marquee-distance, 24px)));
  }
}

@keyframes salesmapMapFilterResetSpin {
  to {
    transform: rotate(360deg);
  }
}
.data-version-control-sheet {
  padding-bottom: calc(30px + var(--safe-bottom));
}

.data-version-control-overview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.data-version-control-overview > div {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--theme-line);
  border-radius: 14px;
  background: var(--theme-surface-soft);
}

.data-version-control-overview span {
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.data-version-control-overview b {
  color: var(--theme-ink);
  font-size: 18px;
  font-weight: 1000;
}

.data-version-control-section-title {
  margin: 15px 0 8px;
  color: var(--theme-menu-section);
  font-size: 11px;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.data-version-control-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  margin-bottom: 10px;
}

.data-version-control-filters button {
  display: grid;
  place-items: center;
  gap: 2px;
  min-height: 44px;
  padding: 6px 4px;
  border: 1px solid var(--theme-line);
  border-radius: 11px;
  background: var(--theme-surface-soft);
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 900;
}

.data-version-control-filters button span {
  font-size: 13px;
  font-weight: 1000;
}

.data-version-control-filters button.active {
  border-color: var(--theme-primary-line);
  background: var(--theme-primary-soft);
  color: var(--theme-primary-dark);
  box-shadow: 0 0 0 2px var(--theme-focus-ring);
}

.data-version-request-list,
.data-version-history-list {
  display: grid;
  gap: 9px;
}

.data-version-request-empty {
  border: 1px dashed var(--theme-line);
  background: var(--theme-surface-soft);
  color: var(--theme-muted);
  box-shadow: none;
}

.data-version-request-card,
.data-version-history-card {
  padding: 12px;
  border: 1px solid var(--theme-line);
  border-radius: 15px;
  background: var(--theme-surface);
  box-shadow: var(--theme-card-shadow);
}

.data-version-request-card.conflict {
  border-color: #d8b37b;
}

.data-version-request-card.rejected {
  opacity: .78;
}

.data-version-request-head,
.data-version-history-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 9px;
}

.data-version-request-head > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.data-version-request-head b,
.data-version-history-head b {
  overflow: hidden;
  color: var(--theme-ink);
  font-size: 14px;
  font-weight: 1000;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.data-version-request-head > div > span,
.data-version-history-head > span {
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
}

.data-version-status {
  flex: 0 0 auto;
  padding: 4px 7px;
  border-radius: 999px;
  background: var(--theme-status-bg);
  color: var(--theme-status-ink);
  font-size: 9px;
  font-weight: 1000;
  text-transform: uppercase;
}

.data-version-status.pending { background: #e8eef3; color: #496274; }
.data-version-status.conflict { background: #fff0d8; color: #805716; }
.data-version-status.applied { background: #ddf2e4; color: #27633a; }
.data-version-status.rejected,
.data-version-status.cancelled { background: #eceff1; color: #5c6469; }

.data-version-request-meta,
.data-version-history-meta {
  margin-top: 7px;
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.data-version-conflict {
  margin-top: 9px;
  padding: 8px 9px;
  border-radius: 10px;
  background: #fff2df;
  color: #78541c;
  font-size: 11px;
  font-weight: 850;
}

.data-version-change-list {
  display: grid;
  gap: 5px;
  margin-top: 10px;
}

.data-version-change-row {
  display: grid;
  grid-template-columns: minmax(90px, .8fr) minmax(0, 1.2fr);
  gap: 8px;
  padding: 7px 8px;
  border-radius: 9px;
  background: var(--theme-surface-soft);
}

.data-version-change-row span {
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 800;
}

.data-version-change-row b {
  overflow-wrap: anywhere;
  color: var(--theme-ink);
  font-size: 11px;
  font-weight: 900;
  text-align: right;
}

.data-version-change-empty,
.data-version-review-note,
.data-version-applied-version,
.data-version-history-reason,
.data-version-history-note {
  color: var(--theme-muted);
  font-size: 11px;
  line-height: 1.45;
}

.data-version-review-note,
.data-version-applied-version {
  margin-top: 8px;
}

.data-version-applied-version {
  color: #2f6c43;
  font-weight: 900;
}

.data-version-request-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 11px;
}

.data-version-request-actions:has(button:only-child) {
  grid-template-columns: 1fr;
}

.data-version-request-actions button,
.data-version-rollback-btn {
  min-height: 40px;
  border: 0;
  border-radius: 10px;
  background: var(--theme-primary-soft);
  color: var(--theme-primary-dark);
  font-size: 11px;
  font-weight: 950;
}

.data-version-request-actions button.danger,
.data-version-rollback-btn {
  background: var(--danger);
  color: var(--danger-text);
}

html[data-runtime="android-webview"]
  .data-version-request-list
  .change-request-card:is(.applied, .rejected):not(.expanded)
  > :not(.draft-cloud-status-head) {
  display: none;
}

html[data-runtime="android-webview"]
  .data-version-request-list
  .change-request-card:is(.applied, .rejected)
  > .draft-cloud-status-head {
  cursor: pointer;
}

html[data-runtime="android-webview"] .data-version-control-filters {
  gap: 0;
  padding: 3px;
  border: 1px solid var(--theme-line);
  border-radius: 14px;
  background: var(--theme-surface-soft);
}

html[data-runtime="android-webview"] .data-version-control-filters button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 34px;
  padding: 0 5px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  box-shadow: none;
  gap: 4px;
}

html[data-runtime="android-webview"] .data-version-control-filters button span {
  font-size: 10px;
  font-weight: 900;
}

html[data-runtime="android-webview"] .data-version-control-filters button.active {
  background: var(--theme-primary-soft);
  color: var(--theme-primary-dark);
  box-shadow: inset 0 0 0 1px var(--theme-primary), var(--theme-card-shadow);
  font-weight: 950;
}

html[data-runtime="android-webview"] :is(.data-version-control-sheet, #draftReviewSheet) .draft-cloud-status-main > span {
  color: var(--theme-primary-dark);
  font-size: 11px;
  font-weight: 900;
}

html[data-runtime="android-webview"] .data-version-mobile-request-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: center;
  gap: 8px;
  margin-top: 0;
  padding: 9px 10px 10px;
  border-top: 1px solid var(--theme-line);
  background: var(--theme-surface-soft);
}

html[data-runtime="android-webview"] .data-version-mobile-request-actions.conflict-only {
  grid-template-columns: 1fr;
}

html[data-runtime="android-webview"] .data-version-mobile-request-actions .data-version-mobile-action {
  width: 100%;
  min-width: 0;
  height: 34px;
  min-height: 34px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}

html[data-runtime="android-webview"] .data-version-mobile-request-actions .data-version-mobile-action.reject {
  background: var(--salesmap-ds-action-danger-soft);
  color: var(--salesmap-ds-action-danger-text);
}

html[data-runtime="android-webview"] .data-version-mobile-request-actions .data-version-mobile-approve {
  width: 100%;
  height: 34px;
  min-height: 34px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}

html[data-runtime="android-webview"] .data-version-mobile-pin-evidence {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  padding: 7px 10px;
  border-top: 1px solid var(--theme-line);
  background: var(--theme-surface-soft);
}

html[data-runtime="android-webview"] .data-version-mobile-pin-evidence span {
  color: var(--theme-muted);
  font-size: 9px;
  font-weight: 850;
}

html[data-runtime="android-webview"] .data-version-mobile-pin-evidence b {
  color: var(--theme-primary-dark);
  font-size: 10px;
  font-weight: 950;
  text-align: right;
}

html[data-runtime="android-webview"] .data-version-review-sheet {
  padding-bottom: calc(24px + var(--safe-bottom));
}

html[data-runtime="android-webview"] .data-version-mobile-review-fields {
  display: grid;
  gap: 10px;
}

html[data-runtime="android-webview"] .data-version-mobile-review-field {
  display: grid;
  gap: 5px;
}

html[data-runtime="android-webview"] .data-version-mobile-review-field-head {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 6px;
}

html[data-runtime="android-webview"] .data-version-mobile-review-field-head > span {
  color: var(--theme-ink);
  font-size: 12px;
  font-weight: 900;
}

html[data-runtime="android-webview"] .data-version-mobile-review-field-head > small {
  min-width: 0;
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 700;
  overflow-wrap: anywhere;
  text-align: left;
}

html[data-runtime="android-webview"] .data-version-mobile-review-readonly {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 9px 12px;
  border: 1px solid var(--theme-line);
  border-radius: 12px;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
  font-size: 12px;
  font-weight: 850;
}

html[data-runtime="android-webview"] .data-version-mobile-review-location-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  padding: 3px 4px 3px 12px;
  border: 1px solid var(--theme-line);
  border-radius: 12px;
  background: var(--theme-surface-soft);
}

html[data-runtime="android-webview"] .data-version-mobile-review-location-row .data-version-mobile-review-readonly {
  min-height: 36px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

html[data-runtime="android-webview"] .data-version-mobile-pick-pin {
  min-width: 78px;
  height: 36px;
  padding: 0 14px;
  border-radius: 999px;
}

html[data-runtime="android-webview"] .data-version-mobile-review-field :is(.form-input,.form-textarea) {
  width: 100%;
}

html[data-runtime="android-webview"] .data-version-mobile-review-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.data-version-history-note {
  margin: -2px 0 9px;
}

.data-version-history-reason {
  margin-top: 6px;
  color: var(--theme-ink);
  font-weight: 800;
}

.data-version-rollback-btn {
  width: 100%;
  margin-top: 10px;
}

@media (min-width: 760px) {
  .data-version-control-overview {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .data-version-request-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* v2.13.11 toolbar containment, plain funnel icon and compact status pill. */
.top-panel {
  box-sizing: border-box;
  max-width: calc(100vw - 20px);
  gap: 6px;
}

.search-wrap {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  box-sizing: border-box;
  gap: 2px;
  padding-right: 5px;
}

html[data-runtime="android-webview"] .map-search-leading-icon {
  position: absolute;
  left: 17px;
  top: 50%;
  z-index: 2;
  width: 19px;
  height: 19px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--theme-muted);
  transform: translateY(-50%);
  pointer-events: none;
}

html[data-runtime="android-webview"] .map-search-leading-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html[data-runtime="android-webview"] .search-wrap > #searchInput {
  padding-left: 39px !important;
}

#menuBtn {
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  box-sizing: border-box;
}

html[data-runtime="android-webview"][data-app-theme] #menuBtn {
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--theme-primary-dark) !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-runtime="android-webview"][data-app-theme] #menuBtn:active {
  background: var(--theme-primary) !important;
  color: #ffffff !important;
}

.search-icon-btn {
  flex: 0 0 34px;
  width: 34px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: #263238;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.search-icon-btn svg {
  width: 23px;
  height: 23px;
  fill: currentColor;
  stroke: none;
  pointer-events: none;
}

.search-clear-btn {
  flex: 0 0 38px;
}

html[data-runtime="android-webview"] .search-clear-btn svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  pointer-events: none;
}

html[data-app-theme] .search-icon-btn {
  color: var(--theme-icon-ink) !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-app-theme] .search-icon-btn:is(:active, :focus, :focus-visible) {
  color: var(--theme-primary-dark) !important;
  background: transparent !important;
  border-color: transparent !important;
  outline: 0 !important;
  opacity: 0.68;
}

.map-quick-controls {
  right: 14px;
  max-width: none;
  flex-wrap: nowrap;
}

.map-quick-controls > button {
  flex: 0 1 auto;
  white-space: nowrap;
}

html[data-runtime="android-webview"] .map-quick-controls {
  flex-wrap: wrap;
  row-gap: 5px;
  align-content: flex-start;
}

html[data-runtime="android-webview"] .map-quick-row-break {
  flex: 0 0 100%;
  width: 0;
  height: 0;
}

html[data-runtime="android-webview"] .map-quick-controls > button {
  min-height: 30px;
  font-size: 12.5px;
  font-weight: 750;
  line-height: 28px;
}

html[data-runtime="android-webview"] body.supervisor-mode #mapOwnCustomersBtn {
  display: inline-flex !important;
}

html[data-runtime="android-webview"] body:not(.supervisor-mode) #mapOwnCustomersBtn,
html[data-runtime="android-webview"] body.driver-mode #mapDsrHighlightBtn,
html[data-runtime="android-webview"] body:not(.supervisor-mode):not(.sp-mode) #dsrFloatBtn {
  display: none !important;
}

html[data-runtime="android-webview"] body:is(.supervisor-mode, .sp-mode) #dsrFloatBtn {
  display: flex !important;
}

.map-cluster-quick-btn.switching,
.map-cluster-quick-btn:disabled {
  opacity: 0.72 !important;
  cursor: wait;
}

html[data-app-theme] #status.status-pill {
  box-sizing: border-box !important;
  height: 22px !important;
  min-height: 22px !important;
  max-height: 22px !important;
  max-width: clamp(145px, 49vw, 225px) !important;
  padding: 0 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  font-size: 10.5px !important;
  line-height: 20px !important;
}

html[data-app-theme] #status.status-pill > span {
  line-height: 20px !important;
}

@media (max-width: 360px) {
  .top-panel {
    left: 8px;
    right: 8px;
    max-width: calc(100vw - 16px);
    gap: 5px;
  }

  #menuBtn {
    flex-basis: 46px;
    width: 46px;
    height: 46px;
  }

  .map-label-mode-btn,
  .map-cluster-quick-btn,
  .map-dsr-highlight-btn {
    min-width: 0;
    padding-left: 8px;
    padding-right: 8px;
    font-size: 12px;
  }
}


/* Shared Summary calendar, inline cloud refresh and full-width report action. */
#dsrDailySummarySheet .dsr-summary-header {
  width: 100%;
  align-items: center;
}

#dsrDailySummarySheet .summary-report-row,
#dsrDailySummarySheet .cloud-summary-status {
  width: 100%;
  box-sizing: border-box;
}

#dsrDailySummarySheet .history-calendar-heading-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
}

#dsrDailySummarySheet .history-today-chip {
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid var(--theme-primary-line);
  border-radius: 999px;
  background: var(--theme-primary);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
}

#dsrDailySummarySheet .summary-report-row {
  margin-top: 8px;
}

#dsrDailySummarySheet #openDsrSummaryPdfBtn {
  width: 100%;
  min-width: 0;
}

#dsrDailySummarySheet #openDsrSummaryPdfBtn[hidden] {
  display: none;
}

html[data-app-theme] #dsrSheet .dsr-summary-grid {
  border-color: var(--theme-line) !important;
  background: var(--theme-surface) !important;
  box-shadow: var(--theme-card-shadow) !important;
}

html[data-app-theme] #dsrSheet .dsr-summary-item {
  color: var(--theme-ink) !important;
  background: transparent !important;
  border-color: var(--theme-line) !important;
}

/* Browser keeps the existing two-column Today summary grammar. */
html[data-runtime="browser-desktop"][data-app-theme] #dsrSheet .dsr-summary-date {
  grid-column: 1 / -1;
}

html[data-runtime="browser-desktop"][data-app-theme] #dsrSheet .dsr-summary-item {
  border-right: 0 !important;
  border-bottom: 0 !important;
}

html[data-runtime="browser-desktop"][data-app-theme] #dsrSheet .dsr-summary-date,
html[data-runtime="browser-desktop"][data-app-theme] #dsrSheet .dsr-summary-item:nth-child(2),
html[data-runtime="browser-desktop"][data-app-theme] #dsrSheet .dsr-summary-item:nth-child(3) {
  border-bottom: 1px solid var(--theme-line) !important;
}

html[data-runtime="browser-desktop"][data-app-theme] #dsrSheet .dsr-summary-item:nth-child(2),
html[data-runtime="browser-desktop"][data-app-theme] #dsrSheet .dsr-summary-item:nth-child(4) {
  border-right: 1px solid var(--theme-line) !important;
}

html[data-app-theme] #dsrSheet .dsr-summary-label,
html[data-app-theme] #dsrTodayDateText {
  color: var(--theme-muted) !important;
}

html[data-app-theme] #dsrSheet .dsr-summary-value,
html[data-app-theme] #dsrSheet .dsr-summary-value.sales,
html[data-app-theme] #dsrSheet .dsr-summary-value.return {
  color: var(--theme-ink) !important;
}

#dsrSheet .dsr-today-date {
  display: none;
}

/* Android Today Records uses one compact row per metric. */
html[data-runtime="android-webview"] #dsrSheet .dsr-daily-title {
  color: var(--theme-ink, #17251f);
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-grid {
  grid-template-columns: minmax(0, 1fr) !important;
  border: 1px solid var(--theme-line, #cfd8d3) !important;
  border-left: 4px solid var(--theme-primary, #164e3b) !important;
  background: var(--theme-surface, #ffffff) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-date {
  grid-column: auto;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-item {
  display: grid;
  grid-template-columns: minmax(0, 40%) minmax(0, 1fr);
  align-items: center;
  min-height: 42px;
  padding: 5px 12px !important;
  border-right: 0 !important;
  border-bottom: 1px solid var(--theme-line, #cfd8d3) !important;
  background: var(--theme-surface, #ffffff) !important;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-item:last-child {
  border-bottom: 0 !important;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-value {
  min-width: 0;
  margin-top: 0;
  font-size: 15px;
  font-weight: 900;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-outlets-value {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-outlets-value > span:first-child {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-map-btn {
  flex: 0 0 auto;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 8px !important;
  font-size: 9px !important;
  white-space: nowrap;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-map-btn[hidden] {
  display: none !important;
}

html[data-runtime="android-webview"] #dsrSheet .dsr-summary-date-value {
  color: var(--theme-ink, #111827) !important;
  font-size: 15px;
}

html[data-runtime="android-webview"] #dsrSheet #dsrList .dsr-card,
html[data-runtime="android-webview"] #dsrHistorySheet #dsrHistoryList .dsr-card {
  border: 1px solid var(--theme-line, #cfd8d3);
  border-left: 4px solid var(--theme-primary, #164e3b);
  background: var(--theme-surface, #ffffff);
  box-shadow: none;
}

/* Android Visit/History/Team money stays secondary to the Check-In/Check-Out time hierarchy. */
html[data-runtime="android-webview"] #dsrSheet #dsrList .dsr-amount-value,
html[data-runtime="android-webview"] #dsrHistorySheet #dsrHistoryList .dsr-amount-value,
html[data-runtime="android-webview"] #dsrDailySummarySheet #dsrManagerSummaryList .dsr-amount-value {
  font-size: 13px;
  font-weight: 800;
}

html[data-runtime="android-webview"] #dsrSheet #dsrList .dsr-amount-value.sales,
html[data-runtime="android-webview"] #dsrSheet #dsrList .dsr-amount-value.return,
html[data-runtime="android-webview"] #dsrHistorySheet #dsrHistoryList .dsr-amount-value.sales,
html[data-runtime="android-webview"] #dsrHistorySheet #dsrHistoryList .dsr-amount-value.return,
html[data-runtime="android-webview"] #dsrDailySummarySheet #dsrManagerSummaryList .dsr-amount-value.sales,
html[data-runtime="android-webview"] #dsrDailySummarySheet #dsrManagerSummaryList .dsr-amount-value.return {
  color: var(--theme-ink, #17251f) !important;
}

html[data-app-theme] #dsrSheet .dsr-record-section-title {
  color: var(--theme-ink) !important;
  border-top-color: var(--theme-line) !important;
}

html[data-app-theme] #dsrSheet .dsr-empty {
  color: var(--theme-muted) !important;
  background: var(--theme-surface-soft) !important;
  border-color: var(--theme-line) !important;
}

html[data-app-theme] #dsrDailySummarySheet #dsrManagerSummaryList > .dsr-empty {
  color: var(--theme-muted) !important;
  background: var(--theme-surface) !important;
  border-color: var(--theme-results-line, var(--theme-line)) !important;
  box-shadow: none !important;
}

#dsrSheet #dsrList .dsr-today-empty-card {
  box-sizing: border-box;
  width: 100%;
  margin-top: 0;
  padding: 10px;
  border: 1px solid var(--theme-line, #cfd8d3);
  border-radius: 16px;
  background: var(--theme-surface, #ffffff);
}

#dsrSheet #dsrList .dsr-today-empty {
  min-height: 84px;
  display: grid;
  place-items: center;
  padding: 12px;
  border: 1px dashed var(--theme-line, #cfd8d3);
  background: transparent !important;
  color: var(--theme-muted, #66736d);
  text-align: center;
}

html[data-app-theme] #dsrSheet #exportDsrBtn {
  color: #ffffff !important;
  background: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
}

html[data-app-theme] #dsrDailySummarySheet .manager-summary-row.empty .dsr-status-pill.locked {
  color: var(--theme-chip-ink) !important;
  background: var(--theme-chip-bg) !important;
  border: 1px solid var(--theme-line) !important;
}

html[data-app-theme] #dsrDailySummarySheet .cloud-summary-status {
  color: var(--theme-accent-dark) !important;
}

@media (max-width: 360px) {
  #dsrDailySummarySheet .summary-date-nav {
    grid-template-columns: 36px minmax(0, 1fr) minmax(0, 1fr) 36px;
    gap: 5px;
  }

  #dsrDailySummarySheet .summary-date-btn {
    font-size: 11px;
  }
}

/* Retired duplicate general-row border override; preserve semantic bundle order. */
/* v2.13.11 regression repair: search-matched outline filter and identical lower map pills. */
#mapFilterQuickBtn.search-filter-btn {
  flex: 0 0 32px !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--theme-icon-ink, #263238) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden;
}

html[data-runtime="android-webview"] #mapFilterQuickBtn.search-filter-btn {
  color: var(--theme-muted, #6b7280) !important;
}

html[data-runtime="android-webview"] #mapFilterQuickBtn.search-filter-btn svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  min-width: 19px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html[data-app-theme] :is(#status.status-pill, #modePill.mode-pill) {
  color: var(--theme-primary-dark) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  border-color: transparent !important;
  box-shadow: var(--theme-map-control-shadow) !important;
  box-sizing: border-box !important;
  height: 24px !important;
  min-height: 24px !important;
  max-height: 24px !important;
  bottom: calc(10px + var(--safe-bottom)) !important;
  padding: 0 9px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10.5px !important;
  font-weight: 750 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

html[data-app-theme] #status.status-pill {
  max-width: min(58vw, 250px) !important;
}

html[data-app-theme] #modePill.mode-pill {
  max-width: min(38vw, 170px) !important;
}

/* Android bottom pills are informational status, not secondary action buttons. */
html[data-runtime="android-webview"][data-app-theme] #status.status-pill {
  color: var(--theme-primary-dark) !important;
  background: var(--theme-surface) !important;
  border: 1px solid var(--theme-primary-line) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #modePill.mode-pill {
  min-width: 0 !important;
  color: var(--theme-primary-dark) !important;
  background: var(--theme-surface) !important;
  border: 1px solid var(--theme-line) !important;
  box-shadow: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
/* v2.13.12 Android WebView scroll stability.
   Keep long sheets in one plain software-friendly scroll surface. */
html[data-runtime="android-webview"] .bottom-sheet.open {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: auto !important;
  overscroll-behavior-y: contain;
  content-visibility: visible !important;
  contain: none !important;
  transform: none !important;
  will-change: auto !important;
  backface-visibility: visible !important;
}

html[data-runtime="android-webview"] .bottom-sheet.open :is(
  .checkbox-list,
  .settings-section,
  .customer-list,
  .draft-list,
  .dsr-monitor-list
) {
  content-visibility: visible !important;
  contain: none !important;
  transform: none !important;
  will-change: auto !important;
}
/* v2.13.12 map placement and role-pill refinement. */
.top-panel {
  top: calc(2px + var(--safe-top)) !important;
}

.map-quick-controls {
  top: calc(58px + var(--safe-top)) !important;
}

html[data-app-theme] #modePill.mode-pill {
  min-width: 118px !important;
  max-width: min(46vw, 205px) !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
}

html[data-runtime="android-webview"][data-app-theme] #modePill.mode-pill {
  min-width: 0 !important;
  max-width: min(38vw, 170px) !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
}
/* v2.14.0 carried-forward contract: submitted cloud requests remain visible after local drafts are cleared. */
.draft-review-history-entry {
  margin: 9px 0 2px;
}

.draft-review-history-entry button {
  width: 100%;
  min-height: 44px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 14px;
  font-weight: 900;
}

.draft-review-history-entry button b {
  color: var(--theme-primary-dark);
  font-size: 22px;
  line-height: 1;
}

.submitted-change-history-sheet .submitted-change-history-list {
  min-height: 120px;
  margin-top: 2px;
}

.draft-review-cloud-status {
  display: grid;
  gap: 9px;
  margin: 12px 0 4px;
}

.draft-cloud-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 2px;
}

.draft-cloud-title b {
  color: var(--theme-ink);
  font-size: 13px;
  font-weight: 950;
}

.draft-cloud-title span {
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 800;
}

.draft-cloud-status-card {
  overflow: hidden;
  border: 1px solid var(--theme-line);
  border-left: 5px solid var(--theme-primary-line);
  border-radius: 14px;
  background: var(--theme-surface);
  box-shadow: var(--theme-card-shadow);
}

.draft-cloud-status-card.draft { border-left-color: #f59e0b; }
.draft-cloud-status-card.applied { border-left-color: #6f9b79; }
.draft-cloud-status-card.rejected,
.draft-cloud-status-card.cancelled { border-left-color: #a87575; }
.draft-cloud-status-card.conflict { border-left-color: #b38b51; }

.draft-cloud-status-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 11px 7px;
}

.draft-cloud-status-main {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.draft-cloud-status-aside {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
}

.draft-cloud-customer-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--theme-ink);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.25;
}

.draft-cloud-status-head b {
  color: var(--theme-ink);
  font-size: 13px;
  font-weight: 950;
}

.draft-cloud-status-head span,
.draft-cloud-status-meta {
  color: var(--theme-muted);
  font-size: 9px;
  font-weight: 750;
}

.draft-cloud-status-head i {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--theme-primary-soft);
  color: var(--theme-title-ink);
  font-size: 9px;
  font-style: normal;
  font-weight: 950;
  text-transform: uppercase;
}

.draft-cloud-status-card.draft .draft-cloud-status-head i {
  background: color-mix(in srgb, #f59e0b 18%, var(--theme-surface));
  color: #7a4a00;
}
.draft-cloud-status-card.applied .draft-cloud-status-head i { background: #e1efe4; color: #3e6948; }
.draft-cloud-status-card.rejected .draft-cloud-status-head i,
.draft-cloud-status-card.cancelled .draft-cloud-status-head i { background: #f1e3e3; color: #7d4848; }
.draft-cloud-status-card.conflict .draft-cloud-status-head i { background: #f4ead7; color: #775b2e; }

.draft-cloud-status-meta {
  padding: 0 11px 8px;
}

.draft-cloud-fields {
  display: grid;
  gap: 1px;
  border-top: 1px solid var(--theme-line);
  background: var(--theme-line);
}

.draft-cloud-field {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(105px, .8fr) minmax(0, 1.2fr);
  gap: 8px;
  padding: 7px 10px;
  background: var(--theme-surface-soft);
}

.draft-cloud-field span,
.draft-cloud-review-note span {
  color: var(--theme-muted);
  font-size: 9px;
  font-weight: 850;
}

.draft-cloud-field b,
.draft-cloud-review-note b {
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--theme-ink);
  font-size: 10px;
  font-weight: 900;
  text-align: right;
}

.draft-cloud-field-empty {
  padding: 9px 10px;
  background: var(--theme-surface-soft);
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 750;
}

.draft-cloud-review-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  padding: 8px 10px;
  border-top: 1px solid var(--theme-line);
  background: var(--theme-surface);
}

.draft-cloud-review-note.pending {
  background: var(--theme-primary-soft);
}


#draftReviewSheet .salesmap-dialog-title {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid var(--theme-line);
  border-radius: 999px;
  background: var(--theme-surface);
  box-shadow: var(--theme-card-shadow);
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-cloud-status-card {
  width: 100%;
  margin-inline: 0;
  box-sizing: border-box;
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-cloud-status-head {
  padding-left: 8px;
  padding-right: 8px;
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-cloud-status-meta {
  padding-left: 8px;
  padding-right: 8px;
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-cloud-field {
  grid-template-columns: minmax(86px, .65fr) minmax(0, 1.35fr);
  padding-left: 8px;
  padding-right: 8px;
}

/* Browser keeps its existing Draft action layout; Android reuses Approval Center action grammar. */
html[data-runtime="browser-desktop"] #draftReviewSheet .draft-cloud-card-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  padding: 8px;
  border-top: 1px solid var(--theme-line);
  background: var(--theme-surface);
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-action-pill {
  width: auto;
  min-width: 0;
  height: 30px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid var(--theme-line);
  border-radius: 999px;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
  box-shadow: none;
  font-size: 10px;
  font-weight: 900;
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-edit-btn {
  border-color: var(--theme-primary-line);
  background: var(--theme-primary-soft);
  color: var(--theme-primary-dark);
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-remove-btn {
  border-color: color-mix(in srgb, var(--salesmap-ds-action-danger-text) 24%, var(--theme-line));
  background: var(--salesmap-ds-action-danger-soft);
  color: var(--salesmap-ds-action-danger-text);
}

html[data-runtime="browser-desktop"] #draftReviewSheet .draft-action-pill:active {
  transform: translateY(1px);
}

/* Submitted History and KAO Summary disclosures share the same compact row grammar as Menu navigation. */
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-change-history-list {
  min-height: 0 !important;
  gap: 8px !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month {
  overflow: hidden !important;
  border: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-lg) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(#submittedChangeHistorySheet, #dsrDailySummarySheet) .submitted-history-month-toggle {
  min-height: 44px !important;
  padding: 0 14px 0 10px !important;
  border: 0 !important;
  border-radius: var(--salesmap-ds-radius-lg) !important;
  background: var(--theme-surface) !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(#submittedChangeHistorySheet, #dsrDailySummarySheet) .submitted-history-month-toggle[aria-expanded="true"] {
  border-radius: var(--salesmap-ds-radius-lg) var(--salesmap-ds-radius-lg) 0 0 !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(#submittedChangeHistorySheet, #dsrDailySummarySheet) .submitted-history-month-chevron {
  width: 8px !important;
  height: 8px !important;
  flex: 0 0 auto !important;
  margin-right: 2px !important;
  border: 0 !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  color: var(--theme-primary-dark) !important;
  box-sizing: border-box !important;
  transform: rotate(-45deg) !important;
  transform-origin: center !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(#submittedChangeHistorySheet, #dsrDailySummarySheet) .submitted-history-month-toggle[aria-expanded="true"] .submitted-history-month-chevron {
  transform: rotate(45deg) !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(#submittedChangeHistorySheet, #dsrDailySummarySheet) .submitted-history-month-chevron::before,
html[data-runtime="android-webview"][data-app-theme] :is(#submittedChangeHistorySheet, #dsrDailySummarySheet) .submitted-history-month-chevron::after {
  content: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-content {
  gap: 8px !important;
  padding: 8px 0 0 !important;
  border-top: 0 !important;
  background: transparent !important;
}

/* Submitted records keep one outer status card with flat detail rows; no frame-inside-frame padding. */
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .draft-cloud-status-card {
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--theme-line) !important;
  border-left: 5px solid var(--theme-primary-line) !important;
  border-radius: 14px !important;
  background: var(--theme-surface) !important;
  box-shadow: var(--theme-card-shadow) !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .draft-cloud-status-card.applied {
  border-left-color: #6f9b79 !important;
}
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .draft-cloud-status-card.rejected,
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .draft-cloud-status-card.cancelled {
  border-left-color: #a87575 !important;
}
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .draft-cloud-status-card.conflict {
  border-left-color: #b38b51 !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .draft-cloud-field {
  border: 0 !important;
  border-radius: 0 !important;
}

/* Submitted History is two-level disclosure: month header, then independent request headers/cards. */
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-toggle,
html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-toggle[aria-expanded="true"] {
  border: 1px solid var(--theme-line) !important;
  border-radius: var(--salesmap-ds-radius-lg) !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-month-content {
  gap: 6px !important;
  padding: 6px 0 0 !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-request {
  box-shadow: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-request-toggle {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font: inherit !important;
  text-align: left !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-request-content[hidden] {
  display: none !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-request-content .draft-cloud-status-meta {
  padding-top: 0 !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-request-chevron {
  width: 8px !important;
  height: 8px !important;
  flex: 0 0 auto !important;
  margin: 0 2px 0 4px !important;
  border-right: 2px solid var(--theme-primary-dark) !important;
  border-bottom: 2px solid var(--theme-primary-dark) !important;
  box-sizing: border-box !important;
  transform: rotate(-45deg) !important;
  transform-origin: center !important;
}

html[data-runtime="android-webview"][data-app-theme] #submittedChangeHistorySheet .submitted-history-request-toggle[aria-expanded="true"] .submitted-history-request-chevron {
  transform: rotate(45deg) !important;
}
/* Android map-side actions use the same white floating surface; DSR keeps a clear circular boundary. */
html[data-runtime="android-webview"][data-app-theme] :is(
  #notificationsBtn.notification-float-btn,
  #gpsBtn.location-float-btn,
  #dsrFloatBtn.dsr-float-btn
) {
  background: var(--theme-surface) !important;
  color: var(--theme-primary-dark) !important;
  box-shadow: var(--theme-map-control-shadow) !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(
  #notificationsBtn.notification-float-btn,
  #gpsBtn.location-float-btn
) {
  border-color: transparent !important;
}

html[data-runtime="android-webview"][data-app-theme] #dsrFloatBtn.dsr-float-btn {
  border: 1px solid var(--theme-primary) !important;
  border-radius: 999px !important;
}

html[data-runtime="android-webview"][data-app-theme] :is(
  #notificationsBtn.notification-float-btn,
  #gpsBtn.location-float-btn,
  #dsrFloatBtn.dsr-float-btn
):is(:hover, :active, :focus, :focus-visible) {
  background: var(--theme-surface) !important;
  color: var(--theme-primary) !important;
  box-shadow: var(--theme-map-control-shadow) !important;
  outline: 0 !important;
  opacity: .78;
}

html[data-runtime="android-webview"][data-app-theme] #dsrFloatBtn.dsr-float-btn:is(:hover, :active, :focus, :focus-visible) {
  border-color: var(--theme-primary-dark) !important;
}

/* Icon-only map actions use one plain pin treatment without a circular control background. */
.map-pin-icon-btn,
html[data-app-theme] .map-pin-icon-btn {
  width: 30px !important;
  min-width: 30px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--theme-primary-dark) !important;
  font-size: 19px !important;
  line-height: 1 !important;
}

.map-pin-icon-btn:is(:hover, :active, :focus, :focus-visible),
html[data-app-theme] .map-pin-icon-btn:is(:hover, :active, :focus, :focus-visible) {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--theme-primary) !important;
  outline: 0 !important;
  opacity: .72;
}

/* Today/History Visit cards expose map navigation only through the unchanged Customer Code; the header is lifecycle status only. */
.dsr-card-head-actions .history-pin-icon-btn {
  display: none !important;
}

/* Management Viewer DSR Today keeps one-row controls, per-user pins, a compact summary, and clear bottom-pill spacing. */
html[data-runtime="android-webview"] body.management_viewer-mode .map-quick-controls {
  flex-wrap: nowrap !important;
}

html[data-runtime="android-webview"] body.management_viewer-mode .map-quick-row-break {
  display: none !important;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary {
  position: fixed;
  left: 14px;
  top: calc(94px + var(--safe-top));
  z-index: 904;
  box-sizing: border-box;
  max-width: calc(100vw - 28px);
  padding: 0 9px 7px;
  display: grid;
  grid-template-columns: 10px minmax(0, max-content) minmax(68px, max-content) minmax(86px, max-content) 18px;
  align-items: center;
  column-gap: 6px;
  row-gap: 5px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--theme-ink);
  font-size: 11px;
  line-height: 1.25;
  pointer-events: none;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary::before {
  content: '';
  position: absolute;
  inset: 25px 0 0;
  z-index: -1;
  border: 1px solid var(--theme-line);
  border-top: 0;
  border-radius: 0 12px 12px 12px;
  background: var(--theme-surface);
  box-shadow: var(--theme-map-control-shadow);
}

/* Supervisor quick controls can wrap to two rows, so the same summary component sits below that toolbar. */
html[data-runtime="android-webview"] body.supervisor-mode .management-dsr-today-summary {
  top: calc(130px + var(--safe-top));
}

/* History map owns its own Visit context, so the live Today summary stays out of that projection. */
html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode).history-map-view .management-dsr-today-summary {
  display: none !important;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary[hidden] {
  display: none !important;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-row {
  display: contents;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-site-tabs {
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, 60px);
  justify-self: start;
  width: auto;
  margin-left: -9px;
  margin-bottom: -1px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  pointer-events: auto;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-site-tabs button {
  min-height: 26px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 10px 10px 0 0;
  background: color-mix(in srgb, var(--theme-surface) 80%, transparent);
  box-shadow: none;
  color: var(--theme-muted);
  font-size: 11px;
  opacity: 1;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-site-tabs button.active {
  position: relative;
  z-index: 1;
  border-color: var(--theme-line);
  border-bottom: 0;
  background: var(--theme-surface);
  box-shadow: none;
  color: var(--theme-primary-dark);
  opacity: 1;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-group-label {
  grid-column: 1 / -1;
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 850;
  line-height: 1.2;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-group-label ~ .management-dsr-today-summary-group-label {
  margin-top: 2px;
  padding-top: 5px;
  border-top: 1px solid var(--theme-line);
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  filter: saturate(1.28);
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-name {
  appearance: none;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--theme-primary-dark);
  font: inherit;
  font-weight: 850;
  line-height: inherit;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  pointer-events: auto;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-name.active {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-lock {
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: center;
  border: 1px solid var(--theme-line);
  border-radius: 999px;
  color: transparent;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-lock.locked {
  border-color: var(--salesmap-ds-color-success, #22c55e);
  background: var(--salesmap-ds-color-success, #22c55e);
  color: #fff;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-history-action {
  grid-column: 1 / -1;
  padding-top: 2px;
  display: flex;
  gap: 6px;
  justify-content: flex-start;
  pointer-events: auto;
}

/* Reset remains immediately after the next-day arrow; Go to visit alone owns the far edge. */
html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-history-chip[data-management-dsr-history] {
  margin-left: auto;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-map-date-nav {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-width: 116px;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-map-date-nav-btn {
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border-radius: 999px;
  line-height: 1;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-map-date-nav-btn:disabled {
  opacity: 0.38;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-map-date-text {
  min-width: 48px;
  color: var(--salesmap-ds-color-text, #334155);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
}


html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) :is(
  .management-dsr-today-history-chip,
  .management-dsr-today-reset-chip
) {
  appearance: none;
  border: 0;
  background: var(--salesmap-ds-action-secondary-bg);
  color: var(--salesmap-ds-action-secondary-text);
  cursor: pointer;
  pointer-events: auto;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-map-date-nav-btn {
  border-color: var(--theme-muted, #7b8790) !important;
  background: var(--theme-muted, #7b8790) !important;
  color: var(--salesmap-ds-primitive-neutral-0, #fff) !important;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) :is(
  .management-dsr-today-summary-visited,
  .management-dsr-today-summary-time
) {
  white-space: nowrap;
  text-align: left;
  font-variant-numeric: tabular-nums;
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-time {
  color: var(--theme-muted);
}

html[data-runtime="android-webview"] body:is(.management_viewer-mode, .supervisor-mode) .management-dsr-today-summary-empty {
  grid-column: 1 / -1;
  color: var(--theme-muted);
  font-size: 11px;
  line-height: 1.3;
}

/* DSR Today and every History "Show Pins on Map" projection share the exact same marker frame. */
html[data-runtime="android-webview"] .pin-visual:is(.dsr-completed, .management-dsr-today, .dsr-history-visited) .custom-pin {
  border: 1px solid rgba(255, 255, 255, 0.82);
  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.34);
}

html[data-runtime="android-webview"] .pin-visual:is(.dsr-completed, .management-dsr-today, .dsr-history-visited) .pin-dsr-check.visit-order {
  border: 1px solid rgba(255, 255, 255, 0.82);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.24);
}


html[data-runtime="android-webview"] body.management_viewer-mode .sp-cluster.management-dsr-today-cluster {
  filter: saturate(1.28);
}

html[data-runtime="android-webview"][data-app-theme] body.management_viewer-mode #status.status-pill {
  max-width: min(42vw, 190px) !important;
}
/* v2.14.0 carried-forward finishing contract: customer audit, local recovery scope and picker safety. */

.customer-audit-action {
  width: 100%;
  margin-top: 9px;
}

.customer-audit-sheet {
  padding-bottom: calc(22px + var(--safe-bottom));
}

.customer-audit-overview {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.customer-audit-overview > div {
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--theme-line);
  border-radius: 12px;
  background: var(--theme-surface-soft);
}

.customer-audit-overview span,
.customer-audit-overview b {
  display: block;
}

.customer-audit-overview span {
  color: var(--theme-muted);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.customer-audit-overview b {
  margin-top: 4px;
  overflow: hidden;
  color: var(--theme-ink);
  font-size: 16px;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-audit-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 13px 0 9px;
}

.customer-audit-toolbar span {
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 850;
}

.customer-audit-toolbar button {
  flex: 0 0 auto;
  min-height: 36px;
}

.customer-audit-list {
  display: grid;
  gap: 10px;
}

.customer-audit-card {
  overflow: hidden;
  border: 1px solid var(--theme-line);
  border-radius: 14px;
  background: var(--theme-surface);
}

.customer-audit-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 13px 9px;
  border-bottom: 1px solid var(--theme-line);
  background: var(--theme-surface-soft);
}

.customer-audit-card-head > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.customer-audit-card-head b,
.customer-audit-card-head span,
.customer-audit-card-head i {
  overflow-wrap: anywhere;
}

.customer-audit-card-head b {
  color: var(--theme-ink);
  font-size: 13px;
  font-weight: 950;
}

.customer-audit-card-head span,
.customer-audit-card-head i {
  color: var(--theme-muted);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}

.customer-audit-meta,
.customer-audit-reason {
  margin: 9px 12px 0;
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 750;
  line-height: 1.4;
}

.customer-audit-reason {
  padding: 8px 9px;
  border-left: 3px solid var(--theme-primary-line);
  border-radius: 8px;
  background: var(--theme-primary-soft);
  color: var(--theme-ink);
}

.customer-audit-change-list {
  display: grid;
  gap: 6px;
  padding: 11px 12px 13px;
}

.customer-audit-change-row {
  display: grid;
  grid-template-columns: minmax(92px, .72fr) minmax(0, 1fr) 22px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 7px 9px;
  border: 1px solid var(--theme-line);
  border-radius: 10px;
  background: var(--theme-surface-soft);
}

.customer-audit-change-row b,
.customer-audit-change-row span,
.customer-audit-change-row strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.customer-audit-change-row b {
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 900;
}

.customer-audit-change-row span,
.customer-audit-change-row strong {
  color: var(--theme-ink);
  font-size: 11px;
  font-weight: 800;
}

.customer-audit-change-row em {
  color: var(--theme-primary-dark);
  font-size: 15px;
  font-style: normal;
  font-weight: 950;
  text-align: center;
}

.customer-audit-request-list {
  display: grid;
  gap: 6px;
  padding: 11px 12px 13px;
}

.customer-audit-request-row {
  display: grid;
  grid-template-columns: minmax(92px, .72fr) 22px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 7px 9px;
  border: 1px solid var(--theme-line);
  border-radius: 10px;
  background: var(--theme-surface-soft);
}

.customer-audit-request-row b,
.customer-audit-request-row strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 11px;
}

.customer-audit-request-row b {
  color: var(--theme-muted);
  font-weight: 900;
}

.customer-audit-request-row strong {
  color: var(--theme-ink);
  font-weight: 850;
}

.customer-audit-request-row em {
  color: var(--theme-primary-dark);
  font-size: 15px;
  font-style: normal;
  font-weight: 950;
  text-align: center;
}

.customer-audit-card.request-event.pending .customer-audit-card-head i,
.customer-audit-card.request-event.conflict .customer-audit-card-head i {
  color: var(--warning);
}

.customer-audit-card.request-event.applied .customer-audit-card-head i {
  color: var(--success);
}

.customer-audit-card.request-event.rejected .customer-audit-card-head i,
.customer-audit-card.request-event.cancelled .customer-audit-card-head i {
  color: var(--danger);
}

.customer-audit-no-fields {
  color: var(--theme-muted);
  font-size: 11px;
  font-weight: 750;
}

.database-backup-scope {
  line-height: 1.55;
}

/* Picking a customer location owns the map until Use Pin or Cancel is chosen. */
body.map-pick-active :is(
  .notification-float-btn,
  .dsr-float-btn,
  .gps-float-btn,
  .map-quick-controls,
  .top-panel,
  .status-pill,
  .mode-pill
) {
  display: none !important;
  pointer-events: none !important;
}

body.map-pick-active #map :is(
  .leaflet-control,
  .leaflet-marker-icon,
  .leaflet-interactive
) {
  pointer-events: none !important;
}

body.map-pick-active .map-picker-bar,
body.map-pick-active #confirmMapPickBtn,
body.map-pick-active #cancelMapPickBtn {
  pointer-events: auto !important;
}

@media (max-width: 560px) {
  .customer-audit-overview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .customer-audit-change-row {
    grid-template-columns: minmax(82px, .72fr) minmax(0, 1fr) 18px minmax(0, 1fr);
    gap: 5px;
  }
}

@media (min-width: 901px) {
  html[data-runtime="browser-desktop"] #customerAuditTimelineSheet .desktop-fill-body {
    display: flex;
    min-height: 0;
    flex-direction: column;
  }

  html[data-runtime="browser-desktop"] #customerAuditTimelineSheet .customer-audit-list {
    min-height: 0;
    flex: 1 1 auto;
    overflow: auto;
  }

  html[data-runtime="browser-desktop"] #customerAuditTimelineSheet .customer-audit-overview {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
:root { --salesmap-ui-icon-size: 1.08em; }

[data-ui-icon] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .42em;
}
[data-ui-icon]::before,
[data-ui-field-icon="search"]::before {
  content: "";
  flex: 0 0 auto;
  width: var(--salesmap-ui-icon-size);
  height: var(--salesmap-ui-icon-size);
  background-color: currentColor;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}
[data-ui-icon="product-management"]::before { -webkit-mask-image: url("ui-icons/product-management.png?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/product-management.png?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="dashboard"]::before { -webkit-mask-image: url("ui-icons/dashboard.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/dashboard.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="team-performance"]::before { -webkit-mask-image: url("ui-icons/team-performance.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/team-performance.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="dsr"]::before { -webkit-mask-image: url("ui-icons/dsr.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/dsr.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="stock-check"]::before { -webkit-mask-image: url("ui-icons/stock-check.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/stock-check.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="schedule"]::before { -webkit-mask-image: url("ui-icons/schedule.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/schedule.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="customer-management"]::before { -webkit-mask-image: url("ui-icons/customer-management.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/customer-management.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="users-access"]::before { -webkit-mask-image: url("ui-icons/users-access.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/users-access.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="approval"]::before { -webkit-mask-image: url("ui-icons/approval.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/approval.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="tools"]::before { -webkit-mask-image: url("ui-icons/tools.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/tools.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="settings"]::before { -webkit-mask-image: url("ui-icons/settings.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/settings.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="notifications"]::before { -webkit-mask-image: url("ui-icons/notifications.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/notifications.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="search"]::before,
[data-ui-field-icon="search"]::before { -webkit-mask-image: url("ui-icons/search.png?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/search.png?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="filter"]::before { -webkit-mask-image: url("ui-icons/filter.png?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/filter.png?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="edit"]::before { -webkit-mask-image: url("ui-icons/edit.png?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/edit.png?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="trash"]::before { -webkit-mask-image: url("ui-icons/trash.png?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/trash.png?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="map-pin"]::before { -webkit-mask-image: url("ui-icons/map-pin.png?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/map-pin.png?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="history"]::before { -webkit-mask-image: url("ui-icons/history.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/history.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="undo"]::before { -webkit-mask-image: url("ui-icons/undo.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/undo.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="calendar-prev"]::before { -webkit-mask-image: url("ui-icons/calendar-prev.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/calendar-prev.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="calendar-next"]::before { -webkit-mask-image: url("ui-icons/calendar-next.svg?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/calendar-next.svg?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="refresh"]::before { -webkit-mask-image: url("ui-icons/refresh.png?v=2.19.0-browser-e76f363f51a528986eb5"); mask-image: url("ui-icons/refresh.png?v=2.19.0-browser-e76f363f51a528986eb5"); }
[data-ui-icon="scroll-down"]::before {
  -webkit-mask-image: url("ui-icons/scroll-down.png?v=2.19.0-browser-e76f363f51a528986eb5");
  mask-image: url("ui-icons/scroll-down.png?v=2.19.0-browser-e76f363f51a528986eb5");
}

[data-ui-icon][data-ui-icon-only="true"] { gap: 0; font-size: 0 !important; }
[data-ui-icon][data-ui-icon-only="true"]::before { width: 20px; height: 20px; }
[data-ui-icon] > svg,
[data-ui-icon] > .legacy-action-icon { display: none !important; }

/* Search decoration is explicit. Never infer a wrapper from every search input. */
[data-ui-field-icon="search"] { position: relative; min-width: 0; }
[data-ui-field-icon="search"]::before {
  position: absolute;
  z-index: 2;
  left: 14px;
  top: 50%;
  width: 17px;
  height: 17px;
  color: var(--theme-muted);
  transform: translateY(-50%);
  pointer-events: none;
}
[data-ui-field-icon="search"] > input[type="search"],
[data-ui-field-icon="search"] > input[type="text"],
[data-ui-field-icon="search"] > span > input[type="search"],
[data-ui-field-icon="search"] > span > input[type="text"] { padding-left: 42px !important; }
[data-ui-field-icon="search"] input::-webkit-search-cancel-button,
[data-ui-field-icon="search"] input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; }
[data-ui-field-icon="search"] > span[aria-hidden="true"] { display: none !important; }

:is(.customer-row-icon-btn,.customer-row-undo-btn,.product-row-action)[data-ui-icon] { font-size: 0 !important; gap: 0 !important; }
:is(.customer-row-icon-btn,.customer-row-undo-btn,.product-row-action)[data-ui-icon]::before { width: 18px; height: 18px; }
[data-ui-icon-only="true"] > i { font-size: 9px; }
.month-nav-btn[data-ui-icon], .summary-date-btn[data-ui-icon] { font-size: 0 !important; gap: 0 !important; }
.month-nav-btn[data-ui-icon]::before, .summary-date-btn[data-ui-icon]::before { width: 17px; height: 17px; }

/* The Android map search stays a flex row; the icon is overlaid inside the input area only. */
html[data-runtime="android-webview"] .search-wrap[data-ui-field-icon="search"] {
  display: flex;
  align-items: center;
}
html[data-runtime="android-webview"] .search-wrap[data-ui-field-icon="search"]::before {
  left: 18px;
  width: 18px;
  height: 18px;
}
html[data-runtime="android-webview"] .search-wrap[data-ui-field-icon="search"] > #searchInput {
  padding-left: 35px !important;
}
.sheet-scroll-hint[data-ui-icon="scroll-down"]::before { width: 32px; height: 18px; }

/* Semantic arrows are geometry-owned UI primitives; consumers provide direction, never glyph characters. */
[data-ui-arrow] {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  color: currentColor;
}
[data-ui-arrow="right"] {
  width: 18px;
  height: 12px;
}
[data-ui-arrow="right"]::before {
  content: "";
  position: absolute;
  left: 1px;
  right: 2px;
  top: 50%;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  transform: translateY(-50%);
}
[data-ui-arrow="right"]::after {
  content: "";
  position: absolute;
  right: 1px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg);
  transform-origin: center;
}
[data-ui-arrow="disclosure"] {
  width: 12px;
  height: 12px;
  transition: transform .16s ease;
}
[data-ui-arrow="disclosure"]::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 2px;
  width: 6px;
  height: 6px;
  border-top: 2px solid currentColor;
  border-right: 2px solid currentColor;
  transform: rotate(45deg);
}
details[open] > summary [data-ui-arrow="disclosure"] {
  transform: rotate(90deg);
}

.customer-business-profile-panel {
  min-width: 0;
  margin: 8px 0 10px;
  padding: 8px 0 0;
  border: 0;
  border-top: 1px solid var(--line-soft);
}
.customer-business-profile-panel legend {
  margin: 0 0 5px;
  padding: 0 4px 0 0;
  color: var(--text-main);
  background: var(--surface);
  font-size: 12px;
  font-weight: 850;
  line-height: 1.2;
}
.customer-business-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 8px;
  row-gap: 3px;
}
.customer-business-profile-grid label {
  min-width: 0;
  min-height: 31px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 4px 6px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: var(--surface-soft);
  color: var(--text-main);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.15;
}
.customer-business-profile-grid label[hidden],
.customer-business-profile-panel[hidden] {
  display: none !important;
}
.customer-business-profile-grid label span { min-width: 0; }
.customer-business-profile-grid input {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  margin: 0;
  accent-color: var(--theme-accent);
}
.customer-business-profile-grid input:disabled + span { opacity: .58; }
.customer-inheritance-hint {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px 8px;
  margin-top: 8px;
  padding: 9px 10px;
  border: 1px solid var(--salesmap-ds-color-line);
  border-radius: var(--salesmap-ds-radius-sm);
  background: var(--salesmap-ds-color-surface-soft);
  color: var(--salesmap-ds-color-text);
  font-size: var(--salesmap-ds-type-helper-size);
  line-height: 1.4;
  text-align: left;
}
.customer-inheritance-hint[hidden] { display: none !important; }
.customer-inheritance-title { font-weight: var(--salesmap-ds-font-weight-semibold); }
.customer-inheritance-code {
  max-width: 16ch;
  padding: 2px 7px;
  border: 1px solid var(--salesmap-ds-color-line);
  border-radius: var(--salesmap-ds-radius-pill);
  background: var(--salesmap-ds-color-surface);
  color: var(--salesmap-ds-color-text-muted);
  overflow-wrap: anywhere;
  font-size: var(--salesmap-ds-font-size-2xs);
  font-weight: var(--salesmap-ds-font-weight-strong);
}
.customer-inheritance-detail { grid-column: 1 / -1; color: var(--salesmap-ds-color-text-muted); }
html[data-runtime="android-webview"] .customer-business-profile-panel.form-row { margin-top: 6px; margin-bottom: 8px; }
html[data-runtime="android-webview"] .customer-business-profile-panel legend { width: 100%; text-align: left; }
html[data-runtime="android-webview"] .customer-business-profile-grid label:last-child:nth-child(odd) { grid-column: auto; }
html[data-runtime="browser-desktop"] #addCustomerSheet .customer-business-profile-panel,
html[data-runtime="browser-desktop"] #editSheet .customer-business-profile-panel { grid-column: 1 / -1; }
@media (min-width: 900px) {
  html[data-runtime="browser-desktop"] .customer-business-profile-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  html[data-runtime="browser-desktop"] .customer-business-profile-grid label { min-height: 34px; padding: 5px 8px; }
}

.customer-service-requirements-panel { margin-top: 2px; }
.customer-service-requirements-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html[data-runtime="browser-desktop"] .customer-service-requirements-grid { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
html[data-runtime="browser-desktop"] .salesmap-bulk-form-subhead {
  margin: 7px 0 1px;
  padding-top: 7px;
  border-top: 1px solid var(--line-soft);
  color: var(--text-main);
  font-size: 11px;
  font-weight: 850;
}


/* Edit Customer keeps the optional Head-name action on the Company Name title row. */
.customer-name-action-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 8px;
}
.customer-name-action-row > .form-label {
  grid-column: 1;
  grid-row: 1;
  margin-bottom: 6px;
}
.customer-name-action-row > #editNameInput {
  grid-column: 1 / -1;
  grid-row: 2;
}
.customer-name-action-row > #editUseHeadNameBtn {
  grid-column: 2;
  grid-row: 1;
  justify-self: end;
  min-height: 22px;
  margin: 0 0 6px;
  padding: 3px 9px;
  border: 0;
  border-radius: var(--salesmap-ds-radius-pill);
  background: var(--salesmap-ds-color-text-muted);
  color: var(--salesmap-ds-primitive-neutral-0);
  font-size: var(--salesmap-ds-font-size-2xs);
  font-weight: var(--salesmap-ds-font-weight-semibold);
  line-height: 1;
  white-space: nowrap;
}
.customer-name-action-row > #editUseHeadNameBtn[hidden] {
  display: none !important;
}
.customer-name-action-row > #editUseHeadNameBtn:active {
  background: var(--salesmap-ds-color-text);
}

.history-search-field {
  position: relative;
  display: block;
  min-width: 0;
}
.history-search-field .dsr-history-search {
  width: 100%;
  padding-left: 40px !important;
}
#dsrHistorySheet .history-show-map-btn[data-ui-icon]::before {
  width: 16px;
  height: 16px;
}
#mapFilterQuickBtn[data-ui-icon] { overflow: visible !important; }
#mapFilterQuickBtn[data-ui-icon]::before { width: 22px !important; height: 22px !important; }
#mapFilterQuickBtn[data-ui-icon] > svg { display: none !important; }
.search-wrap[data-ui-field-icon="search"] > input { padding-left: 43px !important; }

#dsrHistorySheet .dsr-history-results-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 250px);
  gap: 12px;
  align-items: end;
}
#dsrHistorySheet .history-search-wrap {
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
}
#dsrHistorySheet .history-search-field { min-width: 0; width: 100%; }
#dsrHistorySheet .history-search-field .dsr-history-search { width: 100%; }
#dsrHistorySheet .history-control-label { position: static; transform: none; }
#dsrHistorySheet .history-show-map-btn { width: 100%; }
@media (max-width: 760px) {
  #dsrHistorySheet .dsr-history-results-toolbar { grid-template-columns: 1fr; }
}


@media (min-width: 901px) {
  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap {
    position: relative;
    min-width: 0;
    width: 100%;
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap[data-ui-field-icon="search"]::before {
    left: 13px;
    width: 18px;
    height: 18px;
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap input {
    width: 100%;
    min-height: 42px;
    height: 42px;
    padding: 0 84px 0 40px !important;
    border: 1px solid var(--theme-line);
    border-radius: 12px;
    background: var(--theme-surface);
    color: var(--theme-ink);
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap input::-webkit-search-cancel-button,
  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap input::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
    display: none;
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap > :is(.search-clear-btn,.search-filter-btn) {
    position: absolute;
    top: 50%;
    z-index: 3;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: var(--theme-icon-ink);
    box-shadow: none;
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap > .search-clear-btn {
    right: 40px;
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
    padding: 0;
    border-radius: 8px;
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap > .search-clear-btn[hidden] { display: none !important; }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap > .search-filter-btn {
    right: 7px;
    width: 32px;
    min-width: 32px;
    height: 36px;
    min-height: 36px;
    padding: 5px;
    border-radius: 9px;
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap > .search-filter-btn i {
    position: absolute;
    top: -3px;
    right: -3px;
    display: inline-grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--theme-primary);
    color: #fff;
    font-size: 8px;
    font-style: normal;
    font-weight: 950;
  }

  html[data-runtime="browser-desktop"] .salesmap-management-search-wrap > :is(.search-filter-btn:is(:hover,[aria-expanded="true"]),.search-clear-btn:hover) {
    background: var(--theme-primary-soft);
    color: var(--theme-primary-dark);
  }
}
html[data-runtime="android-webview"] .customer-business-profile-panel legend {
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}
html[data-runtime="android-webview"] .customer-business-profile-grid {
  align-items: start;
}
html[data-runtime="android-webview"] .customer-business-profile-grid label {
  justify-content: flex-start;
  text-align: left;
}

/* Check-In GPS retry stays contextual: status left, secondary chip right, detail on its own line. */
html[data-runtime="android-webview"] #dsrCheckInSheet .dsr-checkin-status-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--salesmap-ds-spacing-control-gap);
}
html[data-runtime="android-webview"] #dsrCheckInSheet .dsr-checkin-status-head > #dsrGetGpsBtn {
  width: auto;
  min-width: 0;
  min-height: 32px;
  height: 32px;
  padding: 0 9px;
  margin: 0;
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-type-helper-weight);
  line-height: var(--salesmap-ds-type-helper-line-height);
}
html[data-runtime="android-webview"] #dsrCheckInSheet #dsrGpsText {
  white-space: pre-line;
}

/* Check-Out capture utilities stay contextual without reviving the old framed GPS card. */
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-checkout-location-zone {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--salesmap-ds-spacing-control-gap);
  margin: var(--salesmap-ds-spacing-field-gap) 0;
}
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-checkout-location-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-checkout-inline-action {
  width: auto;
  min-width: 0;
  min-height: 32px;
  height: 32px;
  padding: 0 9px;
  margin: 0;
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-type-helper-weight);
  line-height: var(--salesmap-ds-type-helper-line-height);
}

/* Photo evidence actions follow the visible-action count: one fills the row, two share it equally. */
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-photo-editor-actions {
  display: flex;
  gap: var(--salesmap-ds-spacing-control-gap);
}
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-photo-editor-actions > button {
  flex: 1 1 0;
  min-width: 0;
}
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-photo-editor-actions > button[hidden] {
  display: none !important;
}

/* Check-Out stacks full-width Cancel/Confirm; Edit keeps Delete left and Save right in normal flow. */
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-checkout-commit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--salesmap-ds-spacing-control-gap);
  margin-top: var(--salesmap-ds-spacing-field-gap);
}
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-checkout-commit-actions > button {
  width: 100%;
  min-width: 0;
}
html[data-runtime="android-webview"] #dsrCheckOutSheet #cancelDsrCheckOutBtn {
  flex: 0 0 100%;
}
html[data-runtime="android-webview"] #dsrCheckOutSheet :is(#deleteDsrCheckoutEditBtn, #saveDsrCheckOutBtn) {
  flex: 1 1 0;
}
html[data-runtime="android-webview"] #dsrCheckOutSheet .dsr-checkout-commit-actions > button[hidden] {
  display: none !important;
}

/* Check-In commit actions stay full-width regardless of the CTA's current semantic state. */
html[data-runtime="android-webview"] #dsrCheckInSheet .dsr-checkin-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--salesmap-ds-spacing-control-gap);
  margin-top: var(--salesmap-ds-spacing-field-gap);
}
html[data-runtime="android-webview"] #dsrCheckInSheet .dsr-checkin-actions > button {
  width: 100%;
  min-width: 0;
}

/* One open-visit action fills the row; Stock Check + Take Photo share it equally when both are visible. */
html[data-runtime="android-webview"] #customerSheet .customer-open-visit-actions {
  display: flex;
  gap: var(--salesmap-ds-spacing-control-gap);
  margin-top: var(--salesmap-ds-spacing-control-gap);
}
html[data-runtime="android-webview"] #customerSheet .customer-open-visit-actions[hidden] {
  display: none !important;
}
html[data-runtime="android-webview"] #customerSheet .customer-open-visit-actions > .secondary-action {
  flex: 1 1 0;
  min-width: 0;
}

#dsrHistorySheet .compact-history-summary .period-value {
  font-size: 13px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
#dsrHistorySheet .compact-history-summary .money-values {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  flex-wrap: wrap;
  line-height: 1.2;
}
#dsrHistorySheet .compact-history-summary .money-values b,
#dsrHistorySheet .compact-history-summary .money-values i {
  font-style: normal;
}
#dsrHistorySheet .compact-history-summary .money-values .sales { color: #3f6a52; }
#dsrHistorySheet .compact-history-summary .money-values .return { color: #8a5a4d; }
/*
 * Shared Management Table contract.
 * Add `salesmap-management-table` to future Customer/Product/Admin data tables
 * so typography, row rhythm, checkbox language and sortable headers stay aligned.
 */
html[data-runtime="browser-desktop"] .salesmap-management-table-frame {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  border-radius: 12px;
  scrollbar-gutter: stable;
}

html[data-runtime="browser-desktop"] .salesmap-management-table th,
html[data-runtime="browser-desktop"] .salesmap-management-table td {
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle !important;
  font-weight: 500;
}

html[data-runtime="browser-desktop"] .salesmap-management-table td,
html[data-runtime="browser-desktop"] .salesmap-management-table td > b,
html[data-runtime="browser-desktop"] .salesmap-management-table td > strong,
html[data-runtime="browser-desktop"] .salesmap-management-table .customer-cell-code,
html[data-runtime="browser-desktop"] .salesmap-management-table .customer-cell-name,
html[data-runtime="browser-desktop"] .salesmap-management-table td[data-customer-column="sp"],
html[data-runtime="browser-desktop"] .salesmap-management-table td[data-customer-column="area"],
html[data-runtime="browser-desktop"] .salesmap-management-table .product-cell-code,
html[data-runtime="browser-desktop"] .salesmap-management-table .product-cell-name,
html[data-runtime="browser-desktop"] .salesmap-management-table .product-cell-center {
  font-weight: 500 !important;
}

html[data-runtime="browser-desktop"] .salesmap-management-table th {
  overflow: visible;
  text-align: center !important;
  text-overflow: clip;
  white-space: normal;
  text-transform: uppercase;
}

html[data-runtime="browser-desktop"] .salesmap-management-table th > :is(span, b, strong),
html[data-runtime="browser-desktop"] .salesmap-management-table th:first-child {
  text-align: center !important;
}

html[data-runtime="browser-desktop"] .salesmap-management-table thead th {
  position: sticky;
  top: 0;
  z-index: 8;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header {
  width: 100% !important;
  min-width: 0;
  display: grid !important;
  grid-template-columns: 14px minmax(0, auto) 14px;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  font: inherit !important;
  text-align: center !important;
  text-transform: inherit !important;
  cursor: pointer;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header::before {
  content: "";
  width: 14px;
  height: 1px;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header > span {
  min-width: 0;
  overflow: visible;
  text-align: center;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.05;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header > i {
  position: relative !important;
  width: 14px !important;
  height: 20px !important;
  flex: none !important;
  color: var(--theme-muted);
  font-size: 0 !important;
  font-style: normal;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header > i::before,
html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header > i::after {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: 8px;
  font-weight: 950;
  line-height: 1;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header > i::before {
  content: "▲";
  top: 1px;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header > i::after {
  content: "▼";
  bottom: 1px;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header.sort-asc > i::before,
html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header.sort-desc > i::after {
  color: var(--theme-primary-dark);
  font-size: 11px;
}

html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header.sort-asc > i::after,
html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-sort-header.sort-desc > i::before {
  opacity: .22;
}

html[data-runtime="browser-desktop"] .salesmap-management-table input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
  display: inline-grid !important;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--theme-muted) 72%, var(--theme-line)) !important;
  border-radius: 4px !important;
  background: var(--theme-surface) !important;
  cursor: pointer;
  vertical-align: middle;
}

html[data-runtime="browser-desktop"] .salesmap-management-table input[type="checkbox"]:checked,
html[data-runtime="browser-desktop"] .salesmap-management-table input[type="checkbox"]:indeterminate {
  border-color: var(--theme-primary) !important;
  background: var(--theme-primary) !important;
}

html[data-runtime="browser-desktop"] .salesmap-management-table input[type="checkbox"]:checked::after {
  content: "✓";
  color: #fff;
  font-size: 12px;
  font-weight: 950;
  line-height: 1;
}

html[data-runtime="browser-desktop"] .salesmap-management-table input[type="checkbox"]:indeterminate::after {
  content: "−";
  color: #fff;
  font-size: 13px;
  font-weight: 950;
  line-height: 1;
}


/* Shared alignment contract for all management tables. */
html[data-runtime="browser-desktop"] .salesmap-management-table th:has(> input[type="checkbox"]),
html[data-runtime="browser-desktop"] .salesmap-management-table td:has(> input[type="checkbox"]),
html[data-runtime="browser-desktop"] .salesmap-management-table th:first-child,
html[data-runtime="browser-desktop"] .salesmap-management-table td:first-child,
html[data-runtime="browser-desktop"] .salesmap-management-table .salesmap-table-cell-center {
  text-align: center !important;
}

html[data-runtime="browser-desktop"] .salesmap-management-table th:has(> input[type="checkbox"]),
html[data-runtime="browser-desktop"] .salesmap-management-table td:has(> input[type="checkbox"]) {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html[data-runtime="browser-desktop"] .salesmap-management-table th:has(> input[type="checkbox"]) > input,
html[data-runtime="browser-desktop"] .salesmap-management-table td:has(> input[type="checkbox"]) > input {
  margin-inline: auto !important;
}

/*
 * Summary contract: do not create new 2x2 metric grids.
 * Use one rounded `salesmap-summary-list`; every direct child is one label/value row.
 */
.salesmap-summary-list,
#dsrHistorySheet .compact-history-summary.salesmap-summary-list,
#dsrSheet .dsr-summary-grid.salesmap-summary-list,
#dsrDailySummarySheet .salesmap-summary-list {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  gap: 0 !important;
  overflow: hidden !important;
  margin: 8px 0 12px !important;
  padding: 0 !important;
  border: 1px solid var(--theme-line) !important;
  border-left: 4px solid var(--theme-primary) !important;
  border-radius: 16px !important;
  background: var(--theme-surface) !important;
  box-shadow: var(--theme-card-shadow) !important;
}

.salesmap-summary-list > :is(.dsr-summary-item, .manager-overview-card, div),
#dsrHistorySheet .compact-history-summary.salesmap-summary-list > .dsr-summary-item,
#dsrSheet .dsr-summary-grid.salesmap-summary-list > .dsr-summary-item,
#dsrDailySummarySheet .salesmap-summary-list > :is(.manager-overview-card, div) {
  min-width: 0 !important;
  min-height: 42px !important;
  display: grid !important;
  grid-template-columns: minmax(132px, .9fr) minmax(0, 1.1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 8px 14px !important;
  border: 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid var(--theme-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
}

.salesmap-summary-list > :is(.dsr-summary-item, .manager-overview-card, div):last-child,
#dsrHistorySheet .compact-history-summary.salesmap-summary-list > .dsr-summary-item:last-child {
  border-bottom: 0 !important;
}

.salesmap-summary-list :is(.dsr-summary-label, .manager-overview-label),
.salesmap-summary-list > :is(.dsr-summary-item, .manager-overview-card, div) > span,
#dsrHistorySheet .compact-history-summary.salesmap-summary-list .dsr-summary-label {
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--theme-muted) !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

.salesmap-summary-list :is(.dsr-summary-value, .manager-overview-value, b, strong),
#dsrHistorySheet .compact-history-summary.salesmap-summary-list .dsr-summary-value {
  min-width: 0 !important;
  margin: 0 !important;
  color: var(--theme-ink) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  overflow-wrap: anywhere !important;
}

.salesmap-summary-list .dsr-summary-value.sales,
.salesmap-summary-list .money-sales { color: #3f6a52 !important; }
.salesmap-summary-list .dsr-summary-value.return,
.salesmap-summary-list .money-return { color: #8a5a4d !important; }

.salesmap-summary-list .money-values {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}

.salesmap-summary-list .money-values :is(b, i) {
  width: auto !important;
  font-style: normal !important;
}

html[data-runtime="android-webview"] .salesmap-summary-list,
html[data-runtime="android-webview"] #dsrHistorySheet .compact-history-summary.salesmap-summary-list {
  margin: 7px 0 10px !important;
  border-radius: 15px !important;
}

html[data-runtime="android-webview"] .salesmap-summary-list > :is(.dsr-summary-item, .manager-overview-card, div),
html[data-runtime="android-webview"] #dsrHistorySheet .compact-history-summary.salesmap-summary-list > .dsr-summary-item {
  grid-template-columns: minmax(128px, .94fr) minmax(0, 1.06fr) !important;
  min-height: 39px !important;
  padding: 7px 11px !important;
  gap: 9px !important;
}

html[data-runtime="android-webview"] .salesmap-summary-list :is(.dsr-summary-label, .manager-overview-label),
html[data-runtime="android-webview"] .salesmap-summary-list > :is(.dsr-summary-item, .manager-overview-card, div) > span,
html[data-runtime="android-webview"] #dsrHistorySheet .compact-history-summary.salesmap-summary-list .dsr-summary-label {
  font-size: 9.5px !important;
}

html[data-runtime="android-webview"] .salesmap-summary-list :is(.dsr-summary-value, .manager-overview-value, b, strong),
html[data-runtime="android-webview"] #dsrHistorySheet .compact-history-summary.salesmap-summary-list .dsr-summary-value {
  font-size: 14px !important;
}

/* All roles share the same denser Android DSR calendar. */
html[data-runtime="android-webview"] .salesmap-compact-calendar {
  margin: 7px 0 !important;
  padding: 9px !important;
  border-radius: 16px !important;
  border-color: var(--salesmap-ds-color-line);
  background: var(--salesmap-ds-color-surface);
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .history-section-heading {
  margin-bottom: 4px !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .dsr-calendar-nav {
  min-height: 38px !important;
  margin: 1px 0 5px !important;
  padding: 3px 5px !important;
  border-radius: 12px !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .month-nav-btn {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  min-height: 34px !important;
  border-radius: 50% !important;
  background: var(--salesmap-ds-primitive-neutral-0, #fff) !important;
  opacity: 1 !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .month-nav-btn:disabled {
  color: var(--theme-muted) !important;
}
html[data-runtime="android-webview"] .salesmap-compact-calendar .month-nav-btn:disabled::before,
html[data-runtime="android-webview"] .salesmap-compact-calendar .month-nav-btn:disabled > * {
  opacity: 0.34;
}

#dsrManagerSummaryList .manager-summary-status-pills {
  text-transform: uppercase;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .dsr-calendar-month {
  font-size: 13px !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .dsr-calendar-collapse-toggle {
  width: 100%;
  min-height: 32px;
  margin: 0;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  text-align: center;
  -webkit-tap-highlight-color: transparent;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .dsr-calendar-collapse-toggle.is-current-month {
  border-radius: 9px;
  background: var(--salesmap-ds-color-primary) !important;
  color: var(--salesmap-ds-primitive-neutral-0, #fff) !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar[data-calendar-collapsed="true"] .dsr-calendar-body {
  display: none !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar[data-calendar-collapsed="true"] .dsr-calendar-nav {
  margin-bottom: 1px !important;
}

html[data-runtime="android-webview"][data-app-theme] #todayDsrSummaryBtn.history-today-chip,
html[data-runtime="android-webview"][data-app-theme] #todayDsrHistoryBtn.history-today-chip {
  border-color: var(--salesmap-ds-color-primary) !important;
  background: var(--salesmap-ds-color-primary) !important;
  color: #fff !important;
}

html[data-runtime="android-webview"] #dsrDailySummarySheet .dsr-summary-today-anchor {
  display: none !important;
}

/* Team DSR Summary keeps one compact, shared value start for Date and every metric. */
html[data-runtime="android-webview"] #dsrDailySummarySheet .salesmap-summary-list > .manager-overview-card {
  grid-template-columns: 88px minmax(0, 1fr) !important;
  column-gap: 8px !important;
}

html[data-runtime="android-webview"] #dsrDailySummarySheet .salesmap-summary-list > .manager-overview-card.period {
  grid-template-columns: 88px minmax(0, 1fr) max-content !important;
}

/* My DSR History and Team DSR History share this sheet and the same compact value start. */
html[data-runtime="android-webview"] #dsrSheet .dsr-summary-grid.salesmap-summary-list > .dsr-summary-item,
html[data-runtime="android-webview"] #dsrHistorySheet .compact-history-summary.salesmap-summary-list > .dsr-summary-item {
  grid-template-columns: 88px minmax(0, 1fr) !important;
  column-gap: 8px !important;
}

html[data-runtime="android-webview"] #dsrDailySummarySheet .manager-overview-card.period > #todayDsrSummaryBtn {
  position: static;
  justify-self: end;
  min-height: 28px;
  margin: 0;
  padding: 5px 10px;
}

html[data-runtime="android-webview"] #dsrDailySummarySheet .manager-overview-value {
  white-space: pre-line;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar :is(.dsr-calendar-weekdays, .dsr-calendar-grid) {
  gap: 3px !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .dsr-calendar-weekdays > div {
  font-size: 8.5px !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .dsr-calendar-day {
  min-height: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  border-radius: 9px !important;
  font-size: 12px !important;
}

html[data-runtime="android-webview"] .salesmap-compact-calendar .dsr-calendar-day.has-records::before {
  bottom: 2px !important;
  width: 3px !important;
  height: 3px !important;
}
html[data-runtime="browser-desktop"] .salesmap-bulk-change-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

html[data-runtime="browser-desktop"] .salesmap-bulk-change-field {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--theme-line);
  border-radius: 11px;
  background: var(--theme-surface);
}

html[data-runtime="browser-desktop"] .salesmap-bulk-change-field > label,
html[data-runtime="browser-desktop"] .salesmap-bulk-change-field > span {
  min-width: 120px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--theme-ink);
  font-size: 10px;
  font-weight: 800;
  line-height: 1.2;
}

html[data-runtime="browser-desktop"] .salesmap-bulk-change-field > :is(select, input:not([type="checkbox"])) {
  width: 100%;
  min-width: 0;
  min-height: 38px;
}

html[data-runtime="browser-desktop"] .salesmap-bulk-change-field > :is(select, input):disabled {
  opacity: .48;
  cursor: not-allowed;
}

html[data-runtime="browser-desktop"] .salesmap-bulk-change-field input[type="checkbox"] {
  width: 17px;
  height: 17px;
  margin: 0;
}

html[data-runtime="browser-desktop"] .salesmap-bulk-section {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--theme-line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--theme-surface-soft) 42%, var(--theme-surface));
}

html[data-runtime="browser-desktop"] .salesmap-bulk-section > legend {
  padding: 0 7px;
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

html[data-runtime="browser-desktop"] .product-bulk-preview-table {
  width: 1632px;
  min-width: 1632px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-select { width: 52px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-name { width: 250px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-code { width: 130px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-status { width: 105px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-brand { width: 135px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-category { width: 170px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-candy-type { width: 145px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-supply-source { width: 145px; }
html[data-runtime="browser-desktop"] .product-bulk-preview-table .p-boolean { width: 125px; }

html[data-runtime="browser-desktop"] .customer-bulk-preview-table {
  width: 1877px;
  min-width: 1877px;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}

html[data-runtime="browser-desktop"] .customer-bulk-preview-table .col-select { width: 52px; }
html[data-runtime="browser-desktop"] .customer-bulk-preview-table .col-code { width: 145px; }
html[data-runtime="browser-desktop"] .customer-bulk-preview-table .col-name { width: 330px; }
html[data-runtime="browser-desktop"] .customer-bulk-preview-table .col-status { width: 100px; }
html[data-runtime="browser-desktop"] .customer-bulk-preview-table .col-sp { width: 90px; }
html[data-runtime="browser-desktop"] .customer-bulk-preview-table .col-area { width: 180px; }
html[data-runtime="browser-desktop"] .customer-bulk-preview-table .col-business { width: 140px; }

@media (max-width: 1060px) {
  html[data-runtime="browser-desktop"] .salesmap-bulk-change-grid {
    grid-template-columns: 1fr;
  }
}
.stock-check-checkout-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}
.stock-check-checkout-copy {
  display: grid;
  min-width: 0;
  align-content: center;
  justify-items: start;
  gap: 4px;
}
.stock-check-checkout-meta {
  display: flex;
  min-width: 0;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}
.stock-check-checkout-summary,
.stock-check-checkout-note {
  color: var(--salesmap-ds-color-text-muted, var(--theme-muted));
  font-size: var(--salesmap-ds-font-size-xs, 11px);
  font-weight: var(--salesmap-ds-font-weight-medium, 700);
  line-height: 1.3;
}
.stock-check-checkout-summary[hidden] { display: none !important; }
.stock-check-checkout-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 2px 8px;
  border: 1px solid color-mix(in srgb, var(--theme-primary-dark) 18%, var(--theme-line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--theme-primary-soft) 72%, var(--theme-surface));
  color: var(--theme-primary-dark);
  font-size: var(--salesmap-ds-font-size-xs, 11px);
  font-weight: var(--salesmap-ds-font-weight-semibold, 800);
  line-height: 1;
}
.stock-check-checkout-card[data-stock-check-state="saved"] .stock-check-checkout-status,
.stock-check-checkout-card[data-stock-check-state="completed"] .stock-check-checkout-status {
  border-color: color-mix(in srgb, var(--theme-success-dark, #3f6f54) 22%, var(--theme-line));
  background: color-mix(in srgb, var(--theme-success-soft, #dfeee4) 86%, var(--theme-surface));
  color: var(--theme-success-dark, #3f6f54);
}
.stock-check-checkout-card[data-stock-check-state="skipped"] .stock-check-checkout-status {
  border-color: color-mix(in srgb, var(--theme-warning-dark, #7a6339) 22%, var(--theme-line));
  background: color-mix(in srgb, var(--theme-warning-soft, #f2ead8) 82%, var(--theme-surface));
  color: var(--theme-warning-dark, #7a6339);
}
.stock-check-checkout-note {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stock-check-checkout-actions {
  min-width: 156px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 8px;
}
.stock-check-checkout-actions > button { width: 100% !important; }
.stock-check-open-btn,
.stock-check-skip-btn,
.stock-check-remove-btn {
  flex: 0 0 auto;
  min-width: 0;
  white-space: nowrap;
}
.dsr-stock-check-chip {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dsr-stock-check-chip.done {
  background: color-mix(in srgb, var(--theme-success-soft, #dfeee4) 82%, var(--theme-surface));
  color: var(--theme-success-dark, #3f6f54);
}
.dsr-stock-check-chip.skipped {
  background: color-mix(in srgb, var(--theme-warning-soft, #f2ead8) 82%, var(--theme-surface));
  color: var(--theme-warning-dark, #7a6339);
}
.dsr-stock-check-chip.saved {
  background: color-mix(in srgb, var(--theme-primary-soft) 72%, var(--theme-surface));
  color: var(--theme-primary-dark);
}
.dsr-stock-check-history {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 8px;
  padding: var(--salesmap-ds-space-2) var(--salesmap-ds-space-3);
  border: 1px solid var(--salesmap-ds-color-line);
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-color-surface-soft);
  box-shadow: none;
}
.dsr-stock-check-history-label {
  min-width: 0;
  flex: 1 1 auto;
  color: var(--theme-muted, #64748b);
  font-size: 12px;
  font-weight: 850;
}
.dsr-stock-check-history.saved .dsr-stock-check-history-label,
.dsr-stock-check-history.done .dsr-stock-check-history-label {
  color: var(--theme-success-dark, #3f6f54);
}
.dsr-stock-check-history.skipped .dsr-stock-check-history-label {
  color: var(--theme-warning-dark, #7a6339);
}
.dsr-stock-check-history-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  margin-left: auto;
}
.dsr-stock-check-view-action {
  min-width: 82px;
  padding: 0 12px;
  cursor: pointer;
  font: inherit;
}
.stock-check-sheet-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.stock-check-capture-panel {
  overflow: visible;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.stock-check-records-panel {
  overflow: hidden;
  border: 1px solid var(--theme-primary-line);
  border-radius: 16px;
  background: color-mix(in srgb, var(--theme-primary-soft) 36%, var(--theme-surface));
}
.stock-check-records-panel[hidden] { display: none !important; }
.stock-check-records-panel[data-empty="true"] {
  overflow: visible;
  border: 0;
  background: transparent;
}
#stockCheckSheet .stock-check-toolbar { display: block; min-width: 0; }
#stockCheckSheet .stock-check-search-field { position: relative; width: 100%; min-width: 0; }
#stockCheckSheet .stock-check-search-leading-icon {
  position: absolute;
  z-index: 2;
  left: 15px;
  top: 50%;
  width: 19px;
  height: 19px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--theme-muted);
  transform: translateY(-50%);
  pointer-events: none;
}
#stockCheckSheet .stock-check-search-leading-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
#stockCheckSheet .stock-check-search-field > input {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding-left: 43px !important;
  padding-right: 124px !important;
  border-radius: 14px;
  background: var(--theme-surface);
}
#stockCheckSheet .stock-check-search-field > input::-webkit-search-cancel-button {
  display: none;
  appearance: none;
}
#stockCheckSheet .stock-check-search-clear-btn {
  position: absolute;
  z-index: 3;
  top: 8px;
  right: 84px;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--theme-icon-bg, var(--theme-surface-soft));
  color: var(--theme-icon-ink, var(--theme-muted));
  box-shadow: none;
}
#stockCheckSheet .stock-check-search-clear-btn[hidden] { display: none !important; }
#stockCheckSheet .stock-check-search-clear-btn:disabled { opacity: .45; }
#stockCheckSheet .stock-check-search-clear-btn svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
}
#stockCheckSheet .stock-check-history-btn {
  position: absolute !important;
  z-index: 2;
  top: 6px;
  right: 6px;
}
#stockCheckSheet .stock-check-history-btn:disabled {
  cursor: default !important;
  opacity: .52;
}
.stock-check-search-results {
  max-height: 190px;
  margin-top: 7px;
  overflow-y: auto;
  border: 1px solid var(--theme-line);
  border-radius: 13px;
  background: var(--theme-surface);
}
.stock-check-search-result {
  width: 100%;
  min-height: 48px;
  display: block;
  padding: 7px 11px;
  border: 0;
  border-bottom: 1px solid var(--theme-line);
  background: transparent;
  color: var(--theme-ink);
  text-align: left;
}
.stock-check-search-result:last-child { border-bottom: 0; }
.stock-check-search-result:active { background: var(--theme-primary-soft); }
.stock-check-search-identity,
.stock-check-search-identity > b,
.stock-check-search-meta { display: block; min-width: 0; }
.stock-check-search-identity > b {
  color: var(--theme-ink);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.3;
  overflow-wrap: anywhere;
  white-space: normal;
}
.stock-check-search-meta {
  margin-top: 2px;
  color: var(--theme-muted);
  font-variant-numeric: tabular-nums;
}
.stock-check-search-meta small { font-size: 11px; font-weight: 800; }
.stock-check-search-state {
  padding: 14px 12px;
  color: var(--theme-muted);
  font-size: 10px;
  text-align: center;
}
.stock-check-editor-card {
  margin-top: 8px;
  padding: 10px;
  border: 1px solid var(--theme-primary-line);
  border-radius: 15px;
  background: var(--theme-surface);
  box-shadow: none;
}
.stock-check-editor-head { min-width: 0; margin-bottom: 6px; }
.stock-check-editor-identity { min-width: 0; }
.stock-check-editor-title-row { min-width: 0; }
.stock-check-editor-title-row b {
  display: block;
  color: var(--theme-ink);
  font-size: 10.5px;
  font-weight: 900;
  line-height: 1.3;
  overflow-wrap: anywhere;
  white-space: normal;
}
.stock-check-editor-identity > span {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: var(--theme-muted);
  font-size: 11px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.stock-check-editor-identity > .stock-check-editor-packing {
  color: var(--theme-ink);
  font-size: 10px;
  font-weight: 850;
}
.stock-check-editor-row {
  display: grid;
  grid-template-columns: minmax(124px, 144px) minmax(148px, 1fr);
  gap: 8px;
  align-items: center;
  min-height: 34px;
  overflow: visible;
}
.stock-check-editor-row + .stock-check-editor-row { margin-top: 7px; }
.stock-check-expiry-editor { align-items: center; }
.stock-check-editor-row > span {
  color: var(--theme-ink);
  font-size: 10.5px;
  font-weight: 850;
  white-space: nowrap;
}
.stock-check-editor-control {
  box-sizing: border-box;
  width: min(100%, 154px);
  min-height: 34px;
  justify-self: end;
}
.stock-check-qty-control {
  position: static;
  z-index: auto;
  height: 34px;
  display: grid;
  grid-template-columns: 34px minmax(56px, 1fr) 34px;
  gap: 0;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid var(--theme-line);
  border-radius: 10px;
  background: var(--theme-surface);
}
.stock-check-qty-control button {
  position: relative;
  min-width: 34px;
  height: 32px;
  min-height: 32px;
  max-height: 32px;
  margin: 0;
  align-self: center;
  appearance: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: color-mix(in srgb, var(--theme-primary-soft) 28%, var(--theme-surface));
  color: var(--theme-ink);
  font-size: 0;
  font-weight: 900;
  line-height: 1;
  display: grid;
  place-items: center;
}
.stock-check-qty-control button::before,
.stock-check-qty-control button[data-stock-check-qty-step="1"]::after {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  content: "";
  transform: translate(-50%, -50%);
}
.stock-check-qty-control button[data-stock-check-qty-step="1"]::after {
  width: 2px;
  height: 10px;
}
.stock-check-qty-control input {
  min-width: 0;
  min-height: 32px;
  height: 32px;
  padding: 3px 6px;
  border: 0;
  border-right: 1px solid var(--theme-line);
  border-left: 1px solid var(--theme-line);
  border-radius: 0;
  background: var(--theme-surface);
  text-align: center;
  font-size: 12px;
  line-height: 1;
  font-weight: 900;
  box-shadow: none;
}
.stock-check-qty-control > b { display: none; }
.stock-check-expiry-field {
  position: static;
  z-index: auto;
  min-width: 0;
  display: grid;
  align-items: center;
  overflow: visible;
}
.stock-check-expiry-picker-btn {
  width: 100%;
  height: 34px;
  min-height: 34px;
  padding: 4px 10px;
  border: 1px solid var(--theme-line);
  border-radius: 10px;
  background: var(--theme-surface);
  color: var(--theme-ink);
  font-size: 10.5px;
  font-weight: 850;
  text-align: left;
  font-variant-numeric: tabular-nums;
}
.stock-check-expiry-picker-btn:disabled {
  cursor: not-allowed;
  background: var(--theme-surface-soft);
  color: var(--theme-muted);
  opacity: .72;
}
.stock-check-expiry-wheel {
  position: relative !important;
  inset: auto !important;
  z-index: auto;
  clear: both;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  height: 78px;
  overflow: hidden;
  border: 1px solid var(--theme-primary-line);
  border-radius: 10px;
  background: var(--theme-surface);
}
.stock-check-expiry-wheel[hidden] { display: none !important; }
.stock-check-wheel-selection {
  position: absolute;
  left: 4px;
  right: 4px;
  top: 27px;
  height: 24px;
  border-radius: 7px;
  background: color-mix(in srgb, var(--theme-primary-soft) 78%, var(--theme-surface));
  pointer-events: none;
}
.stock-check-wheel-column {
  position: relative;
  z-index: 1;
  height: 78px;
  padding: 27px 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-snap-type: y mandatory;
  scrollbar-width: none;
}
.stock-check-wheel-column + .stock-check-wheel-column { border-left: 1px solid var(--theme-line); }
.stock-check-wheel-column::-webkit-scrollbar { display: none; }
.stock-check-wheel-item {
  width: 100%;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border: 0;
  background: transparent;
  color: color-mix(in srgb, var(--theme-muted) 58%, transparent);
  font-size: 9px;
  font-weight: 700;
  scroll-snap-align: center;
}
.stock-check-wheel-item.selected {
  color: var(--theme-ink);
  font-size: 10.5px;
  font-weight: 900;
}
.stock-check-editor-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 7px;
  margin-top: 8px;
}
.stock-check-editor-actions > button { width: 100% !important; }
#stockCheckSheet .stock-check-editor-actions button[data-salesmap-action-role="secondary"],
#stockCheckSheet .stock-check-lot-action[data-salesmap-action-role="secondary"] {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
}
#stockCheckSheet .stock-check-editor-actions button[data-salesmap-action-role="primary"] {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
}
#stockCheckSheet .stock-check-lot-action[data-salesmap-action-role="danger"] {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-danger-bg) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
}
.stock-check-item-list {
  display: flex;
  flex-direction: column;
  max-height: min(34vh, 420px);
  overflow-y: auto;
  background: var(--theme-surface);
}
.stock-check-item-list[data-empty="true"] {
  overflow: visible;
  background: transparent;
}
.stock-check-item-list[data-empty="true"] > .stock-check-empty-state {
  box-sizing: border-box;
  width: 100%;
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  border: 1px dashed var(--salesmap-ds-color-line, var(--theme-line));
  border-radius: var(--salesmap-ds-radius-md, 14px);
  background: var(--salesmap-ds-color-surface-soft, var(--theme-surface-soft));
  color: var(--salesmap-ds-color-text-muted, var(--theme-muted));
  box-shadow: none;
  text-align: center;
}
.stock-check-lot-card {
  position: relative;
  min-height: 58px;
  overflow: hidden;
  border: 0;
  border-bottom: 1px solid var(--theme-primary-line);
  background: var(--theme-surface);
}
.stock-check-lot-card:last-child { border-bottom: 0; }
.stock-check-lot-actions {
  position: absolute;
  z-index: 0;
  inset: 0 0 0 auto;
  box-sizing: border-box;
  width: 156px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 6px;
  padding: 0 8px;
  background: var(--theme-surface);
}
.stock-check-lot-actions > button { width: 100% !important; }
.stock-check-lot-surface {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 76px;
  gap: 8px;
  align-items: center;
  min-height: 58px;
  padding: 8px 12px;
  background: var(--theme-surface);
  cursor: pointer;
  touch-action: pan-y;
  transform: translateX(0);
  transition: transform 180ms ease-out;
  -webkit-tap-highlight-color: transparent;
}
.stock-check-lot-index {
  box-sizing: border-box;
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  justify-self: start;
  border: 1px solid var(--theme-primary-line);
  border-radius: 50%;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.stock-check-lot-card[data-stock-check-actions-open="true"] .stock-check-lot-surface {
  transform: translateX(-156px);
}
.stock-check-lot-surface:focus-visible {
  outline: 2px solid var(--theme-primary-dark);
  outline-offset: -3px;
}
.stock-check-lot-product,
.stock-check-lot-measure {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.stock-check-lot-product { gap: 2px; }
.stock-check-lot-measure {
  align-items: flex-end;
  justify-self: end;
  gap: 4px;
}
.stock-check-lot-product b {
  display: block;
  color: var(--theme-ink);
  font-size: 9.5px;
  font-weight: 900;
  line-height: 1.25;
  overflow-wrap: anywhere;
  white-space: normal;
}
.stock-check-lot-product span,
.stock-check-lot-measure span {
  color: var(--theme-muted);
  font-size: 10px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.stock-check-lot-product .stock-check-lot-packing {
  color: var(--theme-ink);
  font-size: 9px;
  font-weight: 850;
}
.stock-check-lot-measure b {
  color: var(--theme-ink);
  font-size: 10.5px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.stock-check-lot-measure .stock-check-lot-pill,
.stock-check-history-measure .stock-check-lot-pill {
  box-sizing: border-box;
  min-width: 58px;
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  border: 1px solid var(--theme-primary-line);
  border-radius: 999px;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
  line-height: 1;
  white-space: nowrap;
}
.stock-check-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 2px;
}
.stock-check-actions button { min-height: 44px; }
.stock-check-resolution-body { display: flex; flex-direction: column; gap: 12px; }
.stock-check-resolution-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.stock-check-history-body { display: flex; flex-direction: column; gap: 8px; }
.stock-check-history-actions { display: flex; justify-content: stretch; padding-top: 2px; }
.stock-check-history-actions button { width: 100%; min-height: 40px; }
.stock-check-history-summary[hidden],
.stock-check-history-list[hidden],
#stockCheckHistoryEmpty[hidden] { display: none !important; }
#stockCheckHistoryEmpty {
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stock-check-history-summary {
  padding: 10px 12px;
  border: 1px solid var(--theme-primary-line);
  border-radius: 12px;
  background: var(--theme-surface-soft);
  color: var(--theme-ink);
  font-size: 11px;
  font-weight: 850;
}
.stock-check-history-list {
  overflow: hidden;
  border: 1px solid var(--theme-primary-line);
  border-radius: 14px;
  background: var(--theme-surface);
}
.stock-check-history-row {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 84px;
  gap: 8px;
  align-items: center;
  min-height: 54px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--theme-line);
}
.stock-check-history-row:last-child { border-bottom: 0; }
.stock-check-history-product,
.stock-check-history-measure { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
.stock-check-history-product b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.stock-check-history-product span { overflow: hidden; color: var(--theme-muted); font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.stock-check-history-product em { color: var(--theme-primary-dark); font-size: 8px; font-style: normal; font-weight: 850; }
.stock-check-history-measure { align-items: flex-end; justify-self: end; gap: 4px; }
.stock-check-history-measure b { font-size: 10.5px; }
.stock-check-history-measure span { color: var(--theme-muted); font-size: 8.5px; font-weight: 800; }
.ws-stock-check-action {
  min-height: 54px;
  margin-top: 14px;
  margin-bottom: 10px;
  border: 0 !important;
  background: var(--theme-primary-dark) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--theme-primary-dark) 24%, transparent);
  font-size: 17px;
  font-weight: 900;
}
.ws-stock-check-action:active { transform: translateY(1px); filter: brightness(.94); }
@media (max-width: 540px) {
  /* Keeps the Android Check-Out Stock Check zone aligned with GPS and Photo Evidence. */
  html[data-runtime="android-webview"] .stock-check-checkout-actions { gap: 6px; }
  html[data-runtime="android-webview"] .stock-check-checkout-actions > button[hidden] { display: none !important; }
  html[data-runtime="android-webview"] .stock-check-editor-row {
    grid-template-columns: minmax(124px, 132px) minmax(148px, 1fr);
    gap: 7px;
    overflow: visible;
  }
  html[data-runtime="android-webview"] .stock-check-expiry-editor { align-items: center; }
  html[data-runtime="android-webview"] .stock-check-qty-control,
  html[data-runtime="android-webview"] .stock-check-expiry-field,
  html[data-runtime="android-webview"] .stock-check-expiry-wheel {
    position: static !important;
    inset: auto !important;
    float: none !important;
    transform: none !important;
  }
  html[data-runtime="android-webview"] .stock-check-expiry-wheel { margin-top: 0; }
  .stock-check-lot-surface { grid-template-columns: 24px minmax(0, 1fr) 68px; gap: 6px; padding: 8px 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .stock-check-lot-surface { transition: none; }
}
/* My/Team Customers deliberately reuses .map-label-mode-btn for identical typography, colour and surface. */

html[data-runtime="android-webview"] body.supervisor-mode .map-quick-controls {
  left: 12px !important;
  right: 12px !important;
  width: auto !important;
  max-width: calc(100vw - 24px) !important;
  display: grid !important;
  grid-template-columns: repeat(3, max-content);
  align-items: flex-start;
  justify-content: flex-start;
  column-gap: 6px;
  row-gap: 7px;
}

/* Keep Today DSR on the second row independently of translated label widths. */
html[data-runtime="android-webview"] body.supervisor-mode #mapDsrHighlightBtn {
  grid-column: 1 / -1;
  justify-self: start;
}

html[data-runtime="android-webview"] body.supervisor-mode .map-quick-controls > button {
  box-sizing: border-box;
  flex: 0 0 auto !important;
  min-height: 30px;
  height: 30px;
  width: auto !important;
  min-width: max-content !important;
  max-width: 100% !important;
  padding-inline: 10px;
  font-size: 10.5px;
  line-height: 28px;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

/* The Customer scope chip is always the active scope label, so My and Team share one filled fragment treatment. */
html[data-runtime="android-webview"][data-app-theme] body.supervisor-mode #mapOwnCustomersBtn {
  color: var(--salesmap-ds-action-secondary-text) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  border-color: transparent !important;
}
@media (min-width: 901px) {
  html[data-runtime="browser-desktop"] #dsrDailySummarySheet #managerSummaryTable :is(
    .desktop-manager-summary-person,
    .desktop-manager-summary-visit-window
  ) {
    font-size: 12px !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    line-height: normal !important;
  }
  html[data-runtime="browser-desktop"] #dsrDailySummarySheet #managerSummaryTable .desktop-manager-summary-person button,
  html[data-runtime="browser-desktop"] #dsrDailySummarySheet #managerSummaryTable .desktop-manager-summary-visit-window span {
    font: inherit !important;
    font-variant-numeric: tabular-nums;
  }
}
html[data-runtime="browser-desktop"] #addCustomerSheet > .desktop-fill-body {
  row-gap: 0 !important;
}
html[data-runtime="browser-desktop"] #addCustomerSheet .form-row {
  margin-top: 5px;
  margin-bottom: 5px;
}
html[data-runtime="browser-desktop"] #addCustomerSheet .form-label {
  margin-bottom: 4px;
}
html[data-runtime="browser-desktop"] #addCustomerSheet .customer-business-profile-panel {
  margin-top: 5px;
  margin-bottom: 6px;
  padding-top: 6px;
}
html[data-runtime="browser-desktop"] #addCustomerSheet .filter-actions {
  margin-top: 8px;
}
html[data-runtime="browser-desktop"] #addCustomerSheet .customer-service-requirements-grid {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 8px 14px;
}
html[data-runtime="browser-desktop"] #addCustomerSheet .customer-service-requirements-grid label {
  flex: 0 0 auto;
  min-width: 0;
  min-height: 32px;
}

/* Android Customer Add/Edit share one clipped rounded shell and one scrolling form body.
   The shell owns only corner clipping. All ordinary bottom-sheet padding, including safe-bottom space, lives inside
   the scroller so there is no fixed colour strip above the handle or along the phone's bottom edge. */
html[data-runtime="android-webview"][data-app-theme] .customer-form-sheet.open {
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
  overscroll-behavior: contain;
}

html[data-runtime="android-webview"][data-app-theme] .customer-form-sheet > .customer-form-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  padding: 10px 16px calc(16px + var(--safe-bottom));
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

/* Both Customer forms keep the shared Forms/Profile geometry, with only the requested light resting outline
   restored locally. Focus/validation colors remain owned by the shared Forms layer. */
html[data-runtime="android-webview"][data-app-theme] .customer-form-sheet :is(.form-input, .form-textarea):not(:focus) {
  border: 1px solid var(--salesmap-ds-color-line);
}

html[data-runtime="android-webview"][data-app-theme] .customer-form-sheet select:not([multiple]):not(.hidden-native-select):not(:focus) {
  border: 1px solid var(--salesmap-ds-color-line);
}

/* Read-only Add Owner keeps the same visible proxy frame as Edit Owner. */
html[data-runtime="android-webview"][data-app-theme] #addCustomerSheet #addSpSelect + .android-themed-select-trigger:disabled {
  opacity: 1;
  border: 1px solid var(--salesmap-ds-color-line) !important;
  box-shadow: none !important;
}

html[data-app-theme] #editSheet #editActiveToggleBtn {
  text-transform: uppercase !important;
}

/* Edit Status reuses the same selected fragment-chip palette as Inactive reason choices when Active.
   Inactive is deliberately neutral grey rather than another primary/semantic selection colour. */
html[data-runtime="android-webview"][data-app-theme] #editSheet #editActiveToggleBtn[data-active="true"] {
  border-color: color-mix(in srgb, var(--salesmap-ds-color-primary) 28%, var(--salesmap-ds-color-line)) !important;
  background: var(--salesmap-ds-state-selected-bg) !important;
  color: var(--salesmap-ds-color-primary-active) !important;
}

html[data-runtime="android-webview"][data-app-theme] #editSheet #editActiveToggleBtn[data-active="false"] {
  border-color: var(--salesmap-ds-color-line) !important;
  background: var(--salesmap-ds-color-surface-soft) !important;
  color: var(--salesmap-ds-color-text-muted) !important;
}
.dsr-photo-evidence-chip {
  border-color: var(--theme-line, #d8dee4);
  background: var(--theme-surface-soft, #f5f7f8);
}

.dsr-photo-history {
  display: grid;
  gap: 7px;
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px solid var(--theme-line, #d8dee4);
}

.dsr-photo-history-label {
  color: var(--theme-muted, #64748b);
  font-size: 12px;
  font-weight: 850;
}

.dsr-photo-history.has-evidence .dsr-photo-history-label {
  color: var(--theme-success-dark, #3f6f54);
}

.dsr-photo-history-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.dsr-photo-history-actions .dsr-small-action {
  min-width: 82px;
  padding: 0 12px;
}

.dsr-photo-view-action {
  cursor: pointer;
  font: inherit;
}

/* Android Today/History/Key Account Summary keep Photo Evidence in one canonical dedicated visit-card row. */
html[data-runtime="android-webview"] #dsrSheet .dsr-photo-history,
html[data-runtime="android-webview"] #dsrHistorySheet .dsr-photo-history,
html[data-runtime="android-webview"] #dsrDailySummarySheet .dsr-photo-history {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 8px;
  padding: var(--salesmap-ds-space-2) var(--salesmap-ds-space-3);
  border: 1px solid var(--salesmap-ds-color-line);
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-color-surface-soft);
  box-shadow: none;
}
html[data-runtime="android-webview"] #dsrSheet .dsr-photo-history-label,
html[data-runtime="android-webview"] #dsrHistorySheet .dsr-photo-history-label,
html[data-runtime="android-webview"] #dsrDailySummarySheet .dsr-photo-history-label {
  min-width: 0;
  flex: 1 1 auto;
}
html[data-runtime="android-webview"] #dsrSheet .dsr-photo-history-actions,
html[data-runtime="android-webview"] #dsrHistorySheet .dsr-photo-history-actions,
html[data-runtime="android-webview"] #dsrDailySummarySheet .dsr-photo-history-actions {
  flex: 0 0 auto;
  margin-left: auto;
}
html[data-runtime="android-webview"] :is(#dsrSheet, #dsrHistorySheet, #dsrDailySummarySheet) :is(.dsr-photo-view-action, .dsr-stock-check-view-action) {
  height: 28px !important;
  min-height: 28px !important;
  min-width: 72px;
  padding: 0 10px;
  border-color: transparent !important;
  border-radius: var(--salesmap-ds-radius-sm);
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
  box-shadow: none !important;
  font-size: 11px;
  font-weight: var(--salesmap-ds-font-weight-semibold);
}
html[data-runtime="android-webview"] #dsrSheet .dsr-photo-history.empty .dsr-photo-history-label,
html[data-runtime="android-webview"] #dsrHistorySheet .dsr-photo-history.empty .dsr-photo-history-label,
html[data-runtime="android-webview"] #dsrDailySummarySheet .dsr-photo-history.empty .dsr-photo-history-label {
  color: var(--theme-muted);
  font-weight: 700;
}

.dsr-photo-history.browser-metadata {
  padding-top: 6px;
  margin-top: 6px;
}

/* Photo Evidence viewer mirrors the native capture-preview rhythm and stays above shared Sheet affordances. */
.dsr-photo-p2p-viewer {
  position: fixed;
  inset: 0;
  z-index: 7000;
  box-sizing: border-box;
  background: #101416;
  color: #ffffff;
}

.dsr-photo-p2p-viewer[hidden],
.dsr-photo-p2p-footer[hidden],
.dsr-photo-p2p-top-action[hidden],
.dsr-photo-p2p-status[hidden],
.dsr-photo-p2p-spinner[hidden],
.dsr-photo-p2p-retry[hidden] {
  display: none;
}

.dsr-photo-p2p-backdrop {
  position: absolute;
  inset: 0;
  background: #101416;
}

.dsr-photo-p2p-panel {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #101416;
  box-shadow: none;
}

.dsr-photo-p2p-header {
  position: absolute;
  inset: 0 0 auto;
  z-index: 3;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 48px;
  align-items: center;
  gap: 8px;
  min-height: 56px;
  padding: calc(8px + var(--safe-top, 0px)) 10px 8px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.68), rgba(0, 0, 0, 0));
  color: #ffffff;
  pointer-events: none;
}

.dsr-photo-p2p-header > * { pointer-events: auto; }
#dsrPhotoP2pTitle {
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 700;
}
.dsr-photo-p2p-top-action {
  display: grid; place-items: center; width: 48px; height: 48px; margin: 0; padding: 0;
  border: 0; border-radius: 50%; background: rgba(0, 0, 0, 0.5); color: #ffffff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3); font: inherit; font-size: 28px; line-height: 1;
}
.dsr-photo-p2p-top-action:active:not(:disabled) { background: rgba(255, 255, 255, 0.2); }
.dsr-photo-p2p-top-action:disabled { opacity: 0.45; }
.dsr-photo-p2p-share-icon {
  width: 26px; height: 26px; overflow: visible; fill: #ffffff; stroke: #ffffff;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.dsr-photo-p2p-stage {
  position: relative; display: flex; min-width: 0; min-height: 0; align-items: center;
  justify-content: center; overflow: hidden; background: #101416; touch-action: none;
}
#dsrPhotoP2pImage[hidden] { display: none; }
#dsrPhotoP2pImage {
  display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain;
  transform-origin: center center; user-select: none; -webkit-user-drag: none; will-change: transform;
}
.dsr-photo-p2p-status {
  display: grid; width: min(420px, calc(100vw - 48px)); justify-items: center; gap: 10px;
  padding: calc(72px + var(--safe-top, 0px)) 24px 24px; box-sizing: border-box; text-align: center;
}
.dsr-photo-p2p-status strong { font-size: 16px; line-height: 1.35; }
.dsr-photo-p2p-status p { margin: 0; color: rgba(255, 255, 255, 0.72); font-size: 13px; line-height: 1.45; }
.dsr-photo-p2p-spinner {
  width: 30px; height: 30px; box-sizing: border-box; border: 3px solid rgba(255, 255, 255, 0.22);
  border-top-color: #ffffff; border-radius: 50%; animation: dsr-photo-p2p-spin 0.8s linear infinite;
}
@keyframes dsr-photo-p2p-spin { to { transform: rotate(360deg); } }
.dsr-photo-p2p-retry {
  min-width: 128px; min-height: 44px; margin-top: 6px; border: 0;
  background: var(--theme-primary, #16794b); color: #ffffff;
}
.dsr-photo-p2p-footer {
  position: relative; z-index: 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px;
  padding: 6px 20px calc(10px + var(--safe-bottom, 0px)); border: 0; background: #101416;
}
.dsr-photo-p2p-footer .dsr-small-action {
  min-width: 0; min-height: 48px; margin: 0; border: 0; border-radius: 12px;
  background: rgba(255, 255, 255, 0.1); color: #ffffff; box-shadow: none;
}
.dsr-photo-p2p-footer .dsr-small-action:active:not(:disabled) { background: rgba(255, 255, 255, 0.2); }
.dsr-photo-p2p-footer .dsr-small-action:disabled { opacity: 0.35; }
html[data-runtime="browser-desktop"] .settings-category-heading { margin: 2px 0 8px; color: var(--theme-muted); font-size: 10px; font-weight: 900; letter-spacing: .08em; }
html[data-runtime="browser-desktop"] .data-history-tabs-zone { padding: 10px 18px 8px; border-bottom: 1px solid var(--salesmap-ds-color-line); }
html[data-runtime="browser-desktop"] .data-history-panel { overflow: auto; padding: 10px 18px 18px; }
html[data-runtime="browser-desktop"] .data-history-panel[hidden] { display: none !important; }
html[data-runtime="browser-desktop"] .data-history-product-page { padding: 0; gap: 12px; }
/* History map/PDF actions share one equal-width row; PDF stays visually neutral for print-oriented output. */
#dsrHistorySheet .dsr-history-action-row {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
#dsrHistorySheet .dsr-history-action-row > button {
  min-width: 0 !important;
  width: 100% !important;
}
#dsrHistorySheet .dsr-history-action-row > :is(.history-show-map-btn,.history-report-btn) {
  height: 40px !important;
  min-height: 40px !important;
}

/* Range History reuses the existing Visit renderers inside native collapsed date disclosures. */
#dsrHistorySheet .history-date-group {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#dsrHistorySheet .history-date-group-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--salesmap-ds-space-2);
  padding: 6px 10px;
  border: 1px solid var(--salesmap-ds-color-line);
  border-radius: var(--salesmap-ds-radius-md);
  list-style: none;
  cursor: pointer;
  outline: 0;
  -webkit-tap-highlight-color: transparent;
  background: var(--salesmap-ds-color-surface);
  background-clip: padding-box;
  color: var(--salesmap-ds-color-text);
  font-size: var(--salesmap-ds-font-size-sm);
  font-weight: var(--salesmap-ds-font-weight-semibold);
}
#dsrHistorySheet .history-date-group-summary::-webkit-details-marker { display: none; }
#dsrHistorySheet .history-date-group-summary:active {
  background: var(--salesmap-ds-color-surface);
}
#dsrHistorySheet .history-date-group-summary:focus-visible {
  box-shadow: 0 0 0 3px var(--salesmap-ds-state-focus-ring);
}
#dsrHistorySheet .history-date-group-arrow {
  color: var(--salesmap-ds-color-text-muted);
}
#dsrHistorySheet .history-date-group-label {
  min-width: 0;
}
#dsrHistorySheet .history-date-count,
#dsrHistorySheet .dsr-history-range-label {
  border: 1px solid var(--salesmap-ds-color-line) !important;
  background: var(--salesmap-ds-color-surface-soft) !important;
  color: var(--salesmap-ds-color-text-muted) !important;
}
#dsrHistorySheet .history-date-count {
  min-height: 28px;
  height: 28px;
  padding: 0 8px;
  border-radius: var(--salesmap-ds-radius-pill);
  background: var(--salesmap-ds-color-surface) !important;
  font-size: var(--salesmap-ds-font-size-2xs);
  font-weight: var(--salesmap-ds-font-weight-medium);
  line-height: 1;
  white-space: nowrap;
  box-shadow: none !important;
}
#dsrHistorySheet .history-date-group-body {
  display: grid;
  gap: 9px;
  padding: 9px 0 0;
}
#dsrHistorySheet .history-date-group-tools {
  display: flex;
  justify-content: flex-end;
}
#dsrHistorySheet .history-date-group-tools:empty { display: none; }

/* History time/range flows consume the shared geometry arrow instead of character glyphs. */
#dsrHistorySheet :is(.history-period-flow,.history-visit-time-flow) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
#dsrHistorySheet .history-inline-arrow {
  margin: 0 5px;
  vertical-align: middle;
  color: currentColor;
}
:is(#dsrList, #dsrHistoryList) .dsr-timeline-arrow[data-ui-arrow="right"] {
  width: 18px;
  height: 12px;
  font-size: 0;
}

/* Canonical mobile Visit identity overrides the retired Today-only code/name skin. */
:is(#dsrList, #dsrHistoryList) .dsr-card-code {
  display: block;
  min-height: 0;
  padding: 0;
  border-radius: 0;
  background: transparent !important;
  color: var(--salesmap-ds-color-text) !important;
  font-size: 15px;
  font-weight: 950;
  line-height: 1.15;
}
:is(#dsrList, #dsrHistoryList) .dsr-card-name {
  margin-top: 3px;
  color: var(--salesmap-ds-color-text-muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.3;
}

/* Visit metadata stays two semantic rows; Remark is a themed body surface above it. */
:is(#dsrList, #dsrHistoryList) .dsr-history-remark {
  border: 1px solid var(--salesmap-ds-color-line);
  background: var(--salesmap-ds-color-surface-soft);
  color: var(--salesmap-ds-color-text);
}
:is(#dsrList, #dsrHistoryList) .dsr-history-remark .dsr-remark-text {
  font-weight: var(--salesmap-ds-font-weight-regular) !important;
}
:is(#dsrList, #dsrHistoryList) .dsr-history-card-meta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px 10px;
  margin-top: 8px;
  padding: var(--salesmap-ds-space-2) var(--salesmap-ds-space-3);
  border: 1px solid var(--salesmap-ds-color-line);
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-color-surface-soft) !important;
}
:is(#dsrList, #dsrHistoryList) .dsr-history-meta-item {
  display: flex;
  min-width: 0;
  gap: 4px;
  align-items: baseline;
  overflow-wrap: anywhere;
}
:is(#dsrList, #dsrHistoryList) .dsr-history-meta-label {
  flex: 0 0 auto;
  color: var(--salesmap-ds-color-text-muted);
  font-weight: var(--salesmap-ds-font-weight-semibold);
}
:is(#dsrList, #dsrHistoryList) .dsr-history-meta-label::after { content: ":"; }

/* Today-only business actions keep their behavior; closed-record Edit/Delete reuse the shared fragment-chip owner. */
#dsrList .dsr-card-footer-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--salesmap-ds-spacing-control-gap);
  margin-top: var(--salesmap-ds-space-3);
}
/* Today action pairs share the right half; a lone action keeps one half-row slot. */
#dsrList .dsr-card-footer-actions:has(> [data-dsr-delete-id]):has(> :is([data-dsr-edit-id], [data-dsr-checkout-id])) {
  width: 50%;
  margin-left: auto;
}
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip {
  width: 100% !important;
}
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip[data-salesmap-action-role="primary"],
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip[data-salesmap-action-role="primary"]:active {
  border-color: var(--salesmap-ds-action-primary-bg) !important;
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
}
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip[data-salesmap-action-role="secondary"],
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip[data-salesmap-action-role="secondary"]:active {
  border-color: var(--salesmap-ds-action-secondary-bg) !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
}
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip[data-salesmap-action-role="danger"],
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip[data-salesmap-action-role="danger"]:active {
  border-color: var(--salesmap-ds-action-danger-bg) !important;
  background: var(--salesmap-ds-action-danger-bg) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
}
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip[data-salesmap-action-role="danger"] {
  grid-column: 1;
}
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip:only-child {
  grid-column: 2;
}
#dsrList .dsr-card-footer-actions > .salesmap-fragment-chip:is(
  [data-salesmap-action-role="primary"],
  [data-salesmap-action-role="secondary"]
) {
  grid-column: 2;
}

/* Today Visit Records keeps the fragment action in the right half; the left half is intentionally blank. */
html[data-runtime="android-webview"] #dsrSheet .dsr-record-section-title {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: var(--salesmap-ds-spacing-control-gap);
}
html[data-runtime="android-webview"] #dsrSheet .dsr-record-section-title > span {
  min-height: 34px;
}
html[data-runtime="android-webview"] #dsrSheet #showTodayDsrPinsBtn {
  width: 100% !important;
  justify-self: stretch;
}

/* Canonical Visit-card chips and lifecycle states use one Design System treatment in Today and History. */
#dsrHistorySheet .history-visit-actions span,
:is(#dsrList, #dsrHistoryList) .dsr-mini-chip {
  border: 1px solid var(--salesmap-ds-color-line) !important;
  background: var(--salesmap-ds-color-surface-soft) !important;
  color: var(--salesmap-ds-color-text) !important;
}
:is(#dsrList, #dsrHistoryList) .history-status-pill {
  border: 1px solid currentColor !important;
}
:is(#dsrList, #dsrHistoryList) .history-status-pill.live {
  background: var(--salesmap-ds-color-warning-soft) !important;
  color: var(--salesmap-ds-color-warning) !important;
}
:is(#dsrList, #dsrHistoryList) .history-status-pill.history {
  background: var(--salesmap-ds-color-surface-soft) !important;
  color: var(--salesmap-ds-color-text-muted) !important;
}
:is(#dsrList, #dsrHistoryList) .history-status-pill.open {
  background: var(--salesmap-ds-color-warning-soft) !important;
  color: var(--salesmap-ds-color-warning) !important;
}
:is(#dsrList, #dsrHistoryList) .history-status-pill.done {
  background: var(--salesmap-ds-color-success-soft) !important;
  color: var(--salesmap-ds-color-success) !important;
}
:is(#dsrList, #dsrHistoryList) .history-status-pill.locked {
  background: var(--salesmap-ds-color-surface-soft) !important;
  color: var(--salesmap-ds-color-text-muted) !important;
}

/* Android keeps selection guidance in the calendar; Find visits does not repeat the date range. */
html[data-runtime="android-webview"] #dsrHistorySheet .dsr-history-range-label {
  display: none !important;
}

/* Date rows use the shared Summary columns; ranges use two plain date lines. */
html[data-runtime="android-webview"] #dsrHistorySheet .history-period-flow {
  white-space: nowrap !important;
  overflow-wrap: normal !important;
}

html[data-runtime="android-webview"] #dsrHistorySheet .history-period-flow.is-range {
  display: grid;
  justify-items: start;
  gap: 1px;
  font-size: 12px !important;
  line-height: 1.15 !important;
}

html[data-runtime="android-webview"] #dsrHistorySheet .history-results-section[hidden] {
  display: none !important;
}
/* DSR Monitoring keeps the visit-window column compact so business metrics stay visible without horizontal drift. */
@media (min-width: 901px) {
  html[data-runtime="browser-desktop"] #managerSummaryTable .col-salesperson { width: 9%; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .col-visit-window { width: 11%; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .col-money { width: 10%; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .col-count { width: 7%; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .col-sales-outlets { width: 9%; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .col-duration { width: 10%; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .col-status { width: 10%; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .desktop-manager-summary-row { cursor: pointer; }
  html[data-runtime="browser-desktop"] #managerSummaryTable .desktop-manager-summary-row:is(:hover,:focus-visible) td {
    background: var(--theme-primary-soft);
  }
}
/* Customer coordinates already identify map intent; omit the legacy outbound-link arrow. */
#customerSheet .map-link-value::after{content:none!important;display:none!important}
/* Data History follows the shared management-table language; rollback is a deliberate action, not a white link. */
html[data-runtime="browser-desktop"] .data-version-history-table-wrap{border-color:var(--theme-line);background:var(--theme-surface)}
html[data-runtime="browser-desktop"] .data-version-history-table :is(th,td){border-color:var(--theme-line)}
html[data-runtime="browser-desktop"] .data-version-history-table th{background:var(--theme-surface-soft);color:var(--theme-ink)}
html[data-runtime="browser-desktop"] .data-version-history-table-row{background:var(--theme-surface)}
html[data-runtime="browser-desktop"] .data-version-history-table-row:is(:hover,[aria-expanded="true"]){background:var(--theme-primary-soft)}
html[data-runtime="browser-desktop"] .data-version-rollback-btn{
  min-height:34px;padding:6px 14px;border:1px solid var(--theme-primary-dark);border-radius:8px;
  background:var(--theme-primary-dark);color:#fff;font-weight:900;box-shadow:none
}
html[data-runtime="browser-desktop"] .data-version-rollback-btn:hover{background:var(--theme-primary);border-color:var(--theme-primary);color:#fff}
/* M6: obsolete Browser palette removed; M4 semantic palette owns Browser values. */
html[data-runtime="browser-desktop"][data-app-theme] .sheet-title{background:transparent!important;color:var(--theme-title-ink)!important;border-color:transparent!important}
/* Single-customer Audit Timeline uses one identity-first summary and bounded per-version cards. */
html[data-runtime="browser-desktop"] .customer-audit-overview{display:block!important}
html[data-runtime="browser-desktop"] .customer-audit-summary-card{
  display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 16px;
  border:1px solid var(--theme-line);border-radius:12px;background:var(--theme-surface-soft)
}
html[data-runtime="browser-desktop"] .customer-audit-summary-identity{min-width:0;display:grid;gap:3px}
html[data-runtime="browser-desktop"] .customer-audit-summary-identity strong{font-size:20px;font-weight:950;color:var(--theme-primary-dark)}
html[data-runtime="browser-desktop"] .customer-audit-summary-identity b{font-size:14px;font-weight:900;color:var(--theme-ink);overflow-wrap:anywhere}
html[data-runtime="browser-desktop"] .customer-audit-summary-stats{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 16px;color:var(--theme-muted);font-size:11px;font-weight:800}
html[data-runtime="browser-desktop"] .customer-audit-summary-stats span{display:flex;gap:5px;align-items:baseline}
html[data-runtime="browser-desktop"] .customer-audit-summary-stats b{color:var(--theme-ink);font-size:13px}
html[data-runtime="browser-desktop"] .customer-audit-card{max-height:360px;overflow:auto;scrollbar-gutter:stable}
html[data-runtime="browser-desktop"] .customer-audit-card-head{position:sticky;top:0;z-index:1}
@media(max-width:760px){
  html[data-runtime="browser-desktop"] .customer-audit-summary-card{align-items:flex-start;flex-direction:column}
  html[data-runtime="browser-desktop"] .customer-audit-summary-stats{justify-content:flex-start}
}
/* M4/M6 Bright + Flat Design System: the single semantic token owner. */
:root {
  --salesmap-ds-primitive-neutral-0: #ffffff;
  --salesmap-ds-primitive-neutral-25: #fcfcfd;
  --salesmap-ds-primitive-neutral-50: #f8fafc;
  --salesmap-ds-primitive-neutral-100: #f1f4f7;
  --salesmap-ds-primitive-neutral-200: #d9e0e7;
  --salesmap-ds-primitive-neutral-300: #c4ccd5;
  --salesmap-ds-primitive-neutral-500: #667085;
  --salesmap-ds-primitive-neutral-700: #344054;
  --salesmap-ds-primitive-neutral-900: #1f2937;
  --salesmap-ds-primitive-primary-50: #eff7fc;
  --salesmap-ds-primitive-primary-100: #daecf9;
  --salesmap-ds-primitive-primary-200: #bedef3;
  --salesmap-ds-primitive-primary-500: #3498db;
  --salesmap-ds-primitive-primary-600: #2a7aaf;
  --salesmap-ds-primitive-primary-700: #22638e;
  --salesmap-ds-primitive-success-50: #eefbf4;
  --salesmap-ds-primitive-success-700: #1e8549;
  --salesmap-ds-primitive-danger-50: #fdf1ef;
  --salesmap-ds-primitive-danger-600: #b93d30;
  --salesmap-ds-primitive-warning-50: #fff8e6;
  --salesmap-ds-primitive-warning-700: #9a6700;

  --salesmap-ds-color-page: var(--theme-page, var(--salesmap-ds-primitive-neutral-100));
  --salesmap-ds-color-surface: var(--theme-surface, var(--salesmap-ds-primitive-neutral-0));
  --salesmap-ds-color-surface-soft: var(--theme-surface-soft, var(--salesmap-ds-primitive-neutral-50));
  --salesmap-ds-color-text: var(--theme-ink, var(--salesmap-ds-primitive-neutral-900));
  --salesmap-ds-color-text-muted: var(--theme-muted, var(--salesmap-ds-primitive-neutral-500));
  --salesmap-ds-color-line: var(--theme-line, var(--salesmap-ds-primitive-neutral-200));
  --salesmap-ds-color-primary: var(--theme-primary, var(--salesmap-ds-primitive-primary-600));
  --salesmap-ds-color-primary-active: var(--theme-primary-dark, var(--salesmap-ds-primitive-primary-700));
  --salesmap-ds-color-primary-soft: var(--theme-primary-soft, var(--salesmap-ds-primitive-primary-50));
  --salesmap-ds-color-success: var(--theme-success, var(--salesmap-ds-primitive-success-700));
  --salesmap-ds-color-success-soft: var(--theme-success-soft, var(--salesmap-ds-primitive-success-50));
  --salesmap-ds-color-danger: var(--theme-danger, var(--salesmap-ds-primitive-danger-600));
  --salesmap-ds-color-danger-soft: var(--theme-danger-soft, var(--salesmap-ds-primitive-danger-50));
  --salesmap-ds-color-warning: var(--theme-warning, var(--salesmap-ds-primitive-warning-700));
  --salesmap-ds-color-warning-soft: var(--theme-warning-soft, var(--salesmap-ds-primitive-warning-50));
  --salesmap-ds-color-area: #6b4e8e;
  --salesmap-ds-color-area-soft: #f4f0fa;
  --salesmap-ds-color-area-line: #d8c8ea;
  --salesmap-ds-color-role-supervisor: #3f518c;
  --salesmap-ds-color-role-salesperson: #285f9e;
  --salesmap-ds-color-role-management-viewer: #5f4a91;
  --salesmap-ds-color-role-driver: #27677f;
  --salesmap-ds-color-role-merchandiser: #74446f;
  --salesmap-ds-color-title-bg: var(--theme-title-bg, var(--salesmap-ds-color-surface-soft));
  --salesmap-ds-color-title-line: var(--theme-title-line, var(--salesmap-ds-color-line));
  --salesmap-ds-color-title-text: var(--theme-title-ink, var(--salesmap-ds-color-text));

  --salesmap-ds-font-family-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
  --salesmap-ds-font-size-2xs: 11px;
  --salesmap-ds-font-size-xs: 12px;
  --salesmap-ds-font-size-sm: 13px;
  --salesmap-ds-font-size-md: 14px;
  --salesmap-ds-font-size-lg: 16px;
  --salesmap-ds-font-size-xl: 20px;
  --salesmap-ds-font-weight-regular: 400;
  --salesmap-ds-font-weight-medium: 500;
  --salesmap-ds-font-weight-semibold: 600;
  --salesmap-ds-font-weight-strong: 700;
  --salesmap-ds-font-weight-emphasis: 600;
  --salesmap-ds-font-weight-heavy: 700;
  --salesmap-ds-line-height-tight: 1.25;
  --salesmap-ds-line-height-normal: 1.3;

  /* Stage 5 typography roles: shared semantic scale for Android and Browser. */
  --salesmap-ds-type-page-title-size: var(--salesmap-ds-font-size-xl);
  --salesmap-ds-type-page-title-weight: var(--salesmap-ds-font-weight-strong);
  --salesmap-ds-type-page-title-line-height: 1.25;
  --salesmap-ds-type-section-title-size: var(--salesmap-ds-font-size-lg);
  --salesmap-ds-type-section-title-weight: var(--salesmap-ds-font-weight-semibold);
  --salesmap-ds-type-section-title-line-height: 1.3;
  --salesmap-ds-type-body-size: var(--salesmap-ds-font-size-md);
  --salesmap-ds-type-body-weight: var(--salesmap-ds-font-weight-regular);
  --salesmap-ds-type-body-line-height: 1.4;
  --salesmap-ds-type-label-size: var(--salesmap-ds-font-size-sm);
  --salesmap-ds-type-label-weight: var(--salesmap-ds-font-weight-semibold);
  --salesmap-ds-type-label-line-height: 1.3;
  --salesmap-ds-type-helper-size: var(--salesmap-ds-font-size-xs);
  --salesmap-ds-type-helper-weight: var(--salesmap-ds-font-weight-regular);
  --salesmap-ds-type-helper-line-height: 1.35;
  --salesmap-ds-type-metadata-size: var(--salesmap-ds-font-size-xs);
  --salesmap-ds-type-metadata-weight: var(--salesmap-ds-font-weight-medium);
  --salesmap-ds-type-metadata-line-height: 1.25;
  --salesmap-ds-type-metric-size: var(--salesmap-ds-font-size-xl);
  --salesmap-ds-type-metric-weight: var(--salesmap-ds-font-weight-strong);
  --salesmap-ds-type-metric-line-height: 1.2;
  --salesmap-ds-type-table-header-size: var(--salesmap-ds-font-size-2xs);
  --salesmap-ds-type-table-header-weight: var(--salesmap-ds-font-weight-strong);
  --salesmap-ds-type-table-header-line-height: 1.2;
  --salesmap-ds-type-table-body-size: var(--salesmap-ds-font-size-xs);
  --salesmap-ds-type-table-body-weight: var(--salesmap-ds-font-weight-medium);
  --salesmap-ds-type-table-body-line-height: 1.3;
  --salesmap-ds-type-button-label-size: var(--salesmap-ds-font-size-md);
  --salesmap-ds-type-button-label-weight: var(--salesmap-ds-font-weight-semibold);
  --salesmap-ds-type-button-label-line-height: 1.2;

  --salesmap-ds-space-1: 4px;
  --salesmap-ds-space-2: 8px;
  --salesmap-ds-space-3: 12px;
  --salesmap-ds-space-4: 16px;
  --salesmap-ds-space-5: 24px;

  /* Stage 5 spacing/density roles: one rhythm instead of page-local numbers. */
  --salesmap-ds-spacing-page-gutter-mobile: var(--salesmap-ds-space-4);
  --salesmap-ds-spacing-page-gutter-desktop: var(--salesmap-ds-space-5);
  --salesmap-ds-spacing-section-gap: var(--salesmap-ds-space-4);
  --salesmap-ds-spacing-control-gap: var(--salesmap-ds-space-2);
  --salesmap-ds-spacing-field-gap: var(--salesmap-ds-space-3);
  --salesmap-ds-spacing-card-padding-mobile: var(--salesmap-ds-space-3);
  --salesmap-ds-spacing-card-padding-desktop: var(--salesmap-ds-space-4);
  --salesmap-ds-density-row-height: 44px;
  --salesmap-ds-density-table-row-height: 38px;
  --salesmap-ds-density-table-header-height: 40px;
  --salesmap-ds-density-touch-target: 44px;
  --salesmap-ds-spacing-sticky-footer-bottom: calc(var(--salesmap-ds-space-4) + var(--safe-bottom));

  --salesmap-ds-radius-sm: 10px;
  --salesmap-ds-radius-md: 12px;
  --salesmap-ds-radius-lg: 14px;
  --salesmap-ds-radius-pill: 999px;

  --salesmap-ds-elevation-card: var(--theme-card-shadow, 0 4px 14px rgba(31, 41, 55, .08));
  --salesmap-ds-elevation-raised: var(--shadow);
  --salesmap-ds-state-focus-ring: var(--theme-focus-ring, rgba(42, 122, 175, .20));
  --salesmap-ds-state-disabled-bg: var(--theme-disabled-bg, var(--salesmap-ds-primitive-neutral-100));
  --salesmap-ds-state-disabled-text: var(--theme-disabled-ink, var(--salesmap-ds-primitive-neutral-500));
  --salesmap-ds-state-disabled-line: var(--theme-disabled-line, var(--salesmap-ds-primitive-neutral-200));
  --salesmap-ds-state-selected-bg: var(--salesmap-ds-color-primary-soft);
  --salesmap-ds-state-active-primary: var(--salesmap-ds-color-primary-active);

  --salesmap-ds-action-primary-bg: var(--salesmap-ds-color-primary);
  --salesmap-ds-action-primary-active: var(--salesmap-ds-color-primary-active);
  --salesmap-ds-action-primary-text: var(--salesmap-ds-primitive-neutral-0);
  /* Secondary actions use the theme gray-green accent; soft primary remains reserved for selected/status surfaces. */
  --salesmap-ds-action-secondary-bg: var(--theme-accent, var(--salesmap-ds-primitive-neutral-500));
  --salesmap-ds-action-secondary-text: var(--salesmap-ds-primitive-neutral-0);
  --salesmap-ds-action-danger-bg: var(--salesmap-ds-color-danger);
  --salesmap-ds-action-danger-soft: var(--salesmap-ds-color-danger-soft);
  --salesmap-ds-action-danger-text: var(--salesmap-ds-color-danger);
  --salesmap-ds-control-bg: color-mix(in srgb, var(--salesmap-ds-color-surface-soft) 86%, var(--salesmap-ds-color-surface));
  --salesmap-ds-control-text: var(--salesmap-ds-color-text);
  --salesmap-ds-control-placeholder: var(--salesmap-ds-color-text-muted);
  --salesmap-ds-control-focus: color-mix(in srgb, var(--salesmap-ds-color-primary) 28%, var(--salesmap-ds-color-line));
  --salesmap-ds-table-header-bg: color-mix(in srgb, var(--salesmap-ds-color-primary-soft) 54%, var(--salesmap-ds-color-surface-soft));
  --salesmap-ds-table-header-text: var(--salesmap-ds-color-text);
  --salesmap-ds-table-row-bg: var(--salesmap-ds-color-surface);
  --salesmap-ds-table-row-hover: var(--salesmap-ds-color-primary-soft);
  --salesmap-ds-table-divider: color-mix(in srgb, var(--salesmap-ds-color-line) 68%, transparent);

  --salesmap-ds-component-tab-bg: var(--salesmap-ds-primitive-neutral-100);
  --salesmap-ds-component-tab-line: transparent;
  --salesmap-ds-component-tab-text: var(--salesmap-ds-color-text-muted);
  --salesmap-ds-component-tab-selected-bg: var(--salesmap-ds-color-surface);
  --salesmap-ds-component-tab-selected-text: var(--salesmap-ds-color-primary-active);
  --salesmap-ds-component-tab-selected-line: transparent;
  --salesmap-ds-component-tab-selected-shadow: 0 1px 4px rgba(31, 41, 55, .08);
}
/* Bright + Flat stays the single semantic theme scope; Forest Green + Cool Gray owns its visual tokens. */
html[data-app-theme="bright"] {
  --theme-page: #e8eeea;
  --theme-surface: #ffffff;
  --theme-surface-soft: #f2f6f3;
  --theme-ink: #17211d;
  --theme-muted: #5d6963;
  --theme-line: #becac3;
  --theme-primary: #164e3b;
  --theme-primary-dark: #0f3d2e;
  --theme-primary-soft: #dcebe3;
  --theme-primary-line: #afc6b9;
  --theme-accent: #5d6963;
  --theme-accent-dark: #405048;
  --theme-accent-soft: #edf3ef;
  --theme-accent-line: #becac3;
  --theme-title-bg: #edf3ef;
  --theme-title-line: #becac3;
  --theme-title-ink: #17211d;
  --theme-icon-bg: var(--theme-primary-soft);
  --theme-icon-line: transparent;
  --theme-icon-ink: var(--theme-primary-dark);
  --theme-menu-section: #526159;
  --theme-card-shadow: 0 2px 7px rgba(23, 33, 29, .045);
  /* Map controls stay visibly surfaced above Leaflet tiles instead of inheriting transparent fallbacks. */
  --theme-map-control-bg: var(--theme-surface);
  --theme-map-control-line: var(--theme-line);
  --theme-map-control-ink: var(--theme-ink);
  --theme-map-control-shadow: 0 4px 14px rgba(23, 33, 29, .12);
  --theme-focus-ring: rgba(22, 78, 59, .07);
  --theme-disabled-bg: #eef3f0;
  --theme-disabled-ink: #8b9690;
  --theme-disabled-line: #becac3;
}
html[data-app-theme] {
  --theme-success: #2e7d57;
  --theme-success-dark: #245f45;
  --theme-success-soft: #e9f6ef;
  --theme-warning: #a86f13;
  --theme-warning-dark: #81550e;
  --theme-warning-soft: #fff5df;
  --theme-danger: #874d48;
  --theme-danger-dark: #6f3e3a;
  --theme-danger-soft: #f7ebea;
  --theme-danger-text: #874d48;
  --theme-danger-line: #dfc3bf;
  --success: var(--theme-success);
  --warning: var(--theme-warning);
  --danger: var(--theme-danger);
  --danger-text: var(--theme-danger-text);
}
/* Android uses a cool-gray page with white content surfaces so cards and controls stay visibly separated. */
html[data-runtime="android-webview"][data-app-theme] {
  --theme-page: #e8eeea;
  --theme-surface: #ffffff;
  --theme-surface-soft: #f2f6f3;
  --theme-line: #becac3;
  --theme-primary-soft: #dcebe3;
  --theme-primary-line: #afc6b9;
  --theme-accent-soft: #edf3ef;
  --theme-accent-line: #becac3;
  --theme-title-bg: #edf3ef;
  --theme-title-line: #becac3;
  --theme-title-ink: #17211d;
  --theme-icon-bg: var(--theme-primary-soft);
  --theme-icon-line: transparent;
  --theme-icon-ink: var(--theme-primary-dark);
  --theme-success-soft: #e9f6ef;
  --theme-warning-soft: #fff5df;
  --theme-danger-soft: #f7ebea;
}
html[data-runtime="browser-desktop"][data-app-theme] {
  --theme-page: #e8eeea;
  --theme-surface: #ffffff;
  --theme-surface-soft: #f2f6f3;
  --theme-ink: #17211d;
  --theme-muted: #5d6963;
  --theme-line: #becac3;
  --theme-primary: #164e3b;
  --theme-primary-dark: #0f3d2e;
  --theme-primary-soft: #dcebe3;
  --theme-primary-line: #afc6b9;
  --theme-accent: #5d6963;
  --theme-accent-dark: #405048;
  --theme-accent-soft: #edf3ef;
  --theme-accent-line: #becac3;
  --theme-title-bg: transparent;
  --theme-title-line: transparent;
  --theme-title-ink: #17211d;
  --theme-icon-bg: var(--theme-primary-soft);
  --theme-icon-line: transparent;
  --theme-icon-ink: var(--theme-primary-dark);
  --theme-menu-section: #526159;
  --theme-card-shadow: 0 2px 7px rgba(23, 33, 29, .045);
}
/* M4 shared action roles: flat geometry and semantic intent, independent of feature palette. */
.main-action,
.btn-primary,
button.btn-primary {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
  font-weight: var(--salesmap-ds-font-weight-strong) !important;
  box-shadow: none;
}
.main-action:active,
.btn-primary:active,
button.btn-primary:active {
  background: var(--salesmap-ds-action-primary-active) !important;
}
.secondary-action,
.btn-light,
button.btn-light {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  box-shadow: none;
}
:is(.danger-action,.soft-danger-btn,button.dsr-small-action.danger) {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-danger-soft) !important;
  color: var(--salesmap-ds-action-danger-text) !important;
  box-shadow: none !important;
}
:is(button.btn-danger,button[data-salesmap-action-role="danger"]) {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-danger-bg) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
  font-weight: var(--salesmap-ds-font-weight-strong) !important;
  box-shadow: none !important;
}
html[data-runtime="android-webview"] button[data-salesmap-action-role="primary"] {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
  font-weight: var(--salesmap-ds-font-weight-strong) !important;
  box-shadow: none !important;
}
html[data-runtime="android-webview"] button[data-salesmap-action-role="secondary"] {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  box-shadow: none !important;
}
html[data-runtime="android-webview"] :is(button.btn-danger,button[data-salesmap-action-role="danger"]) {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-danger-bg) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
  font-weight: var(--salesmap-ds-font-weight-strong) !important;
  box-shadow: none !important;
}

html[data-runtime="android-webview"] #customerSheet .dsr-main-action {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-primary-bg) !important;
  color: var(--salesmap-ds-action-primary-text) !important;
  box-shadow: none !important;
}

/* Stage 8: Desktop actions share semantic buttons while toolbars and tables keep intentional density. */
html[data-runtime="browser-desktop"] :is(.btn-primary, .btn-light).salesmap-action-toolbar {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 13px !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  line-height: var(--salesmap-ds-type-button-label-line-height);
}
html[data-runtime="browser-desktop"] :is(.btn-primary, .btn-light).salesmap-action-table {
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 9px;
  border-radius: 8px;
  font-size: 12px !important;
  font-weight: var(--salesmap-ds-font-weight-semibold) !important;
  line-height: var(--salesmap-ds-type-button-label-line-height);
}

/* M4 filled-control grammar: obvious control surface, borderless at rest, semantic focus boundary. */
.form-label {
  color: var(--salesmap-ds-color-text-muted);
  font-weight: var(--salesmap-ds-font-weight-semibold);
}
.form-input,
.form-textarea {
  border-color: transparent;
  background: var(--salesmap-ds-control-bg);
  color: var(--salesmap-ds-control-text);
  font-family: var(--salesmap-ds-font-family-sans);
  font-weight: var(--salesmap-ds-font-weight-regular);
}

/* Native single-select controls share the same semantic filled-control grammar. */
select:not([multiple]):not(.hidden-native-select) {
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  padding-right: 36px;
  border-color: transparent;
  background-color: var(--salesmap-ds-control-bg);
  background-image:
    linear-gradient(45deg, transparent 50%, currentColor 50%),
    linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position:
    calc(100% - 17px) 50%,
    calc(100% - 12px) 50%;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  color: var(--salesmap-ds-control-text);
  font-family: var(--salesmap-ds-font-family-sans);
}
select:not([multiple]):not(.hidden-native-select):focus {
  border-color: var(--salesmap-ds-control-focus);
  box-shadow: 0 0 0 3px var(--salesmap-ds-state-focus-ring);
}
select:not([multiple]):not(.hidden-native-select):disabled {
  border-color: transparent;
  background-color: var(--salesmap-ds-state-disabled-bg);
  color: var(--salesmap-ds-state-disabled-text);
}

.form-input:focus,
.form-textarea:focus {
  border-color: var(--salesmap-ds-control-focus);
  box-shadow: 0 0 0 3px var(--salesmap-ds-state-focus-ring);
}
.form-input:disabled,
.form-textarea:disabled,
.form-input[readonly],
.form-textarea[readonly] {
  border-color: transparent;
  background: var(--salesmap-ds-state-disabled-bg);
  color: var(--salesmap-ds-state-disabled-text);
}
.form-input::placeholder,
.form-textarea::placeholder,
input[type="search"]::placeholder {
  color: var(--salesmap-ds-control-placeholder);
  font-weight: var(--salesmap-ds-font-weight-regular);
  opacity: 1;
}
/* M4 Table grammar: readable compact floor, distinct header, horizontal rhythm without cell grid. */
html[data-runtime="browser-desktop"] .salesmap-management-table {
  color: var(--salesmap-ds-color-text);
  font-family: var(--salesmap-ds-font-family-sans);
  font-size: 12px;
}
html[data-runtime="browser-desktop"] .salesmap-management-table-frame {
  border: 0;
  background: var(--salesmap-ds-table-row-bg);
}
html[data-runtime="browser-desktop"] .salesmap-management-table :is(th,td) {
  height: 38px;
  padding: 6px 8px;
  border-right: 0;
  border-bottom: 1px solid var(--salesmap-ds-table-divider);
  background: var(--salesmap-ds-table-row-bg);
  color: var(--salesmap-ds-color-text);
  font-size: 12px !important;
  line-height: 1.25;
}
html[data-runtime="browser-desktop"] .salesmap-management-table th {
  height: 40px;
  background: var(--salesmap-ds-table-header-bg);
  color: var(--salesmap-ds-table-header-text);
  font-size: 11px !important;
  font-weight: var(--salesmap-ds-font-weight-strong) !important;
  letter-spacing: .02em;
}
html[data-runtime="browser-desktop"] .salesmap-management-table tbody tr:hover > td {
  background: var(--salesmap-ds-table-row-hover);
}
/* M4 Calendar grammar: Primary endpoints, subtle Primary range interior, no secondary green range family. */
.salesmap-compact-calendar .dsr-calendar-day,
#dsrHistorySheet .dsr-calendar-day {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--salesmap-ds-color-text) !important;
  box-shadow: none !important;
}
.salesmap-compact-calendar .dsr-calendar-day.in-range,
#dsrHistorySheet .dsr-calendar-day.in-range {
  background: var(--salesmap-ds-color-primary-soft) !important;
  border-color: var(--salesmap-ds-color-primary) !important;
  color: var(--salesmap-ds-color-text) !important;
}
.salesmap-compact-calendar .dsr-calendar-day:is(.selected,.range-start,.range-end),
#dsrHistorySheet .dsr-calendar-day:is(.selected,.range-start,.range-end) {
  background: var(--salesmap-ds-color-primary) !important;
  border-color: var(--salesmap-ds-color-primary) !important;
  color: #fff !important;
}
.salesmap-compact-calendar .dsr-calendar-day.today,
#dsrHistorySheet .dsr-calendar-day.today {
  box-shadow: inset 0 0 0 1px var(--salesmap-ds-color-primary) !important;
}
/* M4/M5 Photo Evidence: shared Section grammar plus smaller viewer optics; touch target remains 40px. */
#dsrCheckOutSheet :is(.dsr-photo-editor,.stock-check-checkout-card) {
  margin: 10px 0;
  padding: 12px;
  border: 1px solid var(--salesmap-ds-color-line) !important;
  border-radius: var(--salesmap-ds-radius-lg);
  background: var(--salesmap-ds-color-surface-soft);
  box-shadow: none !important;
}
#dsrCheckOutSheet .dsr-photo-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}
.dsr-photo-editor-head {
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 4px;
}
.dsr-photo-editor-count {
  color: var(--salesmap-ds-color-text-muted);
  font-size: var(--salesmap-ds-font-size-xs);
  font-weight: var(--salesmap-ds-font-weight-medium);
}
.dsr-photo-editor-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 0;
}
.dsr-photo-editor-actions > button,
.stock-check-checkout-actions > button,
html[data-runtime="android-webview"] #customerSheet :is(.ws-stock-check-action,.dsr-photo-action) {
  min-width: 0;
  border-color: transparent !important;
  background: var(--salesmap-ds-action-secondary-bg) !important;
  color: var(--salesmap-ds-action-secondary-text) !important;
  box-shadow: none !important;
}
#dsrCheckInSheet .gps-sampling-status {
  margin-top: 4px;
  color: var(--salesmap-ds-color-text-muted);
  font-size: var(--salesmap-ds-font-size-xs);
  font-weight: var(--salesmap-ds-font-weight-regular);
  line-height: 1.3;
}
/*
 * Map current shared surfaces to semantic roles without taking feature behavior or state ownership.
 * Future pages should consume these roles/tokens instead of introducing page-local font or rhythm scales.
 */
html[data-runtime="android-webview"] body,
html[data-runtime="browser-desktop"] body {
  font-family: var(--salesmap-ds-font-family-sans);
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}

.salesmap-type-page-title {
  font-size: var(--salesmap-ds-type-page-title-size);
  font-weight: var(--salesmap-ds-type-page-title-weight);
  line-height: var(--salesmap-ds-type-page-title-line-height);
}
.salesmap-type-section-title {
  font-size: var(--salesmap-ds-type-section-title-size);
  font-weight: var(--salesmap-ds-type-section-title-weight);
  line-height: var(--salesmap-ds-type-section-title-line-height);
}
.salesmap-type-body {
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}
.salesmap-type-label {
  font-size: var(--salesmap-ds-type-label-size);
  font-weight: var(--salesmap-ds-type-label-weight);
  line-height: var(--salesmap-ds-type-label-line-height);
}
.salesmap-type-helper {
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-type-helper-weight);
  line-height: var(--salesmap-ds-type-helper-line-height);
}
.salesmap-type-metadata {
  font-size: var(--salesmap-ds-type-metadata-size);
  font-weight: var(--salesmap-ds-type-metadata-weight);
  line-height: var(--salesmap-ds-type-metadata-line-height);
}
.salesmap-type-metric {
  font-size: var(--salesmap-ds-type-metric-size);
  font-weight: var(--salesmap-ds-type-metric-weight);
  line-height: var(--salesmap-ds-type-metric-line-height);
}
.salesmap-type-table-header {
  font-size: var(--salesmap-ds-type-table-header-size);
  font-weight: var(--salesmap-ds-type-table-header-weight);
  line-height: var(--salesmap-ds-type-table-header-line-height);
}
.salesmap-type-table-body {
  font-size: var(--salesmap-ds-type-table-body-size);
  font-weight: var(--salesmap-ds-type-table-body-weight);
  line-height: var(--salesmap-ds-type-table-body-line-height);
}
.salesmap-type-button-label {
  font-size: var(--salesmap-ds-type-button-label-size);
  font-weight: var(--salesmap-ds-type-button-label-weight);
  line-height: var(--salesmap-ds-type-button-label-line-height);
}
.salesmap-density-row {
  min-height: var(--salesmap-ds-density-row-height);
}

/* Existing shared headings now consume the role scale; feature palette/shape stays with its current owner. */
.sheet-title,
.sheet-subtitle {
  font-size: var(--salesmap-ds-type-section-title-size);
  font-weight: var(--salesmap-ds-type-section-title-weight);
  line-height: var(--salesmap-ds-type-section-title-line-height);
  letter-spacing: 0;
}
html[data-runtime="browser-desktop"] .desktop-fill-sheet > .sheet-header .sheet-title,
html[data-runtime="browser-desktop"] .salesmap-workspace-head > div > b {
  font-size: var(--salesmap-ds-type-page-title-size);
  font-weight: var(--salesmap-ds-type-page-title-weight);
  line-height: var(--salesmap-ds-type-page-title-line-height);
}

/* Shared form/read-only text roles keep Android forms and Browser editors on one scale. */
.form-label,
.dsr-action-title {
  font-size: var(--salesmap-ds-type-label-size);
  font-weight: var(--salesmap-ds-type-label-weight);
  line-height: var(--salesmap-ds-type-label-line-height);
}
.form-input,
.form-textarea,
.location-value,
.dsr-form-readonly-field > b,
.dsr-form-customer > span {
  font-family: var(--salesmap-ds-font-family-sans);
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}
.dsr-form-customer > b {
  font-size: var(--salesmap-ds-type-section-title-size);
  font-weight: var(--salesmap-ds-type-section-title-weight);
  line-height: var(--salesmap-ds-type-section-title-line-height);
}
.permission-hint {
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-type-helper-weight);
  line-height: var(--salesmap-ds-type-helper-line-height);
}
.location-label,
.dsr-form-readonly-field > span,
html[data-runtime="browser-desktop"] .salesmap-workspace-head > div > span,
html[data-runtime="browser-desktop"] .salesmap-management-overview-summary > span,
html[data-runtime="browser-desktop"] .salesmap-management-last-action {
  font-size: var(--salesmap-ds-type-metadata-size);
  font-weight: var(--salesmap-ds-type-metadata-weight);
  line-height: var(--salesmap-ds-type-metadata-line-height);
}
html[data-runtime="browser-desktop"] .salesmap-management-overview-summary > b {
  font-size: var(--salesmap-ds-type-label-size);
  font-weight: var(--salesmap-ds-type-label-weight);
  line-height: var(--salesmap-ds-type-label-line-height);
}
html[data-runtime="browser-desktop"] .salesmap-management-overview-summary > b > strong {
  font-size: var(--salesmap-ds-type-metric-size);
  font-weight: var(--salesmap-ds-type-metric-weight);
  line-height: var(--salesmap-ds-type-metric-line-height);
}

/* Common actions share Button Label while compact icon-only controls keep their existing geometry. */
:is(
  .main-action,
  .secondary-action,
  .btn-primary,
  button.btn-primary,
  .btn-light,
  button.btn-light,
  .btn-danger,
  .location-btn,
  .dsr-action-chip
) {
  font-family: var(--salesmap-ds-font-family-sans);
  font-size: var(--salesmap-ds-type-button-label-size);
  font-weight: var(--salesmap-ds-type-button-label-weight) !important;
  line-height: var(--salesmap-ds-type-button-label-line-height);
}
:is(.main-action,.secondary-action,.btn-primary,button.btn-primary,.btn-light,button.btn-light,.btn-danger,.location-btn) {
  min-height: var(--salesmap-ds-density-touch-target);
}

/* Shared spacing/density rhythm. Values remain platform-aware where touch and dense tables differ. */
html[data-runtime="android-webview"] .bottom-sheet {
  padding-left: var(--salesmap-ds-spacing-page-gutter-mobile);
  padding-right: var(--salesmap-ds-spacing-page-gutter-mobile);
  padding-bottom: var(--salesmap-ds-spacing-sticky-footer-bottom);
}
.form-row {
  margin-top: var(--salesmap-ds-spacing-field-gap);
  margin-bottom: var(--salesmap-ds-spacing-field-gap);
}
.form-label {
  margin-bottom: var(--salesmap-ds-spacing-control-gap);
}
.form-input {
  height: var(--salesmap-ds-density-touch-target);
}
:is(.secondary-actions,.area-actions,.tools-actions,.location-actions,.dsr-action-grid,.filter-actions) {
  gap: var(--salesmap-ds-spacing-control-gap);
}
.dsr-action-section {
  margin-top: var(--salesmap-ds-spacing-field-gap);
  padding: var(--salesmap-ds-spacing-card-padding-mobile);
}
html[data-runtime="android-webview"] :is(.tools-summary,.location-box,.user-account-row,.dsr-card,.dsr-gps-box) {
  padding: var(--salesmap-ds-spacing-card-padding-mobile);
}

/* Shared Settings, Dialog and card text now consume the same Stage 5 role vocabulary. */
.settings-section-title {
  font-size: var(--salesmap-ds-type-section-title-size);
  font-weight: var(--salesmap-ds-type-section-title-weight);
  line-height: var(--salesmap-ds-type-section-title-line-height);
}
:is(.settings-row-title,.notification-title,.tools-summary-label) {
  font-size: var(--salesmap-ds-type-label-size);
  font-weight: var(--salesmap-ds-type-label-weight);
  line-height: var(--salesmap-ds-type-label-line-height);
}
:is(.settings-section-note,.settings-row-subtitle,.settings-test-help,.notification-detail,.message-subtitle,.user-account-name) {
  font-size: var(--salesmap-ds-type-helper-size);
  font-weight: var(--salesmap-ds-type-helper-weight);
  line-height: var(--salesmap-ds-type-helper-line-height);
}
:is(.settings-test-label,.settings-category-heading,.result-meta) {
  font-size: var(--salesmap-ds-type-metadata-size);
  font-weight: var(--salesmap-ds-type-metadata-weight);
  line-height: var(--salesmap-ds-type-metadata-line-height);
}
:is(.message-body,.result-name) {
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}
:is(.tools-summary-value) {
  font-size: var(--salesmap-ds-type-metric-size);
  font-weight: var(--salesmap-ds-type-metric-weight);
  line-height: var(--salesmap-ds-type-metric-line-height);
}
:is(.user-account-code,.result-code) {
  font-size: var(--salesmap-ds-type-section-title-size);
  font-weight: var(--salesmap-ds-type-section-title-weight);
  line-height: var(--salesmap-ds-type-section-title-line-height);
}

/* Mobile utility surfaces share one row/card/control rhythm without changing their behavior. */
html[data-runtime="android-webview"] .settings-section {
  padding: var(--salesmap-ds-spacing-card-padding-mobile);
}
html[data-runtime="android-webview"] .settings-section-heading {
  gap: var(--salesmap-ds-spacing-control-gap);
  margin-bottom: var(--salesmap-ds-spacing-control-gap);
}
html[data-runtime="android-webview"] .settings-row {
  min-height: var(--salesmap-ds-density-row-height);
}
html[data-runtime="android-webview"] :is(.message-body,.notification-item) {
  padding: var(--salesmap-ds-spacing-card-padding-mobile);
}
:is(
  .settings-logout-action,
  .settings-neutral-action,
  .settings-test-action,
  .settings-clear-test-action,
  .settings-support-location-action,
  .notification-action
) {
  min-height: var(--salesmap-ds-density-touch-target);
  font-family: var(--salesmap-ds-font-family-sans);
  font-size: var(--salesmap-ds-type-button-label-size);
  font-weight: var(--salesmap-ds-type-button-label-weight);
  line-height: var(--salesmap-ds-type-button-label-line-height);
}
.message-input-field {
  font-size: var(--salesmap-ds-type-label-size);
  font-weight: var(--salesmap-ds-type-label-weight);
  line-height: var(--salesmap-ds-type-label-line-height);
}
.message-input-field input {
  min-height: var(--salesmap-ds-density-touch-target);
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}

html[data-runtime="browser-desktop"] .bottom-sheet.desktop-fill-sheet {
  padding-left: var(--salesmap-ds-spacing-page-gutter-desktop) !important;
  padding-right: var(--salesmap-ds-spacing-page-gutter-desktop) !important;
}
html[data-runtime="browser-desktop"] :is(.salesmap-workspace-head,.salesmap-workspace-actions) {
  gap: var(--salesmap-ds-spacing-control-gap);
  padding-left: var(--salesmap-ds-spacing-page-gutter-desktop);
  padding-right: var(--salesmap-ds-spacing-page-gutter-desktop);
}
html[data-runtime="browser-desktop"] .salesmap-workspace-body {
  gap: var(--salesmap-ds-spacing-section-gap);
  padding: var(--salesmap-ds-spacing-section-gap) var(--salesmap-ds-spacing-page-gutter-desktop);
}
html[data-runtime="browser-desktop"] .salesmap-management-overview {
  gap: var(--salesmap-ds-spacing-section-gap);
  padding: var(--salesmap-ds-spacing-card-padding-desktop);
}
html[data-runtime="browser-desktop"] :is(.salesmap-management-overview-actions,.salesmap-management-toolbar) {
  gap: var(--salesmap-ds-spacing-control-gap);
}
html[data-runtime="browser-desktop"] .salesmap-management-toolbar-btn {
  min-height: var(--salesmap-ds-density-touch-target);
  font-size: var(--salesmap-ds-type-button-label-size);
  font-weight: var(--salesmap-ds-type-button-label-weight);
  line-height: var(--salesmap-ds-type-button-label-line-height);
}
html[data-runtime="browser-desktop"] .salesmap-management-table th {
  height: var(--salesmap-ds-density-table-header-height);
  font-size: var(--salesmap-ds-type-table-header-size) !important;
  font-weight: var(--salesmap-ds-type-table-header-weight) !important;
  line-height: var(--salesmap-ds-type-table-header-line-height) !important;
}
html[data-runtime="browser-desktop"] .salesmap-management-table td {
  height: var(--salesmap-ds-density-table-row-height);
  font-size: var(--salesmap-ds-type-table-body-size) !important;
  font-weight: var(--salesmap-ds-type-table-body-weight) !important;
  line-height: var(--salesmap-ds-type-table-body-line-height) !important;
}
/*
 * This owner defines page lifecycle grammar only. Feature owners keep business content,
 * permissions, state transitions and feature-specific geometry inside semantic zones.
 */
.salesmap-page-archetype {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.salesmap-page-archetype :is(
  .salesmap-layout-navigation-zone,
  .salesmap-layout-identity-zone,
  .salesmap-layout-status-zone,
  .salesmap-layout-page-action-zone,
  .salesmap-layout-utility-zone,
  .salesmap-layout-commit-zone
) {
  min-width: 0;
  flex: 0 0 auto;
}

.salesmap-page-archetype .salesmap-layout-content-zone {
  min-width: 0;
  min-height: 0;
  flex: 1 1 auto;
}

/* Zone markers carry lifecycle meaning; they do not replace feature-owned grid/flex geometry. */

.salesmap-page-archetype .salesmap-layout-status-zone[hidden],
.salesmap-page-archetype .salesmap-ux-state[hidden] {
  display: none !important;
}

/* Detail pages keep identity stable while the content and contextual actions can vary. */
.salesmap-page-archetype[data-salesmap-archetype="detail"] .salesmap-layout-content-zone {
  display: flex;
  flex-direction: column;
  gap: var(--salesmap-ds-spacing-section-gap);
}

/* List pages reserve the content zone for the scrollable collection/results owner. */
.salesmap-page-archetype[data-salesmap-archetype="list"] .salesmap-layout-content-zone {
  overflow: auto;
  overscroll-behavior: contain;
}

/* Form/Capture pages keep one page-level scroll owner; commit actions stay after the form in normal flow. */
.salesmap-page-archetype:is(
  [data-salesmap-archetype="form"],
  [data-salesmap-archetype="capture"]
) {
  overflow: auto;
  overscroll-behavior: contain;
}

.salesmap-page-archetype:is(
  [data-salesmap-archetype="form"],
  [data-salesmap-archetype="capture"]
) .salesmap-layout-content-zone {
  flex: 0 0 auto;
  overflow: visible;
  overscroll-behavior: auto;
}

.salesmap-page-archetype:is(
  [data-salesmap-archetype="form"],
  [data-salesmap-archetype="capture"]
) .salesmap-layout-commit-zone {
  position: static;
  z-index: auto;
}

/* Report pages keep controls/status above results and commit/report actions outside results. */
.salesmap-page-archetype[data-salesmap-archetype="report"] .salesmap-layout-content-zone {
  min-height: 0;
  overflow: auto;
}

/* Settings pages are section-first and do not invent a separate workspace lifecycle. */
.salesmap-page-archetype[data-salesmap-archetype="settings"] .salesmap-layout-content-zone {
  display: flex;
  flex-direction: column;
  gap: var(--salesmap-ds-spacing-section-gap);
  overflow: auto;
}

/*
 * UX state grammar. State owners choose when a state is active; this component owns only
 * the shared presentation and semantic role. Feature-specific copy remains feature-owned.
 */
.salesmap-ux-state {
  min-width: 0;
  min-height: var(--salesmap-ds-density-row-height);
  display: grid;
  align-content: center;
  justify-items: start;
  gap: var(--salesmap-ds-spacing-control-gap);
  padding: var(--salesmap-ds-spacing-card-padding-mobile);
  border-radius: var(--salesmap-ds-radius-md);
  background: var(--salesmap-ds-color-surface-soft);
  color: var(--salesmap-ds-color-text-muted);
  font-size: var(--salesmap-ds-type-body-size);
  font-weight: var(--salesmap-ds-type-body-weight);
  line-height: var(--salesmap-ds-type-body-line-height);
}

.salesmap-ux-state > :is(b, strong, .salesmap-ux-state-title) {
  color: var(--salesmap-ds-color-text);
  font-size: var(--salesmap-ds-type-label-size);
  font-weight: var(--salesmap-ds-type-label-weight);
  line-height: var(--salesmap-ds-type-label-line-height);
}

.salesmap-ux-state[data-salesmap-ux-state="error"],
.salesmap-ux-state[data-salesmap-ux-state="permission-denied"] {
  background: color-mix(in srgb, var(--salesmap-ds-color-danger) 10%, var(--salesmap-ds-color-surface));
}

.salesmap-ux-state[data-salesmap-ux-state="success"] {
  background: color-mix(in srgb, var(--salesmap-ds-color-success) 10%, var(--salesmap-ds-color-surface));
}

.salesmap-ux-state:is(
  [data-salesmap-ux-state="loading"],
  [data-salesmap-ux-state="sync-pending"],
  [data-salesmap-ux-state="unsaved"]
) {
  background: color-mix(in srgb, var(--salesmap-ds-color-primary-soft) 54%, var(--salesmap-ds-color-surface));
}

.salesmap-ux-state:is(
  [data-salesmap-ux-state="empty"],
  [data-salesmap-ux-state="offline"],
  [data-salesmap-ux-state="disabled"],
  [data-salesmap-ux-state="readonly"]
) {
  color: var(--salesmap-ds-color-text-muted);
}

.salesmap-ux-state[data-salesmap-ux-state="empty"] {
  border: 1px dashed var(--salesmap-ds-color-line);
  background: var(--salesmap-ds-color-surface-soft);
}

/* Page actions are contextual; commit actions are the final workflow decision surface. */
.salesmap-page-archetype .salesmap-layout-commit-zone {
  padding-top: var(--salesmap-ds-spacing-control-gap);
  padding-bottom: var(--salesmap-ds-spacing-sticky-footer-bottom);
  background: var(--salesmap-ds-color-surface);
}

/* Explicit action clusters opt into shared row geometry; a zone marker alone never changes columns. */
.salesmap-page-archetype .salesmap-action-cluster {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--salesmap-ds-spacing-control-gap);
}

.salesmap-page-archetype .salesmap-action-cluster[data-salesmap-action-align="end"] {
  justify-content: flex-end;
}

.salesmap-page-archetype .salesmap-layout-commit-zone > [data-salesmap-action-role] {
  min-height: var(--salesmap-ds-density-touch-target);
}

/* Shared keyboard and form-state grammar; business validation remains feature-owned. */
.salesmap-page-archetype :is(button, a[href], input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--salesmap-ds-control-focus);
  outline-offset: 2px;
}

.salesmap-page-archetype :is(.form-input, .form-textarea)[aria-invalid="true"] {
  border-color: var(--salesmap-ds-color-danger) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--salesmap-ds-color-danger) 18%, transparent);
}

.salesmap-page-archetype [aria-busy="true"] {
  cursor: progress;
}

html[data-runtime="android-webview"] .salesmap-page-archetype {
  gap: var(--salesmap-ds-spacing-section-gap);
}

html[data-runtime="android-webview"] .bottom-sheet.open.salesmap-page-archetype:is(
  [data-salesmap-archetype="form"],
  [data-salesmap-archetype="capture"]
) {
  overflow: auto;
  padding-bottom: 0;
}

html[data-runtime="android-webview"] .salesmap-page-archetype .salesmap-layout-commit-zone {
  margin-left: calc(-1 * var(--salesmap-ds-spacing-page-gutter-mobile));
  margin-right: calc(-1 * var(--salesmap-ds-spacing-page-gutter-mobile));
  padding-left: var(--salesmap-ds-spacing-page-gutter-mobile);
  padding-right: var(--salesmap-ds-spacing-page-gutter-mobile);
  background: transparent;
}

/* Stage 8: one shared compact Dialog anatomy for confirmation, form and prompt Sheets. */
.salesmap-dialog-sheet {
  font-family: var(--salesmap-ds-font-family-sans);
}

.salesmap-dialog-sheet .salesmap-dialog-header {
  align-items: center;
  margin-bottom: var(--salesmap-ds-spacing-field-gap);
}

/* Dialog titles keep the shared sheet-title frame while owning dialog typography. */
.salesmap-dialog-sheet .salesmap-dialog-title {
  margin: 0;
  color: var(--theme-ink);
  font-size: var(--salesmap-ds-type-section-title-size);
  font-weight: var(--salesmap-ds-type-section-title-weight);
  line-height: var(--salesmap-ds-type-section-title-line-height);
  letter-spacing: 0;
}

.salesmap-dialog-body,
.salesmap-dialog-form {
  min-width: 0;
  display: grid;
  gap: var(--salesmap-ds-spacing-field-gap);
}

.salesmap-dialog-context,
.salesmap-dialog-helper,
.salesmap-dialog-error {
  font-size: var(--salesmap-ds-type-helper-size);
  line-height: var(--salesmap-ds-type-helper-line-height);
}

.salesmap-dialog-context,
.salesmap-dialog-helper {
  color: var(--theme-muted);
  font-weight: var(--salesmap-ds-type-helper-weight);
}

.salesmap-dialog-context:empty {
  display: none;
}

.salesmap-dialog-error {
  min-height: 18px;
  color: var(--salesmap-ds-color-danger);
  font-weight: var(--salesmap-ds-font-weight-semibold);
}

.salesmap-dialog-field {
  min-width: 0;
  display: grid;
  gap: var(--salesmap-ds-spacing-control-gap);
  margin: 0;
  color: var(--theme-ink);
}

.salesmap-dialog-field[hidden] {
  display: none;
}

.salesmap-dialog-field > .form-label {
  margin: 0;
}

.salesmap-dialog-actions {
  display: flex;
  gap: var(--salesmap-ds-spacing-control-gap);
  margin-top: var(--salesmap-ds-spacing-section-gap);
}

.salesmap-dialog-actions > button {
  min-width: 0;
  flex: 1 1 0;
}

.salesmap-dialog-actions > button.is-loading {
  cursor: wait;
  pointer-events: none;
}

.salesmap-dialog-actions > button.is-loading::before {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 8px;
  vertical-align: -2px;
  border: 2px solid color-mix(in srgb, currentColor 38%, transparent);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: salesmap-dialog-spin 0.72s linear infinite;
}

@keyframes salesmap-dialog-spin {
  to { transform: rotate(360deg); }
}

.message-sheet[data-processing="true"] .sheet-handle {
  pointer-events: none;
}

/* A destructive Dialog confirm is a strong Danger action, not a generic Primary button. */
.salesmap-dialog-actions > button[data-salesmap-action-role="danger"] {
  border-color: transparent !important;
  background: var(--salesmap-ds-action-danger-bg) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
  box-shadow: none !important;
}

.salesmap-dialog-actions > button[data-salesmap-action-role="danger"]:active {
  background: var(--theme-danger-dark) !important;
  color: var(--salesmap-ds-primitive-neutral-0) !important;
}

/* Android Create User keeps the existing semantic control surface with one visible light boundary. */
html[data-runtime="android-webview"][data-app-theme] #createUserSheet :is(
  .form-input,
  .form-textarea,
  select:not([multiple]):not(.hidden-native-select),
  .android-themed-select-trigger
) {
  border-color: var(--theme-line) !important;
}

html[data-runtime="android-webview"][data-app-theme] #createUserSheet :is(
  .form-input,
  .form-textarea,
  select:not([multiple]):not(.hidden-native-select),
  .android-themed-select-trigger
):focus,
html[data-runtime="android-webview"][data-app-theme] #createUserSheet .android-themed-select-trigger[aria-expanded="true"] {
  border-color: var(--salesmap-ds-control-focus) !important;
}

html[data-runtime="android-webview"] #newUserCodeInput {
  text-transform: uppercase;
}

@media (min-width: 901px) {
  html[data-runtime="browser-desktop"] .salesmap-dialog-sheet,
  html[data-runtime="browser-desktop"] .salesmap-dialog-sheet.open {
    width: min(560px, calc(100vw - var(--desktop-main-left) - 48px)) !important;
    max-width: 560px !important;
    padding: 0 22px 20px !important;
    border-radius: 18px !important;
    overflow: hidden !important;
  }

  html[data-runtime="browser-desktop"] .salesmap-dialog-sheet > .sheet-handle {
    display: none;
  }

  html[data-runtime="browser-desktop"] .salesmap-dialog-sheet > .salesmap-dialog-header {
    margin: 0 -22px 16px !important;
    padding: 16px 22px !important;
    border-bottom: 1px solid var(--theme-line) !important;
  }
}
