/* ============================================================
   INTRANET RANCHO S — home.css
   Tela inicial por perfil (3 camadas)
   ============================================================ */

/* ── Carregamento ────────────────────────────────────────── */
.home-loading {
  padding: 48px 24px;
  text-align: center;
  color: var(--text3);
  font-size: 14px;
}

/* ── Header / saudação ───────────────────────────────────── */
.home-header {
  margin-bottom: 24px;
}
.home-title {
  font-family: 'Syne', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 4px;
  line-height: 1.2;
}
.home-subtitle {
  font-size: 13px;
  color: var(--text2);
  margin: 0;
}

/* ── Hero ────────────────────────────────────────────────── */
.home-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 22px;
  background: var(--verde-escuro);
  color: #fff;
  border-radius: var(--radius);
  margin-bottom: 24px;
  cursor: pointer;
  transition: opacity .15s;
  box-shadow: var(--shadow);
}
.home-hero:hover { opacity: .92; }
.home-hero-body {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  min-width: 0;
}
.home-hero-icon {
  flex-shrink: 0;
  opacity: .85;
  display: flex;
  align-items: center;
}
.home-hero-text {
  font-size: 15px;
  font-weight: 600;
  white-space: normal;
  overflow: hidden;
}
.home-hero-btn {
  flex-shrink: 0;
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  color: #fff !important;
  white-space: nowrap;
  font-size: 13px;
}
.home-hero-btn:hover {
  background: rgba(255,255,255,.28) !important;
}

/* ── Rótulo de seção ─────────────────────────────────────── */
.home-section-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text3);
  margin: 24px 0 10px;
}

/* ── Pendências ──────────────────────────────────────────── */
.home-pendencias {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.home-pendencia {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 16px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  border-left-width: 4px;
  background: var(--surface);
  transition: box-shadow .15s;
}
.home-pendencia:hover { box-shadow: var(--shadow); }
.home-pend-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}
.home-pend-texto {
  flex: 1;
  font-size: 14px;
  color: var(--text);
  line-height: 1.4;
}
.home-pend-btn {
  flex-shrink: 0;
  white-space: nowrap;
  font-size: 12px;
  padding: 5px 11px;
}

/* ── Sem pendências ──────────────────────────────────────── */
.home-sem-pendencias {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: var(--radius-sm);
  font-size: 14px;
  color: #166534;
}
.home-sem-pendencias svg { flex-shrink: 0; }

/* ── KPIs ────────────────────────────────────────────────── */
.home-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 12px;
}
.home-kpi {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 18px 20px;
  transition: box-shadow .15s;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 84px;
}
.home-kpi:hover { box-shadow: var(--shadow); }
.home-kpi.home-kpi-alerta {
  border-color: var(--warning);
  background: #fffbeb;
}
.home-kpi-valor {
  font-family: 'DM Sans', sans-serif;
  font-size: 17px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  margin-bottom: 4px;
  line-height: 1.2;
}
.home-kpi.home-kpi-alerta .home-kpi-valor { color: var(--warning); }
.home-kpi-label {
  font-size: 11px;
  color: var(--text3);
  line-height: 1.4;
}
.home-kpi-sub {
  font-size: 10px;
  color: var(--text3);
  margin-top: 5px;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
}
.home-kpi-fonte {
  font-style: italic;
  font-size: 10px;
  color: var(--text3);
}

/* ── Módulos ─────────────────────────────────────────────── */
.home-modulos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px;
  margin-bottom: 8px;
}
.home-modulo {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px 12px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  cursor: pointer;
  transition: all .2s;
  text-align: center;
}
.home-modulo:hover {
  border-color: var(--verde-escuro);
  background: var(--verde-suave);
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}
.home-modulo-icon {
  color: var(--verde-escuro);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.home-modulo-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
}

/* ── Métricas (página dedicada) ──────────────────────────── */
.metricas-loading {
  padding: 32px;
  text-align: center;
  color: var(--text3);
  font-size: 14px;
}
.metricas-section { margin-bottom: 28px; }
.metricas-section-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text3);
  margin: 0 0 12px;
}
.metricas-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 14px;
}
.metricas-kpi {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 18px 20px;
  transition: box-shadow .15s;
}
.metricas-kpi:hover { box-shadow: var(--shadow); }
.metricas-kpi.alerta { border-color: var(--warning); background: #fffbeb; }
.metricas-kpi-valor {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(14px, 4vw, 22px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--text);
  margin-bottom: 5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.metricas-kpi.alerta .metricas-kpi-valor { color: var(--warning); }
.metricas-kpi-label { font-size: 12px; color: var(--text3); }
.metricas-kpi-fonte { font-size: 10px; font-style: italic; color: var(--text3); margin-top: 2px; }

/* ── Cores de status consistentes em todo o app ──────────── */
.status-criada          { color: #6b7280; }
.status-andamento       { color: var(--warning); }
.status-conferido       { color: var(--success); }
.status-encerrado       { color: var(--verde-escuro); }
.status-cancelado       { color: var(--danger); }

.badge-status-criada    { background: #f3f4f6; color: #374151; border: 1px solid #d1d5db; }
.badge-status-andamento { background: #fffbeb; color: #92400e; border: 1px solid #fcd34d; }
.badge-status-conferido { background: #f0fdf4; color: #166534; border: 1px solid #86efac; }
.badge-status-encerrado { background: var(--verde-suave); color: var(--verde-escuro); border: 1px solid var(--border); }
.badge-status-cancelado { background: #fef2f2; color: #991b1b; border: 1px solid #fca5a5; }

/* ── Responsividade ──────────────────────────────────────── */
@media (max-width: 480px) {
  .home-hero { flex-direction: column; align-items: flex-start; }
  .home-hero-btn { align-self: flex-end; }
  .home-kpis { grid-template-columns: repeat(2, 1fr); }
  .home-kpi { min-height: 72px; padding: 14px 12px; }
  .home-modulos { grid-template-columns: repeat(3, 1fr); }
  .metricas-kpis { grid-template-columns: repeat(2, 1fr); }
}

/* ══════════════════════════════════════════════════════════════
   PAINEL ADMIN (home rica)
   ══════════════════════════════════════════════════════════════ */

/* Header verde */
.adm-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  background: var(--verde-escuro);
  color: #fff;
  border-radius: var(--radius);
  margin-bottom: 20px;
  box-shadow: var(--shadow);
}
.adm-header-left { display: flex; align-items: center; gap: 14px; }
.adm-avatar {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Syne', sans-serif;
  font-size: 18px; font-weight: 700;
  flex-shrink: 0;
}
.adm-nome {
  font-family: 'Syne', sans-serif;
  font-size: 18px; font-weight: 700;
  line-height: 1.2;
}
.adm-sub {
  font-size: 12px;
  opacity: .78;
  margin-top: 2px;
}
.adm-pend-card {
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.28);
  border-radius: var(--radius-sm);
  padding: 10px 16px;
  font-size: 13px;
  text-align: center;
  white-space: nowrap;
}
.adm-pend-num {
  font-family: 'DM Sans', sans-serif;
  font-size: 22px; font-weight: 700;
  font-variant-numeric: tabular-nums;
  display: block;
  line-height: 1;
  margin-bottom: 2px;
}

/* "Ver dashboard como" tabs */
.adm-tabs-wrap {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  margin-bottom: 20px;
}
.adm-tabs-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text3);
  margin-bottom: 10px;
}
.adm-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.adm-tab {
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: transparent;
  color: var(--text2);
  cursor: pointer;
  transition: all .15s;
}
.adm-tab:hover { border-color: var(--verde-escuro); color: var(--verde-escuro); }
.adm-tab.adm-tab-active {
  background: var(--verde-escuro);
  border-color: var(--verde-escuro);
  color: #fff;
}

.adm-select-hint {
  padding: 48px 24px;
  text-align: center;
  color: var(--text3);
  font-size: 14px;
}

/* Chips de usuário por perfil */
.adm-user-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--border);
}
.adm-user-filter:empty { display: none; }
.adm-filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  width: 100%;
}
.adm-filter-row + .adm-filter-row {
  padding-top: 8px;
  border-top: 1px dashed var(--border);
}
.adm-filter-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--text3);
  white-space: nowrap;
  margin-right: 4px;
}
.adm-user-chip {
  padding: 4px 12px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: #fff;
  color: var(--text2);
  cursor: pointer;
  transition: all .15s;
  font-family: inherit;
}
.adm-user-chip:hover { border-color: var(--verde-escuro); color: var(--verde-escuro); background: var(--verde-suave); }
.adm-user-chip.adm-user-chip-active {
  background: var(--verde-suave);
  border-color: var(--verde-escuro);
  color: var(--verde-escuro);
  font-weight: 700;
}

/* Preview bar */
.adm-preview-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  background: #fffbeb;
  border: 1px solid #fcd34d;
  border-radius: var(--radius-sm);
  font-size: 13px;
  color: #78350f;
  margin-bottom: 16px;
}
.adm-preview-bar svg { flex-shrink: 0; }

/* Section label */
.adm-section-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text3);
  margin: 0 0 10px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.adm-periodo {
  font-size: 11px;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--text3);
}

/* 4 KPI cards */
.adm-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
  margin-bottom: 28px;
}
.adm-kpi {
  background: #fff;
  border: 1px solid #C7E59B;
  border-radius: var(--radius-sm);
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  transition: box-shadow .15s;
}
.adm-kpi:hover { box-shadow: 0 2px 8px rgba(0,80,30,.1); }
.adm-kpi-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.adm-kpi-icon { color: var(--verde-escuro); display: flex; align-items: center; }
.adm-kpi-delta {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 999px;
}
.adm-kpi-delta-pos { background: #dcfce7; color: #166534; }
.adm-kpi-delta-neg { background: #fef2f2; color: #991b1b; }
.adm-kpi-valor {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(14px, 4vw, 22px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--verde-escuro);
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.adm-kpi-label {
  font-size: 12px;
  color: var(--text3);
  line-height: 1.3;
}
.adm-kpi-sub {
  font-size: 11px;
  color: var(--text3);
}

/* Duas colunas */
.adm-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 28px;
}
@media (max-width: 600px) { .adm-two-col { grid-template-columns: 1fr; } }

/* Eventos */
.adm-eventos {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.adm-evento {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 11px 14px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border);
  border-left-width: 4px;
  font-size: 13px;
  color: var(--text);
  line-height: 1.4;
  transition: box-shadow .15s;
}
.adm-evento:hover { box-shadow: var(--shadow); }
.adm-evento-icon { flex-shrink: 0; display: flex; align-items: center; margin-top: 1px; }
.adm-evento-body { flex: 1; min-width: 0; }
.adm-evento-btn {
  flex-shrink: 0;
  font-size: 11px;
  padding: 3px 9px;
  align-self: flex-start;
}
.adm-evt-danger  { border-left-color: var(--danger);        background: #fef2f2; }
.adm-evt-warning { border-left-color: var(--warning);       background: #fffbeb; }
.adm-evt-info    { border-left-color: var(--verde-escuro);  background: #f0fdf4; }
.adm-evt-danger  .adm-evento-icon { color: var(--danger);       }
.adm-evt-warning .adm-evento-icon { color: var(--warning);      }
.adm-evt-info    .adm-evento-icon { color: var(--verde-escuro); }
.adm-sem-eventos {
  display: flex; align-items: center; gap: 8px;
  padding: 14px 16px;
  background: #f0fdf4; border: 1px solid #bbf7d0;
  border-radius: var(--radius-sm);
  font-size: 13px; color: #166534;
}

/* APIs */
.adm-apis { display: flex; flex-direction: column; gap: 8px; }
.adm-api {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  transition: box-shadow .15s;
}
.adm-api:hover { box-shadow: var(--shadow); }
.adm-api-sigla {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--verde-suave);
  border: 1px solid var(--verde-escuro);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Syne', sans-serif;
  font-size: 10px; font-weight: 700;
  color: var(--verde-escuro);
  flex-shrink: 0;
}
.adm-api-info { flex: 1; min-width: 0; }
.adm-api-nome  { font-size: 13px; font-weight: 600; color: var(--text);  }
.adm-api-detalhe { font-size: 11px; color: var(--text3); margin-top: 1px; }
.adm-badge-ativa    { background: #dcfce7; color: #166534; font-size: 11px; padding: 3px 9px; border-radius: 999px; font-weight: 600; white-space: nowrap; }
.adm-badge-pendente { background: #fffbeb; color: #92400e; font-size: 11px; padding: 3px 9px; border-radius: 999px; font-weight: 600; white-space: nowrap; }

/* Responsividade admin */
@media (max-width: 540px) {
  .adm-header { flex-direction: column; align-items: flex-start; }
  .adm-kpis { grid-template-columns: repeat(2, 1fr); }
}

/* ── Viagem atual (entregador_interno) ───────────────────────── */
.home-viagem-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px;
  margin-bottom: 20px;
  box-shadow: var(--shadow);
}
.home-viagem-header {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 600;
  color: var(--verde-escuro);
  margin-bottom: 12px;
}
.home-viag-infos {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 14px;
}
.home-viag-info-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--text2);
}
.home-viag-prog-track {
  background: #e5e7eb;
  border-radius: 4px;
  height: 8px;
  margin-bottom: 6px;
  overflow: hidden;
}
.home-viag-prog-fill {
  background: var(--verde-escuro);
  height: 8px;
  border-radius: 4px;
  transition: width .4s;
}
.home-viag-prog-label {
  font-size: 12px;
  color: var(--text3);
  margin-bottom: 14px;
}
.home-viagem-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* ── Próximas entregas ──────────────────────────────────────── */
.home-entregas-list { display: flex; flex-direction: column; gap: 6px; }
.home-entrega-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 13px;
}
.home-entrega-num  { font-weight: 600; color: var(--verde-escuro); flex-shrink: 0; font-size: 12px; }
.home-entrega-dest { flex: 1; min-width: 0; color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Lotes (entregador_terceirizado) ────────────────────────── */
.home-lotes-list { display: flex; flex-direction: column; gap: 6px; }
.home-lote-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 13px;
}
.home-lote-info    { flex: 1; min-width: 0; }
.home-lote-detalhe { font-size: 11px; color: var(--text3); margin-top: 2px; }
.home-lote-valor   { font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 15px; font-variant-numeric: tabular-nums; color: var(--text); flex-shrink: 0; white-space: nowrap; }
.home-lote-status  { font-size: 11px; padding: 2px 8px; border-radius: 999px; font-weight: 600; white-space: nowrap; flex-shrink: 0; }
.home-lote-aberto  { background: #f3f4f6; color: #374151; }
.home-lote-pend    { background: #fffbeb; color: #92400e; }
.home-lote-caixa   { background: #eff6ff; color: #1d4ed8; }
.home-lote-pago    { background: #f0fdf4; color: #166534; }

/* ══════════════════════════════════════════════════════════════
   HOME ENTREGADOR — layout rico 2 colunas
   ══════════════════════════════════════════════════════════════ */

.ent-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 16px;
  margin-bottom: 4px;
}
.ent-col-main { display: flex; flex-direction: column; gap: 16px; }
.ent-col-side { align-self: start; }

/* ── Card "Viagem de hoje" ────────────────────────────────── */
.vdh-card {
  background: #fff;
  border: 1px solid #C7E59B;
  border-radius: 12px;
  padding: 18px 20px;
}
.vdh-vazio {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text3);
  font-size: 14px;
  background: #f9fafb;
  border-radius: 12px;
  padding: 20px;
}
.vdh-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
  color: #005C28;
}
.vdh-title   { font-size: 16px; font-weight: 500; color: #005C28; line-height: 1.2; }
.vdh-subtitle { font-size: 12px; color: #3A5A2A; margin-top: 2px; }
.vdh-rows { margin: 0 0 14px; }
.vdh-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px dashed #C7E59B;
}
.vdh-row:last-child { border-bottom: none; }
.vdh-row-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  color: #8aaa6a;
  width: 72px;
  flex-shrink: 0;
}
.vdh-row-val { flex: 1; font-size: 13px; color: #005C28; min-width: 0; }
.vdh-prog-wrap { flex: 1; min-width: 0; }
.vdh-prog-track {
  height: 6px;
  background: #EEF5E6;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 4px;
}
.vdh-prog-fill {
  height: 6px;
  background: #005C28;
  border-radius: 3px;
  transition: width .4s;
}
.vdh-prog-label { font-size: 11px; color: #3A5A2A; }
.vdh-actions { display: flex; flex-direction: column; gap: 8px; }
.vdh-actions-row { display: flex; gap: 8px; }
.vdh-actions-row .btn-vdh-outline { flex: 1; }
.btn-vdh-full {
  width: 100%;
  padding: 12px 18px;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: 'DM Sans', sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.btn-vdh-iniciar  { background: #005C28; color: #fff; }
.btn-vdh-iniciar:hover  { background: #004a20; }
.btn-vdh-finalizar { background: #EEF5E6; color: #005C28; border: 1px solid #C7E59B; }
.btn-vdh-finalizar:hover { background: #dcefc7; }
.btn-vdh-primary {
  padding: 9px 18px;
  background: #99D420;
  color: #1B5E2A;
  border: none;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: 'DM Sans', sans-serif;
}
.btn-vdh-primary:hover { background: #8bc31b; }
.btn-vdh-outline {
  padding: 9px 14px;
  background: transparent;
  border: 1px solid #C7E59B;
  color: #005C28;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  font-family: 'DM Sans', sans-serif;
  text-align: center;
}
.btn-vdh-outline:hover { background: #EEF5E6; }

/* ── Card "Resumo do mês" ─────────────────────────────────── */
.rsm-card {
  background: #fff;
  border: 1px solid #C7E59B;
  border-radius: 12px;
  padding: 18px 20px;
}
.rsm-title { font-size: 14px; font-weight: 600; color: #005C28; margin-bottom: 14px; }
.rsm-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rsm-kpi   { border: 0.5px solid #C7E59B; border-radius: 10px; padding: 12px; background: #fff; }
.rsm-kpi-km    { border-top: 2px solid #378ADD; }
.rsm-kpi-green { border-top: 2px solid #99D420; }
.rsm-icon-wrap {
  width: 28px; height: 28px;
  background: #EEF5E6;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #005C28;
  margin-bottom: 8px;
}
.rsm-kpi-label { font-size: 11px; font-weight: 700; text-transform: uppercase; color: #8aaa6a; margin-bottom: 4px; }
.rsm-kpi-num   { display: flex; align-items: baseline; gap: 4px; flex-wrap: wrap; }
.rsm-kpi-val   { font-size: 22px; font-weight: 500; color: #005C28; line-height: 1; }
.rsm-kpi-unit  { font-size: 12px; color: #8aaa6a; }
.rsm-kpi-delta {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 999px;
  white-space: nowrap;
}
.rsm-delta-up   { background: #dcfce7; color: #166534; }
.rsm-delta-down { background: #fef2f2; color: #991b1b; }
.rsm-kpi-sub    { font-size: 11px; color: #8aaa6a; margin-top: 4px; }

/* ── Card "Próximas entregas" ─────────────────────────────── */
.prox-card {
  background: #fff;
  border: 1px solid #C7E59B;
  border-radius: 12px;
  padding: 18px 20px;
}
.prox-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}
.prox-title     { font-size: 14px; font-weight: 600; color: #005C28; }
.prox-ver-todas { font-size: 12px; color: #005C28; cursor: pointer; font-weight: 500; }
.prox-sub       { font-size: 12px; color: #3A5A2A; margin-bottom: 14px; min-height: 18px; }
.prox-list      { display: flex; flex-direction: column; gap: 10px; }
.prox-item      { display: flex; align-items: center; gap: 10px; }
.prox-avatar {
  width: 30px; height: 30px;
  background: #005C28;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}
.prox-body  { flex: 1; min-width: 0; }
.prox-nome  {
  font-size: 13.5px;
  font-weight: 500;
  color: #242021;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.prox-meta  {
  font-size: 12px;
  color: #3A5A2A;
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.prox-badge          { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; flex-shrink: 0; white-space: nowrap; }
.prox-badge-pendente { background: #FAEEDA; color: #854F0B; }
.prox-badge-entregue { background: #dcfce7; color: #166534; }
.prox-vazio          { font-size: 13px; color: var(--text3); text-align: center; padding: 16px 0; }

@media (max-width: 640px) {
  .ent-layout { grid-template-columns: 1fr; }
  .vdh-card, .prox-card, .rsm-card { padding: 14px 14px; }
}

/* ── Badge de contagem no ícone do módulo ───────────────────── */
.home-modulo-badge {
  position: absolute;
  top: -6px;
  right: -8px;
  background: var(--danger);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  border: 1.5px solid #fff;
  line-height: 1;
}

/* ── Contas a pagar por loja (gráfico da home) ──────────────── */
.ap-titulo { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.ap-controles { display: flex; gap: 6px; }
.ap-preset {
  border: 1px solid var(--border); background: var(--surface); color: var(--text2);
  border-radius: 8px; padding: 3px 10px; font-size: 12px; cursor: pointer;
  font-family: inherit; line-height: 1.4;
}
.ap-preset.ativo { background: var(--verde-escuro); border-color: var(--verde-escuro); color: #fff; font-weight: 600; }
.ap-card { padding: 14px 16px 10px; position: relative; margin-bottom: 20px; }
.ap-atraso {
  display: flex; align-items: center; gap: 7px;
  font-size: 12.5px; color: #a93226; background: #fdf3f2; border: 1px solid #f2c9c4;
  border-radius: 8px; padding: 7px 10px; margin: -2px 0 12px;
}
.ap-vazio { color: var(--text3); font-size: 13px; padding: 18px 4px; text-align: center; }
.ap-svg { width: 100%; height: auto; display: block; }
.ap-svg .ap-grid     { stroke: #ececec; stroke-width: 1; }
.ap-svg .ap-baseline { stroke: #d6d6d0; stroke-width: 1; }
.ap-svg .ap-ytick    { font-size: 10px; fill: #8b8b85; text-anchor: end; font-variant-numeric: tabular-nums; }
.ap-svg .ap-xtick    { font-size: 10px; fill: #8b8b85; text-anchor: middle; }
.ap-svg .ap-lbl-max  { font-size: 10.5px; font-weight: 700; fill: var(--text); text-anchor: middle; }
.ap-svg .ap-hit      { outline: none; cursor: pointer; }
.ap-svg .ap-hit:focus-visible { stroke: var(--verde-escuro); stroke-width: 1.5; stroke-dasharray: 3 2; }
.ap-svg.ap-hovering g.ap-day { opacity: .4; transition: opacity .12s; }
.ap-svg.ap-hovering g.ap-day.on { opacity: 1; }
#ap-tip {
  position: absolute; pointer-events: none; display: none; z-index: 6;
  background: #fff; border: 1px solid #e3e3de; border-radius: 8px;
  box-shadow: var(--shadow); padding: 8px 10px; font-size: 12px; min-width: 150px;
}
#ap-tip .th { font-weight: 600; color: var(--text2); margin-bottom: 5px; }
#ap-tip .tr { display: flex; align-items: center; gap: 6px; margin: 2px 0; }
#ap-tip .tk { width: 10px; height: 3px; border-radius: 2px; flex: 0 0 auto; }
#ap-tip .tv { font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
#ap-tip .tn { color: var(--text3); }
#ap-tip .tf { border-top: 1px solid #ececec; margin-top: 5px; padding-top: 4px; font-weight: 600; color: var(--text2); }
.ap-legenda {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px;
  margin-top: 8px; font-size: 12px; color: var(--text2);
}
.ap-legenda .sw { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.ap-legenda .ap-tot { margin-left: auto; color: var(--text3); }
.ap-fonte { font-size: 11px; color: var(--text3); margin-top: 6px; }
.ap-tabela-wrap { overflow-x: auto; }
.ap-tabela { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ap-tabela th, .ap-tabela td {
  padding: 5px 8px; border-bottom: 1px solid #ececec;
  text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.ap-tabela th:first-child, .ap-tabela td:first-child { text-align: left; }
.ap-tabela thead th { color: var(--text2); font-weight: 600; border-bottom: 1px solid #d6d6d0; }
.ap-tabela tfoot td { font-weight: 700; border-top: 1px solid #d6d6d0; border-bottom: none; }