* { box-sizing: border-box; }

:root {
  --brand: #f2a51a;
  --brand-dark: #cf8807;
  --brand-soft: #fff6e3;
  --brand-faint: #fffaf0;
  --ink: #0f172a;
  --ink-soft: #334155;
  --muted: #667085;
  --line: #e7ebf0;
  --line-strong: #d5dbe3;
  --bg: #f7f8fb;
  --card: #ffffff;
  --success: #15803d;
  --success-soft: #ecfdf3;
  --danger: #dc2626;
  --danger-soft: #fff1f2;
  --info: #2563eb;
  --info-soft: #eff6ff;
  --slate: #475467;
  --slate-soft: #f2f4f7;
  --shadow-sm: 0 8px 24px rgba(15, 23, 42, .05);
  --shadow: 0 20px 48px rgba(15, 23, 42, .08);
  --radius-xl: 24px;
  --radius-lg: 20px;
  --radius-md: 16px;
  --radius-sm: 12px;
}

html { min-height: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background:
    radial-gradient(circle at 8% -10%, rgba(242, 165, 26, .12), transparent 34rem),
    radial-gradient(circle at 105% 110%, rgba(37, 99, 235, .05), transparent 24rem),
    linear-gradient(180deg, #fbfcfe 0%, var(--bg) 100%);
  font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

button, input, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: wait; opacity: .72; }
svg { width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; }

.hidden { display: none !important; }
.muted { color: var(--muted); }
.full { width: 100%; }

.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 28px;
}

.login-card {
  width: min(500px, 100%);
  border: 1px solid rgba(208, 213, 221, .9);
  border-radius: 30px;
  background: rgba(255, 255, 255, .92);
  box-shadow: var(--shadow);
  padding: 30px;
  backdrop-filter: blur(10px);
}

.login-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.sidebar-hero {
  flex: 0 0 auto;
  border: 1px solid #ecd8a0;
  border-radius: 22px;
  padding: 16px 16px 14px;
  background: linear-gradient(180deg, #fffdf9 0%, #fdf9ef 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}
.sidebar-hero-logo {
  width: 138px;
  margin-bottom: 8px;
}
.sidebar-hero .eyebrow {
  margin-bottom: 6px;
}
.sidebar-hero-text {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.brand-logo {
  width: 152px;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.login-copy { margin: 30px 0 22px; }
.eyebrow {
  margin: 0 0 8px;
  color: var(--brand-dark);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 8px; font-size: clamp(27px, 3.4vw, 40px); line-height: 1.06; letter-spacing: -.04em; }
h2 { margin-bottom: 8px; font-size: 20px; letter-spacing: -.03em; }
h3 { margin-bottom: 4px; font-size: 16px; letter-spacing: -.02em; }
p { line-height: 1.55; }

.login-copy p:last-child,
.card-heading p,
.form-intro p,
.section-title p,
.guide-card p,
.support-card p,
.info-card p { color: var(--muted); margin-bottom: 0; }

.login-form { display: grid; gap: 14px; }
.login-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
  font-size: 13px;
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
  padding: 20px 14px;
  border-right: 1px solid var(--line);
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(18px);
}

.sidebar-menu-scroll {
  min-height: 0;
  display: grid;
  gap: 16px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 2px 4px 12px 0;
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, .65) transparent;
}
.sidebar-menu-scroll::-webkit-scrollbar { width: 8px; }
.sidebar-menu-scroll::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: rgba(148, 163, 184, .55);
  background-clip: padding-box;
}
.sidebar-menu-scroll::-webkit-scrollbar-track { background: transparent; }

.nav-section { display: grid; gap: 8px; }
.nav-section-title {
  margin: 0 10px;
  color: #98a2b3;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.new-order-button,
.primary {
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--brand) 0%, #ffb83c 100%);
  color: #1f1300;
  font-weight: 800;
  box-shadow: 0 12px 22px rgba(242, 165, 26, .24);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.new-order-button {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 12px 16px;
  font-size: 15px;
}

.primary { padding: 13px 18px; }
.primary:hover,
.new-order-button:hover { transform: translateY(-1px); box-shadow: 0 16px 28px rgba(242, 165, 26, .3); filter: saturate(1.04); }

.nav-list { display: grid; gap: 6px; }
.nav-item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 0;
  border-radius: 14px;
  padding: 10px 12px;
  background: transparent;
  color: var(--ink-soft);
  text-align: left;
  font-weight: 700;
  transition: background .16s ease, color .16s ease, border-color .16s ease;
}
.nav-item:hover { background: #f7f8fa; color: var(--ink); }
.nav-item.active {
  background: linear-gradient(180deg, var(--brand-soft), #fffdf8);
  color: #9a5f00;
  box-shadow: inset 3px 0 0 var(--brand), 0 6px 16px rgba(242, 165, 26, .08);
}
.nav-icon {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 20px;
}

.sidebar-bottom {
  flex: 0 0 auto;
  display: grid;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(231, 235, 240, .9);
  background: linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.96) 24%, rgba(255,255,255,.96));
}
.company-mini {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 10px;
  background: #fff;
  box-shadow: var(--shadow-sm);
}
.company-mini strong,
.company-mini span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-mini span { color: var(--muted); font-size: 13px; margin-top: 2px; }
.avatar {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #65b87b, #2f9652);
  color: #fff;
  font-weight: 850;
}

.main-area {
  min-width: 0;
  padding: 28px clamp(20px, 3vw, 40px) 54px;
}

.topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 24px;
}
.topbar h1 { margin: 0; }
.page-subtitle {
  margin: 8px 0 0;
  color: var(--muted);
  max-width: 680px;
}
.topbar-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }

.referral-chip,
.icon-button,
.ghost,
.link-button,
.sync-chip {
  border: 1px solid var(--line-strong);
  background: #fff;
  color: var(--ink);
  font-weight: 700;
}
.referral-chip { border-color: rgba(242, 165, 26, .45); border-radius: 14px; padding: 12px 16px; }
.icon-button {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
}
.ghost { border-radius: 13px; padding: 12px 15px; }
.ghost:hover,
.referral-chip:hover,
.icon-button:hover,
.link-button:hover,
.quick-action:hover { background: #f9fafb; }
.ghost.small { padding: 9px 12px; font-size: 13px; }
.link-button {
  border: 0;
  color: var(--brand-dark);
  background: transparent;
  padding: 4px 0;
}
.sync-chip {
  border-radius: 999px;
  padding: 10px 12px;
  color: var(--muted);
  font-size: 13px;
}

.view-panel { display: none; }
.view-panel.active { display: block; }

.hero-panel,
.card,
.metric-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: rgba(255, 255, 255, .96);
  box-shadow: var(--shadow-sm);
}

.hero-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 24px;
  margin-bottom: 18px;
  background:
    linear-gradient(110deg, rgba(255, 247, 232, .92), rgba(255, 255, 255, .99) 64%),
    #fff;
}
.hero-panel.slim { padding: 20px 24px; }
.hero-main { display: grid; gap: 10px; }
.hero-panel h2 { font-size: clamp(24px, 2.8vw, 34px); margin-bottom: 4px; }
.hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.meta-pill {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(208, 213, 221, .8);
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 700;
}

.metric-grid {
  display: grid;
  gap: 16px;
  margin-bottom: 18px;
}
.metrics-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metric-card {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 18px;
}
.metric-card p { color: var(--muted); margin-bottom: 2px; font-size: 14px; }
.metric-card strong { display: block; font-size: 24px; letter-spacing: -.03em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.metric-icon {
  width: 54px;
  height: 54px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  font-size: 22px;
}
.metric-icon.amber { background: var(--brand-soft); color: var(--brand-dark); }
.metric-icon.green { background: var(--success-soft); color: var(--success); }
.metric-icon.blue { background: var(--info-soft); color: var(--info); }
.metric-icon.slate { background: var(--slate-soft); color: var(--slate); }

.content-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(300px, 0.9fr);
  gap: 18px;
}
.home-grid-refined { align-items: start; }
.card { padding: 22px; }
.side-stack { display: grid; gap: 18px; }
.card-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 16px;
}
.card-heading.minimal { margin-bottom: 14px; }

.quick-actions { display: grid; gap: 12px; }
.quick-action {
  width: 100%;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: flex-start;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
  background: #fff;
  text-align: left;
}
.quick-action strong { display: block; margin-bottom: 2px; }
.quick-action span:last-child,
.quick-action div span { color: var(--muted); font-size: 13px; line-height: 1.45; }
.quick-action-icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
}
.quick-action-icon.amber { background: var(--brand-soft); color: var(--brand-dark); }
.quick-action-icon.blue { background: var(--info-soft); color: var(--info); }

.support-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.support-list li {
  display: grid;
  gap: 4px;
  padding: 0 0 12px;
  border-bottom: 1px solid var(--line);
}
.support-list li:last-child { border-bottom: 0; padding-bottom: 0; }
.support-list strong { font-size: 14px; }
.support-list span { color: var(--muted); font-size: 14px; line-height: 1.5; }

.order-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 18px;
  align-items: start;
}
.order-form { padding: 24px; }
.form-intro {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.new-order-experience-hint {
  margin: 14px 0 0;
  padding: 12px 14px;
  border: 1px solid rgba(242, 165, 26, .22);
  border-radius: 16px;
  background: var(--brand-faint);
  color: var(--ink-soft);
  line-height: 1.45;
  font-size: 14px;
}
.new-order-optional-toggle-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin: 16px 0 -2px;
  padding: 12px 14px;
  border: 1px dashed rgba(148, 163, 184, .55);
  border-radius: 16px;
  background: #fff;
}
.new-order-optional-toggle-row span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
body.new-order-options-collapsed [data-order-optional] {
  display: none !important;
}
body.new-order-simple-flow .execution-choice-field {
  display: none !important;
}
body.new-order-advanced-flow .new-order-experience-hint {
  border-color: rgba(37, 99, 235, .18);
  background: var(--info-soft);
}
body.new-order-single-route-flow .new-order-experience-hint::before {
  content: 'Uma rota por pedido · ';
  font-weight: 900;
  color: var(--brand-dark);
}

.form-section {
  padding: 20px 0 6px;
  border-bottom: 1px solid var(--line);
}
.form-section:last-of-type { border-bottom: 0; }
.locked-customer { padding-bottom: 18px; }
.section-title {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 14px;
}
.section-title > span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-weight: 900;
}
.inline-actions { margin: -6px 0 14px 46px; }

.grid { display: grid; gap: 14px; }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.field.wide { grid-column: 1 / -1; }
label { font-size: 13px; font-weight: 800; color: var(--ink-soft); }
small { color: var(--muted); line-height: 1.4; }
input,
textarea {
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  padding: 12px 13px;
  color: var(--ink);
  background: #fff;
  outline: none;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
textarea { resize: vertical; min-height: 92px; }
input:focus,
textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(242, 165, 26, .16); }
input::placeholder,
textarea::placeholder { color: #98a2b3; }

.suggest-field { position: relative; }
.suggest-box {
  position: absolute;
  z-index: 40;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  max-height: 286px;
  overflow-y: auto;
  border: 1px solid var(--line-strong);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 20px 42px rgba(15, 23, 42, .14);
}
.suggest-item {
  width: 100%;
  border: 0;
  border-radius: 0;
  display: block;
  padding: 12px 14px;
  color: var(--ink);
  background: #fff;
  text-align: left;
  font-weight: 700;
}
.suggest-item small { display: block; margin-top: 3px; font-weight: 500; }
.suggest-item:hover { background: #faf7ef; }
.suggest-empty { padding: 13px 14px; color: var(--muted); }

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding-top: 20px;
}

.order-aside { min-width: 0; }
.sticky-card { position: sticky; top: 24px; }
.route-preview { margin-top: 12px; }
.route-point {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}
.route-point > span {
  width: 18px;
  height: 18px;
  margin-top: 3px;
  border-radius: 999px;
  background: var(--brand);
  border: 4px solid var(--brand-soft);
}
.route-point.end > span { background: var(--success); border-color: var(--success-soft); }
.route-point p { margin: 2px 0 0; color: var(--muted); font-size: 14px; word-break: break-word; }
.route-line {
  width: 2px;
  height: 34px;
  margin: 3px 0 3px 9px;
  background: linear-gradient(var(--brand), var(--success));
  border-radius: 999px;
}
.summary-list { display: grid; gap: 10px; margin: 18px 0 0; }
.summary-list div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-radius: 14px;
  background: #fafafa;
}
dt { color: var(--muted); font-size: 13px; }
dd { margin: 0; font-weight: 800; text-align: right; }

.success-box {
  margin-top: 18px;
  padding: 14px;
  border: 1px solid #b7efc7;
  border-radius: 16px;
  background: var(--success-soft);
  color: #166534;
}
.success-box strong { display: block; margin-bottom: 4px; }

.order-list { display: grid; gap: 12px; }
.order-row {
  display: grid;
  grid-template-columns: minmax(130px, 0.85fr) minmax(0, 1.25fr) minmax(0, 1.4fr) auto;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.order-row:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}
.order-list.compact .order-row { grid-template-columns: minmax(120px, 0.8fr) minmax(0, 1.4fr) auto; }
.order-list.compact .order-row .order-route,
.order-list.compact .order-row .order-action { display: none; }
.order-cell strong,
.order-route strong { display: block; margin-bottom: 4px; }
.order-cell span,
.order-route span,
.order-route small,
.order-cell small { color: var(--muted); display: block; }
.order-number { font-size: 16px; letter-spacing: -.02em; }
.order-route { display: grid; gap: 4px; }
.order-route-label { color: #98a2b3; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.order-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 110px;
}
.status-chip,
.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.pill { background: var(--brand-soft); color: var(--brand-dark); }
.pill.subtle { background: #f3f4f6; color: var(--ink-soft); }
.status-chip { background: var(--brand-soft); color: var(--brand-dark); }
.status-chip.done { background: var(--success-soft); color: var(--success); }
.status-chip.cancel { background: var(--danger-soft); color: var(--danger); }
.status-chip.motion { background: var(--info-soft); color: var(--info); }
.empty-state {
  border: 1px dashed var(--line-strong);
  border-radius: 18px;
  padding: 24px;
  color: var(--muted);
  background: #fff;
  text-align: center;
}

.empty-feature-state {
  min-height: 260px;
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: center;
  gap: 22px;
  padding: 34px;
  border-style: solid;
  border-color: rgba(214, 180, 83, .45);
  background:
    radial-gradient(circle at 10% 10%, rgba(242, 165, 26, .12), transparent 18rem),
    linear-gradient(135deg, #fffdf8 0%, #ffffff 58%, #f8fafc 100%);
  text-align: left;
}

.empty-feature-icon {
  width: 72px;
  height: 72px;
  border-radius: 24px;
  display: grid;
  place-items: center;
  color: var(--brand-dark);
  background: var(--brand-soft);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), 0 14px 24px rgba(242, 165, 26, .14);
}

.empty-feature-icon svg {
  width: 36px;
  height: 36px;
}

.empty-feature-copy {
  min-width: 0;
}

.empty-feature-copy strong {
  display: block;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.18;
  letter-spacing: -.03em;
  margin-bottom: 6px;
}

.empty-feature-copy > span {
  display: block;
  max-width: 720px;
  color: var(--muted);
  line-height: 1.55;
}

.empty-feature-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.empty-feature-list li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink-soft);
  background: rgba(255, 255, 255, .82);
  font-size: 13px;
  font-weight: 700;
}

.empty-feature-list li::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--brand);
}

.empty-feature-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.notification-list .empty-feature-state,
.activity-list .empty-feature-state,
.proofs-list .empty-feature-state,
.destinations-list .empty-feature-state,
.template-list .empty-feature-state,
.report-list .empty-feature-state,
.tracking-list .empty-feature-state,
.order-list .empty-feature-state {
  width: 100%;
}

@media (max-width: 720px) {
  .empty-feature-state {
    min-height: auto;
    grid-template-columns: 1fr;
    padding: 24px;
    text-align: center;
  }
  .empty-feature-icon {
    margin: 0 auto;
  }
  .empty-feature-copy > span {
    margin: 0 auto;
  }
  .empty-feature-list,
  .empty-feature-actions {
    justify-content: center;
  }
}

.steps-list { margin: 14px 0 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.steps-list li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; color: var(--ink-soft); }
.steps-list span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-weight: 900;
}
.help-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.help-grid article { padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.help-grid p { color: var(--muted); margin-bottom: 0; }

.toast {
  position: fixed;
  right: 22px;
  bottom: 96px;
  z-index: 120;
  max-width: min(420px, calc(100vw - 44px));
  border-radius: 16px;
  padding: 14px 16px;
  background: #111827;
  color: #fff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .28);
  font-weight: 700;
}

@media (max-width: 1260px) {
  .metrics-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1180px) {
  .app-shell { grid-template-columns: 248px minmax(0, 1fr); }
  .order-layout { grid-template-columns: 1fr; }
  .sticky-card { position: static; }
  .content-grid { grid-template-columns: 1fr; }
}

@media (max-width: 920px) {
  .app-shell { display: block; }
  .sidebar {
    position: static;
    height: auto;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .sidebar-menu-scroll {
    overflow: visible;
    padding-right: 0;
  }
  .sidebar-bottom {
    border-top: 0;
    background: transparent;
  }
  .nav-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nav-item { justify-content: center; font-size: 13px; padding: 11px 9px; }
  .nav-item span:last-child { display: none; }
  .sidebar-bottom { display: grid; }
  .main-area { padding: 22px 16px 44px; }
  .metrics-4,
  .help-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .topbar,
  .hero-panel,
  .form-intro,
  .card-heading,
  .login-footer { align-items: stretch; flex-direction: column; }
  .grid.two,
  .grid.three { grid-template-columns: 1fr; }
  .field.wide { grid-column: auto; }
  .order-row,
  .order-list.compact .order-row { grid-template-columns: 1fr; align-items: start; }
  .order-action { min-width: 0; justify-content: flex-start; }
  .topbar-actions { width: 100%; justify-content: stretch; }
  .topbar-actions > * { flex: 1; }
  .login-shell { padding: 14px; }
  .login-card { padding: 22px; border-radius: 24px; }
  .hero-meta { display: grid; }
}

/* Fase 3 — Meus pedidos: filtros, detalhe e reutilização */
.orders-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: 18px;
  align-items: start;
}

.orders-card { min-width: 0; }
.orders-heading { margin-bottom: 18px; }

.orders-toolbar {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) 190px;
  gap: 14px;
  align-items: end;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #fcfcfd);
  margin-bottom: 12px;
}

.search-input-wrap {
  position: relative;
}

.search-input-wrap input {
  padding-right: 42px;
}

.clear-search-button {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 30px;
  height: 30px;
  transform: translateY(-50%);
  border: 0;
  border-radius: 999px;
  background: #f2f4f7;
  color: var(--muted);
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
}

.clear-search-button:hover {
  background: #e9edf3;
  color: var(--ink);
}

select {
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  padding: 12px 36px 12px 13px;
  color: var(--ink);
  background: #fff;
  outline: none;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 13px) calc(50% - 3px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

select:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 4px rgba(242, 165, 26, .16);
}

.status-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}

.status-filter {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--ink-soft);
  padding: 9px 13px;
  font-weight: 800;
  font-size: 13px;
}

.status-filter:hover {
  background: #f9fafb;
}

.status-filter.active {
  border-color: rgba(242, 165, 26, .55);
  background: var(--brand-soft);
  color: #9a5f00;
}

.orders-count-label {
  margin: 2px 0 14px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.order-row {
  cursor: pointer;
}

.order-row.selected {
  border-color: rgba(242, 165, 26, .75);
  box-shadow: 0 14px 30px rgba(242, 165, 26, .13);
}

.order-row:focus-visible {
  outline: 3px solid rgba(242, 165, 26, .28);
  outline-offset: 2px;
}

.order-detail-card {
  position: sticky;
  top: 24px;
  min-width: 0;
}

.order-detail-empty {
  min-height: 260px;
  display: grid;
  align-content: center;
  gap: 8px;
  text-align: center;
}

.order-detail-empty h2,
.order-detail-empty p {
  margin-bottom: 0;
}

.detail-header {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}

.detail-header h2 {
  font-size: 28px;
  margin-bottom: 4px;
}

.detail-section {
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}

.detail-section h3 {
  margin-bottom: 6px;
}

.detail-section p {
  margin-bottom: 0;
  color: var(--muted);
}

.detail-route {
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}

.customer-timeline {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
}

.customer-timeline li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  position: relative;
}

.customer-timeline li::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 24px;
  bottom: -14px;
  width: 2px;
  background: var(--line);
}

.customer-timeline li:last-child::before { display: none; }

.customer-timeline li > span {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 2px solid var(--line-strong);
  background: #fff;
  z-index: 1;
}

.customer-timeline li.done > span {
  border-color: var(--success);
  background: var(--success);
}

.customer-timeline li.current > span {
  border-color: var(--brand);
  background: var(--brand-soft);
  box-shadow: inset 0 0 0 5px #fff;
}

.customer-timeline li strong {
  display: block;
  margin-bottom: 2px;
}

.customer-timeline li p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 14px;
}

.customer-timeline li.pending {
  opacity: .68;
}

.detail-actions {
  display: grid;
  gap: 10px;
  padding-top: 16px;
}

@media (max-width: 1180px) {
  .orders-workspace {
    grid-template-columns: 1fr;
  }
  .order-detail-card {
    position: static;
  }
}

@media (max-width: 720px) {
  .orders-toolbar {
    grid-template-columns: 1fr;
  }
  .status-filter-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .status-filter {
    width: 100%;
  }
  .detail-header {
    flex-direction: column;
  }
}

/* Fase 4 — refinamento do fluxo de nova entrega */
.intro-actions {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.draft-chip {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border-radius: 999px;
  padding: 6px 10px;
  background: var(--slate-soft);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.draft-chip.saved { background: var(--success-soft); color: var(--success); }
.draft-chip.dirty { background: var(--brand-soft); color: var(--brand-dark); }

.order-progress {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  padding: 18px 0 4px;
}
.progress-step {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px;
  background: #fff;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.progress-step span {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  flex: 0 0 24px;
  border-radius: 999px;
  background: #f2f4f7;
  color: var(--muted);
  font-size: 12px;
}
.progress-step strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.progress-step.done {
  border-color: rgba(21, 128, 61, .22);
  background: var(--success-soft);
  color: var(--success);
}
.progress-step.done span { background: #d1fadf; color: var(--success); }
.progress-step.current {
  border-color: rgba(242, 165, 26, .38);
  background: var(--brand-faint);
  color: var(--brand-dark);
  box-shadow: inset 3px 0 0 var(--brand);
}
.progress-step.current span { background: var(--brand-soft); color: var(--brand-dark); }

.field.has-error input,
.field.has-error textarea {
  border-color: rgba(220, 38, 38, .72);
  box-shadow: 0 0 0 4px rgba(220, 38, 38, .10);
}
.field-error {
  display: none;
  color: var(--danger);
  font-weight: 750;
}
.field.has-error .field-error:not(:empty) { display: block; }

.compact-actions-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: -2px;
}
.quick-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.quick-chip-row button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 10px;
  background: #fff;
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 800;
}
.quick-chip-row button:hover {
  border-color: rgba(242, 165, 26, .45);
  background: var(--brand-faint);
  color: var(--brand-dark);
}

.readiness-box {
  display: grid;
  gap: 12px;
  margin: 12px 0 18px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}
.readiness-score {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}
.readiness-score strong {
  min-width: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 8px 10px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-size: 16px;
}
.readiness-score span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
.readiness-list {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.readiness-list li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
}
.readiness-list li::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border-radius: 999px;
  background: #f2f4f7;
  border: 1px solid var(--line-strong);
}
.readiness-list li.done {
  color: var(--ink-soft);
  font-weight: 750;
}
.readiness-list li.done::before {
  content: "✓";
  display: grid;
  place-items: center;
  background: var(--success-soft);
  border-color: rgba(21, 128, 61, .22);
  color: var(--success);
  font-size: 12px;
  font-weight: 900;
}
.summary-submit { margin-top: 16px; }

@media (max-width: 920px) {
  .order-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .order-progress { grid-template-columns: 1fr; }
  .intro-actions { justify-content: flex-start; }
  .compact-actions-row { flex-direction: column; align-items: stretch; }
  .compact-actions-row .ghost { width: 100%; }
}

/* Fase 5 — acompanhamento do pedido e pós-solicitação */
.post-submit-banner {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) auto auto;
  gap: 16px;
  align-items: center;
  margin: -2px 0 18px;
  padding: 16px;
  border: 1px solid rgba(21, 128, 61, .18);
  border-radius: 22px;
  background:
    linear-gradient(120deg, rgba(236, 253, 243, .95), rgba(255, 255, 255, .98) 62%),
    #fff;
  box-shadow: 0 14px 32px rgba(21, 128, 61, .08);
}
.post-submit-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: var(--success-soft);
  color: var(--success);
}
.post-submit-copy h2 { margin-bottom: 4px; font-size: 20px; }
.post-submit-copy p:last-child { margin-bottom: 0; color: var(--muted); }
.post-submit-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}

.mini-timeline {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px 12px;
  align-items: center;
  margin-top: 4px;
}
.mini-timeline span {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #fff;
  border: 2px solid var(--line-strong);
  position: relative;
}
.mini-timeline span:not(:last-of-type)::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 16px;
  width: 2px;
  height: 24px;
  background: var(--line);
}
.mini-timeline span.done { background: var(--success); border-color: var(--success); }
.mini-timeline span.current { border-color: var(--brand); background: var(--brand-soft); box-shadow: inset 0 0 0 4px #fff; }
.mini-timeline strong { font-size: 14px; color: var(--ink-soft); }

.empty-detail-icon {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  justify-self: center;
  border-radius: 20px;
  background: var(--brand-soft);
  color: var(--brand-dark);
}
.detail-header.polished { padding-bottom: 14px; }
.next-step-card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin: 16px 0;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #fff, #fbfcfd);
}
.next-step-card strong { display: block; margin-bottom: 4px; }
.next-step-card p { margin-bottom: 0; color: var(--muted); font-size: 14px; }
.next-step-card.warning { border-color: rgba(242, 165, 26, .24); background: var(--brand-faint); }
.next-step-card.info { border-color: rgba(37, 99, 235, .16); background: var(--info-soft); }
.next-step-card.success { border-color: rgba(21, 128, 61, .18); background: var(--success-soft); }
.next-step-card.danger { border-color: rgba(220, 38, 38, .18); background: var(--danger-soft); }
.next-step-icon {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: #fff;
  color: var(--brand-dark);
}
.next-step-card.info .next-step-icon { color: var(--info); }
.next-step-card.success .next-step-icon { color: var(--success); }
.next-step-card.danger .next-step-icon { color: var(--danger); }

.detail-info-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.detail-info-grid div {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}
.detail-info-grid span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.detail-info-grid strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
}
.refined-route {
  padding: 16px 0;
  border-top: 1px solid var(--line);
}
.timeline-section { padding-top: 16px; }
.timeline-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.timeline-title-row h3 { margin-bottom: 0; }
.timeline-title-row span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.customer-timeline li.done > span::before {
  content: "✓";
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}
.customer-timeline li.current > span::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  margin: 5px;
  border-radius: 999px;
  background: var(--brand);
}
.customer-timeline.issue li.current > span {
  border-color: var(--danger);
  background: var(--danger-soft);
  box-shadow: inset 0 0 0 5px #fff;
}
.customer-timeline.issue li.current > span::before { background: var(--danger); }

.pod-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin-top: 16px;
  padding: 14px;
  border: 1px dashed var(--line-strong);
  border-radius: 18px;
  background: #fcfcfd;
}
.pod-card.ready {
  border-style: solid;
  border-color: rgba(21, 128, 61, .20);
  background: var(--success-soft);
}
.pod-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: #fff;
  color: var(--muted);
}
.pod-card.ready .pod-icon { color: var(--success); }
.pod-card strong { display: block; margin-bottom: 4px; }
.pod-card p { margin-bottom: 0; color: var(--muted); font-size: 14px; }
.polished-actions { gap: 9px; }
.help-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.help-status-card .support-list { margin-top: 4px; }

@media (max-width: 1040px) {
  .post-submit-banner { grid-template-columns: 54px minmax(0, 1fr); }
  .post-submit-banner > .status-chip,
  .post-submit-actions { grid-column: 2; justify-content: flex-start; }
}

@media (max-width: 720px) {
  .post-submit-banner { grid-template-columns: 1fr; }
  .post-submit-banner > .status-chip,
  .post-submit-actions { grid-column: auto; }
  .post-submit-icon { justify-self: start; }
  .detail-info-grid,
  .help-grid-2 { grid-template-columns: 1fr; }
  .timeline-title-row { align-items: flex-start; flex-direction: column; }
}

.tracking-progress {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin: 12px 0 14px;
}
.tracking-progress > div {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #eef1f5;
}
.tracking-progress > div > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--brand), #ffc45c);
  transition: width .28s ease;
}
.tracking-progress strong {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 850;
}
.detail-loading {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--brand-dark);
  font-weight: 800;
}
.detail-loading::before {
  content: "";
  width: 10px;
  height: 10px;
  border: 2px solid rgba(207, 136, 7, .24);
  border-top-color: var(--brand-dark);
  border-radius: 999px;
  animation: xmotoSpin .8s linear infinite;
}
.customer-timeline small {
  display: block;
  margin-top: 4px;
  color: #98a2b3;
  font-size: 12px;
  font-weight: 700;
}
.pod-card.ready {
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
}
.pod-card .ghost.small {
  white-space: nowrap;
}
@keyframes xmotoSpin { to { transform: rotate(360deg); } }

@media (max-width: 720px) {
  .pod-card.ready { grid-template-columns: 46px minmax(0, 1fr); }
  .pod-card .ghost.small { grid-column: 1 / -1; }
}


/* Fase 7 — catálogo de endereços/destinatários frequentes */
.quick-action-icon.slate {
  background: var(--slate-soft);
  color: var(--slate);
}

.destinations-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.destinations-card {
  min-width: 0;
}

.destinations-toolbar {
  margin-bottom: 14px;
}

.destinations-list {
  display: grid;
  gap: 12px;
}

.destination-card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) minmax(190px, auto);
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.destination-card:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.destination-pin {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: var(--brand-soft);
  color: var(--brand-dark);
}

.destination-pin svg {
  width: 23px;
  height: 23px;
}

.destination-main {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.destination-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.destination-title-row strong {
  display: block;
  font-size: 16px;
  letter-spacing: -.02em;
}

.destination-title-row span:not(.meta-pill),
.destination-main small {
  color: var(--muted);
  font-size: 13px;
}

.destination-main p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.45;
}

.destination-actions {
  display: grid;
  gap: 8px;
  justify-items: stretch;
}

.primary.small-action {
  min-height: 38px;
  padding: 10px 13px;
  font-size: 13px;
}

.destination-guide-card {
  position: sticky;
  top: 24px;
}

.compact-steps {
  gap: 10px;
}

.compact-steps li {
  font-size: 14px;
}

.destination-guide-note {
  margin-top: 18px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--brand-faint);
}

.destination-guide-note p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.destination-empty {
  display: grid;
  gap: 4px;
}

.destination-empty strong {
  color: var(--ink);
}

.destination-empty span {
  color: var(--muted);
}

@media (max-width: 1180px) {
  .destinations-workspace {
    grid-template-columns: 1fr;
  }

  .destination-guide-card {
    position: static;
  }
}

@media (max-width: 720px) {
  .destination-card {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .destination-actions {
    justify-items: stretch;
  }

  .destination-title-row {
    flex-direction: column;
  }
}

/* Hotfix UX: evita piscar a tela de login enquanto a sessão salva é validada. */
body.is-booting #loginView,
body.is-booting #appView {
  opacity: 0;
  visibility: hidden;
}

.boot-overlay {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 14% -8%, rgba(242, 165, 26, .14), transparent 32rem),
    linear-gradient(180deg, #fbfcfe 0%, var(--bg) 100%);
  opacity: 1;
  visibility: visible;
  transition: opacity .18s ease, visibility .18s ease;
}

body:not(.is-booting) .boot-overlay {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.boot-card {
  width: min(260px, calc(100vw - 48px));
  min-height: 150px;
  display: grid;
  place-items: center;
  gap: 18px;
  border: 1px solid #ecd8a0;
  border-radius: 24px;
  background: rgba(255, 255, 255, .94);
  box-shadow: var(--shadow-sm);
}

.boot-logo {
  width: 150px;
  height: auto;
  object-fit: contain;
}

.boot-spinner {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 3px solid rgba(242, 165, 26, .22);
  border-top-color: var(--brand);
  animation: xmotoBootSpin .82s linear infinite;
}

@keyframes xmotoBootSpin {
  to { transform: rotate(360deg); }
}

/* Fase 8 — central de comprovantes/POD */
.proofs-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.proofs-card { min-width: 0; }
.proofs-heading { margin-bottom: 18px; }

.proof-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 14px;
}

.proof-summary-grid article {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}

.proof-summary-grid span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.proof-summary-grid strong {
  display: block;
  margin-top: 4px;
  font-size: 26px;
  letter-spacing: -.04em;
}

.proofs-toolbar {
  grid-template-columns: 1fr;
}

.proof-list {
  display: grid;
  gap: 12px;
}

.proof-card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) minmax(170px, auto);
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.proof-card:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.proof-card.available {
  border-color: rgba(21, 128, 61, .18);
  background: linear-gradient(180deg, #fff, rgba(236, 253, 243, .55));
}

.proof-card.pending {
  border-color: rgba(37, 99, 235, .14);
  background: linear-gradient(180deg, #fff, rgba(239, 246, 255, .5));
}

.proof-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: var(--slate-soft);
  color: var(--slate);
}

.proof-card.available .proof-icon {
  background: var(--success-soft);
  color: var(--success);
}

.proof-card.pending .proof-icon {
  background: var(--info-soft);
  color: var(--info);
}

.proof-main {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.proof-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.proof-title-row strong {
  display: block;
  font-size: 16px;
  letter-spacing: -.02em;
}

.proof-title-row span:not(.status-chip),
.proof-main small {
  color: var(--muted);
  font-size: 13px;
}

.proof-main p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.45;
}

.proof-actions {
  display: grid;
  gap: 8px;
  justify-items: stretch;
}

.proofs-guide-card {
  position: sticky;
  top: 24px;
}

@media (max-width: 1180px) {
  .proofs-workspace {
    grid-template-columns: 1fr;
  }

  .proofs-guide-card {
    position: static;
  }
}

@media (max-width: 720px) {
  .proof-summary-grid,
  .proof-card {
    grid-template-columns: 1fr;
  }

  .proof-title-row {
    flex-direction: column;
  }
}

/* Fase 9 — Atendimento operacional */
.support-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 18px;
  align-items: start;
}

.support-request-card {
  min-width: 0;
}

.support-form {
  display: grid;
  gap: 16px;
}

.support-actions {
  align-items: center;
}

.support-result {
  display: grid;
  gap: 4px;
  margin-top: 2px;
  padding: 14px 16px;
  border: 1px solid #b7efc7;
  border-radius: 16px;
  background: var(--success-soft);
  color: #166534;
}

.support-result strong,
.support-result span,
.support-result small {
  display: block;
}

.support-result small {
  color: #166534;
  opacity: .86;
}

.support-side-card {
  position: sticky;
  top: 24px;
}

.support-note {
  margin-top: 16px;
}

@media (max-width: 1180px) {
  .support-workspace {
    grid-template-columns: 1fr;
  }

  .support-side-card {
    position: static;
  }
}

/* Hotfix · evita que o balão flutuante cubra o conteúdo do atendimento */
.support-workspace {
  padding-bottom: 112px;
}

#helpPanel.active ~ .quick-support-button {
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
}

/* Fase 9 — Conta e segurança */
.account-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.account-card { min-width: 0; }
.account-heading { margin-bottom: 18px; }

.account-profile-card {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
  margin-bottom: 14px;
}

.account-avatar {
  width: 64px;
  height: 64px;
  font-size: 18px;
}

.account-profile-card h3 {
  margin-bottom: 2px;
  font-size: 20px;
}

.account-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.account-info-grid article {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.account-info-grid span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.account-info-grid strong {
  display: block;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.password-form {
  border-top: 1px solid var(--line);
  padding-top: 18px;
}

.compact-intro {
  padding-bottom: 14px;
  margin-bottom: 14px;
}

.account-guide-card {
  position: sticky;
  top: 24px;
}

@media (max-width: 1180px) {
  .account-workspace {
    grid-template-columns: 1fr;
  }
  .account-guide-card {
    position: static;
  }
}

@media (max-width: 720px) {
  .account-info-grid,
  .account-profile-card {
    grid-template-columns: 1fr;
  }
}

/* Fase 9 — central de atividades/notificações do cliente */
.activity-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.activity-card { min-width: 0; }
.activity-heading { margin-bottom: 18px; }

.activity-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 14px;
}

.activity-summary-grid article {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}

.activity-summary-grid span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.activity-summary-grid strong {
  display: block;
  margin-top: 4px;
  font-size: 26px;
  letter-spacing: -.04em;
}

.activity-toolbar { grid-template-columns: 1fr; }
.activity-list,
.mini-activity-list {
  display: grid;
  gap: 12px;
}

.activity-item {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.activity-item:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.activity-item.compact {
  grid-template-columns: 16px minmax(0, 1fr);
  padding: 13px;
}

.activity-item.compact .activity-meta-row,
.activity-item.compact .activity-actions {
  display: none;
}

.activity-dot {
  width: 12px;
  height: 12px;
  margin-top: 5px;
  border-radius: 999px;
  background: var(--slate);
  box-shadow: 0 0 0 4px var(--slate-soft);
}

.activity-item.success .activity-dot { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.activity-item.warning .activity-dot { background: var(--brand-dark); box-shadow: 0 0 0 4px var(--brand-soft); }
.activity-item.info .activity-dot { background: var(--info); box-shadow: 0 0 0 4px var(--info-soft); }
.activity-item.danger .activity-dot { background: var(--danger); box-shadow: 0 0 0 4px var(--danger-soft); }

.activity-body {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.activity-title-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.activity-title-row strong {
  display: block;
  letter-spacing: -.02em;
}

.activity-title-row small,
.activity-meta-row {
  color: var(--muted);
  font-size: 13px;
}

.activity-body p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.45;
}

.activity-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.activity-meta-row span {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 8px;
  background: #f8fafc;
}

.activity-actions {
  display: grid;
  justify-items: stretch;
}

.activity-guide-card {
  position: sticky;
  top: 24px;
}

.mini-activity-empty {
  padding: 14px;
  border: 1px dashed var(--line-strong);
  border-radius: 16px;
  color: var(--muted);
  background: #fff;
}

@media (max-width: 1180px) {
  .activity-workspace {
    grid-template-columns: 1fr;
  }

  .activity-guide-card {
    position: static;
  }
}

@media (max-width: 720px) {
  .activity-summary-grid,
  .activity-item {
    grid-template-columns: 1fr;
  }

  .activity-dot {
    display: none;
  }

  .activity-title-row {
    flex-direction: column;
  }
}
.quick-action-icon.green { background: var(--success-soft); color: var(--success); }

/* Fase 10 — pedidos em lote assistido */
.quick-action-icon.purple { background: #f3e8ff; color: #7e22ce; }

.batch-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 18px;
  align-items: start;
}

.batch-card,
.batch-guide-card { min-width: 0; }
.batch-heading { align-items: flex-start; }

.batch-import-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: stretch;
}

.batch-input-field textarea {
  min-height: 230px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 13px;
  line-height: 1.55;
}

.batch-format-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  background: linear-gradient(180deg, #fffdf8 0%, #fff 100%);
}

.batch-format-card strong { display: block; margin-bottom: 10px; }
.batch-format-card ol {
  margin: 0;
  padding-left: 20px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.8;
}

.batch-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 18px 0;
}

.batch-summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 13px 14px;
  background: #fff;
  color: var(--ink-soft);
}
.batch-summary.empty {
  border-style: dashed;
  color: var(--muted);
  justify-content: center;
  text-align: center;
}
.batch-summary strong { color: var(--ink); }
.batch-summary span { color: var(--muted); font-size: 14px; }

.batch-preview {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.batch-row {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  padding: 14px;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.batch-row:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}
.batch-row.sent { background: linear-gradient(180deg, #ffffff 0%, #f7fff9 100%); }
.batch-row.error { background: linear-gradient(180deg, #ffffff 0%, #fff7f7 100%); }
.batch-row.sending { background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%); }

.batch-row-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
}
.batch-line-number {
  display: inline-flex;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.batch-row strong { display: block; letter-spacing: -.02em; }
.batch-row p { margin: 4px 0 0; color: var(--ink-soft); }
.batch-row small { display: block; margin-top: 4px; }
.batch-row-error { color: var(--danger) !important; font-weight: 750; }
.batch-row-result { color: var(--success) !important; font-weight: 750; }
.batch-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.batch-guide-card {
  position: sticky;
  top: 24px;
}
.batch-steps { margin-bottom: 18px; }
.batch-note { margin-top: 18px; }

.batch-progress {
  display: grid;
  gap: 10px;
  margin: 16px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.batch-progress-bar {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #eef2f7;
}
.batch-progress-bar span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--brand), #ffb83c);
  transition: width .18s ease;
}
.batch-progress strong {
  color: var(--ink-soft);
  font-size: 13px;
}

@media (max-width: 1180px) {
  .batch-workspace,
  .batch-import-grid {
    grid-template-columns: 1fr;
  }

  .batch-guide-card {
    position: static;
  }
}

@media (max-width: 720px) {
  .batch-summary,
  .batch-row-main {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
}

/* Fase 10: notificações e exportações */
.card-heading-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.notification-button {
  position: relative;
}

.notification-badge {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #dc2626;
  color: #fff;
  border: 2px solid #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}

.notifications-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 18px;
  align-items: start;
}

.notification-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.notification-summary-grid article {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  background: #fff;
}

.notification-summary-grid span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 5px;
}

.notification-summary-grid strong {
  display: block;
  font-size: 24px;
  letter-spacing: -.03em;
}

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

.notification-card {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  background: #fff;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, opacity .16s ease;
}

.notification-card:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.notification-card.read {
  opacity: .78;
}

.notification-card.unread {
  border-color: rgba(242, 165, 26, .55);
  background: linear-gradient(180deg, #fffdf8, #fff);
}

.notification-dot {
  width: 11px;
  height: 11px;
  margin-top: 7px;
  border-radius: 999px;
  background: var(--slate);
  box-shadow: 0 0 0 5px var(--slate-soft);
}

.notification-card.warning .notification-dot { background: var(--brand-dark); box-shadow: 0 0 0 5px var(--brand-soft); }
.notification-card.info .notification-dot { background: var(--info); box-shadow: 0 0 0 5px var(--info-soft); }
.notification-card.success .notification-dot { background: var(--success); box-shadow: 0 0 0 5px var(--success-soft); }
.notification-card.attention .notification-dot,
.notification-card.danger .notification-dot { background: var(--danger); box-shadow: 0 0 0 5px var(--danger-soft); }

.notification-body h3 {
  margin: 4px 0 5px;
  font-size: 16px;
}

.notification-body p {
  margin: 0;
  color: var(--muted);
}

.notification-meta,
.notification-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  color: #98a2b3;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.notification-footer {
  margin-top: 10px;
  color: var(--muted);
  text-transform: none;
  letter-spacing: normal;
}

.notification-footer strong {
  color: var(--ink);
}

.notification-actions {
  display: grid;
  gap: 8px;
  justify-items: end;
  min-width: 130px;
}

.notification-empty span {
  display: block;
  margin-top: 4px;
}

@media (max-width: 1180px) {
  .notifications-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .notification-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .notification-card { grid-template-columns: 1fr; }
  .notification-dot { display: none; }
  .notification-actions { justify-items: stretch; min-width: 0; }
  .card-heading-actions { justify-content: stretch; }
  .card-heading-actions > * { flex: 1; }
}

.reports-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 18px;
  align-items: start;
}

.report-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.report-summary-grid article {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
  padding: 16px;
}

.report-summary-grid span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 5px;
}

.report-summary-grid strong {
  display: block;
  font-size: 24px;
  letter-spacing: -.03em;
}

.report-filter-grid {
  display: grid;
  grid-template-columns: 160px 160px 180px 120px minmax(260px, 1fr);
  gap: 14px;
  align-items: end;
  margin-bottom: 14px;
}

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

.report-list {
  display: grid;
  gap: 12px;
}

.report-row {
  display: grid;
  grid-template-columns: minmax(170px, .9fr) minmax(0, 1.4fr) minmax(150px, .72fr) auto;
  gap: 14px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.report-row:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.report-main strong {
  display: block;
  font-size: 16px;
  letter-spacing: -.02em;
  margin-bottom: 3px;
}

.report-main span,
.report-route span,
.report-route small {
  display: block;
  color: var(--muted);
  line-height: 1.4;
}

.report-route {
  display: grid;
  gap: 3px;
}

.report-route small {
  color: #98a2b3;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.report-status-stack {
  display: grid;
  justify-items: start;
  gap: 8px;
}

.proof-mini-chip {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 9px;
  background: var(--slate-soft);
  color: var(--slate);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.proof-mini-chip.ready {
  background: var(--success-soft);
  color: var(--success);
}

.report-actions {
  display: grid;
  gap: 8px;
  min-width: 120px;
}

.report-empty span {
  display: block;
  margin-top: 4px;
}

@media (max-width: 1180px) {
  .reports-workspace { grid-template-columns: 1fr; }
  .report-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-search-field { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .report-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-filter-grid { grid-template-columns: 1fr; }
  .report-search-field { grid-column: auto; }
  .report-row { grid-template-columns: 1fr; align-items: start; }
  .report-actions { min-width: 0; }
}

/* Fase 10 — modelos de entrega recorrentes */
.templates-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .78fr);
  gap: 18px;
  align-items: start;
}

.templates-list {
  display: grid;
  gap: 12px;
}

.template-card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.template-card:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.template-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  color: var(--brand-dark);
  background: var(--brand-soft);
}

.template-main {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.template-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.template-title-row strong,
.template-title-row span {
  display: block;
}

.template-title-row div span,
.template-main small,
.template-main p {
  color: var(--muted);
}

.template-main p {
  margin-bottom: 0;
  word-break: break-word;
}

.template-main small {
  line-height: 1.45;
}

.template-actions {
  display: grid;
  gap: 8px;
  justify-items: stretch;
  min-width: 150px;
}

.template-empty {
  display: grid;
  gap: 10px;
  justify-items: center;
}

.danger-link {
  color: var(--danger) !important;
}

@media (max-width: 1180px) {
  .templates-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .template-card { grid-template-columns: 1fr; }
  .template-actions { min-width: 0; }
}

/* Fase 12 — busca global e status do portal */
.global-search-trigger {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  padding: 10px 12px;
  color: var(--ink-soft);
  background: #fff;
  font-weight: 800;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .04);
}
.global-search-trigger:hover { background: #f9fafb; color: var(--ink); }
.global-search-trigger kbd,
.command-hint-row kbd {
  border: 1px solid var(--line-strong);
  border-bottom-width: 2px;
  border-radius: 8px;
  padding: 3px 7px;
  color: var(--muted);
  background: #f8fafc;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .02em;
}
.command-open { overflow: hidden; }
.command-palette {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: start center;
  padding: 8vh 20px 20px;
}
.command-palette-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, .38);
  backdrop-filter: blur(8px);
}
.command-palette-card {
  position: relative;
  width: min(760px, 100%);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 28px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 34px 90px rgba(15, 23, 42, .28);
}
.command-search-row {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 44px;
  gap: 14px;
  align-items: center;
  padding: 18px;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--brand-faint), #fff);
}
.command-search-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  color: var(--brand-dark);
  background: var(--brand-soft);
}
.command-search-row h2 {
  margin-bottom: 8px;
  font-size: 18px;
}
.command-search-row input {
  border: 0;
  padding: 0;
  border-radius: 0;
  font-size: 20px;
  font-weight: 750;
  background: transparent;
  box-shadow: none !important;
}
.command-close { font-size: 24px; }
.command-hint-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 18px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
}
.command-results {
  max-height: min(58vh, 560px);
  overflow-y: auto;
  padding: 10px;
  display: grid;
  gap: 6px;
}
.command-result {
  width: 100%;
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  border: 1px solid transparent;
  border-radius: 18px;
  padding: 12px;
  color: var(--ink);
  background: transparent;
  text-align: left;
}
.command-result:hover,
.command-result:focus-visible {
  border-color: var(--line);
  background: #f9fafb;
  outline: none;
}
.command-result-icon {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 16px;
}
.command-result-icon.action,
.command-result-icon.template { background: var(--brand-soft); color: var(--brand-dark); }
.command-result-icon.order,
.command-result-icon.proof { background: var(--info-soft); color: var(--info); }
.command-result-icon.destination { background: var(--success-soft); color: var(--success); }
.command-result-icon.notification { background: #fff1f2; color: #e11d48; }
.command-result-icon.report { background: var(--slate-soft); color: var(--slate); }
.command-result-main { min-width: 0; }
.command-result-main strong,
.command-result-main small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.command-result-main small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}
.command-result-label {
  align-self: center;
  border-radius: 999px;
  padding: 6px 9px;
  color: var(--muted);
  background: #f8fafc;
  font-size: 12px;
  font-weight: 800;
}
.command-empty { margin: 4px; }
.status-workspace { align-items: start; }
.status-actions-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
.status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.status-grid article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
  background: #fff;
}
.status-grid span {
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.status-grid strong {
  display: block;
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.45;
}
.diagnostics-panel { margin-top: 20px; }
.diagnostics-heading { margin-bottom: 12px; }
.diagnostics-heading h3 { margin-bottom: 4px; }
.diagnostics-list { display: grid; gap: 10px; }
.diagnostic-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 13px;
  background: #fff;
}
.diagnostic-result.ok { border-color: #b7efc7; background: #fbfffc; }
.diagnostic-result.fail { border-color: #fecdd3; background: #fffafb; }
.diagnostic-result strong,
.diagnostic-result span,
.diagnostic-result small { display: block; }
.diagnostic-result span { color: var(--muted); font-size: 13px; margin-top: 3px; }
.diagnostic-result small { color: var(--muted); margin-top: 5px; max-width: 260px; text-align: right; }
.status-tool-list { display: grid; gap: 10px; margin: 16px 0; }
@media (max-width: 720px) {
  .global-search-trigger { width: 100%; justify-content: center; }
  .global-search-trigger kbd { display: none; }
  .command-palette { padding-top: 14px; place-items: start center; }
  .command-search-row { grid-template-columns: 38px minmax(0, 1fr) 40px; padding: 14px; }
  .command-search-icon { width: 38px; height: 38px; }
  .command-search-row input { font-size: 16px; }
  .command-result { grid-template-columns: 40px minmax(0, 1fr); }
  .command-result-label { display: none; }
  .status-grid { grid-template-columns: 1fr; }
  .diagnostic-result { grid-template-columns: 1fr; }
  .diagnostic-result small { text-align: left; max-width: none; }
}
.batch-file-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.batch-draft-status {
  display: inline-flex;
  align-self: flex-start;
  margin-top: 4px;
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--muted);
  background: #f8fafc;
  font-size: 12px;
  font-weight: 800;
}
.batch-draft-status.saved { color: var(--success); background: var(--success-soft); }
.batch-draft-status.dirty { color: var(--brand-dark); background: var(--brand-soft); }

/* Fase 15 — Atendimento com solicitações/tickets */
.support-requests-panel {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.support-requests-heading {
  margin-bottom: 12px;
}

.support-ticket-list {
  display: grid;
  gap: 12px;
}

.support-ticket-card {
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 15px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.support-ticket-card:hover {
  transform: translateY(-1px);
  border-color: #d7dde6;
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.support-ticket-head,
.support-ticket-meta,
.support-ticket-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.support-ticket-head strong {
  display: block;
  font-size: 16px;
}

.support-ticket-head span,
.support-ticket-meta span,
.support-ticket-message,
.support-ticket-response p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.support-ticket-message {
  margin: 0;
}

.support-ticket-response {
  display: grid;
  gap: 4px;
  border: 1px solid #b7efc7;
  border-radius: 14px;
  padding: 12px;
  background: var(--success-soft);
  color: #166534;
}

.support-ticket-response strong,
.support-ticket-response p {
  margin: 0;
  color: #166534;
}

.support-chat-thread {
  display: grid;
  gap: 9px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f8fafc;
}

.support-chat-more {
  justify-self: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.support-chat-message {
  display: grid;
  gap: 4px;
  justify-items: start;
}

.support-chat-message.operator {
  justify-items: end;
}

.support-chat-message.system {
  justify-items: center;
}

.support-chat-bubble {
  max-width: min(680px, 88%);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 10px 12px;
  background: #fff;
  color: var(--text);
  font-size: 14px;
  line-height: 1.45;
  white-space: pre-wrap;
}

.support-chat-message.operator .support-chat-bubble {
  border-color: transparent;
  background: var(--brand);
  color: #fff;
}

.support-chat-message.system .support-chat-bubble {
  background: var(--slate-soft);
  color: var(--slate);
}

.support-chat-message small {
  color: var(--muted);
  font-size: 11px;
}

.support-reply-box {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 16px;
  background: #fff;
}

.support-reply-box label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.support-reply-box textarea {
  width: 100%;
  min-height: 74px;
  resize: vertical;
}

.support-reply-actions {
  display: flex;
  justify-content: flex-end;
}

.support-status-chip.open { background: var(--brand-soft); color: var(--brand-dark); }
.support-status-chip.in_progress { background: var(--info-soft); color: var(--info); }
.support-status-chip.resolved { background: var(--success-soft); color: var(--success); }
.support-status-chip.closed { background: var(--slate-soft); color: var(--slate); }
.support-priority-chip.critical { background: var(--danger-soft); color: var(--danger); }
.support-priority-chip.high { background: var(--brand-soft); color: var(--brand-dark); }
.support-sla-chip { background: var(--info-soft); color: var(--info); }
.support-sla-chip.overdue { background: var(--danger-soft); color: var(--danger); }
.support-sla-chip.due_soon { background: var(--brand-soft); color: var(--brand-dark); }
.support-sla-chip.monitoring,
.support-sla-chip.closed { background: var(--slate-soft); color: var(--slate); }
.support-ticket-card.is-overdue { border-color: rgba(239, 68, 68, .34); box-shadow: 0 16px 34px rgba(239, 68, 68, .10); }
.support-ticket-card.is-customer-reply { border-color: rgba(245, 158, 11, .38); }
.support-ticket-card.is-operator-reply { border-color: rgba(34, 197, 94, .32); box-shadow: 0 14px 30px rgba(34, 197, 94, .08); }
.support-ticket-card.has-operation-reply {
  border-color: rgba(34, 197, 94, .38);
  box-shadow: 0 18px 42px rgba(34, 197, 94, .10);
}
.support-new-response-chip {
  background: var(--success-soft);
  color: var(--success);
}
.support-sla-note { color: var(--muted); font-size: 12px; font-weight: 700; }
.support-sla-note.danger { color: var(--danger); }
.support-sla-note.success { color: var(--success); }

@media (max-width: 720px) {
  .support-ticket-head,
  .support-ticket-meta,
  .support-ticket-actions {
    display: grid;
    justify-content: stretch;
  }
}

/* Fase 17 — acompanhamento operacional */
.tracking-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 390px;
  gap: 18px;
  align-items: start;
}

.tracking-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.tracking-summary-grid article {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px;
  background: #fff;
}

.tracking-summary-grid span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.tracking-summary-grid strong {
  display: block;
  font-size: 24px;
  letter-spacing: -.03em;
}

.tracking-list {
  display: grid;
  gap: 12px;
}

.tracking-item {
  display: grid;
  gap: 11px;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  background: #fff;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.tracking-item:hover,
.tracking-item.selected {
  transform: translateY(-1px);
  border-color: rgba(242, 165, 26, .55);
  box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
}

.tracking-item-main,
.tracking-item-footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.tracking-item-main strong,
.tracking-item-footer strong {
  display: block;
  margin-bottom: 3px;
}

.tracking-item-main span:not(.status-chip),
.tracking-item-footer span,
.tracking-item p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.45;
}

.tracking-item-progress {
  overflow: hidden;
  height: 8px;
  border-radius: 999px;
  background: #eef1f5;
}

.tracking-item-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--brand), #3b82f6);
}

.tracking-detail-card {
  position: sticky;
  top: 24px;
}

.tracking-detail-empty {
  display: grid;
  gap: 8px;
  min-height: 220px;
  align-content: center;
  color: var(--muted);
}

.tracking-detail .tracking-progress.large {
  margin: 16px 0;
}

.tracking-empty strong {
  display: block;
  margin-bottom: 4px;
  color: var(--ink);
}

@media (max-width: 1180px) {
  .tracking-workspace { grid-template-columns: 1fr; }
  .tracking-detail-card { position: static; }
}

@media (max-width: 720px) {
  .tracking-summary-grid { grid-template-columns: 1fr; }
  .tracking-item-main,
  .tracking-item-footer { flex-direction: column; }
}

/* Fase 18 — relatórios gerenciais */
.report-range-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: -4px 0 18px;
}

.report-insights-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.report-kpi-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  padding: 16px;
  box-shadow: var(--shadow-sm);
}

.report-kpi-card span,
.report-kpi-card small {
  display: block;
  color: var(--muted);
}

.report-kpi-card span {
  font-size: 13px;
  margin-bottom: 5px;
}

.report-kpi-card strong {
  display: block;
  font-size: 30px;
  letter-spacing: -.04em;
  margin-bottom: 4px;
}

.report-kpi-card.success strong { color: var(--success); }
.report-kpi-card.amber strong { color: var(--brand-dark); }
.report-kpi-card.danger strong { color: var(--danger); }

.report-analytics-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
  gap: 14px;
  margin-bottom: 14px;
}

.report-visual-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
  padding: 16px;
}

.top-destinations-card { margin-bottom: 16px; }

.mini-bar-chart {
  min-height: 180px;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  overflow-x: auto;
  padding: 8px 2px 0;
}

.mini-bar-item {
  min-width: 44px;
  height: 164px;
  display: grid;
  grid-template-rows: 22px 1fr 18px 18px;
  align-items: end;
  gap: 4px;
  color: var(--muted);
  font-size: 11px;
  text-align: center;
}

.mini-bar-item span {
  color: var(--ink);
  font-weight: 800;
}

.mini-bar-item i {
  width: 100%;
  min-height: 8px;
  display: block;
  border-radius: 10px 10px 4px 4px;
  background: linear-gradient(180deg, var(--brand), #ffd283);
  box-shadow: 0 8px 18px rgba(242, 165, 26, .16);
}

.mini-bar-item small,
.mini-bar-item em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-style: normal;
}

.breakdown-list {
  display: grid;
  gap: 10px;
}

.compact-breakdown {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.breakdown-item {
  display: grid;
  gap: 7px;
}

.breakdown-item > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.breakdown-item strong {
  font-size: 14px;
}

.breakdown-item span {
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}

.breakdown-item b {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #eef2f7;
}

.breakdown-item b i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--brand), #ffd283);
}

.top-destination-list {
  display: grid;
  gap: 10px;
}

.top-destination-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  background: #fff;
}

.top-destination-row > span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-weight: 850;
}

.top-destination-row strong,
.top-destination-row small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.top-destination-row small,
.top-destination-row em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.top-destination-row b {
  font-size: 20px;
}

.empty-mini-chart,
.breakdown-empty {
  border: 1px dashed var(--line-strong);
  border-radius: 16px;
  color: var(--muted);
  padding: 18px;
  text-align: center;
  background: #fff;
}

@media (max-width: 1180px) {
  .report-analytics-grid { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .report-insights-grid { grid-template-columns: 1fr; }
  .top-destination-row { grid-template-columns: 34px minmax(0, 1fr); }
  .top-destination-row b,
  .top-destination-row em { grid-column: 2; }
}

/* Fase 18 — indicadores gerenciais do cliente */
.analytics-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 18px;
  align-items: start;
}

.analytics-filter-grid {
  grid-template-columns: 160px 160px 180px;
  margin-bottom: 18px;
}

.analytics-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.analytics-kpi-grid article {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
  padding: 16px;
}

.analytics-kpi-grid span,
.analytics-kpi-grid small {
  display: block;
  color: var(--muted);
  font-size: 13px;
}

.analytics-kpi-grid strong {
  display: block;
  margin: 4px 0 2px;
  font-size: 28px;
  letter-spacing: -.04em;
}

.analytics-section-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.analytics-block {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  padding: 18px;
  min-width: 0;
}

.analytics-series-list,
.analytics-status-list,
.analytics-destinations-list,
.analytics-insights-list {
  display: grid;
  gap: 10px;
}

.analytics-series-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 130px;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.analytics-series-row:last-child { border-bottom: 0; }
.analytics-series-row strong,
.analytics-series-row span { display: block; }
.analytics-series-row span { color: var(--muted); font-size: 13px; margin-top: 2px; }
.analytics-series-row b {
  height: 9px;
  border-radius: 999px;
  background: var(--slate-soft);
  overflow: hidden;
}
.analytics-series-row i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--brand), #ffcf70);
}

.analytics-insight {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
  background: #fff;
}
.analytics-insight p { margin: 4px 0 0; color: var(--muted); }
.analytics-insight.success { border-color: rgba(21, 128, 61, .22); background: var(--success-soft); }
.analytics-insight.info { border-color: rgba(37, 99, 235, .20); background: var(--info-soft); }
.analytics-insight.warning { border-color: rgba(242, 165, 26, .30); background: var(--brand-faint); }
.analytics-insight.danger { border-color: rgba(220, 38, 38, .24); background: var(--danger-soft); }

@media (max-width: 1180px) {
  .analytics-workspace,
  .analytics-section-grid { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
  .analytics-kpi-grid,
  .analytics-filter-grid { grid-template-columns: 1fr; }
  .analytics-series-row { grid-template-columns: 1fr; }
}

/* Fase 19 — segurança e auditoria do acesso */
.security-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: 18px;
  align-items: start;
}

.security-session-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.security-session-grid article {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
  padding: 15px;
  min-width: 0;
}

.security-session-grid span,
.security-session-grid strong {
  display: block;
  overflow-wrap: anywhere;
}

.security-session-grid span {
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 4px;
}

.security-session-grid strong {
  font-size: 15px;
}

.security-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 18px;
}

.danger-ghost {
  border-color: rgba(220, 38, 38, .28);
  color: var(--danger);
}

.danger-ghost:hover {
  background: var(--danger-soft);
}

.security-events-list,
.security-sessions-list {
  display: grid;
  gap: 12px;
}

.security-session-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  min-width: 0;
}

.security-session-item.current {
  border-color: rgba(16, 185, 129, .35);
  background: linear-gradient(180deg, #fff, rgba(16, 185, 129, .06));
}

.security-session-item strong,
.security-session-item p,
.security-session-item small,
.security-session-item span {
  display: block;
  overflow-wrap: anywhere;
}

.security-session-item p {
  margin: 3px 0;
  color: var(--muted);
}

.security-session-item small,
.security-session-item span {
  color: #98a2b3;
  font-size: 12px;
}

.security-event {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.security-event-dot {
  width: 12px;
  height: 12px;
  margin-top: 5px;
  border-radius: 999px;
  background: var(--slate);
  box-shadow: 0 0 0 4px var(--slate-soft);
}

.security-event-dot.done {
  background: var(--success);
  box-shadow: 0 0 0 4px var(--success-soft);
}

.security-event-dot.current {
  background: var(--brand);
  box-shadow: 0 0 0 4px var(--brand-soft);
}

.security-event strong,
.security-event p,
.security-event small {
  display: block;
}

.security-event p {
  margin: 3px 0;
  color: var(--muted);
}

.security-event small {
  color: #98a2b3;
}

@media (max-width: 1180px) {
  .security-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 780px) {
  .security-session-grid { grid-template-columns: 1fr; }
  .security-actions { display: grid; }
  .security-session-item { grid-template-columns: 1fr; }
}

/* Fase 20 — instalação/PWA e polimento mobile */
.install-chip {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(242, 165, 26, .5);
  border-radius: 14px;
  padding: 10px 13px;
  background: linear-gradient(180deg, #fffdf8, var(--brand-soft));
  color: #8a5600;
  font-weight: 850;
  box-shadow: 0 8px 18px rgba(242, 165, 26, .12);
}
.install-chip:hover { filter: saturate(1.04); transform: translateY(-1px); }

.install-chip.install-chip-muted {
  background: #fff;
  color: var(--ink-soft);
  box-shadow: none;
  border-color: var(--line-strong);
}
.install-chip.install-chip-muted:hover {
  background: #f9fafb;
  transform: none;
}

.pwa-settings-card {
  background:
    radial-gradient(circle at 100% 0%, rgba(242, 165, 26, .12), transparent 16rem),
    #fff;
}
.pwa-settings-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.pwa-settings-head p { margin-bottom: 0; }
.pwa-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}
.pwa-status-grid div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px;
  background: rgba(255,255,255,.82);
}
.pwa-status-grid span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.pwa-status-grid strong {
  display: block;
  overflow-wrap: anywhere;
  font-size: 13px;
  line-height: 1.45;
}
.pwa-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 10px;
}
.pwa-actions > * { flex: 1 1 160px; }
@media (max-width: 920px) {
  .pwa-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .install-chip { width: 100%; justify-content: center; }
  .pwa-settings-head { flex-direction: column; }
  .pwa-status-grid { grid-template-columns: 1fr; }
}

/* Fase 21 — homologação guiada / QA */
.qa-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 18px;
  align-items: start;
}
.qa-actions-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
.qa-progress-card {
  display: grid;
  gap: 12px;
  padding: 16px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(135deg, var(--brand-faint), #fff);
}
.qa-progress-card strong { display: block; font-size: 16px; }
.qa-progress-card span { color: var(--muted); font-size: 14px; }
.qa-progress-track {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #eef2f6;
}
.qa-progress-track span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--brand), #16a34a);
  transition: width .18s ease;
}

.qa-readiness-card {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 18px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,250,252,.94));
  box-shadow: 0 18px 44px rgba(15, 23, 42, .06);
}
.qa-readiness-heading {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}
.qa-readiness-heading h3 { margin: 0 0 6px; }
.qa-readiness-heading p { margin: 0; color: var(--muted); }
.qa-readiness-summary {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.qa-readiness-summary strong { font-size: 16px; }
.qa-readiness-summary span,
.qa-readiness-summary small { color: var(--muted); }
.qa-readiness-list {
  display: grid;
  gap: 10px;
}
.qa-scenario-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(118px, auto);
  gap: 12px;
  align-items: stretch;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}
.qa-scenario-card.ok { border-color: rgba(22, 163, 74, .22); background: rgba(240, 253, 244, .55); }
.qa-scenario-card.missing { border-color: rgba(239, 68, 68, .22); background: rgba(254, 242, 242, .55); }
.qa-scenario-card.optional { border-color: rgba(148, 163, 184, .28); }
.qa-scenario-main { min-width: 0; }
.qa-scenario-main h3 {
  margin: 4px 0 4px;
  font-size: 15px;
  overflow-wrap: anywhere;
}
.qa-scenario-main p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}
.qa-scenario-main small {
  display: block;
  margin-top: 7px;
  color: #475569;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-scenario-status {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .06);
  color: #334155;
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.qa-scenario-card.ok .qa-scenario-status { background: rgba(22, 163, 74, .13); color: #166534; }
.qa-scenario-card.missing .qa-scenario-status { background: rgba(239, 68, 68, .13); color: #991b1b; }
.qa-scenario-side {
  display: grid;
  align-content: center;
  justify-items: end;
  gap: 5px;
  text-align: right;
  min-width: 0;
}
.qa-scenario-side strong { font-size: 22px; line-height: 1; }
.qa-scenario-side span { color: var(--muted); font-size: 12px; }
.qa-scenario-side .link-button { font-size: 12px; }
.qa-readiness-footer {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 14px;
  padding-top: 2px;
}
.qa-readiness-footer h4 {
  margin: 0 0 8px;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #475569;
}
.qa-recommendations-list {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.qa-samples-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}
.qa-sample-pill {
  display: inline-grid;
  gap: 2px;
  max-width: 180px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}
.qa-sample-pill strong,
.qa-sample-pill span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.qa-sample-pill strong { font-size: 12px; }
.qa-sample-pill span { color: var(--muted); font-size: 11px; }

.pilot-readiness-card {
  display: grid;
  gap: 14px;
  margin: 0 0 18px;
  padding: 18px;
  border: 1px solid rgba(245, 158, 11, .22);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(255, 251, 235, .92), rgba(255, 255, 255, .98));
  box-shadow: 0 18px 44px rgba(146, 64, 14, .06);
}
.pilot-check-list {
  display: grid;
  gap: 10px;
}
.pilot-check-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(104px, auto);
  gap: 12px;
  align-items: stretch;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}
.pilot-check-card.ok { border-color: rgba(22, 163, 74, .24); background: rgba(240, 253, 244, .64); }
.pilot-check-card.warning { border-color: rgba(245, 158, 11, .28); background: rgba(255, 251, 235, .76); }
.pilot-check-card.blocker { border-color: rgba(239, 68, 68, .28); background: rgba(254, 242, 242, .74); }
.pilot-check-card.manual { border-color: rgba(37, 99, 235, .24); background: rgba(239, 246, 255, .72); }
.pilot-check-card.info { border-color: rgba(148, 163, 184, .28); }
.pilot-check-main { min-width: 0; }
.pilot-check-main h3 {
  margin: 4px 0 4px;
  font-size: 15px;
  overflow-wrap: anywhere;
}
.pilot-check-main p {
  margin: 0;
  color: var(--text);
  font-size: 13px;
  line-height: 1.4;
}
.pilot-check-main small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  line-height: 1.4;
}
.pilot-check-status {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .06);
  color: #334155;
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.pilot-check-card.ok .pilot-check-status { background: rgba(22, 163, 74, .13); color: #166534; }
.pilot-check-card.warning .pilot-check-status { background: rgba(245, 158, 11, .15); color: #92400e; }
.pilot-check-card.blocker .pilot-check-status { background: rgba(239, 68, 68, .14); color: #991b1b; }
.pilot-check-card.manual .pilot-check-status { background: rgba(37, 99, 235, .13); color: #1d4ed8; }
.pilot-check-side {
  display: grid;
  align-content: center;
  justify-items: end;
  gap: 5px;
  text-align: right;
  min-width: 0;
}
.pilot-check-side strong { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: #475569; }
.pilot-check-side span { color: var(--muted); font-size: 12px; }
.pilot-readiness-footer { align-items: start; }
.pilot-monitoring-box {
  display: grid;
  gap: 12px;
}
.pilot-monitor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 8px;
}
.pilot-monitor-grid article {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #fff;
}
.pilot-monitor-grid span { color: var(--muted); font-size: 11px; }
.pilot-monitor-grid strong { font-size: 18px; }
.pilot-rollout-box,
.pilot-command-box {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}
.pilot-rollout-box h4,
.pilot-command-box h4 { margin: 0; font-size: 13px; color: #475569; }
.pilot-rollout-box ol { margin: 0; padding-left: 18px; color: var(--muted); font-size: 12px; line-height: 1.42; }
.pilot-command-box { grid-template-columns: 1fr; }


.qa-readiness-loading,
.qa-readiness-empty {
  padding: 14px;
  border: 1px dashed var(--line);
  border-radius: 16px;
  color: var(--muted);
  background: #fff;
}
.small-muted { font-size: 12px; }

.qa-checklist { display: grid; gap: 16px; }
.qa-section {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  overflow: hidden;
}
.qa-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  background: #fbfcfe;
}
.qa-section-heading h3 { margin: 0; font-size: 16px; }
.qa-section-heading span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.qa-items { display: grid; }
.qa-item {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  cursor: pointer;
  transition: background .16s ease;
}
.qa-item:last-child { border-bottom: 0; }
.qa-item:hover { background: #fafafa; }
.qa-item.checked { background: #f3fbf6; }
.qa-item input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--brand-dark); }
.qa-item strong { display: block; font-size: 14px; }
.qa-item small { display: block; margin-top: 3px; color: var(--muted); }
.qa-item em {
  align-self: center;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-size: 11px;
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.qa-side-card .destination-guide-note { margin-top: 18px; }
.compact-steps { gap: 10px; }

@media (max-width: 1180px) {
  .qa-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
  .qa-readiness-heading,
  .qa-readiness-footer { grid-template-columns: 1fr; flex-direction: column; }
  .qa-scenario-card,
  .pilot-check-card { grid-template-columns: 1fr; }
  .qa-scenario-side,
  .pilot-check-side { justify-items: start; text-align: left; }
}

@media (max-width: 720px) {
  .qa-actions-inline { justify-content: stretch; }
  .qa-actions-inline > * { flex: 1; }
  .qa-item { grid-template-columns: 22px minmax(0, 1fr); }
  .qa-item em { grid-column: 2; justify-self: start; }
}

.notification-empty.empty-feature-state,
.proof-empty.empty-feature-state,
.activity-empty.empty-feature-state {
  min-height: 320px;
}

/* Fase 25 — estados vazios mais intencionais e consistentes */
.rich-empty {
  min-height: 300px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 16px;
  padding: 38px 28px;
  border-style: solid;
  border-color: rgba(213, 219, 227, .9);
  background:
    radial-gradient(circle at 50% 0%, rgba(242, 165, 26, .12), transparent 18rem),
    linear-gradient(180deg, #ffffff 0%, #fffdf8 100%);
  color: var(--muted);
  text-align: center;
}

.rich-empty-wide,
.notification-empty.rich-empty,
.tracking-empty.rich-empty,
.proof-empty.rich-empty,
.report-empty.rich-empty,
.activity-empty.rich-empty,
.destination-empty.rich-empty,
.template-empty.rich-empty {
  min-height: 340px;
}

.rich-empty.compact {
  min-height: 180px;
  padding: 26px 20px;
}

.rich-empty-icon {
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  box-shadow: inset 0 0 0 1px rgba(242, 165, 26, .18);
}

.rich-empty-icon svg {
  width: 30px;
  height: 30px;
}

.rich-empty-copy {
  max-width: 620px;
  display: grid;
  gap: 6px;
}

.rich-empty-copy strong {
  color: var(--ink);
  font-size: 18px;
  letter-spacing: -.02em;
}

.rich-empty-copy span {
  display: block;
  color: var(--muted);
  line-height: 1.55;
}

.rich-empty-eyebrow {
  margin: 0;
  color: var(--brand-dark);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.rich-empty-list,
.rich-empty-hints {
  width: min(620px, 100%);
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.rich-empty-list li,
.rich-empty-hints li {
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, .86);
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 700;
}

.rich-empty-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.rich-empty > small {
  color: var(--muted);
  font-size: 12px;
}

@media (max-width: 720px) {
  .rich-empty {
    min-height: 260px;
    padding: 28px 18px;
  }

  .rich-empty-wide,
  .notification-empty.rich-empty,
  .tracking-empty.rich-empty,
  .proof-empty.rich-empty,
  .report-empty.rich-empty,
  .activity-empty.rich-empty,
  .destination-empty.rich-empty,
  .template-empty.rich-empty {
    min-height: 280px;
  }

  .rich-empty-list,
  .rich-empty-hints {
    grid-template-columns: 1fr;
  }

  .rich-empty-actions > * {
    flex: 1 1 100%;
  }
}

/* Fase 25 — estados vazios intencionais e menos sensação de tela quebrada */
.rich-empty,
.rich-empty-state {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 14px;
  min-height: clamp(260px, 34vh, 420px);
  padding: 34px 26px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 0%, rgba(242, 165, 26, .10), transparent 15rem),
    linear-gradient(180deg, #fff 0%, #fffdf8 100%);
  border-color: rgba(208, 213, 221, .95);
}

.rich-empty.compact,
.rich-empty-state.compact,
.command-empty.rich-empty,
.command-empty.rich-empty-state,
.diagnostics-empty.rich-empty-state,
.security-empty.rich-empty-state {
  min-height: 160px;
  padding: 24px 18px;
}

.notification-empty.rich-empty,
.notification-empty.rich-empty-state,
.proof-empty.rich-empty,
.activity-empty.rich-empty,
.report-empty.rich-empty,
.tracking-empty.rich-empty {
  min-height: clamp(340px, 44vh, 520px);
}

.rich-empty-icon {
  width: 64px;
  height: 64px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  background: linear-gradient(180deg, #fff7e6, #fff1cf);
  color: var(--brand-dark);
  box-shadow: 0 12px 26px rgba(242, 165, 26, .16);
}

.rich-empty-icon svg {
  width: 30px;
  height: 30px;
}

.rich-empty-copy,
.rich-empty-body {
  display: grid;
  gap: 7px;
  max-width: 620px;
}

.rich-empty-copy strong,
.rich-empty-body strong {
  color: var(--ink);
  font-size: clamp(18px, 2vw, 22px);
  letter-spacing: -.03em;
}

.rich-empty-copy span,
.rich-empty-body span,
.rich-empty small,
.rich-empty-state small {
  color: var(--muted);
  line-height: 1.55;
}

.rich-empty-eyebrow {
  margin: 0;
  color: var(--brand-dark);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.rich-empty-list,
.rich-empty-hints {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  max-width: 720px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
}

.rich-empty-list li,
.rich-empty-hints li {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(255,255,255,.85);
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 750;
}

.rich-empty-list li::before,
.rich-empty-hints li::before {
  content: "";
  width: 6px;
  height: 6px;
  margin-right: 7px;
  border-radius: 999px;
  background: var(--brand);
}

.rich-empty-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 4px;
}

.rich-empty-actions .primary,
.rich-empty-actions .ghost {
  min-width: 132px;
}

.notification-list:has(.rich-empty),
.proof-list:has(.rich-empty),
.activity-list:has(.rich-empty),
.report-list:has(.rich-empty),
.destinations-list:has(.rich-empty),
.template-list:has(.rich-empty),
.order-list:has(.rich-empty) {
  display: block;
}

@media (max-width: 720px) {
  .rich-empty,
  .rich-empty-state {
    min-height: 260px;
    padding: 26px 16px;
  }

  .rich-empty-list,
  .rich-empty-hints,
  .rich-empty-actions {
    display: grid;
    width: 100%;
  }

  .rich-empty-list li,
  .rich-empty-hints li,
  .rich-empty-actions .primary,
  .rich-empty-actions .ghost {
    justify-content: center;
    width: 100%;
  }
}

/* Fase 26 — smoke test / homologação */
.qa-smoke-card {
  display: grid;
  gap: 14px;
  margin: 18px 0;
  padding: 18px;
  border: 1px solid rgba(242, 165, 26, .32);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255, 247, 232, .85), rgba(255, 255, 255, .96));
}
.qa-smoke-card h3 {
  margin-bottom: 6px;
}
.qa-smoke-card p:last-child {
  margin-bottom: 0;
  color: var(--muted);
}
.qa-smoke-card pre {
  overflow-x: auto;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0f172a;
  color: #f8fafc;
  font-size: 12px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
}
.qa-smoke-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}


.qa-deploy-card {
  display: grid;
  gap: 14px;
  margin: 16px 0 18px;
  padding: 18px;
  border: 1px solid rgba(37, 99, 235, .18);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(239, 246, 255, .88), rgba(255, 255, 255, .96));
}
.qa-deploy-card h3 { margin-bottom: 6px; }
.qa-deploy-card p { color: var(--muted); margin-bottom: 0; }
.qa-deploy-card pre {
  overflow-x: auto;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #0f172a;
  color: #f8fafc;
  font-size: 12px;
  line-height: 1.45;
}

/* Fase cliente — painel inicial operacional tipo acompanhamento logístico */
.home-order-board {
  display: grid;
  gap: 10px;
}
.home-board-head,
.home-order-row {
  display: grid;
  grid-template-columns: minmax(115px, .8fr) minmax(150px, 1.2fr) minmax(180px, 1.45fr) minmax(118px, .85fr) minmax(120px, .9fr) minmax(120px, .9fr) 74px;
  gap: 12px;
  align-items: center;
}
.home-board-head {
  padding: 0 12px 4px;
  color: #98a2b3;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.home-order-row {
  min-width: 0;
  padding: 13px 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.home-order-row:hover,
.home-order-row.selected {
  border-color: rgba(242, 165, 26, .68);
  box-shadow: 0 14px 30px rgba(15, 23, 42, .06);
  transform: translateY(-1px);
}
.home-order-id strong,
.home-order-eta strong,
.home-order-address span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-order-id span,
.home-order-eta span,
.home-order-address small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}
.home-order-address small {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #98a2b3;
}
.home-order-pod {
  display: flex;
  justify-content: center;
}
.pod-thumb-button,
.home-proof-tile {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(21, 128, 61, .26);
  border-radius: 14px;
  background: #fff;
  color: var(--success);
  padding: 0;
}
.pod-thumb-button {
  width: 58px;
  height: 48px;
}
.pod-thumb-button img,
.home-proof-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: linear-gradient(135deg, #ffffff, var(--success-soft));
}
.pod-thumb-button span {
  position: absolute;
  left: 5px;
  bottom: 5px;
  border-radius: 999px;
  padding: 2px 6px;
  background: rgba(255,255,255,.92);
  color: var(--success);
  font-size: 10px;
  font-weight: 900;
}
.proof-mini-chip.pending {
  background: var(--brand-soft);
  color: var(--brand-dark);
}
.driver-mini {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}
.driver-mini strong,
.driver-mini span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.driver-mini span,
.driver-unassigned {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}
.driver-avatar {
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--brand-soft), #fff);
  color: var(--brand-dark);
  font-weight: 950;
  border: 1px solid rgba(242, 165, 26, .35);
  flex: 0 0 auto;
  position: relative;
}
.driver-avatar.small {
  width: 34px;
  height: 34px;
  font-size: 12px;
}
.driver-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.driver-avatar.has-photo {
  position: relative;
}
.driver-avatar-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}
.driver-avatar.has-photo img {
  position: relative;
  z-index: 1;
}
.live-card {
  overflow: hidden;
}
.home-live-tracking {
  display: grid;
  gap: 14px;
}
.home-live-empty {
  display: grid;
  gap: 10px;
  min-height: 180px;
  align-content: center;
}
.home-live-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}
.home-live-head h3 {
  margin-bottom: 2px;
  font-size: 20px;
}
.home-live-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}
.customer-route-map {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 18% 20%, rgba(242, 165, 26, .12), transparent 7rem),
    radial-gradient(circle at 88% 18%, rgba(37, 99, 235, .10), transparent 7rem),
    #f8fafc;
}
.customer-route-map svg {
  display: block;
  width: 100%;
  height: 176px;
  stroke-width: 0;
}
.customer-route-map .map-grid {
  fill: none;
  stroke: #e7ebf0;
  stroke-width: 1;
  opacity: .72;
}
.customer-route-map .map-street {
  fill: none;
  stroke: #cbd5e1;
  stroke-width: 8;
  stroke-linecap: round;
  opacity: .78;
}
.customer-route-map .map-route {
  fill: none;
  stroke: var(--info);
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.customer-route-map .map-pin {
  stroke: #fff;
  stroke-width: 4;
}
.customer-route-map .map-pin.pickup { fill: var(--brand); }
.customer-route-map .map-pin.dropoff { fill: var(--success); }
.customer-route-map .map-pin.driver { fill: #ff5a1f; }
.customer-route-map .map-driver-arrow {
  fill: #ff5a1f;
  stroke: #fff;
  stroke-width: 2;
}
.customer-route-map .map-caption {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 10px 24px rgba(15,23,42,.08);
  backdrop-filter: blur(8px);
}
.customer-route-map.is-schematic .map-route {
  stroke-dasharray: 8 8;
  opacity: .72;
}
.customer-route-map.is-schematic .map-pin {
  opacity: .82;
}

.customer-route-map .map-caption span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.customer-route-map .map-caption strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}
.detail-route-map {
  margin: 16px 0;
}
.compact-progress {
  margin: 0;
}
.home-live-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.home-live-meta div {
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 12px;
  background: #fff;
}
.home-live-meta span {
  display: block;
  margin-bottom: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}
.home-live-meta strong {
  display: block;
  font-size: 14px;
}
.home-driver-card,
.driver-detail-card {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px;
  background: #fff;
}
.driver-detail-card {
  margin: 0 0 16px;
}
.driver-detail-card.empty,
.home-driver-card.muted-card {
  background: #fcfcfd;
}
.home-driver-card strong,
.driver-detail-card strong {
  display: block;
}
.home-driver-card span:not(.driver-presence),
.driver-detail-card p {
  display: block;
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 13px;
}

.contact-policy-card {
  border: 1px solid rgba(245, 158, 11, .28);
  border-radius: 16px;
  background: rgba(245, 158, 11, .08);
  padding: 12px 14px;
  margin: -4px 0 16px;
  min-width: 0;
}
.contact-policy-card.compact {
  margin: 0;
}
.contact-policy-card strong,
.contact-policy-card p {
  display: block;
  overflow-wrap: anywhere;
}
.contact-policy-card strong {
  color: #92400e;
  font-size: 13px;
}
.contact-policy-card p {
  margin: 4px 0 0;
  color: #a16207;
  font-size: 13px;
  line-height: 1.35;
}
.driver-presence {
  border-radius: 999px;
  padding: 5px 8px;
  background: var(--slate-soft);
  color: var(--slate);
  font-size: 11px;
  font-weight: 900;
}
.driver-presence.online {
  background: var(--success-soft);
  color: var(--success);
}
.home-mini-timeline {
  list-style: none;
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
}
.home-mini-timeline li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}
.home-mini-timeline li > span {
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border-radius: 999px;
  border: 2px solid var(--line-strong);
  background: #fff;
}
.home-mini-timeline li.done > span {
  border-color: var(--success);
  background: var(--success);
}
.home-mini-timeline li.current > span {
  border-color: var(--brand);
  background: var(--brand-soft);
  box-shadow: inset 0 0 0 4px #fff;
}
.home-mini-timeline strong,
.home-mini-timeline small {
  display: block;
}
.home-mini-timeline small {
  color: var(--muted);
  font-weight: 650;
}
.home-pod-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px dashed var(--line-strong);
  border-radius: 18px;
  padding: 12px;
  background: #fcfcfd;
}
.home-pod-card.ready {
  border-style: solid;
  border-color: rgba(21, 128, 61, .22);
  background: var(--success-soft);
}
.home-pod-card p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 13px;
}
.home-proof-strip {
  margin-top: 16px;
  border-top: 1px solid var(--line);
  padding-top: 14px;
}
.home-proof-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.home-proof-content {
  display: grid;
  gap: 10px;
}
.home-proof-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.home-proof-empty {
  width: 100%;
  border: 1px dashed var(--line-strong);
  border-radius: 18px;
  padding: 14px;
  background: #fcfcfd;
}
.home-proof-empty strong,
.home-proof-empty span {
  display: block;
}
.home-proof-empty span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}
.home-proof-tile {
  width: 112px;
  height: 76px;
  text-align: left;
}
.home-proof-tile span {
  position: absolute;
  left: 7px;
  right: 7px;
  bottom: 7px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-radius: 999px;
  padding: 3px 7px;
  background: rgba(255,255,255,.92);
  color: var(--success);
  font-size: 11px;
  font-weight: 900;
}
.quick-action-icon.teal {
  background: var(--success-soft);
  color: var(--success);
}

@media (max-width: 1320px) {
  .customer-live-board {
    grid-template-columns: 1fr;
  }
  .realtime-card {
    position: static;
  }
  .home-board-head { display: none; }
  .home-order-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }
  .home-order-address,
  .home-order-eta,
  .home-order-row > div:nth-child(4),
  .home-order-row > div:nth-child(6),
  .home-order-pod {
    grid-column: 1 / -1;
  }
  .home-order-pod {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .home-live-head,
  .home-pod-card {
    grid-template-columns: 1fr;
    display: grid;
  }
  .home-live-meta,
  .home-driver-card,
  .driver-detail-card {
    grid-template-columns: 1fr;
  }
  .driver-presence {
    justify-self: start;
  }
}
.pod-preview-tile {
  position: relative;
  overflow: hidden;
  width: 72px;
  height: 58px;
  border: 1px solid rgba(21, 128, 61, .28);
  border-radius: 15px;
  background: #fff;
  padding: 0;
}
.pod-preview-tile img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  background: linear-gradient(135deg, #ffffff, var(--success-soft));
}
.pod-preview-tile span {
  position: absolute;
  left: 6px;
  bottom: 6px;
  border-radius: 999px;
  padding: 2px 6px;
  background: rgba(255,255,255,.92);
  color: var(--success);
  font-size: 10px;
  font-weight: 950;
}

/* Ajustes finais da fase: layout do novo painel inicial e separação Arquivo POD */
.customer-live-board {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(330px, .85fr);
  gap: 18px;
  align-items: start;
}
.customer-live-board > .live-orders-card {
  grid-column: 1;
}
.customer-live-board > .realtime-card {
  grid-column: 2;
  grid-row: 1 / span 2;
  position: sticky;
  top: 18px;
}
.customer-live-board > .home-proof-panel,
.customer-live-board > .home-actions-card,
.customer-live-board > .home-activity-card {
  min-width: 0;
}
.customer-live-board > .home-proof-panel {
  grid-column: 1;
}
.customer-live-board > .home-actions-card,
.customer-live-board > .home-activity-card {
  grid-column: auto;
}
.live-heading {
  align-items: flex-start;
}
.live-order-table {
  min-width: 0;
}
.home-tracking-detail-empty {
  display: grid;
  gap: 8px;
  min-height: 280px;
  align-content: center;
}
.compact-actions {
  grid-template-columns: 1fr;
}
.card.home-proof-panel {
  position: static;
  overflow: visible;
  width: auto;
  height: auto;
  min-height: 0;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  background: rgba(255, 255, 255, .96);
  color: var(--ink);
  text-align: initial;
}
.home-proof-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.home-proof-tile {
  position: relative;
  overflow: hidden;
  display: grid;
  align-items: end;
  width: 128px;
  min-height: 82px;
  border: 1px solid rgba(21, 128, 61, .26);
  border-radius: 16px;
  background: #fff;
  color: var(--success);
  padding: 0;
  text-align: left;
}
.home-proof-tile img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  background: linear-gradient(135deg, #ffffff, var(--success-soft));
}
.home-proof-tile.ready span {
  position: absolute;
  left: 7px;
  right: 7px;
  bottom: 7px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  border-radius: 999px;
  padding: 3px 7px;
  background: rgba(255,255,255,.92);
  color: var(--success);
  font-size: 11px;
  font-weight: 900;
}
.home-proof-tile.pending {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 12px;
  border-style: dashed;
  border-color: rgba(242, 165, 26, .45);
  background: var(--brand-soft);
  color: var(--ink);
}
.home-proof-tile.pending strong,
.home-proof-tile.pending small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-proof-tile.pending small {
  color: var(--muted);
  font-weight: 750;
}
.ghost.tiny {
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 11px;
  justify-self: start;
}
.home-proof-empty {
  display: grid;
  gap: 4px;
  border: 1px dashed var(--line-strong);
  border-radius: 16px;
  padding: 14px;
  background: #fcfcfd;
}
.home-proof-empty span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
@media (max-width: 1180px) {
  .customer-live-board {
    grid-template-columns: 1fr;
  }
  .customer-live-board > .live-orders-card,
  .customer-live-board > .realtime-card,
  .customer-live-board > .home-proof-panel,
  .customer-live-board > .home-actions-card,
  .customer-live-board > .home-activity-card {
    grid-column: 1;
  }
  .customer-live-board > .realtime-card {
    grid-row: auto;
    position: static;
  }
}
@media (max-width: 720px) {
  .home-proof-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .home-proof-tile {
    width: 100%;
  }
}
.card.home-proof-panel .home-proof-empty span,
.card.home-proof-panel .home-proof-tile.pending small,
.card.home-proof-panel .home-proof-tile.pending strong {
  position: static;
  left: auto;
  right: auto;
  bottom: auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
}
#homeProofsList {
  display: grid;
  gap: 10px;
}
#homeProofsList .home-proof-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

/* Fase 2 cliente — Meus pedidos e acompanhamento como cockpit logístico */
.order-list.logistics-board-mode {
  display: block;
}
.customer-order-board {
  display: grid;
  gap: 10px;
}
.customer-order-board-head,
.customer-order-board-row {
  display: grid;
  grid-template-columns: minmax(118px, .9fr) minmax(165px, 1.25fr) minmax(190px, 1.45fr) minmax(130px, .95fr) minmax(120px, .9fr) minmax(132px, .95fr) 88px;
  gap: 12px;
  align-items: center;
}
.customer-order-board-head {
  padding: 0 12px 4px;
  color: #98a2b3;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.customer-order-board-row {
  min-width: 0;
  padding: 13px 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.customer-order-board-row:hover,
.customer-order-board-row.selected {
  border-color: rgba(242, 165, 26, .68);
  box-shadow: 0 14px 30px rgba(15, 23, 42, .06);
  transform: translateY(-1px);
}
.customer-order-id strong,
.customer-order-id span,
.customer-order-id small,
.customer-order-address span,
.customer-order-address small,
.customer-order-eta strong,
.customer-order-eta span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.customer-order-id span,
.customer-order-id small,
.customer-order-address small,
.customer-order-eta span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}
.customer-order-address small {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #98a2b3;
}
.customer-order-status {
  display: grid;
  gap: 8px;
}
.tracking-item-progress.tiny {
  height: 5px;
}
.customer-order-pod {
  display: flex;
  justify-content: center;
}
.tracking-item-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}
.tracking-item-meta > div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 8px;
  background: #fcfcfd;
}
.tracking-item-meta > div > span {
  display: block;
  margin-bottom: 4px;
  color: #98a2b3;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.tracking-item-meta strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.proof-mini-card {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 13px;
  padding: 5px 7px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}
.proof-mini-card.ready {
  position: relative;
  overflow: hidden;
  width: 58px;
  height: 42px;
  padding: 0;
  border-color: rgba(21, 128, 61, .26);
  color: var(--success);
}
.proof-mini-card.ready img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: linear-gradient(135deg, #ffffff, var(--success-soft));
}
.proof-mini-card.ready span {
  position: absolute;
  left: 5px;
  bottom: 5px;
  border-radius: 999px;
  padding: 2px 6px;
  background: rgba(255,255,255,.92);
  color: var(--success);
}
.proof-mini-card.pending {
  border-color: rgba(242, 165, 26, .30);
  background: var(--brand-soft);
  color: var(--brand-dark);
}
.proof-mini-card.muted {
  background: #f8fafc;
  color: #98a2b3;
}
.route-map-expand {
  position: absolute;
  z-index: 3;
  top: 10px;
  right: 10px;
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(255,255,255,.92);
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
  box-shadow: 0 10px 20px rgba(15,23,42,.08);
  backdrop-filter: blur(8px);
}
.route-map-expand:hover {
  border-color: rgba(242, 165, 26, .55);
  color: var(--brand-dark);
}
.map-privacy-note {
  display: block;
  padding: 0 13px 11px;
  color: #98a2b3;
  font-size: 11px;
  font-weight: 700;
}
.route-map-modal.hidden {
  display: none;
}
.route-map-modal {
  position: fixed;
  inset: 0;
  z-index: 1500;
  display: grid;
  place-items: center;
  padding: 24px;
}
.route-map-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, .46);
  backdrop-filter: blur(8px);
}
.route-map-modal-card {
  position: relative;
  z-index: 1;
  width: min(920px, 96vw);
  max-height: min(92vh, 900px);
  overflow: auto;
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 28px;
  padding: 20px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(15,23,42,.24);
}
.route-map-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.route-map-modal-head h2 {
  margin-bottom: 3px;
}
.route-map-modal-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-weight: 750;
}
.expanded-route-map svg {
  height: min(46vh, 420px);
}
.no-expand .route-map-expand {
  display: none;
}
.route-map-modal-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}
.route-map-modal-grid div {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  background: #fcfcfd;
}
.route-map-modal-grid span,
.route-map-modal-grid strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.route-map-modal-grid span {
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}
.modal-route-points {
  margin: 0;
}
body.route-map-open {
  overflow: hidden;
}
@media (max-width: 1180px) {
  .customer-order-board-head { display: none; }
  .customer-order-board-row {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .customer-order-pod { justify-content: flex-start; }
  .tracking-item-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .tracking-item-meta,
  .route-map-modal-grid {
    grid-template-columns: 1fr;
  }
  .route-map-modal { padding: 10px; }
  .route-map-modal-card { border-radius: 22px; padding: 14px; }
  .expanded-route-map svg { height: 280px; }
}

/* Fase 2.1 — snapshot vivo, mapa ampliado e status público da rota */
.route-status-panel {
  position: relative;
  display: grid;
  gap: 12px;
  margin: 14px 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}
.route-status-panel.compact {
  margin: 10px 0;
  padding: 12px;
}
.route-status-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.route-status-main strong,
.route-status-main p {
  display: block;
  min-width: 0;
  margin: 0;
}
.route-status-main p {
  margin-top: 2px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.35;
}
.route-live-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #cbd5e1;
  box-shadow: 0 0 0 6px rgba(203, 213, 225, .24);
}
.route-live-dot.assigned {
  background: var(--brand);
  box-shadow: 0 0 0 6px rgba(242, 165, 26, .16);
}
.route-live-dot.live {
  background: var(--success);
  box-shadow: 0 0 0 6px rgba(21, 128, 61, .16);
}
.route-live-chip {
  border-radius: 999px;
  padding: 5px 9px;
  background: #f1f5f9;
  color: var(--muted);
  font-size: 11px;
  font-weight: 950;
  white-space: nowrap;
}
.route-live-chip.assigned {
  background: var(--brand-soft);
  color: var(--brand-dark);
}
.route-live-chip.live {
  background: var(--success-soft);
  color: var(--success);
}
.route-code-chip,
.route-code-inline {
  background: rgba(242, 165, 26, .14);
  color: var(--brand-dark);
}
.route-code-inline {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 2px 7px;
  margin-right: 4px;
  font-size: 11px;
  font-weight: 950;
  vertical-align: middle;
}
.route-status-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.route-status-metrics div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px;
  background: #fcfcfd;
}
.route-status-metrics span,
.route-status-metrics strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.route-status-metrics span {
  margin-bottom: 3px;
  color: #98a2b3;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.route-status-metrics strong {
  font-size: 13px;
}
.route-status-panel .route-map-expand {
  position: static;
  justify-self: start;
  border-color: var(--line);
  box-shadow: none;
  background: #fff;
  backdrop-filter: none;
}
.route-warning-list {
  display: grid;
  gap: 8px;
}
.route-warning {
  border: 1px solid rgba(242, 165, 26, .28);
  border-radius: 14px;
  padding: 10px 12px;
  background: var(--brand-soft);
  color: var(--brand-dark);
}
.route-warning strong,
.route-warning span {
  display: block;
}
.route-warning span {
  margin-top: 3px;
  font-size: 12px;
  font-weight: 700;
}
.live-map-modal.hidden {
  display: none;
}
.live-map-modal {
  position: fixed;
  inset: 0;
  z-index: 1700;
  display: grid;
  place-items: center;
  padding: 22px;
}
.live-map-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .55);
  backdrop-filter: blur(8px);
}
.live-map-sheet {
  position: relative;
  z-index: 1;
  width: min(1180px, 96vw);
  max-height: min(92vh, 920px);
  overflow: auto;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 30px;
  background: #fff;
  box-shadow: 0 34px 90px rgba(15,23,42,.28);
}
.live-map-content {
  padding: 20px;
}
.live-map-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
}
.live-map-header h2 {
  margin: 0 0 4px;
}
.live-map-header p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-weight: 750;
}
.live-map-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(310px, .85fr);
  gap: 18px;
  align-items: start;
}
.live-map-large svg {
  height: min(52vh, 500px);
}
.live-map-side {
  display: grid;
  gap: 12px;
}
.live-map-addresses {
  display: grid;
  gap: 10px;
}
.live-map-addresses div {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  background: #fcfcfd;
}
.live-map-addresses span,
.live-map-addresses strong {
  display: block;
}
.live-map-addresses span {
  margin-bottom: 4px;
  color: #98a2b3;
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.live-map-addresses strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.35;
}
.live-map-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.live-map-timeline li {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
}
.live-map-timeline li > span {
  width: 12px;
  height: 12px;
  margin-top: 3px;
  border-radius: 999px;
  background: #cbd5e1;
  box-shadow: 0 0 0 5px rgba(203, 213, 225, .20);
}
.live-map-timeline li.done > span {
  background: var(--success);
  box-shadow: 0 0 0 5px rgba(21, 128, 61, .14);
}
.live-map-timeline li.current > span {
  background: var(--brand);
  box-shadow: 0 0 0 5px rgba(242, 165, 26, .16);
}
.live-map-timeline strong,
.live-map-timeline small {
  display: block;
}
.live-map-timeline small {
  margin-top: 2px;
  color: var(--muted);
  font-weight: 650;
  line-height: 1.35;
}
.loading-inline {
  display: inline-flex;
  margin-left: 6px;
  color: var(--brand-dark);
  font-weight: 900;
}
@media (max-width: 980px) {
  .route-status-metrics,
  .live-map-grid {
    grid-template-columns: 1fr;
  }
  .live-map-modal {
    padding: 10px;
  }
  .live-map-content {
    padding: 14px;
  }
  .live-map-sheet {
    border-radius: 22px;
  }
  .live-map-large svg {
    height: 310px;
  }
}
.customer-route-map .map-pin-label {
  fill: #475467;
  stroke: rgba(255,255,255,.85);
  stroke-width: 3px;
  paint-order: stroke;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .02em;
}
.customer-route-map .map-live-pulse {
  fill: rgba(255, 90, 31, .18);
  stroke: rgba(255, 90, 31, .28);
  stroke-width: 2;
}
.map-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  padding: 9px 13px 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}
.legend-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--line-strong);
  display: inline-block;
}
.legend-dot.pickup { background: var(--brand); }
.legend-dot.dropoff { background: var(--success); }
.legend-dot.driver { background: #ff5a1f; }
.legend-dot.muted { background: #cbd5e1; }

/* Fase 3 — estabilização visual do cockpit do cliente: sem sobreposição em listas estreitas */
.home-order-board-v3 {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.home-order-board-v3 .home-board-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 2px;
}
.home-order-board-v3 .home-board-toolbar span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 9px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}
.home-order-card-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.home-order-board-v3 .home-order-row,
.home-order-board-v3 .home-order-card {
  display: grid;
  grid-template-columns: 1fr;
  gap: 11px;
  min-width: 0;
  padding: 13px 14px;
  overflow: hidden;
}
.home-order-card-main,
.home-order-route,
.home-order-meta-row {
  display: grid;
  min-width: 0;
}
.home-order-card-main {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}
.home-order-card-main .status-chip {
  max-width: 100%;
  justify-self: end;
  text-align: center;
  white-space: normal;
  line-height: 1.2;
}
.home-order-route {
  grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1.1fr);
  gap: 10px;
  align-items: center;
  border-top: 1px dashed var(--line);
  border-bottom: 1px dashed var(--line);
  padding: 10px 0;
}
.home-route-arrow {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-size: 12px;
  font-weight: 950;
}
.home-order-meta-row {
  grid-template-columns: minmax(140px, 1fr) minmax(128px, .8fr) auto;
  gap: 10px;
  align-items: center;
}
.home-order-meta-row > div {
  min-width: 0;
}
.home-order-meta-row small,
.home-order-pod > small,
.home-order-driver > small,
.home-order-eta small {
  display: block;
  margin: 0 0 3px;
  color: #98a2b3;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.home-order-driver .driver-mini {
  min-width: 0;
}
.home-order-driver .driver-mini > div {
  min-width: 0;
}
.home-order-driver .driver-mini strong,
.home-order-driver .driver-mini span,
.home-order-eta strong,
.home-order-eta span,
.home-order-address span,
.home-order-address small,
.home-order-id strong,
.home-order-id span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-order-pod {
  display: grid;
  justify-content: end;
  align-items: end;
  min-width: 74px;
}
.home-order-pod .proof-mini-chip,
.home-order-pod .pod-thumb-button {
  justify-self: end;
}
.home-live-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  min-width: 0;
}
.home-live-head > div,
.live-map-header > div,
.route-status-main > div {
  min-width: 0;
}
.home-live-head .status-chip {
  max-width: 100%;
  justify-self: end;
  text-align: center;
  white-space: normal;
  line-height: 1.2;
}
.home-live-head h3,
.home-live-head p,
.live-map-header h2,
.live-map-header p,
.route-status-main strong,
.route-status-main p {
  min-width: 0;
  overflow-wrap: anywhere;
}
.route-status-panel.compact .route-status-main {
  grid-template-columns: auto minmax(0, 1fr);
}
.route-status-panel.compact .route-live-chip {
  grid-column: 1 / -1;
  justify-self: start;
  white-space: normal;
  line-height: 1.25;
}
.route-status-panel.compact .route-status-metrics {
  grid-template-columns: 1fr;
}
.route-status-panel.compact .route-status-metrics strong {
  white-space: normal;
  line-height: 1.25;
}
.customer-live-board > .realtime-card {
  min-width: 0;
  overflow: hidden;
}
.realtime-card .home-route-map,
.realtime-card .customer-route-map {
  max-width: 100%;
}
@media (max-width: 1560px) {
  .customer-live-board {
    grid-template-columns: minmax(0, 1.45fr) minmax(360px, .95fr);
  }
  .home-order-meta-row {
    grid-template-columns: minmax(0, 1fr) minmax(118px, .75fr) auto;
  }
}
@media (max-width: 1320px) {
  .customer-live-board {
    grid-template-columns: 1fr;
  }
  .customer-live-board > .live-orders-card,
  .customer-live-board > .realtime-card,
  .customer-live-board > .home-proof-panel,
  .customer-live-board > .home-actions-card,
  .customer-live-board > .home-activity-card {
    grid-column: 1;
  }
  .customer-live-board > .realtime-card {
    grid-row: auto;
    position: static;
  }
}
@media (max-width: 760px) {
  .home-order-card-main,
  .home-order-route,
  .home-order-meta-row {
    grid-template-columns: 1fr;
  }
  .home-route-arrow {
    transform: rotate(90deg);
  }
  .home-order-card-main .status-chip,
  .home-order-pod,
  .home-order-pod .proof-mini-chip,
  .home-order-pod .pod-thumb-button,
  .home-live-head .status-chip {
    justify-self: start;
  }
}


/* Fase 3.1 — lightbox autenticado de POD e refinamento de densidade */
.pod-lightbox-modal.hidden {
  display: none;
}
.pod-lightbox-modal {
  position: fixed;
  inset: 0;
  z-index: 1800;
  display: grid;
  place-items: center;
  padding: 22px;
}
.pod-lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .58);
  backdrop-filter: blur(8px);
}
.pod-lightbox-sheet {
  position: relative;
  z-index: 1;
  width: min(880px, 96vw);
  max-height: min(92vh, 920px);
  overflow: auto;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 30px;
  background: #fff;
  box-shadow: 0 34px 90px rgba(15,23,42,.30);
}
.pod-lightbox-content {
  display: grid;
  gap: 14px;
  padding: 20px;
}
.pod-lightbox-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
}
.pod-lightbox-header > div {
  min-width: 0;
}
.pod-lightbox-header h2,
.pod-lightbox-header p {
  min-width: 0;
  overflow-wrap: anywhere;
}
.pod-lightbox-header h2 {
  margin-bottom: 3px;
}
.pod-lightbox-header p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  font-weight: 750;
}
.pod-lightbox-body {
  min-height: 300px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 22px;
  background:
    radial-gradient(circle at 20% 20%, rgba(21, 128, 61, .07), transparent 16rem),
    #f8fafc;
}
.pod-lightbox-body img {
  display: block;
  max-width: 100%;
  max-height: min(62vh, 620px);
  object-fit: contain;
  background: #fff;
}
.pod-loading-card {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 28px;
  text-align: center;
  color: var(--ink-soft);
}
.pod-loading-card small {
  color: var(--muted);
  font-weight: 650;
}
.pod-loading-card.error strong {
  color: var(--danger);
}
.inline-loader {
  width: 26px;
  height: 26px;
  border: 3px solid rgba(242, 165, 26, .20);
  border-top-color: var(--brand-dark);
  border-radius: 999px;
  animation: portal-spin .78s linear infinite;
}
.pod-lightbox-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.pod-lightbox-note {
  color: var(--muted);
  font-weight: 650;
}
@media (max-width: 720px) {
  .pod-lightbox-modal {
    padding: 10px;
  }
  .pod-lightbox-sheet {
    border-radius: 22px;
  }
  .pod-lightbox-content {
    padding: 14px;
  }
  .pod-lightbox-actions,
  .pod-lightbox-actions > button {
    width: 100%;
  }
  .pod-lightbox-body {
    min-height: 230px;
  }
}
@keyframes portal-spin {
  to { transform: rotate(360deg); }
}

/* Fase 4 — acabamento operacional, responsividade e leitura sem sobreposição */
.customer-live-board,
.customer-live-board > .live-orders-card,
.customer-live-board > .realtime-card,
.customer-live-board > .home-proof-panel,
.customer-live-board > .home-actions-card,
.customer-live-board > .home-activity-card,
.home-order-board-v3,
.home-order-card-list,
.home-order-board-v3 .home-order-card,
.home-order-board-v3 .home-order-row,
.home-order-card-main,
.home-order-route,
.home-order-meta-row,
.home-order-id,
.home-order-address,
.home-order-driver,
.home-order-eta,
.home-live-head,
.home-live-status-stack,
.route-status-panel,
.route-status-main,
.route-status-metrics,
.live-map-header,
.live-map-grid,
.live-map-side,
.live-map-addresses,
.home-driver-card,
.home-pod-card {
  min-width: 0;
}

.customer-live-board {
  grid-template-columns: minmax(0, 1.62fr) minmax(350px, .88fr);
}
.customer-live-board > .live-orders-card,
.customer-live-board > .realtime-card,
.customer-live-board > .home-proof-panel,
.customer-live-board > .home-actions-card,
.customer-live-board > .home-activity-card {
  overflow: hidden;
}
.live-orders-card {
  container-type: inline-size;
}
.live-orders-card .card-heading,
.live-heading,
.home-live-head,
.home-order-board-v3 .home-board-toolbar {
  min-width: 0;
  gap: 12px;
}
.live-orders-card .card-heading > div,
.live-heading > div,
.home-live-head > div {
  min-width: 0;
}
.live-orders-card .card-heading h2,
.live-orders-card .card-heading p,
.home-order-id strong,
.home-order-id span,
.home-order-address small,
.home-order-address span,
.home-order-driver .driver-mini strong,
.home-order-driver .driver-mini span,
.home-order-eta strong,
.home-order-eta span,
.route-status-metrics strong,
.route-status-metrics span,
.live-map-addresses strong,
.live-map-addresses span,
.live-map-timeline strong,
.live-map-timeline small,
.home-mini-timeline strong,
.home-mini-timeline small,
.home-pod-card strong,
.home-pod-card p {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

.home-order-board-v3 .home-board-toolbar {
  align-items: center;
}
.home-order-board-v3 .home-board-toolbar small {
  flex: 1 1 220px;
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.25;
}
.home-board-refresh {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 10px;
  background: #fff;
  color: var(--brand-dark);
  font-size: 11px;
  font-weight: 950;
  white-space: nowrap;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.home-board-refresh:hover {
  border-color: rgba(242, 165, 26, .55);
  background: var(--brand-soft);
  box-shadow: 0 8px 18px rgba(242, 165, 26, .12);
  transform: translateY(-1px);
}
.home-board-refresh:disabled {
  cursor: wait;
  opacity: .72;
  transform: none;
}

.home-order-card-list {
  max-height: min(58vh, 610px);
  overflow: auto;
  padding-right: 3px;
  scrollbar-width: thin;
}
.home-order-board-v3 .home-order-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
}
.home-order-board-v3 .home-order-card.selected {
  border-color: rgba(242, 165, 26, .72);
  background: linear-gradient(135deg, rgba(255, 247, 232, .84), #fff 58%);
  box-shadow: 0 12px 30px rgba(242, 165, 26, .13);
}
.home-order-board-v3 .home-order-row:focus-visible,
.tracking-item:focus-visible,
.route-map-expand:focus-visible {
  outline: 3px solid rgba(242, 165, 26, .32);
  outline-offset: 3px;
}
.home-order-card-main .status-chip,
.home-live-head .status-chip,
.live-map-side > .status-chip,
.route-live-chip {
  max-width: min(100%, 180px);
  overflow: hidden;
  text-overflow: ellipsis;
}
.home-order-route {
  grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr);
}
.home-order-address span,
.home-order-address small {
  overflow-wrap: anywhere;
}
.home-order-meta-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, .9fr) minmax(76px, auto);
}
.home-order-driver .driver-mini {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  min-width: 0;
}
.home-order-driver .driver-mini .driver-avatar {
  width: 28px;
  height: 28px;
  font-size: 10px;
}

.home-live-status-stack {
  display: grid;
  justify-items: end;
  gap: 6px;
  min-width: 0;
}
.mini-loading-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 8px;
  background: #fff;
  color: var(--brand-dark);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
  white-space: nowrap;
}
.mini-loading-chip::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: .58;
  animation: xmotoBlink 1.1s ease-in-out infinite;
}
@keyframes xmotoBlink {
  0%, 100% { opacity: .35; transform: scale(.82); }
  50% { opacity: 1; transform: scale(1); }
}
.home-live-addresses {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.home-live-addresses div {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 10px 11px;
  background: #fcfcfd;
}
.home-live-addresses span,
.home-live-addresses strong {
  display: block;
  min-width: 0;
}
.home-live-addresses span {
  margin-bottom: 3px;
  color: #98a2b3;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.home-live-addresses strong {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.3;
}
.home-live-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.home-live-actions .ghost.small {
  min-width: 0;
  justify-content: center;
  padding-inline: 8px;
  white-space: nowrap;
}

.route-readiness-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}
.route-readiness-chips span {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 8px;
  background: #fcfcfd;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  line-height: 1.1;
  white-space: nowrap;
}
.route-readiness-chips span.ready {
  border-color: rgba(21, 128, 61, .20);
  background: var(--success-soft);
  color: var(--success);
}
.route-readiness-chips.compact span,
.live-map-side > .status-chip {
  white-space: normal;
  line-height: 1.2;
}

.home-route-map.customer-route-map svg {
  height: clamp(154px, 16vw, 190px);
}
.realtime-card .home-route-map.customer-route-map svg {
  height: clamp(158px, 18vw, 206px);
}
.live-map-large.customer-route-map svg {
  height: clamp(300px, 50vh, 520px);
}
.customer-route-map.is-ready {
  border-color: rgba(37, 99, 235, .16);
}
.customer-route-map.is-schematic .map-caption strong {
  color: var(--muted);
}
.customer-route-map .map-caption {
  min-width: 0;
  max-width: calc(100% - 24px);
}
.customer-route-map .map-caption span {
  flex: 0 0 auto;
}
.customer-route-map .map-caption strong {
  text-align: center;
}
.customer-route-map .map-pin-label {
  pointer-events: none;
}
.customer-route-map .map-legend,
.customer-route-map .map-privacy-note,
.map-privacy-note {
  overflow-wrap: anywhere;
  line-height: 1.35;
}
.route-map-expand {
  max-width: calc(100% - 20px);
  white-space: nowrap;
}
.customer-route-map.no-expand .route-map-expand {
  display: none;
}
.live-map-sheet {
  overscroll-behavior: contain;
}

.pref-compact .metric-card,
.pref-compact .card {
  border-radius: 18px;
}
.pref-compact .home-order-board-v3 .home-order-card {
  gap: 8px;
  padding: 10px 11px;
}
.pref-compact .home-order-route {
  padding: 8px 0;
}
.pref-compact .home-mini-timeline li:nth-child(n+5) {
  display: none;
}
.pref-compact .home-live-addresses div,
.pref-compact .route-status-panel,
.pref-compact .home-pod-card {
  padding: 10px;
}
.pref-reduce-motion *,
.pref-reduce-motion *::before,
.pref-reduce-motion *::after {
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
  transition-duration: .01ms !important;
}

@container (max-width: 780px) {
  .home-order-card-main,
  .home-order-route,
  .home-order-meta-row {
    grid-template-columns: 1fr;
  }
  .home-order-card-main .status-chip,
  .home-order-pod,
  .home-order-pod .proof-mini-chip,
  .home-order-pod .pod-thumb-button {
    justify-self: start;
  }
  .home-route-arrow {
    transform: rotate(90deg);
  }
  .home-order-meta-row {
    gap: 12px;
  }
}
@media (max-width: 1680px) {
  .customer-live-board {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 370px);
  }
  .home-order-meta-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
  }
  .home-order-pod,
  .home-order-pod .proof-mini-chip,
  .home-order-pod .pod-thumb-button {
    justify-self: start;
  }
}
@media (max-width: 1460px) {
  .customer-live-board {
    grid-template-columns: minmax(0, 1fr);
  }
  .customer-live-board > .live-orders-card,
  .customer-live-board > .realtime-card,
  .customer-live-board > .home-proof-panel,
  .customer-live-board > .home-actions-card,
  .customer-live-board > .home-activity-card {
    grid-column: 1;
  }
  .customer-live-board > .realtime-card {
    grid-row: auto;
    position: static;
  }
  .home-order-route {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .home-route-arrow {
    transform: rotate(90deg);
  }
}
@media (max-width: 1320px) {
  .home-order-card-list {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}
@media (max-width: 820px) {
  .live-heading,
  .live-orders-card .card-heading,
  .home-live-head,
  .home-pod-card,
  .route-status-main,
  .route-status-metrics,
  .home-order-meta-row {
    grid-template-columns: 1fr;
  }
  .home-order-card-main .status-chip,
  .home-live-head .status-chip,
  .live-map-side > .status-chip,
  .route-live-chip,
  .home-order-pod {
    justify-self: start;
    max-width: 100%;
  }
  .home-live-status-stack {
    justify-items: start;
  }
  .route-readiness-chips span {
    white-space: normal;
  }
}
@media (max-width: 620px) {
  .home-order-board-v3 .home-board-toolbar small,
  .home-board-refresh {
    flex-basis: 100%;
  }
  .home-live-addresses,
  .home-live-actions {
    grid-template-columns: 1fr;
  }
  .home-live-actions .ghost.small {
    justify-content: center;
  }
  .home-live-addresses strong {
    display: block;
    white-space: normal;
  }
  .home-route-map.customer-route-map svg,
  .realtime-card .home-route-map.customer-route-map svg {
    height: 154px;
  }
  .customer-route-map .map-pin-label.driver {
    display: none;
  }
  .live-map-large.customer-route-map svg {
    height: 300px;
  }
}


/* Fase 7 — resumo executivo gerencial no portal */
.executive-report-card {
  display: grid;
  gap: 16px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 24px;
  padding: 18px;
  margin: 18px 0;
  background: linear-gradient(135deg, rgba(15, 23, 42, .035), rgba(37, 99, 235, .055));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.executive-report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
}
.executive-report-head h3,
.executive-report-head p {
  margin: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.executive-report-head h3 {
  font-size: clamp(1.08rem, 2vw, 1.36rem);
  letter-spacing: -.03em;
}
.executive-report-head p {
  color: var(--muted);
  margin-top: 4px;
}
.executive-report-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  min-width: min(280px, 100%);
}
.executive-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.executive-kpi-card {
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 16px;
  padding: 12px;
  background: rgba(255,255,255,.84);
  min-width: 0;
}
.executive-kpi-card span,
.executive-kpi-card small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.executive-kpi-card span {
  color: var(--muted);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 900;
}
.executive-kpi-card strong {
  display: block;
  font-size: 1.55rem;
  line-height: 1.1;
  margin: 5px 0;
  color: #0f172a;
  overflow-wrap: anywhere;
}
.executive-kpi-card small {
  color: #475569;
  font-size: .78rem;
  min-height: 2.2em;
}
.executive-kpi-card.success { border-color: rgba(22, 101, 52, .18); }
.executive-kpi-card.info { border-color: rgba(29, 78, 216, .18); }
.executive-kpi-card.warning { border-color: rgba(146, 64, 14, .22); }
.executive-kpi-card.danger { border-color: rgba(153, 27, 27, .22); }
.executive-body-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.executive-body-grid h4 {
  margin: 0 0 8px;
  font-size: .78rem;
  color: #334155;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.executive-insights-list,
.executive-actions-list,
.analytics-executive-list {
  display: grid;
  gap: 8px;
}
.executive-insight,
.executive-action-item,
.analytics-executive-score,
.analytics-executive-item {
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, .08);
  padding: 10px;
  background: rgba(255,255,255,.78);
  min-width: 0;
}
.executive-insight strong,
.executive-action-item strong,
.analytics-executive-score strong,
.analytics-executive-item strong {
  display: block;
  color: #0f172a;
  overflow-wrap: anywhere;
}
.executive-insight p,
.executive-action-item p,
.analytics-executive-score small,
.analytics-executive-item p {
  margin: 4px 0 0;
  color: #64748b;
  font-size: .82rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.executive-action-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}
.executive-insight.success,
.analytics-executive-score.success,
.analytics-executive-item.success { border-color: rgba(22, 101, 52, .16); }
.executive-insight.info,
.analytics-executive-score.info,
.analytics-executive-item.info { border-color: rgba(29, 78, 216, .18); }
.executive-insight.warning,
.analytics-executive-score.warning,
.analytics-executive-item.warning { border-color: rgba(146, 64, 14, .22); }
.executive-insight.danger,
.analytics-executive-score.danger,
.analytics-executive-item.danger { border-color: rgba(153, 27, 27, .22); }
.analytics-executive-block { margin-bottom: 14px; }
.analytics-executive-score span {
  display: block;
  color: var(--muted);
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 900;
}
.analytics-executive-score strong {
  font-size: 1.8rem;
  margin-top: 4px;
}
@media (max-width: 920px) {
  .executive-report-head,
  .executive-action-item { grid-template-columns: 1fr; }
  .executive-report-head { flex-direction: column; }
  .executive-report-actions { justify-content: flex-start; }
  .executive-kpi-grid,
  .executive-body-grid { grid-template-columns: 1fr; }
}

/* Fase 8 · mapa público real no Portal do Cliente */
.customer-route-map.is-real-map {
  background: #e8eef5;
  border-color: rgba(37, 99, 235, .22);
}
.customer-route-map.is-real-map .map-svg {
  background: #e8eef5;
}
.customer-route-map .map-tile-bg {
  fill: #e8eef5;
}
.customer-route-map .map-tile {
  opacity: .98;
  pointer-events: none;
}
.customer-route-map .map-route-casing {
  fill: none;
  stroke: rgba(255,255,255,.96);
  stroke-width: 9;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: .96;
}
.customer-route-map.is-real-map .map-route {
  stroke-width: 5.5;
  filter: drop-shadow(0 1px 2px rgba(15,23,42,.18));
}
.customer-route-map.is-real-map .map-pin {
  filter: drop-shadow(0 5px 10px rgba(15,23,42,.22));
}
.customer-route-map.is-real-map .map-pin-label {
  fill: #0f172a;
  stroke: rgba(255,255,255,.94);
  stroke-width: 4px;
  paint-order: stroke;
  font-weight: 950;
}
.customer-route-map.is-real-map .map-caption {
  background: rgba(255,255,255,.92);
  border-color: rgba(255,255,255,.82);
}
.customer-route-map.is-real-map .map-privacy-note {
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(226,232,240,.74);
  border-radius: 999px;
  bottom: 44px;
  left: 12px;
  max-width: calc(100% - 24px);
  padding: 3px 7px;
  position: absolute;
  white-space: nowrap;
}
.customer-route-map.is-real-map .map-legend {
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(226,232,240,.82);
  border-radius: 999px;
  left: 12px;
  max-width: calc(100% - 24px);
  padding: 3px 7px;
  position: absolute;
  top: 12px;
}
.live-map-large.customer-route-map.is-real-map .map-privacy-note {
  bottom: 54px;
}
@media (max-width: 760px) {
  .customer-route-map.is-real-map .map-privacy-note {
    border-radius: 12px;
    white-space: normal;
  }
  .customer-route-map.is-real-map .map-legend {
    border-radius: 12px;
    white-space: normal;
  }
}

/* Fase 9 · geocodificação e rota pública por vias */
.route-map-resolve {
  position: absolute;
  right: 12px;
  top: 48px;
  z-index: 4;
  border: 1px solid rgba(37, 99, 235, .18);
  border-radius: 999px;
  padding: 7px 10px;
  background: rgba(255,255,255,.92);
  color: var(--info);
  font-size: 11px;
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(15,23,42,.10);
  backdrop-filter: blur(8px);
}
.route-map-resolve:hover {
  border-color: rgba(37, 99, 235, .32);
  background: #fff;
  transform: translateY(-1px);
}
.customer-route-map.no-expand .route-map-resolve,
.live-map-large.customer-route-map .route-map-resolve {
  top: 14px;
}
.map-resolution-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: -4px 0 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 11px 12px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15,23,42,.04);
}
.map-resolution-card strong {
  display: block;
  font-size: 13px;
  color: var(--ink);
}
.map-resolution-card p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
}
.map-resolution-card.ready {
  border-color: rgba(21, 128, 61, .18);
  background: linear-gradient(135deg, rgba(22,163,74,.08), #fff 72%);
}
.map-resolution-card.partial {
  border-color: rgba(37, 99, 235, .18);
  background: linear-gradient(135deg, rgba(37,99,235,.08), #fff 72%);
}
.map-resolution-card.pending {
  border-color: rgba(202, 138, 4, .18);
  background: linear-gradient(135deg, rgba(251,191,36,.12), #fff 72%);
}
.map-resolution-card .ghost.small {
  flex: 0 0 auto;
  white-space: nowrap;
}
.customer-route-map[aria-busy="true"] .map-route,
.customer-route-map[aria-busy="true"] .map-route-casing {
  opacity: .65;
}
@media (max-width: 760px) {
  .route-map-resolve {
    left: 12px;
    right: auto;
    top: 46px;
    max-width: calc(100% - 24px);
  }
  .map-resolution-card {
    align-items: flex-start;
    flex-direction: column;
  }
  .map-resolution-card .ghost.small {
    width: 100%;
  }
}


/* Fase 11 — lista operacional rica: status, motorista e POD no próprio pedido */
.home-delivery-table,
.customer-order-board {
  min-width: 0;
}

.home-delivery-table {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 2px;
  scrollbar-width: thin;
}

.home-delivery-head,
.home-order-board-v3 .home-delivery-row,
.customer-order-board-row.rich-delivery-row {
  display: grid;
  grid-template-columns: minmax(92px, .82fr) minmax(132px, 1.08fr) minmax(150px, 1.22fr) minmax(96px, .78fr) minmax(82px, .66fr) minmax(116px, .9fr) minmax(70px, .54fr);
  gap: 9px;
  align-items: center;
}

.home-delivery-head,
.home-order-board-v3 .home-delivery-row {
  min-width: 760px;
}

.home-delivery-head {
  padding: 0 14px 6px;
  color: #98a2b3;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.home-order-board-v3 .home-delivery-row {
  grid-template-columns: minmax(92px, .82fr) minmax(132px, 1.08fr) minmax(150px, 1.22fr) minmax(96px, .78fr) minmax(82px, .66fr) minmax(116px, .9fr) minmax(70px, .54fr);
  gap: 9px;
  padding: 11px 12px;
}

.delivery-cell,
.customer-order-board-row.rich-delivery-row > * {
  min-width: 0;
}

.home-order-board-v3 .home-delivery-row .delivery-cell {
  align-self: center;
}

.driver-mini-placeholder .driver-avatar {
  background: linear-gradient(135deg, #f8fafc, #fff);
  color: #64748b;
  border-color: #e2e8f0;
}

.driver-mini-placeholder strong {
  color: var(--ink-soft);
}

.driver-mini-placeholder span {
  color: #98a2b3;
}

.delivery-id strong,
.delivery-id span,
.delivery-address small,
.delivery-address span,
.delivery-eta strong,
.delivery-eta span,
.customer-order-driver .driver-mini strong,
.customer-order-driver .driver-mini span,
.delivery-driver .driver-mini strong,
.delivery-driver .driver-mini span {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.delivery-id strong,
.customer-order-id strong {
  color: var(--ink);
  font-size: 13px;
  letter-spacing: -.01em;
}

.delivery-id span,
.delivery-address small,
.delivery-eta span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.delivery-address small {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #98a2b3;
}

.delivery-address span {
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.25;
}

.delivery-eta strong,
.customer-order-eta strong {
  color: var(--ink);
  font-size: 13px;
}

.order-status-inline {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.order-status-inline .status-chip {
  justify-self: start;
  max-width: 100%;
  min-height: 26px;
  padding-inline: 9px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.delivery-status .tracking-item-progress.tiny,
.customer-order-status .tracking-item-progress.tiny {
  width: min(100%, 120px);
}

.delivery-driver .driver-mini,
.customer-order-driver .driver-mini,
.compact-order-meta .driver-mini {
  grid-template-columns: 32px minmax(0, 1fr);
}

.delivery-driver .driver-avatar,
.customer-order-driver .driver-avatar,
.compact-order-meta .driver-avatar {
  width: 32px;
  height: 32px;
  font-size: 11px;
}

.driver-avatar.has-photo img {
  position: relative;
  z-index: 2;
}

.driver-avatar-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  z-index: 1;
}

.proof-thumb-card {
  width: 66px;
  height: 48px;
  position: relative;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(21, 128, 61, .26);
  border-radius: 14px;
  background: #fff;
  color: var(--success);
  padding: 0;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .05);
}

.proof-thumb-card.compact {
  width: 62px;
  height: 44px;
}

.proof-thumb-card img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  background: linear-gradient(135deg, #fff, var(--success-soft));
}

.proof-thumb-card span {
  position: absolute;
  left: 5px;
  bottom: 5px;
  max-width: calc(100% - 10px);
  border-radius: 999px;
  padding: 2px 6px;
  background: rgba(255,255,255,.93);
  color: var(--success);
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  box-shadow: 0 4px 10px rgba(15,23,42,.08);
}

.delivery-proof,
.customer-order-pod {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

.delivery-proof .proof-mini-chip,
.customer-order-pod .proof-mini-card,
.compact-order-meta .proof-mini-card {
  min-width: 0;
  max-width: 100%;
  min-height: 30px;
  padding: 6px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 950;
}

.customer-order-pod .proof-mini-card.pending,
.delivery-proof .proof-mini-chip.pending {
  border-color: rgba(242, 165, 26, .26);
  background: var(--brand-soft);
  color: var(--brand-dark);
}

.rich-order-action {
  display: grid;
  gap: 8px;
  justify-items: start;
}

.compact-order-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.compact-order-meta .driver-mini {
  max-width: 170px;
}

@container (max-width: 640px) {
  .home-delivery-head {
    display: none;
  }

  .home-delivery-head,
  .home-order-board-v3 .home-delivery-row {
    min-width: 0;
  }

  .home-order-board-v3 .home-delivery-row {
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: stretch;
  }

  .home-order-board-v3 .home-delivery-row .delivery-cell {
    display: grid;
    grid-template-columns: minmax(96px, .35fr) minmax(0, 1fr);
    gap: 8px;
    align-items: center;
  }

  .home-order-board-v3 .home-delivery-row .delivery-id,
  .home-order-board-v3 .home-delivery-row .delivery-proof {
    grid-template-columns: 1fr;
    justify-content: start;
  }

  .home-order-board-v3 .home-delivery-row .delivery-proof {
    justify-items: start;
  }

  .home-order-board-v3 .home-delivery-row .delivery-address small,
  .home-order-board-v3 .home-delivery-row .delivery-eta::before,
  .home-order-board-v3 .home-delivery-row .delivery-driver::before,
  .home-order-board-v3 .home-delivery-row .delivery-status::before,
  .home-order-board-v3 .home-delivery-row .delivery-proof::before {
    color: #98a2b3;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  .home-order-board-v3 .home-delivery-row .delivery-status::before { content: 'Status'; }
  .home-order-board-v3 .home-delivery-row .delivery-eta::before { content: 'Previsão'; }
  .home-order-board-v3 .home-delivery-row .delivery-driver::before { content: 'Entregador'; }
  .home-order-board-v3 .home-delivery-row .delivery-proof::before { content: 'Prova'; }

  .delivery-proof,
  .customer-order-pod {
    justify-content: flex-start;
  }
}

@media (max-width: 1180px) {
  .customer-order-board-row.rich-delivery-row {
    grid-template-columns: 1fr;
  }

  .customer-order-board-row.rich-delivery-row > * {
    width: 100%;
  }

  .customer-order-driver,
  .customer-order-pod {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .home-order-board-v3 .home-delivery-row .delivery-cell {
    grid-template-columns: 1fr;
  }

  .delivery-id strong,
  .delivery-address span,
  .delivery-eta strong {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}

/* Fase 12 — comunicação automática do cliente */
.notification-automation-card {
  border: 1px solid rgba(242, 165, 26, .26);
  border-radius: 22px;
  background: linear-gradient(135deg, #fffaf0 0%, #ffffff 54%, #f8fbff 100%);
  padding: 16px;
  margin: 0 0 18px;
  box-shadow: 0 14px 30px rgba(15, 23, 42, .05);
}

.notification-automation-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 12px;
}

.notification-automation-head h3 {
  margin: 2px 0 5px;
  font-size: 17px;
  letter-spacing: -.02em;
}

.notification-automation-head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.35;
}

.notification-automation-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.notification-channel-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.notification-channel-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 900;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  white-space: nowrap;
}

.notification-channel-pill.enabled {
  color: var(--success);
  border-color: rgba(22, 163, 74, .22);
  background: var(--success-soft);
}

.notification-channel-pill.disabled {
  color: #94a3b8;
  background: #f8fafc;
}

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

.notification-automation-item {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(226, 232, 240, .96);
  border-radius: 18px;
  background: rgba(255, 255, 255, .88);
  padding: 13px;
}

.notification-automation-item .notification-meta {
  margin-bottom: 3px;
}

.notification-automation-item h4 {
  margin: 0 0 4px;
  font-size: 15px;
  letter-spacing: -.015em;
}

.notification-automation-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.38;
}

.notification-automation-mark {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  margin-top: 7px;
  background: var(--slate);
  box-shadow: 0 0 0 5px var(--slate-soft);
}

.notification-automation-item.info .notification-automation-mark { background: var(--info); box-shadow: 0 0 0 5px var(--info-soft); }
.notification-automation-item.success .notification-automation-mark { background: var(--success); box-shadow: 0 0 0 5px var(--success-soft); }
.notification-automation-item.warning .notification-automation-mark { background: var(--brand-dark); box-shadow: 0 0 0 5px var(--brand-soft); }
.notification-automation-item.attention .notification-automation-mark,
.notification-automation-item.danger .notification-automation-mark { background: var(--danger); box-shadow: 0 0 0 5px var(--danger-soft); }

.notification-automation-side {
  display: grid;
  justify-items: end;
  gap: 7px;
  min-width: 92px;
}

.notification-automation-empty {
  display: grid;
  gap: 4px;
  border: 1px dashed #d8dee8;
  border-radius: 16px;
  background: rgba(255, 255, 255, .7);
  padding: 14px;
  color: var(--muted);
}

.notification-automation-empty strong {
  color: var(--ink);
}

.notification-automation-empty.danger strong {
  color: var(--danger);
}

@media (max-width: 720px) {
  .notification-automation-head {
    display: grid;
  }

  .notification-automation-actions {
    justify-content: stretch;
  }

  .notification-automation-actions > * {
    flex: 1;
  }

  .notification-automation-item {
    grid-template-columns: 1fr;
  }

  .notification-automation-mark {
    display: none;
  }

  .notification-automation-side {
    justify-items: stretch;
    min-width: 0;
  }
}

/* Fase 13 — Faturamento / conferência */
.billing-workspace .billing-card {
  overflow: hidden;
}

.billing-kpi-grid {
  margin-top: 16px;
}

.billing-policy-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  margin: 16px 0;
  border: 1px solid rgba(244, 166, 21, 0.22);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255, 250, 235, 0.96), rgba(255, 255, 255, 0.88));
}

.billing-policy-card h3 {
  margin: 2px 0 4px;
  font-size: 1rem;
  color: var(--text-strong, #0f172a);
}

.billing-policy-card p:last-child {
  margin: 0;
  color: var(--text-muted, #64748b);
}

.billing-list {
  display: grid;
  gap: 10px;
}

.billing-row {
  display: grid;
  grid-template-columns: minmax(150px, 1.05fr) minmax(190px, 1.15fr) minmax(150px, 0.9fr) minmax(120px, 0.75fr) minmax(120px, 0.75fr) auto;
  gap: 12px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.045);
}

.billing-row.success {
  border-color: rgba(34, 197, 94, 0.28);
}

.billing-row.warning {
  border-color: rgba(245, 158, 11, 0.3);
}

.billing-row.danger {
  border-color: rgba(239, 68, 68, 0.28);
}

.billing-main,
.billing-route,
.billing-state-stack,
.billing-amount-stack,
.billing-proof-stack {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.billing-main strong,
.billing-amount-stack strong {
  color: var(--text-strong, #0f172a);
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-main span,
.billing-route span,
.billing-state-stack small,
.billing-amount-stack small,
.billing-proof-stack small {
  color: var(--text-muted, #64748b);
  font-size: 0.82rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-route small {
  color: var(--text-soft, #94a3b8);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.billing-state-chip {
  width: max-content;
  max-width: 100%;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: rgba(148, 163, 184, 0.13);
  color: #475569;
}

.billing-state-chip.success {
  background: rgba(34, 197, 94, 0.12);
  color: #15803d;
}

.billing-state-chip.info {
  background: rgba(59, 130, 246, 0.12);
  color: #1d4ed8;
}

.billing-state-chip.warning {
  background: rgba(245, 158, 11, 0.14);
  color: #b45309;
}

.billing-state-chip.danger {
  background: rgba(239, 68, 68, 0.12);
  color: #b91c1c;
}

.billing-actions {
  align-items: center;
  justify-content: flex-end;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

@media (max-width: 1240px) {
  .billing-row {
    grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.2fr) minmax(150px, 0.8fr);
  }
  .billing-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .billing-policy-card {
    align-items: flex-start;
    flex-direction: column;
  }
  .billing-row {
    grid-template-columns: 1fr;
  }
}

/* Fase 13 — Faturamento / conferência operacional do cliente */
.billing-workspace {
  display: grid;
  gap: 18px;
  grid-template-columns: minmax(0, 1fr) 320px;
}

.billing-kpi-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 16px 0;
}

.billing-kpi-card {
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 18px;
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.04);
  min-width: 0;
  padding: 16px;
}

.billing-kpi-card span,
.billing-kpi-card small {
  color: var(--text-muted, #64748b);
  display: block;
  font-size: 0.78rem;
}

.billing-kpi-card strong {
  color: var(--text, #0f172a);
  display: block;
  font-size: 1.55rem;
  margin: 5px 0;
}

.billing-kpi-card.success { border-color: rgba(34, 197, 94, 0.22); }
.billing-kpi-card.warning { border-color: rgba(245, 158, 11, 0.24); }
.billing-kpi-card.danger { border-color: rgba(239, 68, 68, 0.22); }
.billing-kpi-card.info { border-color: rgba(59, 130, 246, 0.22); }

.billing-readiness-card {
  align-items: flex-start;
  background: linear-gradient(135deg, rgba(255, 251, 235, 0.96), rgba(255, 255, 255, 0.96));
  border: 1px solid rgba(245, 158, 11, 0.22);
  border-radius: 20px;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 0.9fr) minmax(260px, 1.1fr);
  margin: 12px 0 18px;
  padding: 18px;
}

.billing-readiness-card h3 {
  margin: 4px 0 6px;
}

.billing-readiness-card p {
  color: var(--text-muted, #64748b);
  margin: 0;
}

.billing-readiness-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.billing-readiness-pill {
  background: rgba(148, 163, 184, 0.12);
  border-radius: 999px;
  color: #475569;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.25;
  padding: 8px 10px;
}

.billing-readiness-pill.success { background: rgba(34, 197, 94, 0.12); color: #15803d; }
.billing-readiness-pill.info { background: rgba(59, 130, 246, 0.12); color: #1d4ed8; }
.billing-readiness-pill.warning { background: rgba(245, 158, 11, 0.15); color: #b45309; }

.billing-check-field {
  align-items: center;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 14px;
  display: flex;
  gap: 8px;
  padding: 12px 14px;
}

.billing-list {
  display: grid;
  gap: 10px;
}

.billing-row {
  align-items: center;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 18px;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(230px, 1.35fr) minmax(150px, 0.72fr) minmax(150px, 0.72fr) minmax(155px, 0.75fr) auto;
  padding: 14px;
}

.billing-row.ready { border-color: rgba(34, 197, 94, 0.24); }
.billing-row.pending { border-color: rgba(245, 158, 11, 0.24); }
.billing-row.attention { border-color: rgba(239, 68, 68, 0.24); }

.billing-row-main,
.billing-row-status,
.billing-row-proof,
.billing-row-amount,
.billing-row-actions {
  min-width: 0;
}

.billing-row-main strong,
.billing-row-amount strong {
  color: var(--text, #0f172a);
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-row-main span,
.billing-row-main small,
.billing-row-status small,
.billing-row-proof small,
.billing-row-amount span {
  color: var(--text-muted, #64748b);
  display: block;
  font-size: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-status-chip {
  border-radius: 999px;
  display: inline-flex;
  font-size: 0.76rem;
  font-weight: 900;
  max-width: 100%;
  overflow: hidden;
  padding: 6px 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-status-chip.ready { background: rgba(34, 197, 94, 0.12); color: #15803d; }
.billing-status-chip.pending { background: rgba(245, 158, 11, 0.15); color: #b45309; }
.billing-status-chip.open { background: rgba(59, 130, 246, 0.12); color: #1d4ed8; }
.billing-status-chip.attention { background: rgba(239, 68, 68, 0.12); color: #b91c1c; }
.billing-status-chip.review { background: rgba(148, 163, 184, 0.14); color: #475569; }

.billing-row-actions {
  display: flex;
  justify-content: flex-end;
}

.billing-row-notes {
  border-top: 1px dashed rgba(148, 163, 184, 0.28);
  color: var(--text-muted, #64748b);
  display: flex;
  flex-wrap: wrap;
  font-size: 0.78rem;
  gap: 6px;
  grid-column: 1 / -1;
  padding-top: 8px;
}

.billing-row-notes span {
  background: rgba(245, 158, 11, 0.1);
  border-radius: 999px;
  padding: 6px 9px;
}

@media (max-width: 1180px) {
  .billing-workspace {
    grid-template-columns: 1fr;
  }
  .billing-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .billing-row {
    grid-template-columns: minmax(220px, 1fr) minmax(140px, 0.7fr) minmax(140px, 0.7fr);
  }
  .billing-row-amount,
  .billing-row-actions {
    grid-column: span 1;
  }
}

@media (max-width: 760px) {
  .billing-kpi-grid,
  .billing-readiness-card,
  .billing-row {
    grid-template-columns: 1fr;
  }
  .billing-row-actions {
    justify-content: flex-start;
  }
}

/* Fase 13 — ajustes da conferência de faturamento */
.billing-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: start;
}

.billing-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.billing-kpi-grid > article,
.billing-kpi-card {
  min-width: 0;
  border: 1px solid rgba(226, 232, 240, .95);
  border-radius: 18px;
  background: rgba(255, 255, 255, .92);
  padding: 14px;
  display: grid;
  gap: 5px;
}

.billing-kpi-grid > article span,
.billing-kpi-card span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .055em;
}

.billing-kpi-grid > article strong,
.billing-kpi-card strong {
  color: var(--ink);
  font-size: clamp(1.25rem, 2.6vw, 1.85rem);
  letter-spacing: -.045em;
}

.billing-kpi-grid > article small,
.billing-kpi-card small {
  color: var(--muted);
  line-height: 1.3;
}

.billing-readiness-card {
  margin: 16px 0;
  border: 1px solid rgba(244, 166, 21, .28);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(255, 251, 235, .96), rgba(255, 255, 255, .92));
  padding: 16px;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
}

.billing-readiness-card h3 {
  margin: 2px 0 4px;
  font-size: 1.08rem;
}

.billing-readiness-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.42;
}

.billing-score-ring {
  width: 82px;
  height: 82px;
  border-radius: 50%;
  border: 7px solid rgba(244, 166, 21, .28);
  background: #fff;
  display: grid;
  place-items: center;
  align-content: center;
  box-shadow: 0 14px 32px rgba(15, 23, 42, .08);
  flex: 0 0 auto;
}

.billing-score-ring strong {
  font-size: 1.2rem;
  line-height: 1;
}

.billing-score-ring span {
  color: var(--muted);
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 800;
}

.billing-actions-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  margin: 12px 0 16px;
}

.billing-recommendations-card {
  border: 1px solid rgba(226, 232, 240, .96);
  border-radius: 20px;
  background: rgba(248, 250, 252, .76);
  padding: 14px;
  margin-bottom: 14px;
}

.billing-recommendations-card h3 {
  margin: 0 0 10px;
  font-size: 1rem;
}

.billing-recommendations-list {
  display: grid;
  gap: 8px;
}

.billing-recommendation {
  border: 1px solid rgba(226, 232, 240, .95);
  border-radius: 14px;
  background: #fff;
  padding: 11px 12px;
  display: grid;
  gap: 3px;
}

.billing-recommendation strong {
  color: var(--ink);
}

.billing-recommendation span {
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.35;
}

.billing-recommendation.warning { border-color: rgba(245, 158, 11, .35); background: rgba(255, 251, 235, .82); }
.billing-recommendation.success { border-color: rgba(34, 197, 94, .28); background: rgba(240, 253, 244, .78); }
.billing-recommendation.danger { border-color: rgba(239, 68, 68, .28); background: rgba(254, 242, 242, .78); }
.billing-recommendation.info { border-color: rgba(59, 130, 246, .28); background: rgba(239, 246, 255, .78); }

.billing-row {
  grid-template-columns: minmax(240px, 1.45fr) minmax(138px, .74fr) minmax(128px, .68fr) minmax(132px, .72fr) auto;
}

.billing-row-main,
.billing-row-status,
.billing-row-proof,
.billing-row-amount,
.billing-row-actions {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.billing-row-main strong,
.billing-row-amount strong {
  color: var(--ink);
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.billing-row-main span,
.billing-row-main small,
.billing-row-status small,
.billing-row-proof small,
.billing-row-amount span {
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.32;
  overflow: hidden;
  text-overflow: ellipsis;
}

.billing-row-main small {
  white-space: nowrap;
}

.billing-status-chip {
  width: max-content;
  max-width: 100%;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: .78rem;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: rgba(148, 163, 184, .14);
  color: #475569;
}

.billing-status-chip.ready { background: rgba(34, 197, 94, .13); color: #15803d; }
.billing-status-chip.pending { background: rgba(245, 158, 11, .16); color: #b45309; }
.billing-status-chip.open { background: rgba(59, 130, 246, .12); color: #1d4ed8; }
.billing-status-chip.attention { background: rgba(239, 68, 68, .13); color: #b91c1c; }
.billing-status-chip.review { background: rgba(100, 116, 139, .14); color: #475569; }

.billing-row-notes {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 4px;
}

.billing-row-notes span {
  border-radius: 999px;
  background: rgba(248, 250, 252, .95);
  border: 1px solid rgba(226, 232, 240, .95);
  color: var(--muted);
  padding: 5px 8px;
  font-size: .76rem;
  font-weight: 700;
}

.billing-guide-card {
  position: sticky;
  top: 16px;
}

@media (max-width: 1180px) {
  .billing-workspace {
    grid-template-columns: 1fr;
  }

  .billing-guide-card {
    position: static;
  }

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

@media (max-width: 860px) {
  .billing-row {
    grid-template-columns: 1fr 1fr;
  }

  .billing-row-actions,
  .billing-row-notes {
    grid-column: 1 / -1;
  }
}

@media (max-width: 620px) {
  .billing-kpi-grid,
  .billing-row {
    grid-template-columns: 1fr;
  }

  .billing-readiness-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .billing-score-ring {
    width: 70px;
    height: 70px;
  }
}

/* Fase 15 — experiência mobile: navegação inferior, cards táteis e acompanhamento em bottom sheet */
.mobile-sheet-handle {
  display: none;
}

@media (max-width: 760px) {
  html {
    scroll-padding-bottom: 96px;
  }

  body {
    padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
  }

  body.mobile-detail-open {
    overflow: hidden;
  }

  body.mobile-detail-open::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 1190;
    background: rgba(15, 23, 42, .38);
    backdrop-filter: blur(4px);
  }

  .app-shell {
    display: block;
    min-height: 100dvh;
  }

  .sidebar {
    position: fixed;
    top: auto;
    left: 8px;
    right: 8px;
    bottom: max(8px, env(safe-area-inset-bottom, 0px));
    z-index: 900;
    height: 76px;
    min-height: 0;
    display: block;
    overflow: hidden;
    padding: 8px;
    border: 1px solid rgba(213, 219, 227, .92);
    border-radius: 26px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 20px 54px rgba(15, 23, 42, .18);
    backdrop-filter: blur(18px);
  }

  .sidebar-hero,
  .new-order-button,
  .sidebar-bottom,
  .nav-section-title {
    display: none !important;
  }

  .sidebar-menu-scroll {
    display: block;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  .sidebar-menu-scroll::-webkit-scrollbar {
    display: none;
  }

  .sidebar-menu-scroll .nav-section {
    display: contents;
  }

  .sidebar-menu-scroll .nav-list {
    display: flex;
    grid-template-columns: none;
    gap: 6px;
    min-width: max-content;
  }

  .nav-item {
    width: 72px;
    height: 58px;
    flex: 0 0 72px;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    border-radius: 18px;
    padding: 7px 6px;
    text-align: center;
    font-size: 10px;
    line-height: 1.05;
  }

  .nav-item span:last-child {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .nav-item.active {
    box-shadow: inset 0 -3px 0 var(--brand), 0 6px 16px rgba(242, 165, 26, .10);
  }

  .nav-icon {
    width: 21px;
    height: 21px;
    flex-basis: 21px;
  }

  .main-area {
    padding: 14px 12px calc(102px + env(safe-area-inset-bottom, 0px));
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 620;
    align-items: stretch;
    gap: 10px;
    margin: -14px -12px 14px;
    padding: 12px;
    border-bottom: 1px solid rgba(231, 235, 240, .84);
    background: rgba(247, 248, 251, .92);
    backdrop-filter: blur(16px);
  }

  .topbar > div:first-child {
    min-width: 0;
  }

  .topbar .eyebrow,
  .page-subtitle,
  .sync-chip,
  .global-search-trigger kbd,
  .install-chip span:not(.nav-icon),
  .global-search-trigger span:not(.nav-icon) {
    display: none;
  }

  .topbar h1 {
    font-size: 27px;
  }

  .topbar-actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, auto));
    justify-content: end;
    gap: 8px;
  }

  .topbar-actions > * {
    min-height: 42px;
  }

  .global-search-trigger,
  .install-chip,
  .icon-button {
    width: 42px;
    min-width: 42px;
    padding-inline: 0;
    justify-content: center;
  }

  .referral-chip {
    min-width: 132px;
    padding-inline: 12px;
    border-color: rgba(242, 165, 26, .62);
    background: linear-gradient(135deg, var(--brand), #ffb83c);
    color: #1f1300;
  }

  .hero-panel.slim {
    display: grid;
    gap: 14px;
    padding: 16px;
    border-radius: 22px;
  }

  .hero-main,
  .hero-meta {
    min-width: 0;
  }

  .hero-panel h2 {
    font-size: 24px;
  }

  .hero-panel .primary {
    width: 100%;
    min-height: 48px;
  }

  .metric-grid.metrics-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .metric-card {
    min-height: 94px;
    padding: 13px;
    border-radius: 20px;
  }

  .metric-card p {
    font-size: 12px;
  }

  .metric-card strong {
    font-size: 24px;
  }

  .customer-live-board {
    display: block;
  }

  .customer-live-board > .live-orders-card,
  .customer-live-board > .home-proof-panel,
  .customer-live-board > .home-actions-card,
  .customer-live-board > .home-activity-card {
    margin-bottom: 12px;
  }

  .live-orders-card,
  .card.home-proof-panel,
  .home-actions-card,
  .home-activity-card {
    padding: 16px;
    border-radius: 22px;
  }

  .live-orders-card .card-heading,
  .card-heading.minimal {
    gap: 12px;
  }

  .card-heading-actions,
  .home-board-toolbar {
    width: 100%;
    justify-content: flex-start;
  }

  .home-board-toolbar {
    gap: 7px;
    align-items: flex-start;
  }

  .home-board-toolbar small {
    flex: 1 0 100%;
  }

  .home-board-refresh {
    width: 100%;
    min-height: 40px;
  }

  .home-delivery-table {
    overflow: visible;
    padding-bottom: 0;
  }

  .home-delivery-head {
    display: none;
  }

  .home-order-board-v3 .home-delivery-row,
  .home-delivery-head {
    min-width: 0;
  }

  .home-order-board-v3 .home-delivery-row {
    grid-template-columns: 1fr;
    gap: 10px;
    align-items: stretch;
    padding: 14px;
    border-radius: 20px;
    min-height: 0;
  }

  .home-order-board-v3 .home-delivery-row .delivery-cell {
    display: grid;
    grid-template-columns: minmax(78px, .34fr) minmax(0, 1fr);
    gap: 8px;
    align-items: center;
  }

  .home-order-board-v3 .home-delivery-row .delivery-id,
  .home-order-board-v3 .home-delivery-row .delivery-proof {
    grid-template-columns: minmax(0, 1fr);
  }

  .home-order-board-v3 .home-delivery-row .delivery-status::before,
  .home-order-board-v3 .home-delivery-row .delivery-eta::before,
  .home-order-board-v3 .home-delivery-row .delivery-driver::before,
  .home-order-board-v3 .home-delivery-row .delivery-proof::before {
    color: #98a2b3;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  .home-order-board-v3 .home-delivery-row .delivery-status::before { content: 'Status'; }
  .home-order-board-v3 .home-delivery-row .delivery-eta::before { content: 'Previsão'; }
  .home-order-board-v3 .home-delivery-row .delivery-driver::before { content: 'Entregador'; }
  .home-order-board-v3 .home-delivery-row .delivery-proof::before { content: 'Prova'; }

  .delivery-id strong,
  .delivery-address span,
  .delivery-eta strong,
  .delivery-driver .driver-mini strong,
  .delivery-driver .driver-mini span {
    white-space: normal;
  }

  .delivery-address span {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .delivery-driver .driver-mini,
  .customer-order-driver .driver-mini,
  .compact-order-meta .driver-mini {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .delivery-driver .driver-avatar,
  .customer-order-driver .driver-avatar,
  .compact-order-meta .driver-avatar {
    width: 38px;
    height: 38px;
  }

  .delivery-proof,
  .customer-order-pod {
    justify-content: flex-start;
  }

  .proof-thumb-card,
  .proof-thumb-card.compact {
    width: 84px;
    height: 62px;
    border-radius: 16px;
  }

  .proof-mini-chip,
  .proof-mini-card {
    min-height: 34px;
  }

  .customer-live-board > .realtime-card {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    z-index: 1200;
    max-height: min(84dvh, 760px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 14px calc(18px + env(safe-area-inset-bottom, 0px));
    border: 0;
    border-radius: 28px 28px 0 0;
    box-shadow: 0 -22px 70px rgba(15, 23, 42, .26);
    transform: translateY(108%);
    opacity: .98;
    pointer-events: none;
    transition: transform .24s ease, opacity .24s ease;
  }

  body.mobile-detail-open .customer-live-board > .realtime-card {
    transform: translateY(0);
    pointer-events: auto;
  }

  .mobile-sheet-handle {
    position: sticky;
    top: -14px;
    z-index: 5;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 10px;
    margin: -14px -14px 12px;
    padding: 10px 12px 8px;
    border-bottom: 1px solid rgba(231, 235, 240, .72);
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(14px);
  }

  .mobile-sheet-handle::before {
    content: '';
    grid-column: 1 / -1;
    justify-self: center;
    width: 44px;
    height: 5px;
    margin-bottom: 5px;
    border-radius: 999px;
    background: #d0d5dd;
  }

  .mobile-sheet-handle strong {
    grid-column: 2;
    color: var(--ink);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .mobile-sheet-handle span {
    grid-column: 1;
  }

  .mobile-sheet-handle button {
    grid-column: 3;
    justify-self: end;
    width: 34px;
    height: 34px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--ink);
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
  }

  .home-live-head {
    grid-template-columns: 1fr;
  }

  .home-live-status-stack {
    align-items: flex-start;
  }

  .home-route-map.customer-route-map svg,
  .customer-route-map.home-route-map svg {
    min-height: 230px;
  }

  .home-live-addresses,
  .route-status-metrics {
    grid-template-columns: 1fr;
  }

  .home-driver-card,
  .driver-detail-card {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .home-driver-card .driver-presence {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .home-live-actions {
    grid-template-columns: 1fr;
  }

  .home-live-actions > button,
  .home-pod-card button,
  .route-map-action-bar button,
  .map-resolution-card .ghost.small {
    width: 100%;
    min-height: 42px;
  }

  .orders-workspace,
  .tracking-workspace,
  .reports-layout,
  .billing-layout,
  .analytics-layout,
  .qa-layout,
  .security-layout,
  .account-grid,
  .help-grid,
  .content-grid,
  .order-layout {
    grid-template-columns: 1fr !important;
  }

  .orders-toolbar,
  .tracking-toolbar,
  .reports-toolbar,
  .billing-toolbar,
  .proofs-toolbar,
  .destinations-toolbar,
  .activity-toolbar,
  .notifications-toolbar {
    grid-template-columns: 1fr !important;
  }

  .customer-order-board-row.rich-delivery-row {
    grid-template-columns: 1fr;
    padding: 14px;
    border-radius: 20px;
  }

  .customer-order-board-row.rich-delivery-row > * {
    width: 100%;
  }

  .sticky-card,
  .order-detail-card {
    position: static !important;
  }

  .live-map-modal,
  .pod-lightbox-modal {
    padding: 0;
    align-items: stretch;
    place-items: stretch;
  }

  .live-map-sheet,
  .pod-lightbox-sheet {
    width: 100vw;
    height: 100dvh;
    max-height: none;
    border-radius: 0;
  }

  .live-map-content,
  .pod-lightbox-content {
    padding: 14px;
  }

  .live-map-header,
  .pod-lightbox-header {
    position: sticky;
    top: 0;
    z-index: 3;
    margin: -14px -14px 14px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: rgba(255,255,255,.96);
    backdrop-filter: blur(14px);
  }

  .live-map-grid {
    grid-template-columns: 1fr;
  }

  .live-map-large svg {
    height: min(58dvh, 430px);
  }

  .pod-lightbox-body {
    min-height: 52dvh;
  }

  .pod-lightbox-actions,
  .pod-lightbox-actions > button {
    width: 100%;
  }

  .batch-workspace,
  .batch-preview-grid,
  .templates-grid,
  .destinations-grid,
  .proofs-list,
  .activity-list,
  .notification-list {
    grid-template-columns: 1fr !important;
  }

  input,
  textarea,
  select {
    font-size: 16px;
  }
}

@media (max-width: 420px) {
  .topbar-actions {
    grid-template-columns: repeat(4, minmax(0, auto));
  }

  .referral-chip {
    grid-column: 1 / -1;
    width: 100%;
  }

  .metric-grid.metrics-4 {
    grid-template-columns: 1fr;
  }

  .home-order-board-v3 .home-delivery-row .delivery-cell {
    grid-template-columns: 1fr;
  }
}

/* Fase 16 — perfis e permissões do cliente */
.permission-hidden {
  display: none !important;
}
.users-layout {
  align-items: flex-start;
}
.users-list {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}
.user-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--border-color, #e5e7eb);
  border-radius: 18px;
  background: #fff;
}
.user-row.inactive {
  opacity: .62;
}
.small-avatar {
  width: 40px;
  height: 40px;
  font-size: .8rem;
}
.user-main {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.user-main strong,
.user-main span,
.user-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.user-main span,
.user-main small {
  color: var(--muted, #667085);
}
.user-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.user-actions select {
  min-width: 150px;
  min-height: 36px;
  border-radius: 12px;
  border: 1px solid var(--border-color, #e5e7eb);
  padding: 0 10px;
  background: #fff;
}
.info-box.compact {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  font-size: .86rem;
}
@media (max-width: 760px) {
  .user-row {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .user-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .user-actions select,
  .user-actions button {
    width: 100%;
  }
}

/* Fase 18 · Home compacta e avatar padrão */
.company-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px 18px;
  padding: 14px 18px;
  margin-bottom: 14px;
  border-radius: 24px;
  min-height: 0;
  background:
    linear-gradient(110deg, rgba(255, 248, 234, .82), rgba(255, 255, 255, .98) 58%),
    #fff;
}

.company-strip .hero-main,
.company-strip-content {
  display: grid;
  grid-template-columns: minmax(230px, .72fr) minmax(250px, 1fr) auto;
  align-items: center;
  gap: 8px 16px;
  min-width: 0;
}

.company-strip-title,
.company-strip-address,
.company-strip-meta {
  min-width: 0;
}

.company-strip .eyebrow {
  margin: 0 0 2px;
  font-size: 10px;
  letter-spacing: .16em;
}

.company-strip h2 {
  margin: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: clamp(21px, 2vw, 30px);
  line-height: 1.08;
}

.company-strip-address {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink-soft);
  font-size: 14px;
}

.company-strip .hero-meta,
.company-strip-meta {
  justify-content: flex-start;
  gap: 7px;
  flex-wrap: wrap;
}

.company-strip .meta-pill {
  padding: 6px 10px;
  max-width: 100%;
  font-size: 12px;
  line-height: 1.15;
  white-space: nowrap;
}

.company-strip-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: max-content;
}

.company-strip .primary,
.company-strip .ghost {
  min-height: 40px;
  border-radius: 14px;
  white-space: nowrap;
}

.company-strip .compact-primary {
  padding: 10px 16px;
  box-shadow: 0 10px 24px rgba(242, 165, 26, .18);
}

.driver-avatar.is-generated {
  background:
    radial-gradient(circle at 34% 26%, rgba(255, 255, 255, .95) 0 18%, transparent 19%),
    linear-gradient(135deg, #fff2cf, #f2a51a 58%, #b87500);
  color: #2d1b00;
  border-color: rgba(242, 165, 26, .45);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.48), 0 7px 16px rgba(242, 165, 26, .15);
}

.driver-avatar.is-unassigned {
  background:
    linear-gradient(135deg, #f8fafc, #eef2f7),
    #f8fafc;
  color: #667085;
  border-color: #e2e8f0;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.7);
}

.driver-avatar.is-unassigned::after {
  content: '';
  position: absolute;
  right: 6px;
  bottom: 6px;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #cbd5e1;
  box-shadow: 0 0 0 2px #fff;
}

.driver-avatar.has-photo::after {
  display: none;
}

@media (max-width: 1380px) {
  .company-strip .hero-main,
  .company-strip-content {
    grid-template-columns: minmax(210px, .78fr) minmax(240px, 1fr);
  }

  .company-strip .hero-meta,
  .company-strip-meta {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1100px) {
  .company-strip {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .company-strip-actions {
    justify-content: flex-start;
    min-width: 0;
  }
}

@media (max-width: 760px) {
  .company-strip {
    padding: 13px;
    gap: 10px;
    border-radius: 20px;
  }

  .company-strip .hero-main,
  .company-strip-content {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .company-strip h2 {
    white-space: normal;
    font-size: 22px;
  }

  .company-strip-address {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
  }

  .company-strip .hero-meta,
  .company-strip-meta {
    display: flex;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 1px;
    scrollbar-width: none;
  }

  .company-strip .hero-meta::-webkit-scrollbar,
  .company-strip-meta::-webkit-scrollbar {
    display: none;
  }

  .company-strip-actions {
    display: grid;
    grid-template-columns: minmax(0, .75fr) minmax(0, 1fr);
  }

  .company-strip .primary,
  .company-strip .ghost {
    width: 100%;
    min-height: 44px;
    padding-inline: 10px;
  }
}

/* Fase 19 · Polimento visual pós-home compacta
   Navegação: a Home só pode forçar grid quando estiver ativa.
   Antes, #homePanel { display: grid; } mantinha a Home visível mesmo após clicar em Lote, Modelos, Meus pedidos etc. */
#homePanel.active {
  display: grid;
  gap: 14px;
}

.view-panel#homePanel:not(.active) {
  display: none;
}

#homePanel .company-strip {
  margin-bottom: 0;
  box-shadow: 0 10px 26px rgba(15, 23, 42, .045);
}

#homePanel .metric-grid {
  gap: 12px;
  margin-bottom: 0;
}

#homePanel .metric-card {
  min-height: 84px;
  padding: 14px 16px;
  border-radius: 22px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .045);
}

#homePanel .metric-card p {
  font-size: 13px;
  line-height: 1.2;
}

#homePanel .metric-card strong {
  font-size: 22px;
  line-height: 1.05;
}

#homePanel .metric-icon {
  width: 46px;
  height: 46px;
  border-radius: 16px;
}

#homePanel .metric-icon svg {
  width: 25px;
  height: 25px;
}

#homePanel .customer-live-board {
  grid-template-columns: minmax(700px, 1.95fr) minmax(300px, .65fr);
  gap: 14px;
  align-items: start;
}

#homePanel .live-orders-card,
#homePanel .realtime-card,
#homePanel .home-proof-panel,
#homePanel .home-actions-card,
#homePanel .home-activity-card {
  border-radius: 22px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .045);
}

#homePanel .live-orders-card,
#homePanel .realtime-card {
  padding: 18px;
}

#homePanel .live-orders-card .card-heading,
#homePanel .card-heading.live-heading {
  margin-bottom: 12px;
}

#homePanel .live-orders-card .card-heading h2,
#homePanel .home-live-head h3 {
  letter-spacing: -.025em;
}

#homePanel .home-board-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: -2px 0 10px;
  padding: 8px 10px;
  border: 1px solid rgba(231, 235, 240, .95);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(248, 250, 252, .94), rgba(255, 255, 255, .98));
}

#homePanel .home-board-toolbar small {
  flex: 1 1 auto;
  min-width: 180px;
  line-height: 1.3;
}

#homePanel .home-board-refresh {
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 11px;
}

#homePanel .home-order-card-list {
  max-height: clamp(430px, calc(100dvh - 385px), 650px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 4px;
  scrollbar-width: thin;
}

#homePanel .home-order-card-list::-webkit-scrollbar,
#homePanel .realtime-card::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

#homePanel .home-order-card-list::-webkit-scrollbar-thumb,
#homePanel .realtime-card::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(148, 163, 184, .45);
}

#homePanel .home-delivery-head {
  padding-inline: 10px;
}

#homePanel .home-order-board-v3 .home-delivery-row {
  padding: 10px 10px;
  border-radius: 16px;
}

#homePanel .home-order-board-v3 .home-delivery-row + .home-delivery-row {
  margin-top: 8px;
}

#homePanel .home-order-board-v3 .home-delivery-row.selected {
  background:
    linear-gradient(90deg, rgba(255, 247, 232, .9), rgba(255, 255, 255, .98) 44%),
    #fff;
}

#homePanel .home-order-board-v3 .home-delivery-row.selected::before {
  content: '';
  position: absolute;
  inset: 10px auto 10px 0;
  width: 4px;
  border-radius: 999px;
  background: var(--brand);
}

#homePanel .home-order-board-v3 .home-delivery-row {
  position: relative;
}

#homePanel .delivery-address span {
  line-height: 1.24;
}

#homePanel .order-status-inline {
  gap: 6px;
}

#homePanel .delivery-status .tracking-item-progress.tiny,
#homePanel .customer-order-status .tracking-item-progress.tiny {
  height: 5px;
}

#homePanel .realtime-card {
  position: sticky;
  top: 14px;
  max-height: calc(100dvh - 108px);
  overflow-y: auto;
  scrollbar-width: thin;
}

#homePanel .home-live-head {
  gap: 10px;
  margin-bottom: 10px;
}

#homePanel .home-live-status-stack {
  align-items: flex-end;
}

#homePanel .home-route-map.customer-route-map,
#homePanel .customer-route-map.home-route-map {
  border-radius: 18px;
}

#homePanel .home-route-map.customer-route-map svg,
#homePanel .customer-route-map.home-route-map svg {
  height: clamp(188px, 22dvh, 245px);
}

#homePanel .route-map-action-bar {
  top: 10px;
  right: 10px;
}

#homePanel .route-map-action-bar button,
#homePanel .route-map-resolve {
  box-shadow: 0 8px 22px rgba(15, 23, 42, .12);
}

#homePanel .map-resolution-card {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 16px;
}

#homePanel .route-status-panel,
#homePanel .home-live-addresses,
#homePanel .route-status-metrics,
#homePanel .home-driver-card,
#homePanel .home-pod-card {
  border-radius: 16px;
}

#homePanel .route-status-panel {
  padding: 14px;
}

#homePanel .route-status-metrics {
  gap: 8px;
}

#homePanel .home-live-addresses {
  gap: 8px;
}

#homePanel .home-live-actions {
  margin-top: 10px;
}

#homePanel .home-proof-panel,
#homePanel .home-actions-card,
#homePanel .home-activity-card {
  padding: 18px;
}

#homePanel .home-proof-list {
  max-height: 196px;
  overflow-y: auto;
  padding-right: 4px;
}

#homePanel .home-proof-tile {
  width: 118px;
  min-height: 76px;
}

#homePanel .home-proof-empty {
  padding: 12px;
}

/* Hotfix · reserva a coluna direita apenas para a entrega selecionada */
#homePanel .customer-live-board > .home-proof-panel,
#homePanel .customer-live-board > .home-actions-card,
#homePanel .customer-live-board > .home-activity-card {
  grid-column: 1;
}

#homePanel .customer-live-board > .realtime-card {
  grid-column: 2;
  grid-row: 1 / span 4;
  z-index: 2;
}

@media (min-width: 1181px) and (max-width: 1540px) {
  #homePanel .customer-live-board {
    grid-template-columns: minmax(620px, 1.78fr) minmax(290px, .72fr);
  }

  #homePanel .home-delivery-head,
  #homePanel .home-order-board-v3 .home-delivery-row {
    grid-template-columns: minmax(88px, .75fr) minmax(120px, 1fr) minmax(136px, 1.12fr) minmax(90px, .72fr) minmax(78px, .62fr) minmax(108px, .86fr) minmax(64px, .48fr);
    gap: 8px;
  }

  #homePanel .delivery-address span,
  #homePanel .delivery-eta strong,
  #homePanel .delivery-driver .driver-mini strong,
  #homePanel .delivery-driver .driver-mini span {
    font-size: 12px;
  }
}

@media (max-width: 1180px) {
  #homePanel {
    gap: 12px;
  }

  #homePanel .customer-live-board {
    grid-template-columns: 1fr;
  }

  #homePanel .home-order-card-list,
  #homePanel .home-proof-list,
  #homePanel .realtime-card {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }

  #homePanel .home-board-toolbar {
    align-items: stretch;
  }

  #homePanel .home-board-toolbar small {
    min-width: 0;
  }
}

@media (max-width: 760px) {
  #homePanel .metric-grid {
    gap: 10px;
  }

  #homePanel .metric-card {
    grid-template-columns: 42px minmax(0, 1fr);
    min-height: 76px;
    padding: 12px;
  }

  #homePanel .metric-icon {
    width: 40px;
    height: 40px;
    border-radius: 14px;
  }

  #homePanel .live-orders-card,
  #homePanel .realtime-card,
  #homePanel .home-proof-panel,
  #homePanel .home-actions-card,
  #homePanel .home-activity-card {
    padding: 14px;
    border-radius: 20px;
  }

  #homePanel .home-board-toolbar {
    display: grid;
    grid-template-columns: 1fr;
  }

  #homePanel .home-board-refresh {
    width: 100%;
    min-height: 40px;
  }

  #homePanel .home-route-map.customer-route-map svg,
  #homePanel .customer-route-map.home-route-map svg {
    height: 232px;
  }
}

/* Fase 20 — piloto assistido real */
.pilot-assist-card {
  margin-top: 18px;
  padding: 22px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .94));
  box-shadow: 0 18px 45px rgba(15, 23, 42, .08);
}

.pilot-assist-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .8fr);
  gap: 18px;
  align-items: start;
  margin-top: 16px;
}

.pilot-assist-grid h4,
.pilot-assist-watchboard h4,
.pilot-assist-card h4 {
  margin: 0 0 10px;
  color: var(--ink);
}

.pilot-assist-milestones,
.pilot-assist-evidence-list {
  display: grid;
  gap: 12px;
}

.pilot-assist-milestone,
.pilot-assist-evidence {
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 18px;
  background: #fff;
  padding: 14px;
}

.pilot-assist-milestone-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.pilot-assist-milestone-head span {
  display: inline-flex;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.pilot-assist-milestone-head h3 {
  margin: 2px 0 0;
  font-size: 16px;
}

.pilot-assist-task-list {
  display: grid;
  gap: 8px;
}

.pilot-assist-task {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 10px;
  border-radius: 14px;
  background: rgba(248, 250, 252, .9);
}

.pilot-assist-task > span,
.pilot-assist-evidence > span {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
  background: rgba(100, 116, 139, .14);
  color: #475569;
}

.pilot-assist-task.ok > span,
.pilot-assist-evidence.ok > span {
  background: rgba(22, 163, 74, .12);
  color: #15803d;
}

.pilot-assist-task.warning > span,
.pilot-assist-evidence.warning > span {
  background: rgba(245, 158, 11, .16);
  color: #b45309;
}

.pilot-assist-task.blocker > span,
.pilot-assist-evidence.blocker > span {
  background: rgba(220, 38, 38, .13);
  color: #b91c1c;
}

.pilot-assist-task.manual > span,
.pilot-assist-evidence.manual > span {
  background: rgba(79, 70, 229, .12);
  color: #4338ca;
}

.pilot-assist-task strong,
.pilot-assist-evidence strong {
  display: block;
  min-width: 0;
  color: var(--ink);
  font-size: 13px;
}

.pilot-assist-task small,
.pilot-assist-evidence small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
  margin-top: 2px;
}

.pilot-assist-task em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.pilot-assist-evidence {
  display: grid;
  gap: 6px;
}

.pilot-assist-watchboard {
  margin-top: 14px;
  display: grid;
  gap: 14px;
}

.pilot-assist-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.pilot-assist-split > div {
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 18px;
  background: #fff;
  padding: 14px;
}

.pilot-assist-split ul,
.pilot-assist-watchboard ol {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 980px) {
  .pilot-assist-grid,
  .pilot-assist-split {
    grid-template-columns: 1fr;
  }

  .pilot-assist-task {
    grid-template-columns: 1fr;
  }

  .pilot-assist-task > span {
    justify-content: flex-start;
    width: max-content;
  }
}

/* Fase 21 · avatar por iniciais e fallback visual consistente */
.driver-avatar > span:not(.driver-avatar-fallback) {
  position: relative;
  z-index: 1;
  line-height: 1;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.driver-avatar.is-unassigned {
  letter-spacing: -.02em;
}

.driver-avatar.is-unassigned span {
  color: #475467;
}

.driver-mini-placeholder .driver-avatar {
  background:
    radial-gradient(circle at 34% 26%, rgba(255,255,255,.95) 0 18%, transparent 19%),
    linear-gradient(135deg, #f8fafc, #e2e8f0);
}

/* Fase 21 · avatar padrão robusto para entregadores */
.driver-avatar {
  isolation: isolate;
  text-transform: uppercase;
  letter-spacing: .01em;
  line-height: 1;
}

.driver-avatar::before {
  content: attr(data-initials);
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: inherit;
  font: inherit;
  font-weight: 950;
  z-index: 1;
  pointer-events: none;
}

.driver-avatar.has-photo::before {
  opacity: 0;
}

.driver-avatar .driver-avatar-text,
.driver-avatar .driver-avatar-fallback {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: inherit;
  font: inherit;
  font-weight: 950;
  z-index: 1;
  pointer-events: none;
}

.driver-avatar[data-initials='']::before,
.driver-avatar:not([data-initials])::before {
  content: 'XM';
}

.driver-avatar.has-photo .driver-avatar-text,
.driver-avatar.has-photo .driver-avatar-fallback {
  opacity: 0;
}

.driver-avatar.has-photo img {
  position: relative;
  z-index: 3;
}

.driver-avatar[data-avatar-error='1'] .driver-avatar-text,
.driver-avatar[data-avatar-error='1'] .driver-avatar-fallback,
.driver-avatar:not(.has-photo) .driver-avatar-text,
.driver-avatar:not(.has-photo) .driver-avatar-fallback {
  opacity: 1;
}

.driver-mini-placeholder .driver-avatar::before,
.driver-mini-placeholder .driver-avatar .driver-avatar-text {
  content: 'AD';
  color: #475467;
}

.delivery-driver .driver-avatar.small,
.customer-order-driver .driver-avatar.small,
.compact-order-meta .driver-avatar.small {
  font-size: 11px;
}


/* Fase 21 · Ajustes pós-piloto e fallback legível de avatar */
.pilot-feedback-card {
  display: grid;
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: linear-gradient(180deg, #ffffff, #fffaf0);
  box-shadow: var(--shadow-soft);
}

.pilot-feedback-form {
  display: grid;
  gap: 12px;
}

.pilot-feedback-hint {
  align-self: end;
  min-height: 46px;
  display: flex;
  align-items: center;
  padding: 10px 12px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px dashed #d8dee8;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.pilot-feedback-recent {
  display: grid;
  gap: 10px;
}

.pilot-feedback-ticket {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid #e6eaf0;
  background: #fff;
}

.pilot-feedback-ticket strong,
.pilot-feedback-ticket span,
.pilot-feedback-ticket small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pilot-feedback-ticket span,
.pilot-feedback-ticket small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.inline-result {
  display: inline-grid;
  gap: 2px;
  padding: 9px 12px;
  border-radius: 14px;
  background: #ecfdf3;
  color: #027a48;
  font-size: 12px;
  font-weight: 850;
}

.inline-result span,
.inline-result small {
  color: inherit;
  font-weight: 750;
}

/* Fase 22 — comunicação externa controlada */
.notification-external-card {
  border: 1px solid var(--border);
  border-radius: 22px;
  padding: 18px;
  background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.06);
  margin: 16px 0;
}

.external-channel-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.external-channel-toggle {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 12px;
  background: #fff;
  cursor: pointer;
  min-width: 0;
}

.external-channel-toggle input {
  margin-top: 3px;
  accent-color: var(--brand);
}

.external-channel-toggle span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.external-channel-toggle strong {
  color: var(--text);
  font-size: 0.9rem;
}

.external-channel-toggle small {
  color: var(--muted);
  line-height: 1.35;
}

.external-channel-toggle.is-planned {
  background: #fbfcff;
}

@media (max-width: 900px) {
  .external-channel-grid {
    grid-template-columns: 1fr;
  }
}

/* Fase 23 — API controlada / integrações */
.integrations-layout {
  align-items: flex-start;
}

.integration-scope-list {
  display: grid;
  gap: 8px;
  margin: 10px 0 14px;
}

.integration-scope-list .checkbox-line {
  align-items: center;
  border: 1px solid var(--border-soft, #e5eaf2);
  border-radius: 14px;
  display: flex;
  gap: 8px;
  padding: 9px 10px;
}

.integration-keys-list,
.integration-logs-list,
.integration-endpoints-list,
.integration-examples-list {
  display: grid;
  gap: 10px;
}

.integration-key-row,
.integration-log-row,
.integration-endpoint-row,
.integration-example-row {
  border: 1px solid var(--border-soft, #e5eaf2);
  border-radius: 16px;
  background: #fff;
  padding: 12px;
}

.integration-key-row {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  gap: 14px;
}

.integration-key-row.inactive {
  opacity: .68;
}

.integration-key-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.integration-key-main span,
.integration-key-main small {
  color: var(--text-muted, #667085);
}

.integration-key-main code,
.integration-endpoint-row code,
.secret-code {
  background: #f6f8fb;
  border: 1px solid #e7edf5;
  border-radius: 9px;
  color: #1f2937;
  display: inline-block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .86rem;
  max-width: 100%;
  overflow-wrap: anywhere;
  padding: 3px 6px;
}

.integration-key-actions {
  align-items: flex-end;
  display: grid;
  gap: 8px;
  justify-items: end;
  white-space: nowrap;
}

.integration-endpoint-row {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: auto minmax(0, 1fr);
}

.integration-endpoint-row small {
  grid-column: 1 / -1;
  color: var(--text-muted, #667085);
}

.integration-example-row pre {
  background: #0f172a;
  border-radius: 14px;
  color: #e5edf7;
  margin: 8px 0 0;
  max-height: 220px;
  overflow: auto;
  padding: 12px;
  white-space: pre-wrap;
  word-break: break-word;
}

.integration-logs-card,
.integration-docs-card {
  margin-top: 16px;
}

.integration-log-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.integration-log-row div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.integration-log-row small {
  color: var(--text-muted, #667085);
}

@media (max-width: 760px) {
  .integration-key-row,
  .integration-log-row {
    display: grid;
  }
  .integration-key-actions {
    align-items: stretch;
    justify-items: stretch;
  }
}

.integration-log-row {
  align-items: center;
  border: 1px solid var(--border-soft, #e5eaf2);
  border-radius: 14px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
}

.integration-log-row small {
  color: var(--text-muted, #667085);
  display: block;
}

.integration-logs-card {
  margin-top: 16px;
}

/* Fase 25 — hardening/diagnóstico de runtime do Portal do Cliente */
.runtime-diagnostics-panel {
  margin-top: 20px;
  border-top: 1px solid var(--line);
  padding-top: 18px;
}
.runtime-diagnostics-heading {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
}
.runtime-actions-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.runtime-events-list {
  display: grid;
  gap: 10px;
}
.runtime-event {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 13px;
  background: #fff;
}
.runtime-event.error { border-color: #fecdd3; background: #fffafb; }
.runtime-event.warning { border-color: #fde68a; background: #fffdf4; }
.runtime-event.success { border-color: #b7efc7; background: #fbfffc; }
.runtime-event strong,
.runtime-event span,
.runtime-event small { display: block; }
.runtime-event span {
  color: var(--muted);
  font-size: 13px;
  margin-top: 3px;
}
.runtime-event small {
  color: var(--muted);
  margin-top: 5px;
  max-width: 280px;
  overflow-wrap: anywhere;
  text-align: right;
}
@media (max-width: 720px) {
  .runtime-diagnostics-heading { display: grid; }
  .runtime-actions-inline { justify-content: stretch; }
  .runtime-actions-inline .small { flex: 1 1 130px; }
  .runtime-event { grid-template-columns: 1fr; }
  .runtime-event small { max-width: none; text-align: left; }
}

/* Fase 27 — e-mail real controlado */
.external-email-control {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 10px 14px;
  align-items: end;
  margin: 12px 0 14px;
  padding: 12px;
  border: 1px solid rgba(37, 99, 235, 0.14);
  border-radius: 16px;
  background: #f8fbff;
}

.external-email-field {
  margin: 0;
}

.external-email-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.external-email-status {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 750;
  line-height: 1.4;
}

@media (max-width: 720px) {
  .external-email-control {
    grid-template-columns: 1fr;
  }

  .external-email-actions {
    justify-content: stretch;
  }

  .external-email-actions .small {
    flex: 1 1 140px;
  }
}

/* Fase 27 — histórico de e-mail controlado */
.external-email-outbox {
  display: grid;
  gap: 8px;
  grid-column: 1 / -1;
}
.external-email-outbox-empty,
.external-email-outbox-item {
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 14px;
  background: #fff;
  padding: 9px 11px;
  font-size: .82rem;
}
.external-email-outbox-empty {
  color: var(--muted);
  font-weight: 750;
}
.external-email-outbox-item {
  display: grid;
  gap: 2px;
}
.external-email-outbox-item strong {
  color: var(--text);
  font-size: .86rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.external-email-outbox-item span,
.external-email-outbox-item small {
  color: var(--muted);
  font-size: .76rem;
  font-weight: 750;
  overflow-wrap: anywhere;
}
.external-email-outbox-item.sent {
  border-color: rgba(22, 163, 74, .24);
  background: var(--success-soft);
}
.external-email-outbox-item.failed {
  border-color: rgba(220, 38, 38, .20);
  background: #fff5f5;
}

/* Fase 29 — hardening de produção */
.production-hardening-panel {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.98));
  box-shadow: 0 14px 32px rgba(15, 23, 42, 0.06);
}

.production-hardening-heading {
  align-items: flex-start;
  gap: 12px;
}

.production-hardening-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.production-hardening-metrics article {
  min-width: 0;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #fff;
}

.production-hardening-metrics span {
  display: block;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.production-hardening-metrics strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 0.98rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.production-hardening-checks {
  display: grid;
  gap: 8px;
}

.production-hardening-check {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: #fff;
}

.production-hardening-check.warning,
.production-hardening-check.attention {
  border-color: rgba(245, 158, 11, 0.28);
  background: rgba(255, 251, 235, 0.86);
}

.production-hardening-check.blocked {
  border-color: rgba(239, 68, 68, 0.25);
  background: rgba(254, 242, 242, 0.88);
}

.production-hardening-check > div {
  min-width: 0;
}

.production-hardening-check strong,
.production-hardening-check span {
  display: block;
  min-width: 0;
}

.production-hardening-check strong {
  color: var(--ink);
  font-size: 0.92rem;
}

.production-hardening-check div > span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.production-hardening-recommendations {
  margin-top: 12px;
  padding: 12px;
  border-radius: 16px;
  background: rgba(15, 23, 42, 0.04);
}

.production-hardening-recommendations h4 {
  margin: 0 0 8px;
  font-size: 0.9rem;
}

.production-hardening-recommendations ul {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  font-size: 0.86rem;
}

@media (max-width: 980px) {
  .production-hardening-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .production-hardening-panel {
    padding: 12px;
    border-radius: 16px;
  }

  .production-hardening-metrics {
    grid-template-columns: 1fr;
  }

  .production-hardening-check {
    align-items: flex-start;
    flex-direction: column;
  }
}

.production-maintenance-result {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.03);
  display: grid;
  gap: 3px;
}
.production-maintenance-result strong {
  font-size: 0.84rem;
  color: var(--text-strong, #0f172a);
}
.production-maintenance-result span {
  font-size: 0.78rem;
  color: var(--text-muted, #64748b);
}
.production-hardening-check.critical {
  border-color: rgba(239, 68, 68, 0.25);
  background: rgba(254, 242, 242, 0.88);
}
.production-hardening-check p {
  margin: 0;
  flex: 1 1 auto;
  min-width: 160px;
  color: var(--text-muted, #64748b);
  font-size: 0.82rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.production-hardening-check small {
  display: block;
  max-width: 260px;
  color: var(--muted);
  font-size: 0.75rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.production-hardening-footer {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(240px, 0.75fr);
  gap: 12px;
  margin-top: 12px;
}
.production-hardening-footer > div {
  min-width: 0;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: rgba(255, 255, 255, 0.9);
}
.production-hardening-footer h4 {
  margin: 0 0 8px;
  font-size: 0.86rem;
  color: var(--ink);
}
.production-hardening-maintenance {
  display: grid;
  gap: 6px;
  color: var(--text-muted, #64748b);
  font-size: 0.82rem;
}
.production-hardening-maintenance small {
  display: block;
  padding-left: 10px;
  border-left: 2px solid rgba(15, 23, 42, 0.12);
}
.production-hardening-badge {
  display: inline-flex;
  align-items: center;
  margin-right: 8px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.production-hardening-badge.ok {
  background: var(--success-soft);
  color: var(--success);
}
.production-hardening-badge.warning {
  background: #fff7ed;
  color: #b45309;
}
.production-hardening-badge.critical {
  background: #fef2f2;
  color: #b91c1c;
}
@media (max-width: 760px) {
  .production-hardening-footer {
    grid-template-columns: 1fr;
  }
  .production-hardening-check small {
    max-width: none;
  }
}

/* Fase 30 — fechamento final de produção */
.production-final-panel {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(30, 64, 175, .12);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(239, 246, 255, .82), rgba(255, 255, 255, .98));
  box-shadow: 0 16px 34px rgba(15, 23, 42, .06);
}
.production-final-evidence,
.production-final-plan {
  display: grid;
  gap: 8px;
}
.production-final-evidence article {
  padding: 10px 12px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 14px;
  background: #fff;
}
.production-final-evidence span {
  display: block;
  color: var(--muted);
  font-size: .74rem;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.production-final-evidence strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: .95rem;
  overflow-wrap: anywhere;
}
.production-final-plan-grid {
  display: grid;
  gap: 10px;
}
.production-final-plan-grid > div {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 14px;
  background: rgba(255, 255, 255, .92);
}
.production-final-plan-grid h4 {
  margin: 0 0 6px;
  color: var(--ink);
  font-size: .84rem;
}
.production-final-plan-grid p,
.production-final-plan-grid small {
  display: block;
  margin: 0 0 5px;
  color: var(--muted);
  font-size: .78rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.production-final-plan-grid .tiny {
  width: 100%;
  min-height: 32px;
  justify-content: center;
  font-size: .74rem;
}
@media (max-width: 760px) {
  .production-final-panel {
    padding: 12px;
    border-radius: 16px;
  }
}


/* Atalho contextual de atendimento: reforça que suporte é uma fila humana vinculada a pedido. */
.quick-support-button {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 80;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 999px;
  padding: 10px 14px 10px 10px;
  background: linear-gradient(135deg, #172033, #26334e);
  color: #fff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .22);
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.quick-support-button:hover,
.quick-support-button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 22px 50px rgba(15, 23, 42, .28);
  outline: none;
}

.quick-support-icon {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .14);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.quick-support-icon svg {
  width: 21px;
  height: 21px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.quick-support-copy {
  display: grid;
  text-align: left;
  line-height: 1.1;
}

.quick-support-copy strong {
  font-size: .9rem;
}

.quick-support-copy small {
  color: rgba(255, 255, 255, .72);
  font-size: .72rem;
  margin-top: 2px;
}

body:not(.authenticated) .quick-support-button,
.quick-support-button.permission-hidden {
  display: none !important;
}

@media (max-width: 720px) {
  .quick-support-button {
    right: 14px;
    bottom: 14px;
    padding: 10px;
  }

  .quick-support-copy {
    display: none;
  }
}


/* Fase 4 — atendimento: respostas rápidas e fila menos ruidosa */
.support-reply-templates {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0 8px;
}
.support-reply-templates .tiny {
  padding: 5px 8px;
  font-size: .76rem;
  border-radius: 999px;
}
.support-ticket-card.is-customer-reply {
  border-color: rgba(220, 53, 69, .32);
  box-shadow: 0 18px 42px rgba(220, 53, 69, .10);
}


.detail-routing-chip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 7px 0 3px;
}
.detail-routing-chip .routing-scope-pill {
  white-space: normal;
}

.routing-scope-card {
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 18px;
  padding: 16px;
  margin: 14px 0;
  background: linear-gradient(135deg, rgba(248, 250, 252, 0.96), rgba(255, 255, 255, 0.92));
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
}

.routing-scope-card.customer {
  border-color: rgba(22, 163, 74, 0.22);
}

.routing-scope-card.xmoto {
  border-color: rgba(37, 99, 235, 0.20);
}

.routing-scope-main {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.routing-scope-main strong {
  display: block;
  font-size: 0.98rem;
  color: var(--text, #0f172a);
}

.routing-scope-main p,
.routing-scope-actions small {
  margin: 4px 0 0;
  color: var(--muted, #64748b);
  line-height: 1.45;
}

.routing-scope-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 0.78rem;
  font-weight: 700;
  background: rgba(37, 99, 235, 0.10);
  color: #1d4ed8;
}

.routing-scope-card.customer .routing-scope-badge {
  background: rgba(22, 163, 74, 0.12);
  color: #15803d;
}

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

.routing-scope-grid > div {
  min-width: 0;
  border-radius: 14px;
  padding: 10px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(15, 23, 42, 0.08);
}

.routing-scope-grid span,
.routing-scope-grid small {
  display: block;
  color: var(--muted, #64748b);
  font-size: 0.76rem;
}

.routing-scope-grid strong {
  display: block;
  margin-top: 3px;
  color: var(--text, #0f172a);
  font-size: 0.88rem;
  overflow-wrap: anywhere;
}

.routing-scope-actions {
  margin-top: 12px;
}

.routing-scope-transfer-button {
  justify-content: center;
}

@media (max-width: 760px) {
  .routing-scope-main {
    flex-direction: column;
  }

  .routing-scope-grid {
    grid-template-columns: 1fr;
  }
}

/* Fase 8 — Minha frota do cliente */
.fleet-dashboard {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.72fr);
  gap: 18px;
  align-items: start;
}

.fleet-summary-card,
.fleet-vehicle-card,
.fleet-agent-card,
.fleet-guide-card {
  min-width: 0;
}

.fleet-summary-card {
  grid-column: 1 / -1;
}

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

.fleet-summary-item {
  border: 1px solid rgba(15, 23, 42, 0.09);
  border-radius: 16px;
  padding: 13px;
  background: rgba(255, 255, 255, 0.72);
}

.fleet-summary-item span,
.fleet-row-main small,
.fleet-empty-inline {
  display: block;
  color: var(--muted, #64748b);
  font-size: 0.78rem;
}

.fleet-summary-item strong {
  display: block;
  margin-top: 4px;
  color: var(--text, #0f172a);
  font-size: 1.38rem;
}

.fleet-notices {
  display: grid;
  gap: 8px;
  margin: 10px 0 14px;
}

.fleet-notice {
  border-radius: 14px;
  padding: 10px 12px;
  border: 1px solid rgba(15, 23, 42, 0.09);
  background: rgba(248, 250, 252, 0.92);
  color: var(--text, #0f172a);
  font-size: 0.86rem;
}

.fleet-notice.warning {
  border-color: rgba(245, 158, 11, 0.35);
  background: rgba(255, 251, 235, 0.92);
}

.fleet-notice.success {
  border-color: rgba(22, 163, 74, 0.28);
  background: rgba(240, 253, 244, 0.9);
}

.fleet-notice.info {
  border-color: rgba(37, 99, 235, 0.22);
  background: rgba(239, 246, 255, 0.9);
}

.fleet-actions-row,
.fleet-form-actions,
.fleet-row-actions,
.fleet-agent-switches {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.fleet-form {
  display: grid;
  gap: 14px;
  margin-top: 12px;
}

.fleet-checkbox {
  align-items: flex-start;
  gap: 8px;
}

.fleet-check-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 6px;
}

.fleet-check-option {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  border: 1px solid rgba(15, 23, 42, 0.09);
  border-radius: 14px;
  padding: 10px;
  background: rgba(248, 250, 252, 0.74);
  cursor: pointer;
}

.fleet-check-option strong {
  display: block;
  color: var(--text, #0f172a);
  font-size: 0.88rem;
}

.fleet-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.fleet-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 18px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
}

.fleet-row.is-inactive {
  opacity: 0.68;
  background: rgba(248, 250, 252, 0.68);
}

.fleet-row-main strong {
  display: block;
  color: var(--text, #0f172a);
  overflow-wrap: anywhere;
}

.fleet-row-status {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.fleet-loading {
  border-radius: 16px;
  padding: 18px;
  color: var(--muted, #64748b);
  background: rgba(248, 250, 252, 0.9);
  border: 1px dashed rgba(15, 23, 42, 0.12);
}

.fleet-guide-card .steps-list {
  margin-top: 10px;
}

@media (max-width: 1020px) {
  .fleet-dashboard {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 680px) {
  .fleet-summary-grid,
  .fleet-check-list {
    grid-template-columns: 1fr;
  }

  .fleet-row {
    grid-template-columns: 1fr;
  }

  .fleet-row-status,
  .fleet-row-actions {
    justify-content: flex-start;
  }
}

/* Fase 16 — responsabilidade visível nas listas do Portal */
.routing-scope-pill {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin-top: 6px;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid rgba(37, 99, 235, .18);
  background: rgba(37, 99, 235, .08);
  color: #1d4ed8;
  font-size: .72rem;
  font-weight: 850;
  line-height: 1.1;
  white-space: nowrap;
}
.routing-scope-pill > span {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: .85;
  flex: 0 0 auto;
}
.routing-scope-pill.customer {
  border-color: rgba(22, 163, 74, .22);
  background: rgba(22, 163, 74, .10);
  color: #15803d;
}
.routing-scope-pill.compact {
  font-size: .68rem;
  padding: 3px 8px;
}

.routing-scope-pill b {
  display: inline-block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font: inherit;
}
.routing-scope-pill.with-action {
  gap: 7px;
  flex-wrap: wrap;
  white-space: normal;
  justify-content: flex-start;
}
.routing-scope-pill-action {
  border: 0;
  border-radius: 999px;
  padding: 3px 7px;
  background: rgba(255, 255, 255, .72);
  color: inherit;
  font-size: .68rem;
  font-weight: 900;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .08);
}
.routing-scope-pill-action:hover,
.routing-scope-pill-action:focus-visible {
  background: #fff;
  box-shadow: inset 0 0 0 1px currentColor;
  outline: none;
}
.detail-routing-chip .routing-scope-pill {
  margin-top: 6px;
}
.customer-order-id .routing-scope-pill.with-action {
  max-width: 100%;
}
.routing-scope-card.compact {
  margin: 12px 0;
  padding: 13px;
  border-radius: 16px;
}
.routing-scope-card.compact .routing-scope-main {
  margin-bottom: 8px;
}
.routing-scope-card.compact .routing-scope-main p {
  font-size: .84rem;
}
.routing-scope-card.compact .routing-scope-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.routing-scope-card.compact .routing-scope-grid > div {
  padding: 8px;
  border-radius: 12px;
}
.routing-scope-card.compact .routing-scope-actions {
  margin-top: 10px;
}
.customer-order-id .routing-scope-pill,
.delivery-id .routing-scope-pill,
.order-cell .routing-scope-pill,
.tracking-item-main .routing-scope-pill {
  vertical-align: middle;
}
.tracking-item-main .routing-scope-pill {
  margin-top: 7px;
}
@media (max-width: 760px) {
  .routing-scope-pill {
    white-space: normal;
  }
  .routing-scope-card.compact .routing-scope-grid {
    grid-template-columns: 1fr;
  }
}

/* Fase 16b — reforço visual da responsabilidade para o cliente */
.home-live-head .routing-scope-pill {
  margin-top: 7px;
}
.customer-order-board-head span:first-child,
.home-delivery-head span:first-child {
  min-width: 0;
}
.order-row .routing-scope-pill,
.customer-order-board-row .routing-scope-pill,
.home-delivery-row .routing-scope-pill {
  max-width: 100%;
}

/* Fase 16d — ação clara, compacta e legível para trocar quem executa */
.routing-scope-transfer-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  margin: 10px 0 12px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(37, 99, 235, .16);
  background: linear-gradient(135deg, rgba(37, 99, 235, .08), rgba(255, 255, 255, .92));
  box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
}
.routing-scope-transfer-panel.customer {
  border-color: rgba(22, 163, 74, .20);
  background: linear-gradient(135deg, rgba(22, 163, 74, .08), rgba(255, 255, 255, .92));
}
.routing-scope-transfer-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.routing-scope-transfer-panel strong {
  color: var(--text, #0f172a);
  font-size: .94rem;
  line-height: 1.2;
}
.routing-scope-transfer-panel small,
.routing-scope-transfer-note {
  color: var(--muted, #64748b);
  font-size: .8rem;
  line-height: 1.28;
}
.routing-scope-transfer-panel .routing-scope-badge {
  width: fit-content;
  padding: 4px 8px;
  font-size: .68rem;
}
.routing-scope-transfer-action {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
}
.routing-scope-transfer-panel .routing-scope-transfer-button {
  width: auto;
  max-width: 100%;
  min-height: 40px;
  padding: 9px 13px;
  border-radius: 14px;
  white-space: normal;
  line-height: 1.15;
  box-shadow: 0 10px 24px rgba(245, 158, 11, .18);
}
.routing-scope-transfer-panel .routing-scope-transfer-note {
  display: block;
  width: 100%;
}
@media (max-width: 720px) {
  .toast {
    right: 14px;
    left: 14px;
    bottom: 86px;
    max-width: none;
  }
  .routing-scope-transfer-action,
  .routing-scope-transfer-panel .routing-scope-transfer-button {
    width: 100%;
    justify-content: center;
  }
}

/* Fase 16e — mensagens públicas de transferência mais legíveis */
.toast {
  line-height: 1.35;
}


/* Fase Home compacta 1 · topo operacional e empresa no seletor */
.topbar-compact {
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
}

.topbar-identity {
  min-width: 260px;
  max-width: min(680px, 48vw);
}

.topbar-identity .eyebrow {
  margin-bottom: 4px;
}

.topbar-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.company-switcher {
  position: relative;
  min-width: 0;
}

.company-switcher summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  border: 0;
  border-radius: 16px;
  padding: 0;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
}

.company-switcher summary::-webkit-details-marker {
  display: none;
}

.topbar-greeting {
  display: block;
  min-width: 0;
  max-width: min(520px, 42vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: clamp(28px, 3vw, 42px);
  line-height: 1.04;
  font-weight: 850;
  letter-spacing: -.045em;
}

.company-switcher-chevron {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: var(--muted);
  background: rgba(255, 255, 255, .78);
  font-size: 16px;
  line-height: 1;
  transform: translateY(1px);
  transition: transform .16s ease, background .16s ease;
}

.company-switcher[open] .company-switcher-chevron {
  transform: translateY(1px) rotate(180deg);
  background: var(--brand-soft);
  color: var(--brand-dark);
}

.topbar-current-view {
  flex: 0 0 auto;
  margin: 0;
  padding: 6px 10px;
  border: 1px solid rgba(242, 165, 26, .28);
  border-radius: 999px;
  background: rgba(255, 246, 227, .82);
  color: var(--brand-dark);
  font-size: 12px;
  line-height: 1;
  font-weight: 850;
  letter-spacing: .02em;
}

.topbar-compact .page-subtitle {
  margin-top: 6px;
  max-width: 620px;
  font-size: 15px;
  line-height: 1.35;
}

.company-menu-panel {
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  z-index: 760;
  width: min(430px, calc(100vw - 32px));
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 24px 56px rgba(15, 23, 42, .16);
  backdrop-filter: blur(16px);
}

.company-menu-panel strong {
  display: block;
  margin-bottom: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  letter-spacing: -.025em;
}

.company-menu-details {
  display: grid;
  gap: 10px;
  margin: 0;
}

.company-menu-details div {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 8px 0;
  border-top: 1px solid rgba(231, 235, 240, .82);
}

.company-menu-details dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.company-menu-details dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.35;
  font-weight: 650;
}

.company-menu-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.topbar-compact .referral-chip {
  min-height: 44px;
  padding-inline: 18px;
  background: #fff;
}

#homePanel.active {
  gap: 12px;
}

body[data-current-view="home"] .topbar-compact {
  margin-bottom: 10px;
}

body[data-current-view="home"] .topbar-compact .page-subtitle {
  color: var(--ink-soft);
}

@media (max-width: 1180px) {
  .topbar-identity {
    max-width: 100%;
  }

  .topbar-greeting {
    max-width: calc(100vw - 310px);
    font-size: clamp(24px, 4vw, 34px);
  }

  .topbar-title-row {
    flex-wrap: wrap;
  }
}

@media (max-width: 760px) {
  .topbar-compact {
    align-items: flex-start;
  }

  .topbar-title-row {
    gap: 8px;
  }

  .topbar-greeting {
    max-width: calc(100vw - 122px);
    font-size: 24px;
  }

  .topbar-current-view {
    display: none;
  }

  .company-menu-panel {
    width: min(380px, calc(100vw - 24px));
    top: calc(100% + 8px);
  }

  .company-menu-details div {
    grid-template-columns: 1fr;
    gap: 2px;
  }

  .topbar-compact .referral-chip {
    padding-inline: 12px;
  }
}

/* Fase Home compacta 2 · sidebar enxuta como navegação operacional */
@media (min-width: 761px) {
  .app-shell {
    grid-template-columns: 252px minmax(0, 1fr);
  }

  .sidebar {
    gap: 10px;
    padding: 16px 10px 14px;
    background: rgba(255, 255, 255, .9);
  }

  .sidebar-brand-compact,
  .sidebar-hero {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border: 0;
    border-radius: 0;
    padding: 2px 10px 0;
    background: transparent;
    box-shadow: none;
  }

  .sidebar-hero-logo {
    width: 128px;
    margin: 0;
  }

  .sidebar-hero .eyebrow,
  .sidebar-hero-text {
    display: none !important;
  }

  .sidebar-primary-action,
  .new-order-button {
    min-height: 42px;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 13px;
    font-size: 14px;
    box-shadow: 0 9px 18px rgba(242, 165, 26, .20);
  }

  .new-order-button .nav-icon {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
  }

  .sidebar-menu-scroll {
    gap: 10px;
    padding: 0 3px 8px 0;
  }

  .nav-section {
    gap: 6px;
  }

  .nav-section-title {
    margin: 2px 8px 0;
    font-size: 10px;
    letter-spacing: .12em;
  }

  .nav-list {
    gap: 2px;
  }

  .nav-item {
    min-height: 38px;
    gap: 10px;
    border-radius: 12px;
    padding: 8px 9px;
    font-size: 14px;
  }

  .nav-item.active {
    background: linear-gradient(180deg, #fff8e8 0%, #fffdf8 100%);
    box-shadow: inset 3px 0 0 var(--brand), 0 5px 12px rgba(242, 165, 26, .07);
  }

  .nav-item .nav-icon {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
  }

  .sidebar-bottom-compact,
  .sidebar-bottom {
    gap: 8px;
    padding-top: 8px;
    background: transparent;
  }

  .sidebar-company-compact,
  .company-mini {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 8px;
    border-radius: 14px;
    padding: 8px;
    background: rgba(255, 255, 255, .9);
    box-shadow: none;
  }

  .sidebar-company-compact .avatar,
  .company-mini .avatar {
    width: 34px;
    height: 34px;
    font-size: 12px;
  }

  .company-mini strong {
    font-size: 13px;
    line-height: 1.15;
  }

  .company-mini span {
    margin-top: 1px;
    font-size: 11px;
    line-height: 1.15;
  }

  .sidebar-logout-button,
  .sidebar-bottom .ghost.full {
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 12px;
    font-size: 13px;
  }

  .main-area {
    padding-left: clamp(16px, 2.4vw, 32px);
    padding-right: clamp(16px, 2.4vw, 32px);
  }
}

@media (min-width: 761px) and (max-width: 1180px) {
  .app-shell {
    grid-template-columns: 232px minmax(0, 1fr);
  }

  .sidebar-hero-logo {
    width: 116px;
  }

  .nav-item {
    font-size: 13px;
  }
}

/* Home compacta fase 3 — indicadores menores e mais operacionais */
.metrics-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.home-metrics {
  gap: 10px;
  margin-bottom: 14px;
}
.home-metric-card {
  min-height: 72px;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 10px;
  padding: 12px 14px;
  border-radius: 18px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}
.home-metric-card .metric-icon {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  font-size: 16px;
}
.home-metric-card .metric-icon svg {
  width: 18px;
  height: 18px;
}
.home-metric-card p {
  margin: 0 0 1px;
  font-size: 12px;
  line-height: 1.2;
}
.home-metric-card strong {
  font-size: 22px;
  line-height: 1.1;
}
@media (max-width: 1320px) {
  .metrics-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 920px) {
  .metrics-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .metrics-5 { grid-template-columns: 1fr; }
  .home-metric-card {
    min-height: 64px;
    padding: 11px 12px;
  }
}


/* Home compacta fase 4 — lista de pedidos mais alta, densa e central */
#homePanel .home-metrics {
  margin-bottom: 10px;
}

#homePanel .customer-live-board {
  grid-template-columns: minmax(760px, 2.08fr) minmax(292px, .62fr);
  gap: 12px;
}

#homePanel .live-orders-card {
  padding: 14px;
}

#homePanel .card-heading.home-orders-heading,
#homePanel .live-orders-card .home-orders-heading {
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

#homePanel .home-orders-title {
  display: flex;
  align-items: center;
  min-width: 0;
}

#homePanel .home-orders-title h2 {
  margin: 0;
  font-size: clamp(18px, 1.45vw, 21px);
  line-height: 1.08;
}

#homePanel .home-orders-actions {
  gap: 8px;
}

#homePanel .home-orders-actions .ghost.small,
#homePanel .home-orders-actions .link-button {
  min-height: 30px;
  padding: 6px 10px;
  font-size: 12px;
}

#homePanel .home-order-board-v4 {
  gap: 7px;
}

#homePanel .home-order-board-v4 .home-board-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 7px;
  margin: 0 0 7px;
  padding: 7px;
  border-radius: 14px;
}

#homePanel .home-board-summary-chips,
#homePanel .home-board-tools,
#homePanel .home-board-filters {
  display: flex;
  align-items: center;
  min-width: 0;
}

#homePanel .home-board-summary-chips {
  flex-wrap: wrap;
  gap: 6px;
}

#homePanel .home-board-summary-chips span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 25px;
  padding: 4px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}

#homePanel .home-board-summary-chips strong {
  color: var(--ink);
  font-size: 12px;
}

#homePanel .home-board-tools {
  gap: 7px;
}

#homePanel .home-board-filters {
  flex: 1 1 auto;
  flex-wrap: wrap;
  gap: 5px;
}

#homePanel .home-board-filter {
  min-height: 28px;
  padding: 5px 8px;
  border: 1px solid rgba(226, 232, 240, .95);
  border-radius: 999px;
  background: rgba(255, 255, 255, .92);
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, color .16s ease, background .16s ease;
}

#homePanel .home-board-filter strong {
  margin-left: 3px;
  color: var(--ink);
}

#homePanel .home-board-filter.active {
  border-color: rgba(242, 165, 26, .48);
  background: var(--brand-soft);
  color: var(--brand-dark);
  box-shadow: 0 6px 14px rgba(242, 165, 26, .10);
}

#homePanel .home-board-search {
  flex: 0 1 280px;
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 220px;
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
}

#homePanel .home-board-search .nav-icon {
  width: 16px;
  height: 16px;
  color: var(--muted);
}

#homePanel .home-board-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 700;
}

#homePanel .home-board-search input::placeholder {
  color: #98a2b3;
  font-weight: 650;
}

#homePanel .home-board-refresh {
  min-height: 32px;
  padding: 6px 11px;
}

#homePanel .home-order-board-v4 .home-delivery-head {
  padding: 0 10px 4px;
}

#homePanel .home-order-board-v4 .home-order-card-list {
  max-height: clamp(500px, calc(100dvh - 312px), 760px);
  gap: 7px;
}

#homePanel .home-order-board-v4 .home-delivery-row {
  min-height: 66px;
  padding: 8px 10px;
  border-radius: 15px;
}

#homePanel .home-order-board-v4 .home-delivery-row + .home-delivery-row {
  margin-top: 0;
}

#homePanel .home-order-board-v4 .delivery-id strong {
  font-size: 13px;
}

#homePanel .home-order-board-v4 .delivery-id span,
#homePanel .home-order-board-v4 .delivery-address span,
#homePanel .home-order-board-v4 .delivery-eta span,
#homePanel .home-order-board-v4 .driver-mini span {
  font-size: 11px;
}

#homePanel .home-order-board-v4 .routing-scope-pill {
  margin-top: 3px;
}

#homePanel .home-order-board-v4 .status-chip {
  min-height: 24px;
  padding: 4px 7px;
  font-size: 10px;
}

#homePanel .home-order-board-v4 .driver-mini {
  gap: 6px;
}

#homePanel .home-order-board-v4 .driver-avatar {
  width: 28px;
  height: 28px;
  font-size: 10px;
}

#homePanel .home-order-board-v4 .proof-thumb-card {
  min-height: 34px;
}

@media (min-width: 1181px) {
  #homePanel .customer-live-board > .live-orders-card {
    grid-row: span 2;
  }
}

@media (max-width: 1260px) {
  #homePanel .home-board-tools {
    flex-wrap: wrap;
  }
  #homePanel .home-board-search {
    flex: 1 1 260px;
  }
}

@media (max-width: 1180px) {
  #homePanel .customer-live-board {
    grid-template-columns: 1fr;
  }
  #homePanel .home-order-board-v4 .home-order-card-list {
    max-height: none;
  }
}

@media (max-width: 760px) {
  #homePanel .card-heading.home-orders-heading {
    align-items: flex-start;
  }
  #homePanel .home-orders-actions {
    width: 100%;
    justify-content: flex-start;
  }
  #homePanel .home-board-tools {
    display: grid;
    grid-template-columns: 1fr;
  }
  #homePanel .home-board-search,
  #homePanel .home-board-refresh {
    width: 100%;
    min-width: 0;
  }
}

/* Home compacta fase 5 — entrega selecionada mais objetiva */
#homePanel .home-selected-detail {
  display: grid;
  gap: 9px;
  min-width: 0;
}

#homePanel .home-selected-head {
  align-items: center;
  margin-bottom: 0;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(226, 232, 240, .9);
}

#homePanel .home-selected-title {
  min-width: 0;
}

#homePanel .home-selected-title h3 {
  margin: 0;
  font-size: clamp(18px, 1.55vw, 21px);
  line-height: 1.05;
}

#homePanel .home-selected-title p:not(.eyebrow) {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

#homePanel .home-selected-status {
  flex: 0 0 auto;
}

#homePanel .home-selected-status .status-chip {
  min-height: 26px;
  padding: 5px 8px;
  font-size: 10px;
}

#homePanel .home-selected-kpis,
#homePanel .home-selected-mini-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

#homePanel .home-selected-mini-metrics {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#homePanel .home-selected-kpis > div,
#homePanel .home-selected-mini-metrics > div {
  min-width: 0;
  border: 1px solid rgba(226, 232, 240, .9);
  border-radius: 14px;
  padding: 8px 9px;
  background: #fff;
}

#homePanel .home-selected-kpis span,
#homePanel .home-selected-mini-metrics span {
  display: block;
  margin-bottom: 2px;
  color: #98a2b3;
  font-size: 10px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .055em;
}

#homePanel .home-selected-kpis strong,
#homePanel .home-selected-kpis small,
#homePanel .home-selected-mini-metrics strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#homePanel .home-selected-kpis strong,
#homePanel .home-selected-mini-metrics strong {
  color: var(--ink);
  font-size: 13px;
  line-height: 1.12;
}

#homePanel .home-selected-kpis small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 8px 9px;
  border-radius: 14px;
  box-shadow: none;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-badge {
  min-height: 20px;
  padding: 3px 7px;
  font-size: 10px;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact strong {
  font-size: 12px;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact small {
  display: none;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-button {
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 11px;
  white-space: nowrap;
}

#homePanel .home-selected-route-summary {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  padding: 9px 10px;
  border: 1px solid rgba(226, 232, 240, .92);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(248, 250, 252, .94), rgba(255, 255, 255, .98));
}

#homePanel .home-selected-route-summary strong,
#homePanel .home-selected-route-summary small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

#homePanel .home-selected-route-summary strong {
  font-size: 13px;
  line-height: 1.2;
}

#homePanel .home-selected-route-summary small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

#homePanel .home-selected-addresses {
  grid-template-columns: 1fr;
  gap: 7px;
}

#homePanel .home-selected-addresses > div {
  padding: 9px 10px;
}

#homePanel .home-selected-addresses span {
  font-size: 10px;
}

#homePanel .home-selected-addresses strong {
  font-size: 12px;
  line-height: 1.22;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

#homePanel .home-selected-map-wrap .customer-route-map {
  border-radius: 16px;
}

#homePanel .home-selected-map-wrap .customer-route-map svg,
#homePanel .home-route-map.home-selected-map.customer-route-map svg,
#homePanel .customer-route-map.home-route-map.home-selected-map svg {
  height: clamp(140px, 17dvh, 182px);
}

#homePanel .home-selected-map-wrap .map-caption {
  left: 9px;
  right: 9px;
  bottom: 8px;
  padding: 5px 8px;
}

#homePanel .home-selected-map-wrap .map-legend,
#homePanel .home-selected-map-wrap .map-privacy-note {
  display: none;
}

#homePanel .home-selected-progress {
  margin: -1px 0 0;
}

#homePanel .home-selected-progress strong {
  font-size: 12px;
}

#homePanel .home-selected-driver-card,
#homePanel .home-selected-pod-card,
#homePanel .contact-policy-card.compact {
  border-radius: 14px;
  padding: 9px 10px;
}

#homePanel .home-selected-driver-card {
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 9px;
}

#homePanel .home-selected-driver-card .driver-avatar {
  width: 38px;
  height: 38px;
}

#homePanel .home-selected-driver-card strong,
#homePanel .home-selected-driver-card span:not(.driver-presence) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#homePanel .home-selected-driver-card span:not(.driver-presence),
#homePanel .contact-policy-card.compact p,
#homePanel .home-selected-pod-card p {
  font-size: 12px;
}

#homePanel .home-mini-timeline {
  gap: 6px;
  padding: 1px 0;
}

#homePanel .home-mini-timeline li {
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 7px;
}

#homePanel .home-mini-timeline li > span {
  width: 16px;
  height: 16px;
}

#homePanel .home-mini-timeline strong {
  font-size: 12px;
}

#homePanel .home-mini-timeline small {
  font-size: 11px;
  line-height: 1.18;
}

#homePanel .home-selected-pod-card {
  gap: 8px;
}

#homePanel .home-selected-pod-card .ghost.small {
  min-height: 30px;
  padding: 6px 9px;
  font-size: 11px;
}

#homePanel .home-selected-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
  margin-top: 0;
}

#homePanel .home-selected-actions .ghost.small {
  justify-content: center;
  min-height: 32px;
  padding: 6px 8px;
  font-size: 11px;
}

@media (max-width: 1180px) {
  #homePanel .home-selected-map-wrap .customer-route-map svg,
  #homePanel .home-route-map.home-selected-map.customer-route-map svg,
  #homePanel .customer-route-map.home-route-map.home-selected-map svg {
    height: 220px;
  }
}

@media (max-width: 760px) {
  #homePanel .home-selected-head,
  #homePanel .home-selected-driver-card,
  #homePanel .home-selected-pod-card,
  #homePanel .realtime-card .routing-scope-transfer-panel.compact {
    grid-template-columns: 1fr;
  }

  #homePanel .home-selected-kpis,
  #homePanel .home-selected-mini-metrics,
  #homePanel .home-selected-actions {
    grid-template-columns: 1fr;
  }

  #homePanel .home-selected-status,
  #homePanel .routing-scope-transfer-action {
    align-items: flex-start;
    justify-content: flex-start;
  }

  #homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-button {
    width: 100%;
    white-space: normal;
  }
}

/* Home compacta fase 6 — responsivo, estados vazios e acabamento final */
html,
body {
  overflow-x: hidden;
}

.toast {
  z-index: 1800;
}

.topbar-compact,
.topbar-identity,
.topbar-title-row,
.company-switcher,
.company-switcher summary,
.topbar-actions {
  min-width: 0;
}

.topbar-greeting,
.sidebar-company-compact strong,
.sidebar-company-compact span,
#topbarCompanyName,
#topbarCompanyAddress,
#topbarCompanyPickup {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sidebar-company-compact strong,
.sidebar-company-compact span,
#topbarCompanyName {
  white-space: nowrap;
}

.company-menu-panel {
  max-height: min(72dvh, 520px);
  overflow: auto;
  overscroll-behavior: contain;
}

#homePanel .customer-live-board,
#homePanel .live-orders-card,
#homePanel .realtime-card,
#homePanel .home-proof-panel,
#homePanel .home-actions-card,
#homePanel .home-activity-card,
#homePanel .home-delivery-table,
#homePanel .home-order-board-v6,
#homePanel .home-board-toolbar,
#homePanel .home-board-tools,
#homePanel .home-board-summary-chips,
#homePanel .home-board-filters,
#homePanel .home-board-search,
#homePanel .home-delivery-row,
#homePanel .home-delivery-row *,
#homePanel .home-selected-detail,
#homePanel .home-selected-detail * {
  min-width: 0;
}

#homePanel .home-order-board-v6[data-state="ready"] .home-delivery-head {
  position: sticky;
  top: 0;
  z-index: 4;
  background: rgba(248, 250, 252, .98);
  backdrop-filter: blur(10px);
  box-shadow: 0 1px 0 rgba(226, 232, 240, .95);
}

#homePanel .home-order-board-v6[data-state="empty"] .home-board-summary-chips span:first-child,
#homePanel .home-order-board-v6[data-state="filtered-empty"] .home-board-summary-chips span:first-child {
  background: rgba(255, 246, 227, .92);
  color: var(--brand-dark);
}

#homePanel .home-empty-state-v6 {
  min-height: clamp(220px, 34dvh, 360px);
  display: grid;
  align-content: center;
  margin-top: 8px;
  border: 1px dashed rgba(148, 163, 184, .45);
  background: linear-gradient(180deg, rgba(248, 250, 252, .92), rgba(255, 255, 255, .98));
}

#homePanel .home-empty-state-v6.empty {
  border-color: rgba(242, 165, 26, .30);
  background: linear-gradient(135deg, rgba(255, 247, 232, .82), #fff 70%);
}

#homePanel .home-empty-state-v6 .rich-empty-actions,
#homePanel .home-empty-state-v6 .empty-actions {
  flex-wrap: wrap;
  justify-content: center;
}

#homePanel .home-empty-state-v6 .rich-empty-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
  padding: 0;
}

#homePanel .home-empty-state-v6 .rich-empty-list li {
  margin: 0;
  padding: 5px 9px;
  border: 1px solid rgba(226, 232, 240, .95);
  border-radius: 999px;
  background: #fff;
  color: var(--ink-soft);
  font-size: 11px;
  font-weight: 800;
  list-style: none;
}

#homePanel .home-order-board-v6 .home-order-card-list {
  scroll-padding-top: 42px;
}

#homePanel .home-order-board-v6 .delivery-address span,
#homePanel .home-order-board-v6 .delivery-id strong,
#homePanel .home-order-board-v6 .delivery-eta strong,
#homePanel .home-order-board-v6 .driver-mini strong,
#homePanel .home-order-board-v6 .driver-mini span {
  overflow: hidden;
  text-overflow: ellipsis;
}

#homePanel .home-order-board-v6 .delivery-address span {
  white-space: nowrap;
}

body[data-home-has-orders="0"] #homePanel .home-selected-empty {
  min-height: 220px;
  align-content: center;
}

body[data-current-view="home"] .quick-support-button {
  z-index: 910;
}

body.mobile-detail-open .quick-support-button {
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
}

@media (min-width: 1181px) and (max-width: 1320px) {
  #homePanel .customer-live-board {
    grid-template-columns: minmax(0, 1fr);
  }

  #homePanel .customer-live-board > .live-orders-card,
  #homePanel .customer-live-board > .realtime-card,
  #homePanel .customer-live-board > .home-proof-panel,
  #homePanel .customer-live-board > .home-actions-card,
  #homePanel .customer-live-board > .home-activity-card {
    grid-column: 1;
    grid-row: auto;
  }

  #homePanel .realtime-card {
    position: static;
    max-height: none;
    overflow: visible;
  }

  #homePanel .home-selected-map-wrap .customer-route-map svg,
  #homePanel .home-route-map.home-selected-map.customer-route-map svg,
  #homePanel .customer-route-map.home-route-map.home-selected-map svg {
    height: 210px;
  }
}

@media (max-width: 760px) {
  .topbar-compact {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .topbar-compact .topbar-identity,
  .topbar-compact .company-switcher,
  .topbar-compact .company-switcher summary {
    width: 100%;
    max-width: 100%;
  }

  .topbar-compact .topbar-title-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  .topbar-greeting {
    max-width: 100%;
    font-size: clamp(20px, 6.3vw, 24px);
  }

  .company-menu-panel {
    position: fixed;
    left: 12px;
    right: 12px;
    top: calc(66px + env(safe-area-inset-top, 0px));
    width: auto;
    max-height: calc(100dvh - 92px);
    border-radius: 18px;
  }

  .topbar-compact .page-subtitle,
  .topbar-compact .sync-chip,
  .topbar-compact #installPortalButton.hidden {
    display: none !important;
  }

  .topbar-compact .topbar-actions {
    display: grid;
    grid-template-columns: 42px 42px minmax(112px, 1fr) 42px;
    width: 100%;
    gap: 7px;
    justify-content: stretch;
  }

  .topbar-compact .global-search-trigger,
  .topbar-compact .install-chip,
  .topbar-compact .icon-button {
    width: 42px;
    min-width: 0;
    height: 42px;
    min-height: 42px;
  }

  .topbar-compact .referral-chip {
    min-width: 0;
    min-height: 42px;
    padding-inline: 10px;
    justify-content: center;
    white-space: nowrap;
  }

  #homePanel .home-metrics.metrics-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 8px;
  }

  #homePanel .home-metric-card {
    min-height: 58px;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
    padding: 9px 10px;
    border-radius: 15px;
  }

  #homePanel .home-metric-card .metric-icon {
    width: 30px;
    height: 30px;
    border-radius: 10px;
  }

  #homePanel .home-metric-card p {
    font-size: 11px;
  }

  #homePanel .home-metric-card strong {
    font-size: 19px;
  }

  #homePanel .home-board-summary-chips,
  #homePanel .home-board-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
  }

  #homePanel .home-board-summary-chips span,
  #homePanel .home-board-filter {
    justify-content: center;
    text-align: center;
    white-space: normal;
  }

  #homePanel .home-board-search {
    min-height: 42px;
  }

  #homePanel .home-order-board-v6[data-state="ready"] .home-delivery-head {
    position: static;
    box-shadow: none;
  }

  #homePanel .home-order-board-v6 .delivery-address span {
    white-space: normal;
  }

  #homePanel .home-empty-state-v6 {
    min-height: 220px;
    padding: 18px 14px;
    border-radius: 20px;
  }

  #homePanel .home-empty-state-v6 .rich-empty-actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  #homePanel .home-empty-state-v6 .rich-empty-actions > button {
    width: 100%;
    justify-content: center;
  }

  #homePanel .customer-live-board > .realtime-card {
    max-height: min(84dvh, 760px);
  }

  #homePanel .home-selected-kpis,
  #homePanel .home-selected-mini-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #homePanel .home-selected-kpis > div:first-child {
    grid-column: 1 / -1;
  }

  #homePanel .home-selected-actions {
    grid-template-columns: 1fr;
  }

  .quick-support-button {
    right: 14px;
    bottom: calc(98px + env(safe-area-inset-bottom, 0px));
    z-index: 910;
  }

  .toast {
    right: 12px;
    left: 12px;
    bottom: calc(164px + env(safe-area-inset-bottom, 0px));
    max-width: none;
    z-index: 1800;
  }

  body.mobile-detail-open .toast {
    top: calc(14px + env(safe-area-inset-top, 0px));
    bottom: auto;
  }
}

@media (max-width: 520px) {
  #homePanel .home-metrics.metrics-5,
  #homePanel .home-selected-kpis,
  #homePanel .home-selected-mini-metrics,
  #homePanel .home-board-summary-chips,
  #homePanel .home-board-filters {
    grid-template-columns: 1fr;
  }

  .topbar-compact .topbar-actions {
    grid-template-columns: 40px 40px minmax(104px, 1fr) 40px;
  }

  .topbar-compact .global-search-trigger,
  .topbar-compact .install-chip,
  .topbar-compact .icon-button {
    width: 40px;
    height: 40px;
    min-height: 40px;
  }
}


/* Fase 6 — responsividade, estados vazios e acabamento final da Home compacta */
.topbar-greeting,
#topbarCompanyName,
#sidebarCompanyName,
#sidebarUserName,
.company-mini-content strong,
.company-mini-content span {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topbar-identity,
.topbar-title-row,
.company-switcher,
.company-switcher summary,
.sidebar-company-compact,
.company-mini-content {
  min-width: 0;
}

.company-switcher summary {
  max-width: min(58vw, 560px);
}

.company-menu-panel {
  max-width: min(520px, calc(100vw - 34px));
}

.company-menu-details dd {
  overflow-wrap: anywhere;
}

#homePanel .home-order-board-v6[data-state="ready"] .home-delivery-head {
  position: sticky;
  top: 0;
  z-index: 4;
  background: rgba(248, 250, 252, .98);
  backdrop-filter: blur(10px);
  box-shadow: 0 1px 0 rgba(226, 232, 240, .95);
}

#homePanel .home-board-summary-chips,
#homePanel .home-board-filters,
#homePanel .home-board-tools,
#homePanel .home-order-card-list {
  min-width: 0;
}

body.home-has-orders #homePanel .home-board-summary-chips::after {
  content: 'Até 10 linhas';
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 999px;
  padding: 5px 9px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

#homePanel .home-order-board-v6[data-state="empty"] .home-board-summary-chips span:first-child,
#homePanel .home-order-board-v6[data-state="filtered-empty"] .home-board-summary-chips span:first-child {
  background: rgba(255, 246, 227, .92);
  color: var(--brand-dark);
}

#homePanel .home-finish-empty {
  margin-top: 10px;
  padding: clamp(18px, 3vw, 28px);
  border: 1px dashed rgba(148, 163, 184, .42);
  border-radius: 22px;
  background:
    radial-gradient(circle at 10% 0%, rgba(242, 165, 26, .10), transparent 28rem),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
}

#homePanel .home-finish-empty.empty-no-orders {
  min-height: 260px;
  align-content: center;
}

#homePanel .home-finish-empty.empty-filtered {
  min-height: 220px;
}

#homePanel .home-finish-empty .rich-empty-actions {
  flex-wrap: wrap;
  justify-content: center;
}

#homePanel .home-finish-empty .rich-empty-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
  padding: 0;
}

#homePanel .home-finish-empty .rich-empty-list li {
  margin: 0;
  padding: 5px 9px;
  border: 1px solid rgba(226, 232, 240, .95);
  border-radius: 999px;
  background: #fff;
  color: var(--ink-soft);
  font-size: 11px;
  font-weight: 800;
  list-style: none;
}

#homePanel .home-delivery-row,
#homePanel .home-selected-detail,
#homePanel .home-selected-detail * {
  min-width: 0;
}

#homePanel .delivery-id strong,
#homePanel .delivery-address span,
#homePanel .delivery-address small,
#homePanel .delivery-eta strong,
#homePanel .delivery-eta span,
#homePanel .delivery-driver .driver-mini strong,
#homePanel .delivery-driver .driver-mini span,
#homePanel .home-selected-title p,
#homePanel .home-selected-addresses strong,
#homePanel .home-selected-route-summary small,
#homePanel .home-selected-kpis strong,
#homePanel .home-selected-kpis small,
#homePanel .home-selected-mini-metrics strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-button:disabled,
#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-button[aria-disabled="true"] {
  box-shadow: none;
  opacity: .72;
}

body[data-home-has-orders="0"] #homePanel .home-selected-empty {
  min-height: 220px;
  align-content: center;
}

.toast {
  z-index: 1650;
}

@media (max-width: 1180px) {
  #homePanel .customer-live-board > .live-orders-card,
  #homePanel .customer-live-board > .realtime-card,
  #homePanel .customer-live-board > .home-proof-panel,
  #homePanel .customer-live-board > .home-actions-card,
  #homePanel .customer-live-board > .home-activity-card {
    grid-column: 1;
    grid-row: auto;
  }

  #homePanel .customer-live-board > .realtime-card {
    position: static;
    max-height: none;
  }

  #homePanel .home-order-card-list {
    max-height: none;
  }
}

@media (max-width: 760px) {
  body.mobile-detail-open {
    overflow: hidden;
  }

  body.mobile-detail-open::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 1190;
    background: rgba(15, 23, 42, .38);
    backdrop-filter: blur(5px);
  }

  body.mobile-detail-open .quick-support-button {
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
  }

  .toast {
    left: 12px;
    right: 12px;
    bottom: calc(96px + env(safe-area-inset-bottom, 0px));
    max-width: none;
    z-index: 1650;
  }

  body.mobile-detail-open .toast {
    top: calc(14px + env(safe-area-inset-top, 0px));
    right: 12px;
    bottom: auto;
    left: 12px;
  }

  .quick-support-button {
    bottom: calc(86px + env(safe-area-inset-bottom, 0px));
    right: 12px;
    z-index: 760;
  }

  .topbar-current-view {
    display: none;
  }

  .topbar-greeting {
    max-width: min(66vw, 340px);
    font-size: clamp(20px, 6.4vw, 27px);
  }

  .company-switcher summary {
    max-width: calc(100vw - 126px);
  }

  .company-menu-panel {
    position: fixed;
    left: 12px;
    right: 12px;
    top: calc(66px + env(safe-area-inset-top, 0px));
    width: auto;
    max-width: none;
    max-height: calc(100dvh - 92px);
    overflow-y: auto;
  }

  .topbar-actions {
    grid-template-columns: repeat(4, minmax(0, auto));
    align-items: center;
  }

  .topbar-actions .referral-chip {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }

  .home-metrics.metrics-5 {
    grid-template-columns: repeat(5, minmax(116px, 1fr));
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 4px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .home-metrics.metrics-5::-webkit-scrollbar {
    display: none;
  }

  .home-metrics.metrics-5 .home-metric-card {
    min-height: 74px;
    padding: 10px;
    border-radius: 18px;
    scroll-snap-align: start;
  }

  .home-metric-card .metric-icon {
    width: 34px;
    height: 34px;
  }

  .home-metric-card p {
    font-size: 11px;
  }

  .home-metric-card strong {
    font-size: 21px;
  }

  #homePanel .customer-live-board > .realtime-card {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: auto;
    z-index: 1200;
    max-height: min(86dvh, 760px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 14px calc(18px + env(safe-area-inset-bottom, 0px));
    border: 0;
    border-radius: 28px 28px 0 0;
    box-shadow: 0 -22px 70px rgba(15, 23, 42, .26);
    transform: translateY(108%);
    opacity: .99;
    pointer-events: none;
    transition: transform .24s ease, opacity .24s ease;
  }

  body.mobile-detail-open #homePanel .customer-live-board > .realtime-card {
    transform: translateY(0);
    pointer-events: auto;
  }

  #homePanel .home-order-board-v6[data-state="ready"] .home-delivery-head {
    position: static;
    box-shadow: none;
  }

  #homePanel .home-board-summary-chips {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #homePanel .home-board-summary-chips span {
    justify-content: center;
    white-space: nowrap;
  }

  #homePanel .home-board-filters {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  #homePanel .home-board-filters::-webkit-scrollbar {
    display: none;
  }

  #homePanel .home-board-filter {
    flex: 0 0 auto;
  }

  #homePanel .home-board-search,
  #homePanel .home-board-search input,
  #homePanel .home-board-refresh {
    width: 100%;
  }

  #homePanel .home-finish-empty {
    padding: 18px 14px;
    border-radius: 20px;
  }

  #homePanel .home-finish-empty .rich-empty-actions {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  #homePanel .home-finish-empty .rich-empty-actions > button {
    width: 100%;
    justify-content: center;
  }

  #homePanel .home-selected-kpis,
  #homePanel .home-selected-mini-metrics,
  #homePanel .home-selected-actions {
    grid-template-columns: 1fr;
  }

  #homePanel .home-selected-title p,
  #homePanel .home-selected-addresses strong,
  #homePanel .home-selected-route-summary small,
  #homePanel .home-selected-kpis strong,
  #homePanel .home-selected-kpis small,
  #homePanel .home-selected-mini-metrics strong {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  #homePanel .home-selected-map-wrap .customer-route-map svg,
  #homePanel .home-route-map.home-selected-map.customer-route-map svg,
  #homePanel .customer-route-map.home-route-map.home-selected-map svg {
    height: 210px;
  }
}

@media (max-width: 420px) {
  .topbar-greeting {
    max-width: calc(100vw - 106px);
  }

  .topbar-actions {
    grid-template-columns: repeat(3, minmax(0, auto));
  }

  .global-search-trigger,
  .install-chip,
  .icon-button {
    width: 40px;
    min-width: 40px;
  }

  .home-metrics.metrics-5 {
    grid-template-columns: repeat(5, minmax(104px, 1fr));
  }
}


/* Ajuste estético final — saudação mais sutil e correção de sobreposição no card de execução */
.topbar-greeting {
  max-width: min(460px, 38vw);
  font-size: clamp(22px, 2.35vw, 30px);
  line-height: 1.12;
  font-weight: 740;
  letter-spacing: -.022em;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact {
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
  gap: 6px;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-copy,
#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-action {
  min-width: 0;
  width: 100%;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact strong {
  display: block;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  line-height: 1.22;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-note {
  display: block;
  width: 100%;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  font-size: 11px;
  line-height: 1.32;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-action {
  justify-content: flex-start;
  align-items: flex-start;
}

#homePanel .realtime-card .routing-scope-transfer-panel.compact .routing-scope-transfer-button {
  width: auto;
  max-width: 100%;
}

@media (max-width: 1180px) {
  .topbar-greeting {
    max-width: calc(100vw - 320px);
    font-size: clamp(22px, 3.1vw, 28px);
  }
}

@media (max-width: 760px) {
  .topbar-greeting {
    max-width: calc(100vw - 118px);
    font-size: 22px;
  }
}

/* Fase 1 — operação guiada do pedido: controles simples de rota sem expor complexidade interna */
.customer-operation-panel {
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .94));
  box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
  padding: 14px;
  display: grid;
  gap: 10px;
}

.customer-operation-panel.compact {
  padding: 12px;
  gap: 8px;
}

.customer-operation-panel.state-approval,
.customer-operation-panel.state-ready,
.customer-operation-panel.state-attention {
  border-color: rgba(245, 158, 11, .35);
  background: linear-gradient(135deg, rgba(255, 251, 235, .95), rgba(255, 255, 255, .98));
}

.customer-operation-panel.state-running {
  border-color: rgba(59, 130, 246, .24);
}

.customer-operation-panel.state-finished,
.customer-operation-panel.state-closed {
  opacity: .92;
}

.customer-operation-head {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.customer-operation-head > span {
  font-size: 10px;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
  color: var(--muted);
}

.customer-operation-head > strong {
  font-size: 15px;
  line-height: 1.18;
  color: var(--ink);
}

.customer-operation-head > small,
.customer-operation-note,
.customer-operation-route > span,
.customer-operation-route small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.customer-operation-route {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  border: 1px solid rgba(148, 163, 184, .18);
  border-radius: 14px;
  background: rgba(255, 255, 255, .72);
  padding: 8px 10px;
  min-width: 0;
}

.customer-operation-route > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.customer-operation-route b {
  color: var(--ink);
  font-size: 12px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-operation-route small {
  display: block;
  min-width: 0;
}

.customer-operation-route > span {
  flex: 0 0 auto;
  white-space: nowrap;
}

.customer-operation-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 8px;
}

.customer-operation-action {
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 13px;
  min-height: 38px;
  padding: 9px 10px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  font-weight: 800;
  font-size: 12px;
  cursor: pointer;
  background: #fff;
  color: var(--ink);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.customer-operation-action:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(15, 23, 42, .12);
}

.customer-operation-action.primary {
  background: var(--brand);
  border-color: var(--brand);
  color: #111827;
}

.customer-operation-action.danger {
  background: #fff;
  border-color: rgba(239, 68, 68, .34);
  color: #b91c1c;
}

.customer-operation-action.neutral {
  background: rgba(255, 255, 255, .88);
}

.customer-operation-action:disabled,
.customer-operation-action[aria-disabled="true"] {
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
  opacity: .54;
}

.customer-operation-note {
  margin: 0;
}

#homePanel .realtime-card .customer-operation-panel.compact {
  box-shadow: none;
  border-radius: 16px;
}

#homePanel .realtime-card .customer-operation-head > strong,
#homePanel .realtime-card .customer-operation-head > small,
#homePanel .realtime-card .customer-operation-note {
  display: block;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

@media (max-width: 760px) {
  .customer-operation-route {
    display: grid;
    gap: 2px;
    justify-content: stretch;
  }

  .customer-operation-route > span {
    white-space: normal;
  }

  .customer-operation-actions {
    grid-template-columns: 1fr;
  }
}

/* Fase 2 — visão simples de rotas no Portal do Cliente */
.routes-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(320px, .9fr);
  gap: 18px;
  align-items: start;
}

.routes-card,
.route-detail-card {
  min-width: 0;
}

.routes-heading p:not(.eyebrow) {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.4;
}

.routes-summary-grid,
.route-detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.routes-summary-grid article,
.route-detail-grid article {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  background: #fff;
}

.routes-summary-grid span,
.routes-summary-grid strong,
.route-detail-grid span,
.route-detail-grid strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.routes-summary-grid span,
.route-detail-grid span {
  color: #98a2b3;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.routes-summary-grid strong,
.route-detail-grid strong {
  margin-top: 3px;
  color: var(--ink);
  font-size: 18px;
}

.routes-toolbar {
  margin-top: 12px;
}

.route-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.customer-route-card {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--brand);
  border-radius: 18px;
  padding: 13px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.customer-route-card:hover,
.customer-route-card.selected {
  transform: translateY(-1px);
  border-color: rgba(242, 165, 26, .48);
  box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
}

.customer-route-card.ready { border-left-color: var(--info); }
.customer-route-card.running { border-left-color: var(--success); }
.customer-route-card.attention { border-left-color: var(--danger); }
.customer-route-card.closed { border-left-color: var(--slate); }

.customer-route-card-main,
.customer-route-card-meta,
.customer-route-card-footer,
.section-heading-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.customer-route-card-main > div,
.customer-route-card-footer > small,
.customer-route-card-meta > span,
.section-heading-row > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-route-card-main strong,
.customer-route-card-main span {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-route-card-main span,
.customer-route-card-footer small,
.customer-route-card-meta span,
.section-heading-row span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.customer-route-card-meta {
  justify-content: flex-start;
  flex-wrap: wrap;
}

.customer-route-card-meta span {
  flex: 0 1 auto;
  border-radius: 999px;
  background: var(--slate-soft);
  padding: 5px 8px;
  font-weight: 800;
}

.customer-route-action {
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 999px;
  min-height: 34px;
  padding: 7px 12px;
  background: #fff;
  color: var(--ink);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}

.customer-route-action.primary {
  border-color: var(--brand);
  background: var(--brand);
  color: #111827;
}

.customer-route-action.neutral {
  background: var(--slate-soft);
  color: var(--slate);
}

.customer-route-action:disabled,
.customer-route-action[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .56;
}

.route-detail-empty,
.customer-route-detail {
  display: grid;
  gap: 14px;
}

.route-detail-empty {
  min-height: 220px;
  place-content: center;
  text-align: center;
  color: var(--muted);
}

.route-detail-section {
  display: grid;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 14px;
  background: #fff;
}

.route-order-mini-list {
  display: grid;
  gap: 8px;
}

.route-order-mini {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px;
  background: #fcfcfd;
}

.route-order-open {
  display: grid;
  gap: 2px;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  text-align: left;
}

.route-order-open strong,
.route-order-open span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.route-order-open span {
  color: var(--muted);
  font-size: 12px;
}

.status-chip.approval,
.status-chip.planning { background: var(--brand-soft); color: var(--brand-dark); }
.status-chip.ready { background: var(--info-soft); color: var(--info); }
.status-chip.running { background: var(--success-soft); color: var(--success); }
.status-chip.attention { background: var(--danger-soft); color: var(--danger); }
.status-chip.closed { background: var(--slate-soft); color: var(--slate); }

@media (max-width: 1080px) {
  .routes-workspace { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .routes-summary-grid,
  .route-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .customer-route-card-main,
  .customer-route-card-footer,
  .section-heading-row { align-items: flex-start; flex-direction: column; }

  .route-order-mini { grid-template-columns: 1fr; }
}

/* Fase 3 — edição controlada de composição de rotas no Portal */
.route-order-mini-side {
  display: grid;
  justify-items: end;
  gap: 6px;
  min-width: 0;
}

.route-order-mini-actions,
.route-attach-list {
  display: grid;
  gap: 6px;
}

.route-order-mini-actions {
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  justify-content: end;
}

.route-compose-action {
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 999px;
  min-height: 30px;
  padding: 6px 10px;
  background: #fff;
  color: var(--ink);
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.route-compose-action:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(15, 23, 42, .10);
}

.route-compose-action.primary {
  border-color: var(--brand);
  background: var(--brand);
  color: #111827;
}

.route-compose-action.danger {
  border-color: rgba(239, 68, 68, .34);
  color: #b91c1c;
}

.route-compose-action.neutral {
  background: var(--slate-soft);
  color: var(--slate);
}

.route-compose-action:disabled,
.route-compose-action[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .52;
  transform: none;
  box-shadow: none;
}

.route-compose-panel {
  background: linear-gradient(135deg, rgba(255, 251, 235, .74), #fff);
  border-color: rgba(245, 158, 11, .28);
}

.route-compose-panel p,
.route-compose-empty {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.route-attach-order {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 14px;
  padding: 10px;
  background: rgba(255, 255, 255, .82);
}

@media (max-width: 760px) {
  .route-order-mini-side {
    justify-items: stretch;
  }

  .route-order-mini-actions {
    grid-auto-flow: row;
    grid-auto-columns: auto;
    justify-content: stretch;
  }

  .route-compose-action {
    width: 100%;
    justify-content: center;
  }

  .route-attach-order {
    grid-template-columns: 1fr;
  }
}


/* Fase 4 — controles avançados simples de rota no Portal */
.route-merge-panel {
  background: linear-gradient(135deg, rgba(239, 246, 255, .78), #fff);
  border-color: rgba(59, 130, 246, .22);
}

.route-merge-list {
  display: grid;
  gap: 6px;
}

.route-merge-target {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.route-merge-target small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .route-merge-target {
    grid-template-columns: 1fr;
  }

  .route-merge-target small {
    white-space: normal;
  }
}

/* Fase 5 — experiência segura: confirmação, orientação e histórico */
.customer-operation-panel.is-busy {
  position: relative;
  opacity: .86;
}

.customer-operation-panel.is-busy::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255, 255, 255, .18), rgba(255, 255, 255, .54));
}

.customer-operation-guidance {
  display: grid;
  gap: 4px;
  border: 1px solid rgba(245, 158, 11, .28);
  border-radius: 14px;
  padding: 10px 12px;
  background: linear-gradient(135deg, rgba(255, 251, 235, .86), rgba(255, 255, 255, .95));
}

.customer-operation-guidance strong {
  color: var(--ink);
  font-size: 13px;
}

.customer-operation-guidance span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.customer-operation-blockers {
  display: grid;
  gap: 6px;
  border: 1px dashed rgba(100, 116, 139, .30);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(248, 250, 252, .82);
}

.customer-operation-blockers strong {
  color: var(--slate);
  font-size: 12px;
}

.customer-operation-blockers span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.customer-operation-subhead {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.customer-operation-subhead strong {
  color: var(--ink);
  font-size: 13px;
}

.customer-operation-subhead span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.customer-operation-history {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 16px;
  padding: 12px;
  background: rgba(255, 255, 255, .92);
}

.customer-operation-history.compact {
  padding: 10px;
}

.customer-operation-history-empty {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.customer-operation-history-row {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 9px;
  align-items: flex-start;
  padding: 8px 0;
  border-top: 1px solid rgba(15, 23, 42, .06);
}

.customer-operation-history-row:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.customer-operation-history-row > span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  margin-top: 5px;
  background: var(--success);
  box-shadow: 0 0 0 4px var(--success-soft);
}

.customer-operation-history-row.error > span {
  background: var(--danger);
  box-shadow: 0 0 0 4px var(--danger-soft);
}

.customer-operation-history-row strong,
.customer-operation-history-row small,
.customer-operation-history-row p,
.customer-operation-history-row em {
  display: block;
  min-width: 0;
}

.customer-operation-history-row strong {
  color: var(--ink);
  font-size: 12px;
}

.customer-operation-history-row small {
  color: var(--muted);
  font-size: 11px;
  margin-top: 1px;
}

.customer-operation-history-row p {
  margin: 4px 0 0;
  color: var(--slate);
  font-size: 12px;
  line-height: 1.35;
}

.customer-operation-history-row em {
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.35;
}

.route-history-panel {
  background: linear-gradient(135deg, rgba(240, 253, 250, .72), #fff);
  border-color: rgba(20, 184, 166, .22);
}

.customer-confirm-modal {
  position: fixed;
  inset: 0;
  z-index: 2200;
  display: grid;
  place-items: center;
  padding: 18px;
}

.customer-confirm-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .50);
  backdrop-filter: blur(4px);
}

.customer-confirm-card {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 16px;
  border-radius: 24px;
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, .50);
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .30);
}

.customer-confirm-icon {
  width: 48px;
  height: 48px;
  border-radius: 18px;
  background: var(--brand-soft);
  display: grid;
  place-items: center;
}

.customer-confirm-icon::before {
  content: '?';
  color: var(--brand-dark);
  font-weight: 1000;
  font-size: 22px;
}

.customer-confirm-modal.tone-danger .customer-confirm-icon {
  background: var(--danger-soft);
}

.customer-confirm-modal.tone-danger .customer-confirm-icon::before {
  content: '!';
  color: var(--danger);
}

.customer-confirm-content {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.customer-confirm-content h2 {
  margin: 0;
  color: var(--ink);
  font-size: 22px;
}

.customer-confirm-content p {
  margin: 0;
  color: var(--muted);
  line-height: 1.48;
}

.customer-confirm-impact {
  display: grid;
  gap: 3px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(248, 250, 252, .84);
}

.customer-confirm-impact strong {
  color: var(--ink);
  font-size: 12px;
}

.customer-confirm-impact span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.38;
}

.customer-confirm-warning {
  border-radius: 14px;
  padding: 10px 12px;
  background: var(--danger-soft);
  color: var(--danger);
  font-weight: 800;
  font-size: 12px;
  line-height: 1.4;
}

.customer-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 4px;
}

.customer-confirm-actions .danger {
  background: var(--danger);
  color: #fff;
}

@media (max-width: 620px) {
  .customer-confirm-card {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .customer-confirm-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .customer-confirm-actions button {
    width: 100%;
  }

  .customer-operation-subhead {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Fase 6 — permissões finas e blindagem operacional */
.user-permission-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}
.user-permission-summary span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eef4ff;
  color: #344054;
  font-size: .74rem;
  font-weight: 700;
}
.user-permission-summary.muted {
  color: var(--muted, #667085);
  font-size: .78rem;
}
.user-permission-editor {
  grid-column: 1 / -1;
  border-top: 1px solid var(--border-color, #e5e7eb);
  padding-top: 10px;
}
.user-permission-editor summary {
  cursor: pointer;
  color: #344054;
  font-weight: 800;
  font-size: .84rem;
}
.permission-toggle-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.permission-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 10px;
  border: 1px solid var(--border-color, #e5e7eb);
  border-radius: 12px;
  background: #f9fafb;
  font-size: .82rem;
  font-weight: 700;
  color: #344054;
}
.permission-toggle input {
  width: 16px;
  height: 16px;
  accent-color: var(--brand, #f97316);
}
.permission-editor-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
}
.permission-editor-footer small {
  color: var(--muted, #667085);
  line-height: 1.35;
}
@media (max-width: 760px) {
  .permission-toggle-grid {
    grid-template-columns: 1fr;
  }
  .permission-editor-footer {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Fase 6 — fechamento: permissões por ação e uso pleno seguro */
.user-permission-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 5px;
}
.user-permission-chips span {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #eef4ff;
  color: #344054;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: -.01em;
}
.user-permission-chips.muted span {
  background: #f2f4f7;
  color: #667085;
  font-weight: 700;
}
.customer-operation-action[disabled],
.customer-route-action[disabled],
.route-compose-action[disabled] {
  cursor: not-allowed;
}
.customer-operation-blockers span {
  overflow-wrap: anywhere;
}
body:not(.can-operate-customer-routes) .customer-operation-panel .customer-operation-actions .customer-operation-action:not([data-support-order]) {
  opacity: .68;
}

/* Fase 6 — permissões finas e fechamento operacional do Portal */
.user-permission-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 6px;
}
.user-permission-chips span {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eef4ff;
  color: #1d4ed8;
  font-size: .72rem;
  font-weight: 700;
}
.user-permission-chips.muted span {
  background: #f3f4f6;
  color: var(--muted, #667085);
}
.user-permission-editor {
  margin-top: 8px;
  border: 1px solid var(--border-color, #e5e7eb);
  border-radius: 14px;
  background: #fafafa;
  overflow: hidden;
}
.user-permission-editor summary {
  cursor: pointer;
  padding: 9px 11px;
  font-size: .8rem;
  font-weight: 800;
  color: var(--text-color, #111827);
}
.user-permission-editor section {
  padding: 0 11px 10px;
  display: grid;
  gap: 7px;
}
.user-permission-editor section strong {
  font-size: .74rem;
  color: var(--muted, #667085);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.user-permission-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: 6px;
}
.user-permission-toggle {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  min-height: 34px;
  padding: 8px;
  border: 1px solid var(--border-color, #e5e7eb);
  border-radius: 12px;
  background: #fff;
  font-size: .78rem;
  line-height: 1.25;
}
.user-permission-toggle input {
  margin-top: 2px;
}
.user-permission-editor-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 11px 11px;
  border-top: 1px solid var(--border-color, #e5e7eb);
}
.user-permission-editor-actions span,
.user-permission-editor-note {
  color: var(--muted, #667085);
  font-size: .78rem;
}
.user-permission-editor-note {
  margin-top: 8px;
  padding: 8px 10px;
  border-radius: 12px;
  background: #fff7ed;
}
@media (max-width: 760px) {
  .user-permission-grid {
    grid-template-columns: 1fr;
  }
}


/* Ajuste v95 — rotas mais visíveis no Portal do Cliente */
.home-routes-shortcut {
  display: inline-flex;
}
.customer-operation-actions-priority {
  margin-top: 2px;
}
.customer-operation-actions-priority .customer-operation-action.primary {
  min-height: 42px;
  font-size: 12.5px;
  box-shadow: 0 10px 22px rgba(245, 158, 11, .18);
}
.route-screen-shortcut {
  border-style: dashed;
}
#homePanel .realtime-card .customer-operation-panel.compact .customer-operation-actions-priority {
  grid-template-columns: 1fr;
}
#homePanel .realtime-card .customer-operation-panel.compact .customer-operation-guidance {
  margin-top: 0;
}
@media (min-width: 1180px) {
  #homePanel .realtime-card .customer-operation-panel.compact .customer-operation-actions-priority {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .home-orders-actions .home-routes-shortcut {
    order: 3;
  }
}

/* Ajuste v96 — responsividade real da Home do Portal do Cliente
   Objetivo: evitar cards enormes e vazios quando a largura fica intermediária
   entre desktop amplo e celular. */
@media (min-width: 761px) and (max-width: 1500px) {
  .app-shell {
    grid-template-columns: clamp(218px, 18vw, 244px) minmax(0, 1fr);
  }

  .main-area {
    padding: 18px clamp(14px, 2vw, 24px) 42px;
  }

  .topbar-compact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px 14px;
    margin-bottom: 12px;
  }

  .topbar-compact .topbar-identity {
    min-width: 0;
    max-width: 100%;
  }

  .topbar-compact .topbar-title-row {
    flex-wrap: nowrap;
  }

  .topbar-compact .topbar-greeting {
    max-width: min(100%, 520px);
    font-size: clamp(24px, 2.55vw, 34px);
  }

  .topbar-compact .page-subtitle {
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.3;
  }

  .topbar-compact .topbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    max-width: 520px;
  }

  .topbar-compact .sync-chip,
  .topbar-compact .global-search-trigger,
  .topbar-compact .install-chip,
  .topbar-compact .referral-chip,
  .topbar-compact .icon-button {
    min-height: 40px;
  }

  .topbar-compact .global-search-trigger {
    padding: 9px 12px;
  }

  .topbar-compact .install-chip,
  .topbar-compact .referral-chip {
    padding: 9px 13px;
  }

  #homePanel .home-metrics.metrics-5 {
    grid-template-columns: repeat(5, minmax(108px, 1fr));
    gap: 8px;
    margin-bottom: 10px;
  }

  #homePanel .home-metric-card {
    min-height: 60px;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
    padding: 9px 10px;
    border-radius: 16px;
  }

  #homePanel .home-metric-card .metric-icon {
    width: 30px;
    height: 30px;
    border-radius: 10px;
  }

  #homePanel .home-metric-card .metric-icon svg {
    width: 16px;
    height: 16px;
  }

  #homePanel .home-metric-card p {
    font-size: 11px;
  }

  #homePanel .home-metric-card strong {
    font-size: 20px;
  }

  #homePanel .customer-live-board {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  #homePanel .customer-live-board > .live-orders-card,
  #homePanel .customer-live-board > .realtime-card,
  #homePanel .customer-live-board > .home-proof-panel,
  #homePanel .customer-live-board > .home-actions-card,
  #homePanel .customer-live-board > .home-activity-card {
    grid-column: 1;
    grid-row: auto;
  }

  #homePanel .customer-live-board > .realtime-card {
    position: static;
    max-height: none;
    overflow: visible;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(255, 255, 255, .96);
    box-shadow: var(--shadow-sm);
  }

  #homePanel .live-orders-card {
    padding: 12px;
    border-radius: 22px;
  }

  #homePanel .live-orders-card .card-heading.home-orders-heading {
    margin-bottom: 8px;
  }

  #homePanel .home-board-toolbar {
    gap: 8px;
    padding: 10px;
    border-radius: 18px;
  }

  #homePanel .home-board-summary-chips,
  #homePanel .home-board-filters {
    gap: 6px;
  }

  #homePanel .home-board-summary-chips span,
  #homePanel .home-board-filter {
    min-height: 26px;
    padding: 5px 9px;
    font-size: 11px;
  }

  #homePanel .home-board-search {
    min-height: 38px;
    flex: 1 1 260px;
  }

  #homePanel .home-board-refresh {
    min-height: 38px;
  }

  #homePanel .home-delivery-table {
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }

  #homePanel .home-delivery-head,
  #homePanel .home-order-board-v3 .home-delivery-row,
  #homePanel .home-order-board-v4 .home-delivery-row,
  #homePanel .home-order-board-v6 .home-delivery-row {
    min-width: 860px;
    display: grid;
    grid-template-columns: minmax(92px, .82fr) minmax(132px, 1.08fr) minmax(150px, 1.22fr) minmax(94px, .72fr) minmax(78px, .58fr) minmax(112px, .84fr) minmax(58px, .44fr);
    align-items: center;
    gap: 8px;
  }

  #homePanel .home-delivery-head {
    padding: 0 10px 5px;
  }

  #homePanel .home-order-board-v3 .home-delivery-row,
  #homePanel .home-order-board-v4 .home-delivery-row,
  #homePanel .home-order-board-v6 .home-delivery-row {
    min-height: 58px;
    padding: 8px 10px;
    border-radius: 15px;
  }

  #homePanel .home-order-board-v3 .home-delivery-row .delivery-cell,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-cell,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-cell {
    display: block;
    width: auto;
  }

  #homePanel .home-order-board-v3 .home-delivery-row .delivery-status::before,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-eta::before,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-driver::before,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-proof::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-status::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-eta::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-driver::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-proof::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-status::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-eta::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-driver::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-proof::before {
    content: none !important;
    display: none !important;
  }

  #homePanel .home-order-card-list {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}

@media (min-width: 761px) and (max-width: 1120px) {
  .topbar-compact {
    grid-template-columns: 1fr;
  }

  .topbar-compact .topbar-actions {
    justify-content: flex-start;
    max-width: 100%;
  }

  .topbar-compact .topbar-greeting {
    max-width: 100%;
  }

  #homePanel .home-metrics.metrics-5 {
    grid-template-columns: repeat(5, minmax(104px, 1fr));
    overflow-x: auto;
    scroll-snap-type: x proximity;
    padding-bottom: 4px;
    scrollbar-width: none;
  }

  #homePanel .home-metrics.metrics-5::-webkit-scrollbar {
    display: none;
  }

  #homePanel .home-metric-card {
    scroll-snap-align: start;
  }
}

@media (max-width: 760px) {
  #homePanel .home-order-board-v3 .home-delivery-row,
  #homePanel .home-order-board-v4 .home-delivery-row,
  #homePanel .home-order-board-v6 .home-delivery-row {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 10px;
    border-radius: 18px;
  }

  #homePanel .home-order-board-v3 .home-delivery-row .delivery-cell,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-cell,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-cell {
    display: grid;
    grid-template-columns: minmax(76px, .32fr) minmax(0, 1fr);
    gap: 7px;
    align-items: center;
  }

  #homePanel .home-order-board-v3 .home-delivery-row .delivery-id,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-id,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-id,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-proof,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-proof,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-proof {
    grid-template-columns: 1fr;
  }

  #homePanel .home-delivery-table {
    overflow: visible;
  }

  #homePanel .home-delivery-head {
    display: none;
  }
}

/* Ajuste v97 — responsividade real da Home em telas intermediárias
   Corrige a colisão de regras antigas que transformavam a linha rica de pedidos
   em um card vertical grande entre desktop e mobile. */
@media (min-width: 761px) and (max-width: 1500px) {
  .app-shell {
    grid-template-columns: clamp(218px, 18vw, 244px) minmax(0, 1fr);
  }

  .main-area {
    padding: 16px clamp(12px, 2vw, 22px) 42px;
  }

  body[data-current-view="home"] .topbar-compact,
  .topbar-compact {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, auto);
    align-items: start;
    gap: 10px 14px;
    margin-bottom: 10px;
  }

  .topbar-compact .topbar-identity,
  .topbar-compact .topbar-title-row,
  .topbar-compact .company-switcher,
  .topbar-compact .company-switcher summary {
    max-width: 100%;
    min-width: 0;
  }

  .topbar-compact .topbar-greeting {
    max-width: min(100%, 520px);
    font-size: clamp(23px, 2.5vw, 32px);
    line-height: 1.08;
  }

  .topbar-compact .page-subtitle {
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.3;
  }

  .topbar-compact .topbar-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    max-width: 520px;
  }

  .topbar-compact .sync-chip,
  .topbar-compact .global-search-trigger,
  .topbar-compact .install-chip,
  .topbar-compact .referral-chip,
  .topbar-compact .icon-button {
    min-height: 38px;
  }

  .topbar-compact .global-search-trigger,
  .topbar-compact .install-chip,
  .topbar-compact .referral-chip {
    padding: 8px 12px;
  }

  #homePanel .home-metrics.metrics-5 {
    display: grid;
    grid-template-columns: repeat(5, minmax(96px, 1fr)) !important;
    gap: 8px;
    margin-bottom: 10px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  #homePanel .home-metrics.metrics-5::-webkit-scrollbar {
    display: none;
  }

  #homePanel .home-metric-card {
    min-height: 58px;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
    padding: 8px 10px;
    border-radius: 16px;
    scroll-snap-align: start;
  }

  #homePanel .home-metric-card .metric-icon {
    width: 30px;
    height: 30px;
    border-radius: 10px;
  }

  #homePanel .home-metric-card .metric-icon svg {
    width: 16px;
    height: 16px;
  }

  #homePanel .home-metric-card p {
    font-size: 11px;
    line-height: 1.15;
  }

  #homePanel .home-metric-card strong {
    font-size: 20px;
    line-height: 1.05;
  }

  #homePanel .customer-live-board {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px;
  }

  #homePanel .customer-live-board > .live-orders-card,
  #homePanel .customer-live-board > .realtime-card,
  #homePanel .customer-live-board > .home-proof-panel,
  #homePanel .customer-live-board > .home-actions-card,
  #homePanel .customer-live-board > .home-activity-card {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  #homePanel .customer-live-board > .realtime-card {
    position: static !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow: var(--shadow-sm);
  }

  #homePanel .live-orders-card {
    padding: 12px;
    border-radius: 22px;
  }

  #homePanel .card-heading.home-orders-heading,
  #homePanel .live-orders-card .home-orders-heading {
    margin-bottom: 8px;
  }

  #homePanel .home-board-toolbar {
    gap: 8px;
    padding: 10px;
    border-radius: 18px;
  }

  #homePanel .home-board-summary-chips,
  #homePanel .home-board-filters {
    gap: 6px;
  }

  #homePanel .home-board-summary-chips span,
  #homePanel .home-board-filter {
    min-height: 26px;
    padding: 5px 9px;
    font-size: 11px;
  }

  #homePanel .home-board-tools {
    gap: 8px;
  }

  #homePanel .home-board-search {
    min-height: 38px;
    flex: 1 1 260px;
  }

  #homePanel .home-board-refresh {
    min-height: 38px;
  }

  #homePanel .home-delivery-table {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }

  #homePanel .home-delivery-head,
  #homePanel .home-order-board-v3 .home-delivery-row,
  #homePanel .home-order-board-v4 .home-delivery-row,
  #homePanel .home-order-board-v6 .home-delivery-row {
    display: grid !important;
    grid-template-columns: minmax(90px, .82fr) minmax(126px, 1.05fr) minmax(148px, 1.22fr) minmax(88px, .70fr) minmax(72px, .56fr) minmax(106px, .80fr) minmax(54px, .42fr) !important;
    min-width: 780px !important;
    max-width: none !important;
    align-items: center !important;
    gap: 8px !important;
  }

  #homePanel .home-delivery-head {
    padding: 0 10px 5px;
  }

  #homePanel .home-order-board-v3 .home-delivery-row,
  #homePanel .home-order-board-v4 .home-delivery-row,
  #homePanel .home-order-board-v6 .home-delivery-row {
    min-height: 56px !important;
    padding: 8px 10px !important;
    border-radius: 15px !important;
  }

  #homePanel .home-order-board-v3 .home-delivery-row > .delivery-cell,
  #homePanel .home-order-board-v4 .home-delivery-row > .delivery-cell,
  #homePanel .home-order-board-v6 .home-delivery-row > .delivery-cell {
    grid-column: auto !important;
    grid-row: auto !important;
    display: block !important;
    width: auto !important;
    min-width: 0 !important;
    align-self: center !important;
  }

  #homePanel .home-order-board-v3 .home-delivery-row .delivery-status::before,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-eta::before,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-driver::before,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-proof::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-status::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-eta::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-driver::before,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-proof::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-status::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-eta::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-driver::before,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-proof::before {
    content: none !important;
    display: none !important;
  }

  #homePanel .delivery-id strong,
  #homePanel .delivery-id span,
  #homePanel .delivery-address small,
  #homePanel .delivery-address span,
  #homePanel .delivery-eta strong,
  #homePanel .delivery-eta span,
  #homePanel .delivery-driver .driver-mini strong,
  #homePanel .delivery-driver .driver-mini span {
    white-space: nowrap;
  }

  #homePanel .delivery-driver .driver-mini {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 7px;
  }

  #homePanel .delivery-driver .driver-avatar {
    width: 30px;
    height: 30px;
    font-size: 10px;
  }

  #homePanel .proof-thumb-card,
  #homePanel .proof-thumb-card.compact {
    width: 54px;
    height: 40px;
    border-radius: 12px;
  }

  #homePanel .home-order-card-list {
    max-height: none !important;
    overflow: visible !important;
    padding-right: 0 !important;
  }

  #homePanel .home-selected-detail {
    gap: 8px;
  }

  #homePanel .home-selected-map-wrap .customer-route-map svg,
  #homePanel .home-route-map.home-selected-map.customer-route-map svg,
  #homePanel .customer-route-map.home-route-map.home-selected-map svg {
    height: clamp(138px, 18vw, 178px);
  }
}

@media (min-width: 761px) and (max-width: 1120px) {
  body[data-current-view="home"] .topbar-compact,
  .topbar-compact {
    grid-template-columns: 1fr;
  }

  .topbar-compact .topbar-actions {
    justify-content: flex-start;
    max-width: 100%;
  }

  #homePanel .home-metrics.metrics-5 {
    grid-template-columns: repeat(5, minmax(104px, 1fr)) !important;
  }

  #homePanel .home-delivery-head,
  #homePanel .home-order-board-v3 .home-delivery-row,
  #homePanel .home-order-board-v4 .home-delivery-row,
  #homePanel .home-order-board-v6 .home-delivery-row {
    min-width: 730px !important;
    grid-template-columns: 84px 116px 136px 86px 70px 100px 48px !important;
  }
}

@media (max-width: 760px) {
  #homePanel .home-delivery-table {
    overflow: visible !important;
  }

  #homePanel .home-delivery-head {
    display: none !important;
  }

  #homePanel .home-order-board-v3 .home-delivery-row,
  #homePanel .home-order-board-v4 .home-delivery-row,
  #homePanel .home-order-board-v6 .home-delivery-row {
    min-width: 0 !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 10px !important;
    border-radius: 18px !important;
  }

  #homePanel .home-order-board-v3 .home-delivery-row > .delivery-cell,
  #homePanel .home-order-board-v4 .home-delivery-row > .delivery-cell,
  #homePanel .home-order-board-v6 .home-delivery-row > .delivery-cell {
    grid-column: auto !important;
    display: grid !important;
    grid-template-columns: minmax(76px, .32fr) minmax(0, 1fr) !important;
    gap: 7px !important;
    align-items: center !important;
  }

  #homePanel .home-order-board-v3 .home-delivery-row .delivery-id,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-id,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-id,
  #homePanel .home-order-board-v3 .home-delivery-row .delivery-proof,
  #homePanel .home-order-board-v4 .home-delivery-row .delivery-proof,
  #homePanel .home-order-board-v6 .home-delivery-row .delivery-proof {
    grid-template-columns: 1fr !important;
  }
}

/* Simplificação fase 3 — Home como resumo/atalhos, não como segunda tela de acompanhamento. */
.home-simple-board {
  grid-template-columns: minmax(280px, 0.95fr) minmax(360px, 1.35fr);
  align-items: start;
}
.home-simple-board > .home-start-card {
  grid-column: 1;
}
.home-simple-board > .home-next-card {
  grid-column: 2;
  grid-row: span 2;
}
.home-simple-board > .home-proof-panel {
  grid-column: 1;
}
.home-order-board-simple .home-board-toolbar {
  margin-bottom: 14px;
}
.home-order-board-simple .home-board-tools,
.home-order-board-simple .home-board-filters,
.home-order-board-simple .home-board-search {
  display: none !important;
}
.home-next-delivery-list {
  display: grid;
  gap: 12px;
}
.home-next-delivery-card {
  margin: 0;
  cursor: pointer;
}
.home-next-delivery-card .tracking-item-meta {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.home-next-delivery-card .tracking-item-footer {
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  padding-top: 10px;
}
@media (max-width: 1180px) {
  .home-simple-board {
    grid-template-columns: 1fr;
  }
  .home-simple-board > .home-start-card,
  .home-simple-board > .home-next-card,
  .home-simple-board > .home-proof-panel {
    grid-column: 1;
    grid-row: auto;
  }
}
@media (max-width: 760px) {
  .home-next-delivery-card .tracking-item-meta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Fase 3 — Home simplificada: a página inicial orienta; Minhas entregas concentra a operação. */
.home-simple-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  gap: 18px;
  align-items: start;
}
.home-next-step-card,
.home-recent-deliveries-card,
.home-proof-panel-simple {
  min-width: 0;
}
.home-next-step-card {
  grid-column: 1;
}
.home-recent-deliveries-card {
  grid-column: 2;
  grid-row: 1 / span 2;
  position: sticky;
  top: 18px;
}
.home-proof-panel-simple {
  grid-column: 1;
}
.home-primary-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.home-primary-action {
  min-height: 92px;
  align-items: center;
}
.home-recent-deliveries-list,
.home-simple-delivery-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}
.home-order-board-simple {
  display: grid;
  gap: 10px;
}
.home-simple-delivery-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  padding: 13px 14px;
  cursor: pointer;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.home-simple-delivery-card:hover,
.home-simple-delivery-card:focus-visible {
  border-color: rgba(242, 165, 26, .45);
  box-shadow: 0 16px 36px rgba(15, 23, 42, .08);
  transform: translateY(-1px);
  outline: none;
}
.home-simple-delivery-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}
.home-simple-delivery-main .status-chip {
  justify-self: end;
  max-width: 180px;
  white-space: normal;
  text-align: center;
  line-height: 1.2;
}
.home-simple-delivery-title {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.home-simple-delivery-title strong,
.home-simple-delivery-title span,
.home-simple-delivery-route span,
.home-simple-delivery-foot span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-simple-delivery-title strong {
  color: var(--ink);
  font-size: 15px;
  font-weight: 950;
}
.home-simple-delivery-title span,
.home-simple-delivery-route small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}
.home-simple-delivery-route {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  border-top: 1px dashed var(--line);
  border-bottom: 1px dashed var(--line);
  padding: 9px 0;
}
.home-simple-delivery-route > div {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.home-simple-delivery-route span {
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
}
.home-simple-delivery-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}
.home-simple-delivery-foot > span,
.home-simple-delivery-foot .scope-pill,
.home-simple-delivery-foot .routing-scope-pill {
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fcfcfd;
  color: var(--muted);
  padding: 5px 8px;
  font-size: 11px;
  font-weight: 900;
}
.home-simple-delivery-foot > span.ready {
  border-color: rgba(21, 128, 61, .22);
  color: var(--success);
  background: var(--success-soft);
}
.home-simple-delivery-foot > span.muted {
  color: var(--muted);
}
.home-simple-empty {
  margin: 0;
}
@media (max-width: 1180px) {
  .home-simple-grid {
    grid-template-columns: 1fr;
  }
  .home-next-step-card,
  .home-recent-deliveries-card,
  .home-proof-panel-simple {
    grid-column: 1;
  }
  .home-recent-deliveries-card {
    grid-row: auto;
    position: static;
  }
}
@media (max-width: 720px) {
  .home-primary-actions {
    grid-template-columns: 1fr;
  }
  .home-simple-delivery-main {
    grid-template-columns: 1fr;
  }
  .home-simple-delivery-main .status-chip {
    justify-self: start;
  }
}


/* Fase 3.1 — responsividade transversal da Home simplificada.
   O bloco do Início também usa a classe customer-live-board, que tinha regras antigas
   mais específicas. Estas regras vencem essas heranças e impedem sobreposição entre
   atalhos, últimas entregas e comprovantes em telas intermediárias. */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

.app-shell,
.main-area,
.view-panel,
#homePanel,
#homePanel .card,
#homePanel .metric-grid,
#homePanel .home-metrics,
#homePanel .customer-live-board.home-simple-grid,
#homePanel .home-next-step-card,
#homePanel .home-recent-deliveries-card,
#homePanel .home-proof-panel-simple,
#homePanel .home-primary-actions,
#homePanel .home-primary-action,
#homePanel .home-recent-deliveries-list,
#homePanel .home-simple-delivery-card,
#homePanel .home-simple-delivery-main,
#homePanel .home-simple-delivery-title,
#homePanel .home-simple-delivery-route,
#homePanel .home-simple-delivery-foot {
  min-width: 0;
  max-width: 100%;
}

.main-area {
  overflow-x: clip;
  padding-bottom: max(54px, calc(88px + env(safe-area-inset-bottom, 0px)));
}
@supports not (overflow: clip) {
  .main-area { overflow-x: hidden; }
}

#homePanel {
  container-type: inline-size;
}

#homePanel .customer-live-board.home-simple-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.12fr) minmax(clamp(280px, 28%, 360px), .78fr) !important;
  gap: clamp(12px, 1.4vw, 18px) !important;
  align-items: start !important;
  width: 100%;
  margin-top: 18px;
  overflow: visible;
}

#homePanel .customer-live-board.home-simple-grid > .home-next-step-card {
  grid-column: 1 !important;
  grid-row: 1 !important;
}

#homePanel .customer-live-board.home-simple-grid > .home-recent-deliveries-card {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: start;
  position: sticky;
  top: 16px;
  z-index: 0;
}

#homePanel .customer-live-board.home-simple-grid > .home-proof-panel-simple {
  grid-column: 1 !important;
  grid-row: 2 !important;
}

#homePanel .home-primary-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(10px, 1.2vw, 12px) !important;
}

#homePanel .home-primary-action {
  width: 100%;
  overflow: hidden;
}

#homePanel .home-primary-action > div,
#homePanel .home-primary-action strong,
#homePanel .home-primary-action span,
#homePanel .home-simple-delivery-title strong,
#homePanel .home-simple-delivery-title span,
#homePanel .home-simple-delivery-route span,
#homePanel .home-simple-delivery-route small,
#homePanel .home-simple-delivery-foot > span {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}

#homePanel .home-recent-deliveries-list {
  max-height: min(62dvh, 640px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
  scrollbar-width: thin;
}

#homePanel .home-simple-delivery-main .status-chip {
  max-width: 100%;
}

.topbar-compact,
.topbar-compact .topbar-identity,
.topbar-compact .topbar-actions {
  min-width: 0;
  max-width: 100%;
}

.topbar-compact .topbar-actions {
  flex-wrap: wrap;
}

.topbar-compact .sync-chip,
.topbar-compact .global-search-trigger,
.topbar-compact .install-chip,
.topbar-compact .referral-chip {
  min-width: 0;
}

@container (max-width: 1080px) {
  #homePanel .customer-live-board.home-simple-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #homePanel .customer-live-board.home-simple-grid > .home-next-step-card,
  #homePanel .customer-live-board.home-simple-grid > .home-recent-deliveries-card,
  #homePanel .customer-live-board.home-simple-grid > .home-proof-panel-simple {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  #homePanel .customer-live-board.home-simple-grid > .home-recent-deliveries-card {
    position: static !important;
  }

  #homePanel .home-recent-deliveries-list {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}

@media (min-width: 761px) and (max-width: 1400px) {
  body[data-current-view="home"] .topbar-compact,
  .topbar-compact {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .topbar-compact .topbar-actions {
    justify-content: flex-start;
  }

  #homePanel .customer-live-board.home-simple-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #homePanel .customer-live-board.home-simple-grid > .home-next-step-card,
  #homePanel .customer-live-board.home-simple-grid > .home-recent-deliveries-card,
  #homePanel .customer-live-board.home-simple-grid > .home-proof-panel-simple {
    grid-column: 1 !important;
    grid-row: auto !important;
  }

  #homePanel .customer-live-board.home-simple-grid > .home-recent-deliveries-card {
    position: static !important;
  }

  #homePanel .home-recent-deliveries-list {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}

@media (max-width: 860px) {
  #homePanel .home-primary-actions {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #homePanel .home-primary-action {
    min-height: 0;
  }
}

@media (max-width: 760px) {
  .main-area {
    overflow-x: hidden;
    padding-inline: clamp(12px, 4vw, 18px);
    padding-bottom: max(86px, calc(112px + env(safe-area-inset-bottom, 0px)));
  }

  #homePanel .customer-live-board.home-simple-grid {
    gap: 12px !important;
    margin-top: 12px;
  }

  #homePanel .home-metrics.metrics-5 {
    max-width: 100%;
  }

  #homePanel .home-simple-delivery-main {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #homePanel .home-simple-delivery-main .status-chip {
    justify-self: start;
  }

  .quick-support-button {
    right: 12px;
    left: auto;
    max-width: calc(100vw - 24px);
  }
}

@media (max-width: 420px) {
  #homePanel .home-simple-delivery-card {
    padding: 11px;
    border-radius: 16px;
  }

  #homePanel .home-primary-action {
    padding: 12px;
  }

  .topbar-compact .topbar-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .topbar-compact .sync-chip,
  .topbar-compact .global-search-trigger,
  .topbar-compact .install-chip,
  .topbar-compact .referral-chip,
  .topbar-compact .icon-button {
    width: 100%;
    justify-content: center;
  }
}


/* Fase 4 — Nova entrega natural por experiência do cliente */
@media (max-width: 720px) {
  .new-order-optional-toggle-row {
    align-items: stretch;
  }
  .new-order-optional-toggle-row button,
  .new-order-optional-toggle-row span {
    width: 100%;
  }
}

/* Simplificação Fase 5 — Conta como área leve de acesso e empresa */
.account-workspace-simple {
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  grid-auto-flow: row;
}

.account-profile-section,
.account-password-card,
.account-experience-card,
.account-support-card {
  min-width: 0;
}

.account-profile-card-clean {
  margin-bottom: 16px;
}

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

.account-info-grid-clean {
  margin-bottom: 0;
}

.account-password-card .password-form {
  border-top: 0;
  padding-top: 0;
}

.account-view-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0;
}

.account-view-chips span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 11px;
  border: 1px solid rgba(245, 176, 32, .28);
  border-radius: 999px;
  background: rgba(255, 248, 235, .88);
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
}

.account-retired-box {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.account-retired-box strong {
  display: block;
  margin-bottom: 6px;
  color: var(--ink);
}

.account-retired-box p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.account-support-card {
  align-self: start;
}

.account-support-list {
  margin: 0 0 16px;
}

@media (max-width: 1120px) {
  .account-workspace-simple {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .account-workspace-simple {
    gap: 14px;
  }
  .account-chip-row,
  .account-view-chips {
    gap: 6px;
  }
  .account-view-chips span {
    width: 100%;
    justify-content: center;
  }
}

/* Fase 5 — Conta simplificada por experiência do cliente */
.account-section-heading {
  margin-bottom: 18px;
}

.account-simple-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  gap: 18px;
  align-items: start;
}

.account-simple-workspace > .account-overview-card,
.account-simple-workspace > .account-experience-card,
.account-simple-workspace > .account-security-card,
.account-simple-workspace > .account-admin-card {
  min-width: 0;
}

.account-overview-card,
.account-experience-card,
.account-security-card,
.account-admin-card {
  grid-column: 1;
}

.account-guide-card-clean {
  grid-column: 2;
  grid-row: 1 / span 4;
  position: sticky;
  top: 18px;
}

.account-profile-card-compact {
  margin-bottom: 18px;
}

.account-profile-card-compact .muted {
  margin: 2px 0 8px;
}

.account-info-grid-compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-experience-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.account-experience-grid article {
  border: 1px solid var(--border-soft);
  border-radius: 18px;
  padding: 14px;
  background: rgba(248,250,252,.78);
  min-width: 0;
}

.account-experience-grid span {
  display: block;
  color: var(--muted);
  font-size: .77rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
  margin-bottom: 6px;
}

.account-experience-grid strong {
  display: block;
  color: var(--ink);
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.account-experience-views {
  margin: 14px 0 0;
}

.account-simple-details {
  border: 1px solid var(--border-soft);
  border-radius: 20px;
  background: rgba(248,250,252,.7);
  overflow: hidden;
}

.account-simple-details > summary {
  list-style: none;
  cursor: pointer;
  padding: 16px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.account-simple-details > summary::-webkit-details-marker {
  display: none;
}

.account-simple-details > summary::after {
  content: 'Abrir';
  font-size: .82rem;
  font-weight: 900;
  color: var(--accent);
  border: 1px solid rgba(242,165,26,.35);
  border-radius: 999px;
  padding: 6px 10px;
  background: rgba(255,244,214,.8);
  flex: 0 0 auto;
}

.account-simple-details[open] > summary::after {
  content: 'Fechar';
}

.account-simple-details strong,
.account-simple-details small {
  display: block;
}

.account-simple-details small {
  color: var(--muted);
  font-weight: 600;
  margin-top: 4px;
}

.account-password-form,
.customer-user-form {
  padding: 0 18px 18px;
}

.account-admin-create-details {
  margin-bottom: 16px;
}

.account-users-list {
  display: grid;
  gap: 12px;
}

.inline-notice {
  border: 1px solid rgba(242,165,26,.25);
  background: rgba(255,244,214,.72);
  color: #8a5b00;
  border-radius: 16px;
  padding: 10px 12px;
  font-weight: 800;
  margin-bottom: 14px;
}

.inline-result {
  align-self: center;
  font-weight: 800;
  color: var(--muted);
}

.customer-simplified-portal .account-guide-card-clean p,
.customer-simplified-portal .account-guide-card-clean li span {
  line-height: 1.45;
}

@media (max-width: 1180px) {
  .account-simple-workspace {
    grid-template-columns: 1fr;
  }

  .account-overview-card,
  .account-experience-card,
  .account-security-card,
  .account-admin-card,
  .account-guide-card-clean {
    grid-column: 1;
    grid-row: auto;
  }

  .account-guide-card-clean {
    position: static;
  }
}

@media (max-width: 860px) {
  .account-info-grid-compact,
  .account-experience-grid {
    grid-template-columns: 1fr;
  }

  .account-simple-details > summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .account-simple-details > summary::after {
    align-self: flex-start;
  }
}

@media (max-width: 640px) {
  .account-section-heading,
  .account-section-heading .heading-actions {
    align-items: stretch;
  }

  .account-section-heading .heading-actions,
  .account-section-heading .heading-actions .ghost {
    width: 100%;
  }

  .account-profile-card-compact {
    align-items: flex-start;
  }

  .customer-user-form .grid.four,
  .account-password-form .grid.three {
    grid-template-columns: 1fr;
  }
}

/* Fase 5 — Conta limpa e recursos administrativos fora do fluxo diário */
.account-workspace-clean {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
}

.account-overview-card .account-heading {
  align-items: flex-start;
}

.account-experience-card {
  display: grid;
  grid-template-columns: minmax(220px, .9fr) minmax(0, 1.1fr);
  gap: 16px;
  padding: 16px;
  margin: 6px 0 18px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}

.account-experience-copy h3 {
  margin: 2px 0 6px;
  color: var(--ink);
  font-size: 20px;
}

.account-experience-copy p:last-child {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.account-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.account-feature-item {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  min-width: 0;
}

.account-feature-item strong,
.account-feature-item span,
.account-feature-item em {
  display: block;
}

.account-feature-item strong {
  color: var(--ink);
  font-size: 14px;
}

.account-feature-item span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.account-feature-item em {
  margin-top: 8px;
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.account-feature-item.enabled {
  border-color: rgba(47, 133, 90, .22);
  background: linear-gradient(180deg, #fff, #f6fbf8);
}

.account-feature-item.enabled em {
  color: #2f855a;
}

.account-feature-item.disabled {
  opacity: .74;
  background: #fafafa;
}

.account-feature-item.disabled em {
  color: var(--muted);
}

.account-admin-card .support-list li span {
  line-height: 1.45;
}

.account-support-note {
  margin-top: 16px;
}

.account-support-note button {
  margin-top: 10px;
}

@media (max-width: 1180px) {
  .account-workspace-clean {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 820px) {
  .account-experience-card {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .account-feature-grid {
    grid-template-columns: 1fr;
  }
  .account-overview-card .account-heading {
    gap: 10px;
  }
  .account-overview-card .account-heading > .pill {
    align-self: flex-start;
  }
}

/* Fase 6 — Minha Frota e Rotas seguem a Experiência do cliente */
.routes-advanced-workspace,
.fleet-dashboard {
  min-width: 0;
}

.route-experience-note,
.fleet-actions-row {
  border: 1px solid rgba(16, 24, 40, 0.08);
  background: rgba(255, 250, 239, 0.72);
  border-radius: 18px;
  padding: 14px 16px;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: var(--text-muted, #667085);
}

.route-experience-note strong,
.fleet-actions-row strong {
  color: var(--text-main, #101828);
  white-space: nowrap;
}

.route-experience-note span,
.fleet-actions-row span {
  min-width: 0;
}

.route-experience-pill,
#fleetExperiencePill {
  white-space: nowrap;
}

.fleet-section-heading {
  gap: 16px;
  align-items: flex-start;
}

.fleet-section-heading .heading-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.fleet-simple-grid {
  grid-template-columns: minmax(0, 1.4fr) minmax(160px, .6fr);
}

.fleet-technical-fields {
  display: none !important;
}

.fleet-form-actions.compact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
}

.fleet-form-actions.compact-actions .fleet-checkbox {
  margin-right: auto;
}

.customer-experience-own-fleet-basic .route-screen-shortcut,
.customer-experience-simple-orders .route-screen-shortcut,
.customer-experience-simple-single-routes .route-screen-shortcut {
  display: none !important;
}

.customer-experience-own-fleet-basic .routes-advanced-workspace,
.customer-experience-simple-orders .routes-advanced-workspace,
.customer-experience-simple-single-routes .routes-advanced-workspace {
  opacity: .98;
}

@media (max-width: 1180px) {
  .routes-advanced-workspace,
  .fleet-dashboard {
    grid-template-columns: 1fr !important;
  }

  .route-detail-card,
  .fleet-guide-card {
    min-width: 0;
  }
}

@media (max-width: 820px) {
  .fleet-simple-grid,
  .fleet-agent-card .grid.three,
  .fleet-vehicle-card .grid.two {
    grid-template-columns: 1fr !important;
  }

  .fleet-section-heading,
  .route-experience-note,
  .fleet-actions-row {
    flex-direction: column;
  }

  .fleet-section-heading .heading-actions,
  .card-heading-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .fleet-form-actions.compact-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .fleet-form-actions.compact-actions .fleet-checkbox {
    margin-right: 0;
  }
}


/* Fase 7 — limpeza/responsividade: Minhas entregas sem vazamento lateral */
.orders-workspace,
.orders-card,
.order-detail-card,
.order-list.logistics-board-mode,
.customer-order-board {
  min-width: 0;
  max-width: 100%;
}

.orders-card {
  overflow: hidden;
}

.order-list.logistics-board-mode {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 8px;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
}

.customer-order-board {
  width: 100%;
}

.customer-order-board-head,
.customer-order-board-row.rich-delivery-row {
  max-width: 100%;
}

.customer-order-board-row.rich-delivery-row > *,
.customer-order-board-row.rich-delivery-row .routing-scope-pill,
.customer-order-board-row.rich-delivery-row .status-chip,
.customer-order-board-row.rich-delivery-row .proof-mini-card,
.customer-order-board-row.rich-delivery-row .driver-mini {
  min-width: 0;
  max-width: 100%;
}

.customer-order-board-row.rich-delivery-row .routing-scope-pill,
.customer-order-board-row.rich-delivery-row .status-chip,
.customer-order-board-row.rich-delivery-row .proof-mini-card {
  overflow: hidden;
  text-overflow: ellipsis;
}

.customer-order-address span,
.customer-order-address strong,
.customer-order-id strong,
.customer-order-id span,
.customer-order-id small,
.customer-order-eta strong,
.customer-order-eta span,
.customer-order-driver .driver-mini strong,
.customer-order-driver .driver-mini span {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 1760px) {
  .orders-workspace {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .order-detail-card {
    position: static !important;
  }
}

@media (max-width: 1180px) {
  .customer-order-board-head {
    display: none !important;
  }

  .customer-order-board-row.rich-delivery-row {
    grid-template-columns: 1fr !important;
    gap: 12px;
  }

  .customer-order-board-row.rich-delivery-row > [role="cell"]::before {
    display: block;
    margin-bottom: 3px;
    color: #98a2b3;
    font-size: 10px;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  .customer-order-id::before { content: 'Entrega'; }
  .customer-order-address:nth-of-type(2)::before { content: 'Coleta'; }
  .customer-order-address:nth-of-type(3)::before { content: 'Destino'; }
  .customer-order-status::before { content: 'Status'; }
  .customer-order-eta::before { content: 'Previsão'; }
  .customer-order-driver::before { content: 'Entregador'; }
  .customer-order-pod::before { content: 'Comprovante'; }
}

@media (max-width: 760px) {
  .orders-card,
  .order-detail-card {
    border-radius: 22px;
  }

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

  .customer-order-board-row.rich-delivery-row {
    padding: 13px;
  }
}

@media (max-width: 460px) {
  .orders-summary-grid {
    grid-template-columns: 1fr !important;
  }
}


/* Fase 7.1 — contenção definitiva de Minhas entregas */
#ordersPanel .orders-card,
#ordersPanel .order-list,
#ordersPanel .customer-order-board {
  min-width: 0;
  max-width: 100%;
}

#ordersPanel .orders-card {
  overflow: hidden;
}

#ordersPanel .order-list.logistics-board-mode {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  padding-bottom: 8px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  overscroll-behavior-inline: contain;
}

#ordersPanel .customer-order-board {
  width: max(100%, 920px);
  min-width: 920px;
}

#ordersPanel .customer-order-board-head,
#ordersPanel .customer-order-board-row.rich-delivery-row {
  grid-template-columns: minmax(86px, .76fr) minmax(118px, 1fr) minmax(136px, 1.12fr) minmax(90px, .74fr) minmax(68px, .56fr) minmax(92px, .76fr) minmax(54px, .44fr) !important;
  gap: 8px !important;
  min-width: 0 !important;
  max-width: none !important;
}

#ordersPanel .customer-order-board-row.rich-delivery-row > *,
#ordersPanel .customer-order-id,
#ordersPanel .customer-order-address,
#ordersPanel .customer-order-status,
#ordersPanel .customer-order-eta,
#ordersPanel .customer-order-driver,
#ordersPanel .customer-order-pod,
#ordersPanel .driver-mini,
#ordersPanel .routing-scope-pill {
  min-width: 0;
  max-width: 100%;
}

#ordersPanel .customer-order-id .routing-scope-pill,
#ordersPanel .customer-order-board-row .routing-scope-pill,
#ordersPanel .customer-order-status .status-chip,
#ordersPanel .customer-order-pod .proof-mini-card {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1320px) {
  #ordersPanel .orders-workspace {
    grid-template-columns: 1fr;
  }
  #ordersPanel .order-detail-card {
    position: static;
  }
}

@media (max-width: 1180px) {
  #ordersPanel .order-list.logistics-board-mode {
    overflow-x: visible;
  }
  #ordersPanel .customer-order-board {
    width: 100%;
    min-width: 0;
  }
  #ordersPanel .customer-order-board-head {
    display: none;
  }
  #ordersPanel .customer-order-board-row.rich-delivery-row {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 14px !important;
  }
  #ordersPanel .customer-order-driver,
  #ordersPanel .customer-order-pod {
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  #ordersPanel .card-heading.orders-heading .card-heading-actions,
  #ordersPanel .card-heading.orders-heading .ghost.small {
    width: 100%;
  }
  #ordersPanel .orders-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  #ordersPanel .customer-order-address span,
  #ordersPanel .customer-order-id strong,
  #ordersPanel .customer-order-eta strong,
  #ordersPanel .customer-order-driver .driver-mini strong,
  #ordersPanel .customer-order-driver .driver-mini span {
    white-space: normal;
  }
}

/* Fase 8 — acabamento final de homologação: contenção geral e responsividade segura. */
html,
body,
.app-view,
.app-shell,
.main-area,
.view-panel,
.view-panel.active,
.card,
.content-grid,
.home-grid,
.home-layout,
.orders-workspace,
.orders-card,
.order-detail-card,
.routes-workspace,
.fleet-grid,
.account-grid,
.proofs-workspace,
.support-workspace {
  max-width: 100%;
  min-width: 0;
}

body.authenticated {
  overflow-x: hidden;
}

.main-area,
.view-panel,
.card {
  overflow-wrap: anywhere;
}

.customer-order-board,
.customer-order-board-row,
.customer-order-board-head,
.home-order-card-list,
.home-order-board-v6,
.routes-list,
.proofs-list,
.support-requests-list,
.fleet-summary-grid,
.fleet-list,
.account-summary-grid {
  max-width: 100%;
  min-width: 0;
}

.customer-order-board-row.rich-delivery-row,
.customer-order-board-row.rich-delivery-row > *,
.customer-order-id,
.customer-order-address,
.customer-order-status,
.customer-order-eta,
.customer-order-driver,
.customer-order-pod,
.order-detail-card,
.route-card,
.fleet-card,
.proof-card,
.support-request-card {
  min-width: 0;
  max-width: 100%;
}

.customer-order-id strong,
.customer-order-id span,
.customer-order-id small,
.customer-order-address span,
.customer-order-address small,
.customer-order-eta strong,
.customer-order-eta span,
.customer-order-driver strong,
.customer-order-driver span,
.customer-order-pod strong,
.customer-order-pod span,
.route-card *,
.proof-card *,
.support-request-card * {
  max-width: 100%;
}

@media (max-width: 1380px) {
  #ordersPanel .orders-workspace {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 18px;
  }

  #ordersPanel .customer-order-board-row.rich-delivery-row,
  #ordersPanel .customer-order-board-head {
    grid-template-columns: minmax(120px, .9fr) minmax(140px, 1fr) minmax(160px, 1.15fr) minmax(130px, .85fr) minmax(92px, .65fr);
  }

  #ordersPanel .customer-order-driver,
  #ordersPanel .customer-order-pod {
    display: none;
  }
}

@media (max-width: 1160px) {
  #ordersPanel .orders-workspace,
  #routesPanel .routes-workspace,
  #fleetPanel .fleet-layout,
  #proofsPanel .proofs-workspace,
  #helpPanel .support-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  #ordersPanel .order-detail-card,
  #routesPanel .route-detail-card,
  #fleetPanel .fleet-side-card,
  #proofsPanel .proof-detail-card,
  #helpPanel .support-detail-card {
    position: static;
    top: auto;
  }
}

@media (max-width: 760px) {
  .topbar-actions,
  .orders-toolbar,
  .proofs-toolbar,
  .routes-toolbar,
  .fleet-toolbar,
  .account-toolbar {
    width: 100%;
  }

  .topbar-actions > *,
  .orders-toolbar > *,
  .proofs-toolbar > *,
  .routes-toolbar > *,
  .fleet-toolbar > *,
  .account-toolbar > * {
    max-width: 100%;
  }

  #ordersPanel .customer-order-board-row.rich-delivery-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  #ordersPanel .customer-order-board-row.rich-delivery-row > * {
    width: 100%;
  }

  .floating-support-card,
  .quick-support-button {
    right: 14px;
    left: 14px;
    max-width: calc(100vw - 28px);
  }
}

@media (max-width: 520px) {
  .sidebar,
  .main-area,
  .page-content,
  .view-panel,
  .card {
    width: 100%;
  }

  .metric-grid,
  .home-action-grid,
  .fleet-summary-grid,
  .account-summary-grid,
  .orders-summary-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .command-palette-card,
  .modal-card {
    width: calc(100vw - 24px);
    max-width: calc(100vw - 24px);
  }
}


/* Fase 8 — homologação final: contenção global e experiência consistente */
html,
body,
#appView,
.app-shell,
.main-area,
.view-panel,
.card,
.rich-card,
.orders-card,
.order-detail-card,
.fleet-card,
.routes-card,
.proofs-card,
.account-card,
.help-card {
  max-width: 100%;
  min-width: 0;
}

html,
body {
  overflow-x: hidden;
}

.view-panel:not(.active) {
  display: none !important;
}

img,
svg,
canvas,
video,
iframe,
table {
  max-width: 100%;
}

button,
input,
select,
textarea,
.badge,
.status-chip,
.routing-scope-pill,
.proof-mini-card,
.driver-mini,
.account-feature-item,
.fleet-agent-card,
.fleet-vehicle-card,
.route-card,
.support-card {
  min-width: 0;
}

.card-heading,
.topbar,
.home-action-grid,
.orders-toolbar,
.fleet-section-heading,
.route-experience-note,
.fleet-actions-row,
.account-feature-list,
.proof-list,
.support-list {
  min-width: 0;
  max-width: 100%;
}

[data-retired-view],
.nav-item.permission-hidden,
[data-open-view].permission-hidden {
  display: none !important;
}

@media (max-width: 1280px) {
  .main-area {
    padding-inline: clamp(14px, 2vw, 24px);
  }

  .topbar-actions {
    flex-wrap: wrap;
  }
}

@media (max-width: 980px) {
  .topbar-search,
  .topbar-actions,
  .topbar-actions > * {
    min-width: 0;
  }

  .topbar-actions {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .main-area {
    padding-inline: 12px;
  }

  .card,
  .rich-card,
  .orders-card,
  .order-detail-card,
  .fleet-card,
  .routes-card,
  .proofs-card,
  .account-card,
  .help-card {
    border-radius: 20px;
  }

  .floating-support-button {
    right: 12px;
    bottom: 12px;
    max-width: calc(100vw - 24px);
  }
}


/* Hotfix v118 — Nova entrega: layout profissional, resumo estável e responsivo */
#newOrderPanel {
  --order-aside-width: clamp(340px, 28vw, 430px);
}

#newOrderPanel .order-layout {
  grid-template-columns: minmax(0, 1fr) var(--order-aside-width);
  gap: 24px;
  align-items: start;
}

#newOrderPanel .order-form,
#newOrderPanel .order-aside .sticky-card {
  border: 1px solid rgba(213, 219, 227, .82);
  box-shadow: 0 18px 46px rgba(15, 23, 42, .055);
}

#newOrderPanel .order-form {
  padding: clamp(22px, 2vw, 30px);
}

#newOrderPanel .form-intro {
  align-items: flex-start;
  gap: 18px;
}

#newOrderPanel .form-intro h2 {
  margin-bottom: 8px;
  letter-spacing: -.02em;
}

#newOrderPanel .form-intro p {
  max-width: 760px;
  line-height: 1.6;
}

#newOrderPanel .intro-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  min-width: max-content;
}

#newOrderPanel .new-order-experience-hint {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 14px 16px;
  border-radius: 18px;
  line-height: 1.55;
}

#newOrderPanel .order-progress {
  gap: 10px;
}

#newOrderPanel .progress-step {
  min-width: 0;
  padding: 11px 12px;
  border-radius: 16px;
}

#newOrderPanel .progress-step strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#newOrderPanel .form-section {
  padding: 22px 0 10px;
}

#newOrderPanel .section-title h3 {
  margin-bottom: 4px;
}

#newOrderPanel .section-title p {
  max-width: 780px;
  line-height: 1.55;
}

#newOrderPanel input,
#newOrderPanel textarea,
#newOrderPanel select {
  min-height: 50px;
  border-color: rgba(213, 219, 227, .95);
  background: rgba(255, 255, 255, .98);
}

#newOrderPanel textarea {
  min-height: 112px;
}

#newOrderPanel .order-aside {
  min-width: 0;
  align-self: stretch;
}

#newOrderPanel .order-aside .sticky-card {
  padding: 24px;
  overflow: hidden;
}

#newOrderPanel .order-aside .card-heading {
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--line);
}

#newOrderPanel .order-aside .card-heading h2 {
  letter-spacing: -.02em;
}

#newOrderPanel .order-aside .card-heading p {
  line-height: 1.55;
}

#newOrderPanel .readiness-box {
  gap: 14px;
  margin: 0 0 18px;
  padding: 16px;
  border-radius: 20px;
  background: linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%);
}

#newOrderPanel .readiness-score {
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
}

#newOrderPanel .readiness-score strong {
  min-width: 64px;
  min-height: 44px;
  padding: 8px 12px;
  font-size: 17px;
}

#newOrderPanel .readiness-score span {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  line-height: 1.45;
}

#newOrderPanel .readiness-list {
  gap: 9px;
}

#newOrderPanel .readiness-list li {
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
}

#newOrderPanel .readiness-list li::before {
  width: 20px;
  height: 20px;
  margin-top: 1px;
}

#newOrderPanel .readiness-item-text {
  display: grid;
  gap: 3px;
  min-width: 0;
}

#newOrderPanel .readiness-item-text strong {
  min-width: 0;
  color: inherit;
  font-size: 13px;
  font-weight: 780;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

#newOrderPanel .readiness-item-text small {
  width: fit-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--slate-soft);
  color: var(--slate);
  font-size: 10px;
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}

#newOrderPanel .route-preview {
  display: grid;
  gap: 0;
  margin-top: 16px;
  padding: 16px;
  border: 1px solid rgba(213, 219, 227, .82);
  border-radius: 20px;
  background: #fff;
}

#newOrderPanel .route-point {
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 12px;
}

#newOrderPanel .route-point > span {
  width: 20px;
  height: 20px;
}

#newOrderPanel .route-point strong {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
}

#newOrderPanel .route-point p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

#newOrderPanel .route-line {
  height: 36px;
  margin-left: 10px;
}

#newOrderPanel .summary-list {
  gap: 8px;
  margin-top: 14px;
}

#newOrderPanel .summary-list div {
  display: grid;
  grid-template-columns: minmax(92px, .8fr) minmax(0, 1.2fr);
  align-items: start;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid rgba(231, 235, 240, .72);
  background: #fff;
}

#newOrderPanel .summary-list dt {
  min-width: 0;
  line-height: 1.35;
}

#newOrderPanel .summary-list dd {
  min-width: 0;
  text-align: right;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

#newOrderPanel .summary-submit {
  min-height: 52px;
  margin-top: 18px;
}

@media (max-width: 1320px) {
  #newOrderPanel {
    --order-aside-width: minmax(320px, 370px);
  }
  #newOrderPanel .order-layout {
    gap: 18px;
  }
}

@media (max-width: 1240px) {
  #newOrderPanel .order-layout {
    grid-template-columns: 1fr;
  }
  #newOrderPanel .sticky-card {
    position: static;
  }
  #newOrderPanel .order-aside .sticky-card {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 18px;
    align-items: start;
  }
  #newOrderPanel .order-aside .card-heading,
  #newOrderPanel .summary-submit,
  #newOrderPanel .success-box {
    grid-column: 1 / -1;
  }
  #newOrderPanel .readiness-box {
    margin-bottom: 0;
  }
  #newOrderPanel .route-preview,
  #newOrderPanel .summary-list {
    margin-top: 0;
  }
}

@media (max-width: 860px) {
  #newOrderPanel .form-intro {
    display: grid;
  }
  #newOrderPanel .intro-actions {
    align-items: stretch;
    min-width: 0;
  }
  #newOrderPanel .intro-actions .pill,
  #newOrderPanel .intro-actions .draft-chip {
    justify-content: center;
    text-align: center;
  }
  #newOrderPanel .order-aside .sticky-card {
    grid-template-columns: 1fr;
  }
  #newOrderPanel .readiness-box,
  #newOrderPanel .route-preview,
  #newOrderPanel .summary-list {
    margin-top: 0;
  }
}

@media (max-width: 720px) {
  #newOrderPanel .order-form,
  #newOrderPanel .order-aside .sticky-card {
    padding: 18px;
    border-radius: 20px;
  }
  #newOrderPanel .order-progress {
    grid-template-columns: 1fr;
  }
  #newOrderPanel .progress-step strong {
    white-space: normal;
  }
  #newOrderPanel .grid.two,
  #newOrderPanel .grid.three {
    grid-template-columns: 1fr;
  }
  #newOrderPanel .inline-actions {
    margin-left: 0;
  }
  #newOrderPanel .summary-list div {
    grid-template-columns: 1fr;
  }
  #newOrderPanel .summary-list dd {
    text-align: left;
  }
}

@media (max-width: 460px) {
  #newOrderPanel .order-form,
  #newOrderPanel .order-aside .sticky-card {
    padding: 15px;
  }
  #newOrderPanel .readiness-score {
    grid-template-columns: 1fr;
  }
  #newOrderPanel .readiness-score strong {
    justify-content: flex-start;
    width: fit-content;
  }
  #newOrderPanel .route-preview {
    padding: 14px;
  }
}

/* v119 — detalhe de Minhas entregas compacto e progressivo */
.compact-delivery-detail {
  display: grid;
  gap: 14px;
}
.compact-detail-hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.compact-detail-title {
  min-width: 0;
}
.compact-detail-title h2 {
  margin-bottom: 6px;
  font-size: 28px;
  line-height: 1.05;
}
.compact-detail-title .muted {
  margin-bottom: 0;
  overflow-wrap: anywhere;
}
.compact-delivery-detail .detail-routing-chip {
  margin: 6px 0 8px;
}
.compact-delivery-detail .tracking-progress.compact-progress {
  margin: 0;
}
.compact-next-step {
  margin: 0;
}
.compact-delivery-main {
  display: grid;
  gap: 12px;
}
.compact-route-summary {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
}
.compact-route-point {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
}
.compact-route-point > span {
  width: 12px;
  height: 12px;
  margin-top: 5px;
  border-radius: 999px;
  background: var(--brand);
  box-shadow: 0 0 0 5px rgba(242, 165, 26, .13);
}
.compact-route-point.end > span {
  background: var(--success);
  box-shadow: 0 0 0 5px rgba(21, 128, 61, .12);
}
.compact-route-point strong {
  display: block;
  margin-bottom: 2px;
  color: var(--ink);
}
.compact-route-point p {
  margin: 0;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.compact-delivery-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.compact-delivery-facts > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}
.compact-delivery-facts span,
.compact-delivery-facts small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.compact-delivery-facts span {
  text-transform: uppercase;
  letter-spacing: .04em;
}
.compact-delivery-facts strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.compact-delivery-facts small {
  margin-top: 3px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
}
.compact-detail-actions,
.compact-more-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.compact-more-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding-top: 10px;
}
.compact-detail-actions .ghost,
.compact-detail-actions .primary,
.compact-more-actions .ghost,
.compact-more-actions .primary {
  width: 100%;
}
.delivery-detail-sections {
  display: grid;
  gap: 10px;
}
.delivery-detail-section {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  overflow: hidden;
}
.delivery-detail-section[open] {
  border-color: rgba(242, 165, 26, .34);
  box-shadow: 0 12px 26px rgba(15, 23, 42, .05);
}
.delivery-detail-section summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  cursor: pointer;
  padding: 14px 16px;
  list-style: none;
}
.delivery-detail-section summary::-webkit-details-marker {
  display: none;
}
.delivery-detail-section-title {
  min-width: 0;
}
.delivery-detail-section-title strong,
.delivery-detail-section-title span {
  display: block;
}
.delivery-detail-section-title strong {
  color: var(--ink);
  font-size: 15px;
}
.delivery-detail-section-title span {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
}
.section-chevron {
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #f8fafc;
  color: var(--muted);
  font-weight: 900;
  transition: transform .18s ease, background .18s ease;
}
.delivery-detail-section[open] .section-chevron {
  transform: rotate(180deg);
  background: var(--brand-soft);
  color: #9a5f00;
}
.delivery-detail-section-body {
  padding: 0 16px 16px;
}
.delivery-detail-section-body .detail-section,
.delivery-detail-section-body .detail-route,
.delivery-detail-section-body .pod-card,
.delivery-detail-section-body .detail-route-map,
.delivery-detail-section-body .customer-route-map,
.delivery-detail-section-body .route-status-panel,
.delivery-detail-section-body .driver-detail-card,
.delivery-detail-section-body .customer-operation-panel,
.delivery-detail-section-body .routing-responsibility-card,
.delivery-detail-section-body .contact-policy-card {
  margin-top: 0;
  margin-bottom: 12px;
}
.delivery-detail-section-body .detail-section {
  padding-top: 0;
  border-bottom: 0;
}
.delivery-detail-section-body .customer-timeline {
  margin-bottom: 0;
}
.delivery-detail-section-body .detail-route-map.compact-map,
.delivery-detail-section-body .detail-route-map {
  margin: 0 0 12px;
}
.delivery-detail-section-body .customer-route-map {
  min-height: 220px;
}
.compact-info-grid {
  margin-bottom: 12px;
}

@media (max-width: 960px) {
  .compact-delivery-facts,
  .compact-detail-actions,
  .compact-more-actions {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .compact-detail-hero {
    flex-direction: column;
  }
  .compact-detail-hero > .status-chip {
    align-self: flex-start;
  }
  .delivery-detail-section summary {
    padding: 13px 14px;
  }
  .delivery-detail-section-body {
    padding: 0 14px 14px;
  }
  .compact-route-summary,
  .compact-delivery-facts > div {
    border-radius: 15px;
  }
}

/* v120 — Minhas entregas em cockpit: lista à esquerda, detalhe à direita */
#ordersPanel .orders-workspace {
  display: grid;
  align-items: stretch;
}

@media (min-width: 1100px) {
  #ordersPanel .orders-workspace {
    grid-template-columns: minmax(430px, .92fr) minmax(470px, 1.08fr) !important;
    gap: 20px !important;
    min-height: min(760px, calc(100vh - 174px));
    height: calc(100vh - 174px);
    max-height: 860px;
  }

  #ordersPanel .orders-card,
  #ordersPanel .order-detail-card {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  #ordersPanel .order-detail-card {
    position: sticky !important;
    top: 18px;
  }

  #ordersPanel .orders-card .orders-heading,
  #ordersPanel .orders-card .orders-summary-grid,
  #ordersPanel .orders-card .orders-toolbar,
  #ordersPanel .orders-card .status-filter-row,
  #ordersPanel .orders-card .orders-count-label {
    flex: 0 0 auto;
  }

  #ordersPanel .order-list.split-delivery-list-mode,
  #ordersPanel .order-list.logistics-board-mode {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding-right: 4px;
    padding-bottom: 4px;
    scrollbar-width: thin;
  }

  #ordersPanel #orderDetail {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
    scrollbar-width: thin;
  }
}

.customer-delivery-split-list {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.delivery-split-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: linear-gradient(180deg, #fff, #fffdf8);
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}

.delivery-split-card:hover,
.delivery-split-card:focus-visible {
  border-color: rgba(242, 165, 26, .55);
  box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
  outline: none;
  transform: translateY(-1px);
}

.delivery-split-card.selected {
  border-color: rgba(242, 165, 26, .86);
  box-shadow: 0 18px 38px rgba(242, 165, 26, .15);
  background: linear-gradient(180deg, #fff, #fffbf0);
}

.delivery-split-card-main,
.delivery-split-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.delivery-split-card-title,
.delivery-split-card-badges,
.delivery-split-card-foot > span {
  min-width: 0;
}

.delivery-split-card-title strong,
.delivery-split-card-title span,
.delivery-split-card-route span,
.delivery-split-card-foot b,
.delivery-split-reference {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.delivery-split-card-title strong {
  color: var(--ink);
  font-size: 18px;
  line-height: 1.15;
}

.delivery-split-card-title span,
.delivery-split-reference,
.delivery-split-card-route small,
.delivery-split-card-foot {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.delivery-split-card-badges {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.delivery-split-card-badges .status-chip,
.delivery-split-card-badges .routing-scope-pill {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.delivery-split-card-route {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
  padding: 10px 12px;
  border: 1px solid rgba(226, 232, 240, .92);
  border-radius: 16px;
  background: #f8fafc;
  min-width: 0;
}

.delivery-split-card-route small {
  margin-bottom: 1px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.delivery-split-card-route span {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 800;
}

.delivery-split-card-foot {
  color: var(--muted);
}

.delivery-split-card-foot > span:first-child {
  display: grid;
  gap: 2px;
}

.delivery-split-card-foot .driver-mini {
  max-width: 150px;
}

.delivery-split-pod {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 9px;
  background: #fff;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
}

.delivery-split-pod.ready {
  border-color: rgba(21, 128, 61, .25);
  background: #ecfdf3;
  color: #15803d;
}

.delivery-split-pod.pending {
  border-color: rgba(242, 165, 26, .3);
  background: var(--brand-soft);
  color: #9a5f00;
}

.compact-map-preview-wrap {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(180deg, #fff, #f8fafc);
}

.compact-map-preview-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.compact-map-preview-heading strong {
  color: var(--ink);
  font-size: 15px;
}

.compact-map-preview-heading span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.compact-map-preview-wrap .customer-route-map.compact-map-preview {
  min-height: 178px;
  height: 210px;
  margin: 0;
  overflow: hidden;
}

.compact-map-preview-wrap .customer-route-map .route-map-expand,
.compact-map-preview-wrap .customer-route-map .route-map-resolve {
  top: 10px;
  right: 10px;
}

.compact-map-preview-wrap .customer-route-map .route-map-resolve {
  top: 52px;
}

#ordersPanel .delivery-detail-section .customer-route-map.no-preview-map {
  min-height: 260px;
}

@media (max-width: 1420px) and (min-width: 1100px) {
  #ordersPanel .orders-workspace {
    grid-template-columns: minmax(390px, .9fr) minmax(430px, 1.1fr) !important;
  }

  #ordersPanel .orders-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .delivery-split-card-foot {
    align-items: flex-start;
    flex-direction: column;
  }

  .delivery-split-card-foot .driver-mini {
    max-width: 100%;
  }
}

@media (max-width: 1099px) {
  #ordersPanel .orders-workspace {
    grid-template-columns: minmax(0, 1fr) !important;
    height: auto;
    max-height: none;
  }

  #ordersPanel .orders-card,
  #ordersPanel .order-detail-card {
    max-height: none;
    overflow: visible;
  }

  #ordersPanel .order-list.split-delivery-list-mode {
    overflow: visible !important;
  }

  #ordersPanel #orderDetail {
    height: auto;
    overflow: visible;
  }

  .compact-map-preview-wrap .customer-route-map.compact-map-preview {
    height: 220px;
  }
}

@media (max-width: 720px) {
  .delivery-split-card-main,
  .delivery-split-card-foot,
  .compact-map-preview-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .delivery-split-card-badges {
    justify-content: flex-start;
  }

  .delivery-split-card-badges .status-chip,
  .delivery-split-card-badges .routing-scope-pill {
    max-width: 100%;
  }

  .compact-map-preview-wrap {
    padding: 10px;
    border-radius: 16px;
  }

  .compact-map-preview-wrap .customer-route-map.compact-map-preview {
    height: 190px;
  }
}


/* v121 — Minhas entregas: mais área útil para percorrer pedidos no cockpit */
@media (min-width: 1100px) {
  #ordersPanel .orders-workspace {
    height: clamp(760px, calc(100vh - 112px), 980px) !important;
    min-height: 760px !important;
    max-height: none !important;
    grid-template-columns: minmax(460px, .94fr) minmax(470px, 1.06fr) !important;
  }

  #ordersPanel .orders-card {
    padding: 18px !important;
  }

  #ordersPanel .orders-card .orders-heading {
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
  }

  #ordersPanel .orders-card .orders-heading h2 {
    font-size: 22px;
    line-height: 1.08;
    margin-bottom: 2px;
  }

  #ordersPanel .orders-card .orders-heading p {
    display: none;
  }

  #ordersPanel .orders-card .orders-heading .card-heading-actions {
    flex: 0 0 auto;
  }

  #ordersPanel .orders-card .orders-heading .ghost.small {
    min-height: 42px;
    padding: 9px 14px;
    white-space: nowrap;
  }

  #ordersPanel .orders-summary-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin: 0 0 10px !important;
  }

  #ordersPanel .orders-summary-grid article {
    min-height: 62px !important;
    padding: 10px 12px !important;
    border-radius: 16px !important;
  }

  #ordersPanel .orders-summary-grid article span {
    font-size: 11px !important;
    line-height: 1.1;
  }

  #ordersPanel .orders-summary-grid article strong {
    font-size: 24px !important;
    line-height: 1;
    margin-top: 3px;
  }

  #ordersPanel .orders-toolbar {
    grid-template-columns: minmax(0, 1fr) minmax(132px, 154px) !important;
    gap: 8px !important;
    padding: 10px !important;
    margin-bottom: 9px !important;
    border-radius: 18px !important;
  }

  #ordersPanel .orders-toolbar .field {
    gap: 4px;
  }

  #ordersPanel .orders-toolbar label {
    font-size: 11px;
    letter-spacing: .02em;
  }

  #ordersPanel .orders-toolbar input,
  #ordersPanel .orders-toolbar select {
    min-height: 42px !important;
    height: 42px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  #ordersPanel .status-filter-row {
    gap: 6px !important;
    margin-bottom: 8px !important;
  }

  #ordersPanel .status-filter-row .status-filter,
  #ordersPanel .status-filter {
    min-height: 34px !important;
    padding: 8px 11px !important;
    font-size: 12px !important;
    line-height: 1.1;
  }

  #ordersPanel .orders-count-label {
    margin: 0 0 8px !important;
    font-size: 12px;
    line-height: 1.25;
  }

  #ordersPanel .order-list.split-delivery-list-mode,
  #ordersPanel .order-list.logistics-board-mode {
    min-height: 360px;
    border-top: 1px solid rgba(226, 232, 240, .72);
    padding-top: 10px;
  }

  #ordersPanel .customer-delivery-split-list {
    gap: 10px;
  }

  #ordersPanel .delivery-split-card {
    padding: 13px 14px;
    gap: 9px;
    border-radius: 18px;
  }

  #ordersPanel .delivery-split-card-title strong {
    font-size: 17px;
  }

  #ordersPanel .delivery-split-card-route {
    padding: 9px 10px;
    gap: 5px;
  }

  #ordersPanel .delivery-split-card-route span {
    font-size: 12.5px;
  }

  #ordersPanel .delivery-split-card-foot {
    gap: 8px;
  }
}

@media (min-width: 1100px) and (max-height: 820px) {
  #ordersPanel .orders-workspace {
    height: calc(100vh - 94px) !important;
    min-height: 700px !important;
  }

  #ordersPanel .orders-card .orders-heading h2 {
    font-size: 20px;
  }

  #ordersPanel .orders-summary-grid article {
    min-height: 54px !important;
    padding: 8px 10px !important;
  }

  #ordersPanel .orders-summary-grid article strong {
    font-size: 22px !important;
  }

  #ordersPanel .orders-toolbar {
    padding: 8px !important;
  }

  #ordersPanel .orders-toolbar input,
  #ordersPanel .orders-toolbar select {
    min-height: 40px !important;
    height: 40px !important;
  }

  #ordersPanel .status-filter-row .status-filter,
  #ordersPanel .status-filter {
    min-height: 32px !important;
    padding: 7px 10px !important;
  }
}

@media (min-width: 1100px) and (max-width: 1360px) {
  #ordersPanel .orders-workspace {
    grid-template-columns: minmax(440px, .96fr) minmax(420px, 1.04fr) !important;
    gap: 16px !important;
  }

  #ordersPanel .orders-card {
    padding: 16px !important;
  }

  #ordersPanel .orders-summary-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }

  #ordersPanel .orders-summary-grid article span {
    font-size: 10px !important;
  }
}

/* Fase — imagem/crop por classe de veículo no Portal Cliente */
.fleet-vehicle-image-field {
  grid-column: 1 / -1;
}

.fleet-vehicle-image-editor {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 18px;
  background: rgba(248, 250, 252, 0.72);
}

.fleet-vehicle-image-current {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--muted, #64748b);
  font-size: 0.86rem;
}

.fleet-vehicle-image-current img,
.fleet-vehicle-thumb {
  width: 84px;
  height: 63px;
  object-fit: contain;
  border: 1px solid rgba(15, 23, 42, 0.10);
  border-radius: 14px;
  background: #fff;
}

.fleet-vehicle-crop-wrap {
  display: grid;
  gap: 8px;
}

.fleet-vehicle-crop-wrap canvas {
  width: min(100%, 420px);
  height: auto;
  display: block;
  border: 1px solid rgba(15, 23, 42, 0.14);
  border-radius: 18px;
  background: #fff;
  cursor: grab;
  touch-action: none;
}

.fleet-vehicle-crop-wrap canvas:active {
  cursor: grabbing;
}

.fleet-vehicle-crop-wrap small,
.fleet-vehicle-zoom-label {
  color: var(--muted, #64748b);
  font-size: 0.78rem;
}

.fleet-vehicle-image-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.fleet-file-button {
  cursor: pointer;
}

.fleet-vehicle-row {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}

.fleet-vehicle-thumb.placeholder {
  display: grid;
  place-items: center;
  color: var(--muted, #64748b);
  font-weight: 900;
  font-size: 0.78rem;
  letter-spacing: .08em;
}

@media (max-width: 680px) {
  .fleet-vehicle-row {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .fleet-vehicle-row .fleet-row-status,
  .fleet-vehicle-row .fleet-row-actions {
    grid-column: 1 / -1;
  }
}

/* Fase 4 — cadastro PF/PJ no Portal do Cliente */
.login-card {
  width: min(720px, 100%);
}
.login-card.register-active {
  width: min(760px, 100%);
}
.auth-switch {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 18px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #f8fafc;
}
.auth-switch-button {
  border: 0;
  border-radius: 12px;
  padding: 11px 12px;
  background: transparent;
  color: var(--muted);
  font-weight: 850;
}
.auth-switch-button.active {
  background: #fff;
  color: var(--brand-dark);
  box-shadow: var(--shadow-sm);
}
.auth-register-intro {
  display: grid;
  gap: 4px;
  padding: 14px;
  border: 1px solid rgba(242, 165, 26, .28);
  border-radius: 18px;
  background: var(--brand-faint);
}
.auth-register-intro strong {
  font-size: 16px;
}
.auth-register-intro span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.signup-form {
  display: grid;
  gap: 14px;
}
.signup-type-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.signup-type-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
  border: 1px solid var(--line-strong);
  border-radius: 17px;
  padding: 13px;
  background: #fff;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
  cursor: pointer;
}
.signup-type-card.active {
  border-color: rgba(242, 165, 26, .72);
  background: var(--brand-faint);
  box-shadow: 0 10px 22px rgba(242, 165, 26, .12);
}
.signup-type-card input {
  width: auto;
  margin-top: 3px;
  accent-color: var(--brand-dark);
}
.signup-type-card strong,
.signup-type-card small {
  display: block;
}
.signup-type-card small {
  margin-top: 3px;
  color: var(--muted);
}
.signup-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.optional-label {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.terms-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: flex-start;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: 12px 13px;
  background: #fffdf8;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.45;
}
.terms-check input {
  width: auto;
  margin-top: 2px;
  accent-color: var(--brand-dark);
}
.signup-actions {
  display: grid;
  gap: 10px;
  justify-items: center;
}
.signup-note {
  margin: 0;
  border-radius: 14px;
  padding: 11px 13px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
@media (max-width: 720px) {
  .signup-type-grid,
  .signup-fields {
    grid-template-columns: 1fr;
  }
  .login-card,
  .login-card.register-active {
    width: min(100%, 500px);
  }
}

/* Fase 36 — acompanhamento operacional centralizado no Portal Cliente */
.portal-operational-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, #fff, #fbfcff);
  box-shadow: var(--shadow-sm);
  padding: 16px;
  display: grid;
  gap: 12px;
}

.portal-operational-card.compact {
  padding: 14px;
  gap: 10px;
}

.portal-operational-card.info { border-color: rgba(37, 99, 235, .18); background: linear-gradient(180deg, #fff, var(--info-soft)); }
.portal-operational-card.warning { border-color: rgba(242, 165, 26, .28); background: linear-gradient(180deg, #fff, var(--brand-faint)); }
.portal-operational-card.danger { border-color: rgba(220, 38, 38, .22); background: linear-gradient(180deg, #fff, var(--danger-soft)); }
.portal-operational-card.success { border-color: rgba(21, 128, 61, .18); background: linear-gradient(180deg, #fff, var(--success-soft)); }

.portal-operational-card-head {
  display: grid;
  gap: 4px;
}

.portal-operational-card-head > span {
  color: var(--brand-dark);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.portal-operational-card-head > strong {
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.2;
}

.portal-operational-card-head > p {
  color: var(--ink-soft);
  margin: 0;
  line-height: 1.45;
}

.portal-operational-alert {
  border-radius: var(--radius-md);
  padding: 11px 12px;
  display: grid;
  gap: 3px;
  border: 1px solid var(--line);
  background: #fff;
}

.portal-operational-alert.info { border-color: rgba(37, 99, 235, .18); background: var(--info-soft); }
.portal-operational-alert.warning { border-color: rgba(242, 165, 26, .30); background: var(--brand-soft); }
.portal-operational-alert.danger { border-color: rgba(220, 38, 38, .24); background: var(--danger-soft); }
.portal-operational-alert strong { font-size: .92rem; color: var(--ink); }
.portal-operational-alert span, .portal-operational-alert small { color: var(--ink-soft); line-height: 1.38; }
.portal-operational-alert.compact { padding: 9px 10px; }

.portal-operational-rail {
  color: var(--slate);
  background: rgba(255,255,255,.68);
  border: 1px dashed var(--line-strong);
  border-radius: var(--radius-sm);
  padding: 9px 10px;
  font-size: .84rem;
  font-weight: 700;
  line-height: 1.35;
}

.portal-operational-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 8px;
}

.portal-operational-metrics > div {
  border: 1px solid rgba(231, 235, 240, .9);
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.78);
  padding: 9px 10px;
  min-width: 0;
}

.portal-operational-metrics span {
  display: block;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.portal-operational-metrics strong {
  display: block;
  color: var(--ink);
  font-size: .9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.portal-operational-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.portal-quick-action {
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 800;
  color: var(--ink);
  background: #fff;
}

.portal-quick-action.primary { border-color: rgba(242, 165, 26, .42); background: var(--brand-soft); color: #7c4a00; }
.portal-quick-action.success { border-color: rgba(21, 128, 61, .22); background: var(--success-soft); color: var(--success); }
.portal-quick-action.warning { border-color: rgba(242, 165, 26, .34); background: var(--brand-faint); color: #7c4a00; }
.portal-quick-action.danger { border-color: rgba(220, 38, 38, .22); background: var(--danger-soft); color: var(--danger); }

.portal-operational-inline {
  margin-top: 7px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  color: var(--slate);
  font-size: .82rem;
}

.portal-operational-inline span {
  border-radius: 999px;
  background: var(--slate-soft);
  padding: 4px 8px;
  font-weight: 800;
}

.portal-operational-inline strong {
  color: var(--brand-dark);
  font-weight: 800;
}

.portal-operational-inline.has-alert strong {
  color: var(--danger);
}

/* Fase 43 — Veículo por hora no Portal Cliente */
.vehicle-rentals-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .85fr);
  gap: 18px;
  align-items: start;
}

.vehicle-rental-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.vehicle-rental-row {
  width: 100%;
  border: 1px solid rgba(15, 23, 42, .09);
  border-radius: 18px;
  background: #fff;
  padding: 14px 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  text-align: left;
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.vehicle-rental-row:hover,
.vehicle-rental-row.selected {
  border-color: rgba(242, 165, 26, .55);
  box-shadow: 0 16px 34px rgba(15, 23, 42, .08);
  transform: translateY(-1px);
}

.vehicle-rental-row-main,
.vehicle-rental-row-side {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.vehicle-rental-row-main strong,
.vehicle-rental-row-main small,
.vehicle-rental-row-main em,
.vehicle-rental-row-side small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vehicle-rental-row-main em,
.vehicle-rental-row-side small {
  color: var(--muted, #64748b);
  font-style: normal;
}

.vehicle-rental-row-side {
  max-width: 210px;
  text-align: right;
}

.vehicle-rental-detail-card {
  position: sticky;
  top: 18px;
}

.vehicle-rental-detail-head {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}

.vehicle-rental-detail-head h2 {
  margin: 0;
}

.vehicle-rental-timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 14px 0 18px;
}

.vehicle-rental-step {
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 14px;
  padding: 10px;
  display: grid;
  gap: 6px;
  background: rgba(248, 250, 252, .9);
  color: var(--muted, #64748b);
}

.vehicle-rental-step i {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(15, 23, 42, .08);
  color: #0f172a;
  font-style: normal;
  font-size: 12px;
}

.vehicle-rental-step.done i,
.vehicle-rental-step.active i {
  background: rgba(242, 165, 26, .22);
  color: #8a5800;
}

.vehicle-rental-step.active {
  border-color: rgba(242, 165, 26, .45);
  color: #0f172a;
}

.vehicle-rental-detail-list {
  display: grid;
  gap: 10px;
  margin: 0;
}

.vehicle-rental-detail-list div {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(15, 23, 42, .07);
}

.vehicle-rental-detail-list dt {
  color: var(--muted, #64748b);
  font-size: .86rem;
}

.vehicle-rental-detail-list dd {
  margin: 0;
  font-weight: 700;
  color: #0f172a;
}

.vehicle-rental-note {
  margin-top: 16px;
  padding: 14px;
  border-radius: 16px;
  background: rgba(15, 23, 42, .04);
}

.vehicle-rental-note p {
  margin: 6px 0 0;
  color: var(--muted, #64748b);
}

.vehicle-rental-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.vehicle-rental-privacy-note {
  display: block;
  margin-top: 12px;
  color: var(--muted, #64748b);
}

@media (max-width: 980px) {
  .vehicle-rentals-workspace {
    grid-template-columns: 1fr;
  }

  .vehicle-rental-detail-card {
    position: static;
  }
}

@media (max-width: 620px) {
  .vehicle-rental-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .vehicle-rental-row-side {
    max-width: none;
    text-align: left;
  }

  .vehicle-rental-timeline {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .vehicle-rental-detail-list div {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

.vehicle-rental-policy-card {
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 18px;
  background: rgba(248, 250, 252, .92);
  padding: 14px 16px;
  margin-top: 12px;
  display: grid;
  gap: 8px;
}
.vehicle-rental-policy-card > strong {
  color: #0f172a;
  font-size: .94rem;
}
.vehicle-rental-policy-card span {
  display: grid;
  gap: 2px;
  color: #475569;
  font-size: .86rem;
  line-height: 1.35;
}
.vehicle-rental-policy-card b {
  color: #1e293b;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}
button.ghost.small.danger {
  border-color: rgba(220, 38, 38, .35);
  color: #b91c1c;
}
button.ghost.small.danger:hover {
  background: rgba(254, 226, 226, .75);
}


.vehicle-rental-update-card {
  display: grid;
  gap: 0.25rem;
  margin: 0.8rem 0;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(33, 150, 243, 0.18);
  border-radius: 16px;
  background: rgba(33, 150, 243, 0.08);
  color: var(--text, #1d2733);
}
.vehicle-rental-update-card strong {
  font-size: 0.88rem;
}
.vehicle-rental-update-card span,
.vehicle-rental-update-card small {
  color: var(--muted, #5d6b7a);
}

/* Fase 49 — criação/agendamento de locação por tempo no Portal */
.vehicle-rental-create-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
}
.vehicle-rental-create-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.48);
  backdrop-filter: blur(6px);
}
.vehicle-rental-create-card {
  position: relative;
  width: min(560px, 100%);
  max-height: calc(100vh - 36px);
  overflow: auto;
  border-radius: 24px;
  background: var(--surface, #fff);
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.24);
  padding: 22px;
  display: grid;
  gap: 12px;
}
.vehicle-rental-create-card header {
  display: grid;
  gap: 4px;
  margin-bottom: 4px;
}
.vehicle-rental-create-card h2 {
  margin: 0;
}
.vehicle-rental-create-card p {
  margin: 0;
  color: var(--muted, #64748b);
}
.vehicle-rental-create-card label {
  display: grid;
  gap: 6px;
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--text, #0f172a);
}
.vehicle-rental-create-card input,
.vehicle-rental-create-card select,
.vehicle-rental-create-card textarea {
  width: 100%;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 14px;
  padding: 10px 12px;
  font: inherit;
  background: var(--surface-soft, #f8fafc);
  color: var(--text, #0f172a);
}
.vehicle-rental-schedule-help,
.vehicle-rental-create-price {
  display: block;
  border-radius: 14px;
  padding: 10px 12px;
  background: var(--surface-soft, #f8fafc);
  color: var(--muted, #64748b);
}
.vehicle-rental-create-price {
  font-weight: 800;
  color: var(--text, #0f172a);
}
.vehicle-rental-create-card footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 4px;
}
@media (max-width: 640px) {
  .vehicle-rental-create-card footer {
    flex-direction: column-reverse;
  }
  .vehicle-rental-create-card footer button {
    width: 100%;
  }
}