/* Lekker Entregas — módulo de logística, design system próprio (extraído 1:1 de
   "Lekker Entregas.dc.html"). Não reaproveita site.css nem suas variáveis --lk-*. */

:root {
  --lg-bg: #eef1ea;
  --lg-ink: #1f2a17;
  --lg-cream: #f2f6ec;
  --lg-green: #5f9b1f;
  --lg-green-hover: #4f8a17;
  --lg-green-dark: #3f6d12;
  --lg-orange: #e8a33d;
  --lg-orange-hover: #d18f2c;
  --lg-orange-bg: #fdf3e2;
  --lg-orange-text: #a1772f;
  --lg-red: #b8412f;
  --lg-red-hover: #9c3626;
  --lg-red-bg: #fdf1ef;
  --lg-blue: #3d63a8;
  --lg-blue-bg: #eaf0fa;
  --lg-muted-1: #96a38c;
  --lg-muted-2: #6b7862;
  --lg-muted-3: #3d4a33;
  --lg-panel-1: #fff;
  --lg-panel-2: #f3f6ee;
  --lg-panel-3: #f7f9f4;
  --lg-border: rgba(31, 42, 23, .14);
  --lg-border-soft: rgba(31, 42, 23, .08);
  --lg-border-strong: rgba(31, 42, 23, .22);
}

html, body { margin: 0; padding: 0; }
body.lg-body {
  background: var(--lg-bg);
  color: var(--lg-ink);
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.lg-body * { box-sizing: border-box; }
.lg-body a { color: var(--lg-green-hover); text-decoration: none; }
.lg-body a:hover { color: var(--lg-ink); }
.lg-body input, .lg-body button, .lg-body select, .lg-body textarea { font-family: inherit; }
.lg-body ::selection { background: var(--lg-green); color: #fff; }
.lg-body h1, .lg-body h2, .lg-body h3, .lg-body h4 { margin: 0; font-family: 'Plus Jakarta Sans', system-ui, sans-serif; }

@keyframes lgUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes lgFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes lgPing { 0% { transform: scale(1); opacity: .55; } 70% { transform: scale(2.4); opacity: 0; } 100% { opacity: 0; } }

/* Header */
.lg-header { position: sticky; top: 0; z-index: 30; background: var(--lg-ink); color: var(--lg-cream); }
.lg-header-inner { max-width: 1560px; margin: 0 auto; padding: 0 28px; height: 64px; display: flex; align-items: center; gap: 16px; }
.lg-logo-badge { width: 30px; height: 30px; border-radius: 9px; background: var(--lg-green); display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; color: #fff; flex: none; }
.lg-logo-word { font-size: 14px; font-weight: 700; letter-spacing: .02em; }
.lg-logo-sub { font-size: 10.5px; font-weight: 500; color: rgba(242, 246, 236, .55); }
.lg-header-spacer { flex: 1; }
.lg-btn-header-outline { height: 34px; padding: 0 14px; border: 1px solid rgba(242, 246, 236, .25); border-radius: 9px; background: transparent; color: var(--lg-cream); font-size: 11.5px; font-weight: 600; cursor: pointer; }
.lg-btn-header-outline:hover { background: rgba(242, 246, 236, .12); }

/* Container */
.lg-container { max-width: 1560px; margin: 0 auto; padding: 26px 28px 60px; }

/* Botões */
.lg-btn {
  height: 48px; padding: 0 20px; border: none; border-radius: 13px; background: var(--lg-green); color: #fff;
  font-size: 13.5px; font-weight: 800; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.lg-btn:hover { background: var(--lg-green-hover); }
.lg-btn:disabled, .lg-btn.lg-btn-disabled { background: #c3ccb8; cursor: not-allowed; opacity: .75; }
.lg-btn-outline {
  height: 48px; padding: 0 20px; border: 1px solid var(--lg-border-strong); border-radius: 13px; background: #fff; color: var(--lg-muted-3);
  font-size: 13px; font-weight: 700; cursor: pointer;
}
.lg-btn-outline:hover { background: var(--lg-panel-2); }
.lg-btn-danger-outline {
  height: 48px; padding: 0 20px; border: 1px solid rgba(184, 65, 47, .3); border-radius: 13px; background: var(--lg-red-bg); color: var(--lg-red);
  font-size: 13px; font-weight: 700; cursor: pointer;
}
.lg-btn-danger-outline:hover { background: #fae2de; }
.lg-btn-danger {
  height: 48px; padding: 0 20px; border: none; border-radius: 13px; background: var(--lg-red); color: #fff;
  font-size: 13px; font-weight: 800; cursor: pointer;
}
.lg-btn-danger:hover { background: var(--lg-red-hover); }
.lg-btn-dark {
  height: 48px; padding: 0 20px; border: none; border-radius: 13px; background: var(--lg-ink); color: var(--lg-cream);
  font-size: 13.5px; font-weight: 700; cursor: pointer;
}
.lg-btn-dark:hover { background: var(--lg-green-hover); }
.lg-icon-btn { width: 48px; height: 48px; border: 1px solid var(--lg-border-strong); border-radius: 13px; background: #fff; font-size: 15px; color: var(--lg-muted-3); cursor: pointer; flex: none; }
.lg-icon-btn:hover { background: var(--lg-panel-2); }

/* Cards genéricos */
.lg-card { border-radius: 18px; background: #fff; border: 1px solid var(--lg-border-soft); overflow: hidden; }
.lg-card-head { padding: 16px 20px; border-bottom: 1px solid var(--lg-border-soft); display: flex; align-items: center; justify-content: space-between; }
.lg-card-title { font-size: 15.5px; font-weight: 800; color: var(--lg-ink); }
.lg-kicker { font-size: 10.5px; font-weight: 800; letter-spacing: .12em; color: var(--lg-muted-1); text-transform: uppercase; }

/* Badges de status */
.lg-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.lg-badge-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.lg-badge-pago { background: var(--lg-blue-bg); color: var(--lg-blue); }
.lg-badge-emseparacao { background: var(--lg-orange-bg); color: var(--lg-orange-text); }
.lg-badge-pronto { background: #f2f8ea; color: var(--lg-green-hover); }
.lg-badge-emrota { background: #e6f1d7; color: var(--lg-green-dark); }
.lg-badge-entregue { background: #e9f7e4; color: #2f7a2a; }
.lg-badge-cancelado { background: var(--lg-red-bg); color: var(--lg-red); }

/* Steps (linha do tempo) */
.lg-step-dot { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; flex: none; border: 2px solid transparent; }
.lg-step-line { flex: 1; width: 2px; min-height: 26px; }

/* Campos de formulário */
.lg-field { display: flex; flex-direction: column; gap: 7px; font-size: 11px; font-weight: 700; color: var(--lg-muted-2); }
.lg-field input, .lg-field select, .lg-field textarea {
  height: 46px; padding: 0 14px; border: 1px solid var(--lg-border-strong); border-radius: 12px; background: var(--lg-panel-2);
  font-size: 14px; font-weight: 500; color: var(--lg-ink); outline: none;
}
.lg-field textarea { padding: 12px 14px; height: auto; resize: vertical; }
.lg-form-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 640px) { .lg-form-grid-2 { grid-template-columns: 1fr; } }

.lg-success-msg { margin: 14px 0 0; font-size: 13px; font-weight: 600; color: var(--lg-green-hover); }
.lg-error-msg { margin: 14px 0 0; font-size: 13px; font-weight: 600; color: var(--lg-red); }

/* Utilitários */
.lg-hidden { display: none !important; }

/* Impressão do romaneio — esconde tudo, exceto o conteúdo do modal, na hora de imprimir. */
@media print {
  body.lg-printing > *:not([data-modal="romaneio"]) { display: none !important; }
  body.lg-printing [data-modal="romaneio"] { position: static !important; padding: 0 !important; background: none !important; }
  body.lg-printing [data-modal="romaneio"] > div:first-child { display: none !important; }
  body.lg-printing #lg-romaneio-print { box-shadow: none !important; }
  body.lg-printing [data-print-hide] { display: none !important; }
}

/* Mapa (Leaflet) */
.lg-map { border-radius: 14px; overflow: hidden; background: var(--lg-panel-2); }
.lg-map-pin { display: flex; align-items: center; justify-content: center; border-radius: 50%; box-shadow: 0 4px 12px rgba(31, 42, 23, .25); }
.lg-map-pin-moto { background: var(--lg-green); border: 3px solid #fff; }
.lg-map-pin-fabrica { background: var(--lg-ink); color: #fff; }
.lg-map-pin-cliente { background: #fff; border: 3px solid var(--lg-ink); }
.lg-map-pin-ping { position: absolute; inset: 0; border-radius: 50%; background: var(--lg-green); animation: lgPing 2s ease-out infinite; }