/* Cabeçalhos e indicadores compartilhados pelo CRM. */
#app .heading,
#app .ov-page-heading {
  margin: 0 0 10px !important;
  padding: 0 0 7px !important;
  min-height: 0 !important;
  gap: 8px 14px !important;
}
#app .heading h1,
#app .ov-page-heading h1,
#app > h1 {
  font-size: clamp(19px, 1.45vw, 23px) !important;
  line-height: 1.18 !important;
  margin: 0 !important;
}
#app .heading p,
#app .ov-page-heading p {
  font-size: 13px !important;
  line-height: 1.35 !important;
  margin: 4px 0 0 !important;
}
#app .heading :is(.eyebrow,.updated),
#app .heading .actions:has(> .updated:only-child),
#app .heading .actions:empty { display: none !important; }
#app .cardhead,
#app .card-head { padding-block: 12px; gap: 8px 14px; }
#app .ov-panel-head { margin-bottom: 10px; }
#app :is(.cardhead,.card-head,.ov-panel-head) :is(h2,h3) { line-height: 1.23; margin-block: 0; }
#app .crm-map-heading { border: 0; padding-bottom: 0 !important; }
#app:has(.crm-network-map) { padding-top: 12px !important; padding-bottom: 10px !important; }
#app .crm-network-map iframe { height: max(510px, calc(100dvh - 128px)); }

#app [data-kpi-tone], .executive-metrics [data-kpi-tone] {
  --kpi-accent: #2360a4;
  --kpi-text: #183b64;
  --kpi-surface: var(--ov-surface, var(--surface, #fff));
  --kpi-ink: var(--ov-text, var(--ink, #102d49));
  --kpi-muted: var(--ov-muted, var(--muted, #506b82));
}
:is(#app,.executive-metrics) [data-kpi-tone="activity"] { --kpi-accent:#087c99; --kpi-text:#13596b; }
:is(#app,.executive-metrics) [data-kpi-tone="success"] { --kpi-accent:#16845b; --kpi-text:#146140; }
:is(#app,.executive-metrics) [data-kpi-tone="attention"] { --kpi-accent:#a86505; --kpi-text:#754608; }
:is(#app,.executive-metrics) [data-kpi-tone="alert"] { --kpi-accent:#bd4356; --kpi-text:#8c2636; }
:root[data-theme=dark] :is(#app,.executive-metrics) [data-kpi-tone="total"] { --kpi-accent:#70b9ff; --kpi-text:#b6dbff; }
:root[data-theme=dark] :is(#app,.executive-metrics) [data-kpi-tone="activity"] { --kpi-accent:#65c9df; --kpi-text:#abe7f2; }
:root[data-theme=dark] :is(#app,.executive-metrics) [data-kpi-tone="success"] { --kpi-accent:#5ecb9e; --kpi-text:#a8eed1; }
:root[data-theme=dark] :is(#app,.executive-metrics) [data-kpi-tone="attention"] { --kpi-accent:#e8b760; --kpi-text:#f7db9d; }
:root[data-theme=dark] :is(#app,.executive-metrics) [data-kpi-tone="alert"] { --kpi-accent:#f18f9a; --kpi-text:#ffc2ca; }

:is(#app,.executive-metrics) :is(.metric,.ov-kpi,.ov-goal)[data-kpi-tone] {
  background: linear-gradient(135deg, color-mix(in srgb, var(--kpi-surface), var(--kpi-accent) 10%), var(--kpi-surface) 76%) !important;
  border: 1px solid color-mix(in srgb, var(--kpi-surface), var(--kpi-accent) 30%) !important;
  border-inline-start: 4px solid var(--kpi-accent) !important;
  border-radius: 11px;
  box-shadow: 0 2px 6px rgb(16 45 73 / 6%);
  color: var(--kpi-ink) !important;
}
:is(#app,.executive-metrics) :is(.metric,.ov-kpi)[data-kpi-tone] {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-height: 0;
  padding: 13px 15px;
}
:is(#app,.executive-metrics) :is(.metric,.ov-kpi)[data-kpi-tone] > :is(label,h3) {
  color: var(--kpi-text) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.25;
  margin: 0;
}
:is(#app,.executive-metrics) :is(.metric,.ov-kpi)[data-kpi-tone] > strong {
  color: var(--kpi-ink) !important;
  font-size: clamp(24px, 2.3vw, 34px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.12;
  overflow-wrap: anywhere;
}
:is(#app,.executive-metrics) :is(.metric,.ov-kpi)[data-kpi-tone] > :is(small,p) {
  color: var(--kpi-muted) !important;
  font-size: 12px !important;
  line-height: 1.35;
  margin: 0;
}
#app .ov-goal[data-kpi-tone] { padding: 16px 18px 26px; }
#app .ov-goal-value > strong { color: var(--kpi-text); }
@media (max-width:760px) {
  #app .crm-network-map iframe { height: max(600px, calc(100dvh - 104px)); }
  #app :is(.metric,.ov-kpi)[data-kpi-tone] { padding: 11px 12px; }
}