/* =========================================================================
   VIVA Expedição — estilos da área própria (mesmo sistema visual do Gestão: tokens --vg-*, escopo .vx)
   Etiqueta: 10 × 15 cm na impressão, sempre em preto sobre branco (também no modo escuro).
   ========================================================================= */
.vx .vx-falta{ color:var(--vg-warn); }
.vx .vx-acao .vg-btn, .vg .vx-acao .vg-btn{ margin:0 8px 8px 0; }
.vg .vx-form{ margin:12px 0 0; padding-top:12px; border-top:1px solid var(--vg-borda); }
.vg .vx-form .field{ margin:0 0 10px; }
.vg .vx-form label{ display:block; font-size:12.5px; font-weight:600; margin:0 0 4px; color:var(--vg-ink); }
.vg .vx-form input{ width:100%; box-sizing:border-box; padding:9px 10px; border:1px solid var(--vg-borda); border-radius:8px; background:var(--vg-card); color:var(--vg-ink); font:inherit; font-size:14px; }
.vg .vx-campos{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.vg .vx-desp{ margin:10px 0 0; font-size:12.5px; }
.vg .vx-conf{ border:0; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:8px; }
.vg .vx-conf-item{ display:flex; gap:10px; align-items:center; padding:10px 12px; border:1px solid var(--vg-borda); border-radius:9px; background:var(--vg-soft); font-size:14px; cursor:pointer; min-height:24px; }
.vg .vx-conf-item input{ width:20px; height:20px; accent-color:var(--vg-acento); flex:none; }
.vg .vx-ocorrencias{ list-style:none; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:10px; font-size:13px; }
.vg .vx-timeline{ list-style:none; margin:0; padding:0; }
.vg .vx-timeline li{ display:flex; gap:12px; padding:0 0 14px; position:relative; font-size:13px; }
.vg .vx-timeline li:not(:last-child)::before{ content:''; position:absolute; left:5px; top:14px; bottom:0; width:2px; background:var(--vg-borda); }
.vg .vx-tl-ponto{ width:12px; height:12px; border-radius:50%; background:var(--vg-acento); flex:none; margin-top:3px; }
.vg .vx-et-previa{ display:flex; justify-content:center; padding:12px; background:var(--vg-soft); border-radius:10px; margin:0 0 10px; overflow:auto; }
@media (max-width:720px){ .vg .vx-campos{ grid-template-columns:1fr; } }

/* ---------- PR14: torre de controle, planejamento, rotas, formulários ---------- */
.vg .vx-tiles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); gap:8px; margin:0 0 14px; }
.vg .vx-tile{ display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:10px 12px; min-height:44px; border:1px solid var(--vg-borda); border-radius:var(--vg-r-sm,10px); background:var(--vg-card); color:var(--vg-ink); font:inherit; text-align:left; cursor:pointer; }
.vg .vx-tile span{ font-size:12px; color:var(--vg-muted); }
.vg .vx-tile strong{ font-size:20px; line-height:1.1; }
.vg .vx-tile:hover{ background:var(--vg-soft); }
.vg .vx-tile.ativo{ border-color:var(--vg-acento); box-shadow:inset 0 0 0 1px var(--vg-acento); background:var(--vg-soft); }
.vg .vx-tile:focus-visible, .vg .vx-rota:focus-visible{ outline:2px solid var(--vg-ring); outline-offset:2px; }
.vg .vx-periodo{ display:flex; flex-wrap:wrap; gap:8px 14px; align-items:center; margin:0 0 12px; font-size:13px; }
.vg .vx-periodo label{ display:inline-flex; gap:6px; align-items:center; }
.vg .vx-periodo input, .vg .vx-in-num, .vg .vx-form select, .vg .vx-form textarea{ padding:7px 9px; border:1px solid var(--vg-borda); border-radius:8px; background:var(--vg-card); color:var(--vg-ink); font:inherit; font-size:14px; }
.vg .vx-form select, .vg .vx-form textarea{ width:100%; box-sizing:border-box; }
.vg .vx-in-num{ width:5.5em; }
.vg .vx-semana{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:0 0 16px; }
.vg .vx-dia{ border:1px solid var(--vg-borda); border-radius:var(--vg-r,12px); background:var(--vg-card); padding:10px; min-width:0; display:flex; flex-direction:column; gap:8px; }
.vg .vx-dia.hoje{ border-color:var(--vg-acento); box-shadow:inset 0 3px 0 var(--vg-acento); }
.vg .vx-dia h2{ font-size:14px; margin:0; }
.vg .vx-dia h2 small{ display:block; font-weight:400; color:var(--vg-muted); font-size:12px; }
.vg .vx-dia-pe{ margin:auto 0 0; font-size:12px; color:var(--vg-muted); }
.vg .vx-rota{ display:flex; flex-direction:column; gap:4px; align-items:flex-start; width:100%; padding:8px 10px; border:1px solid var(--vg-borda); border-radius:9px; background:var(--vg-soft); color:var(--vg-ink); font:inherit; font-size:12.5px; text-align:left; cursor:pointer; overflow-wrap:anywhere; }
.vg .vx-rota.virtual{ border-style:dashed; background:transparent; }
.vg .vx-rota-pe{ display:flex; flex-wrap:wrap; gap:4px; }
.vg .vx-grade{ overflow-x:auto; margin:0 0 10px; }
.vg .vx-tab{ width:100%; border-collapse:collapse; font-size:13px; }
.vg .vx-tab th, .vg .vx-tab td{ text-align:left; padding:7px 8px; border-bottom:1px solid var(--vg-borda); vertical-align:top; }
.vg .vx-tab th{ font-size:12px; color:var(--vg-muted); font-weight:600; }
.vg .vx-vol{ border:1px solid var(--vg-borda); border-radius:9px; padding:8px 10px 10px; margin:0 0 10px; }
.vg .vx-vol legend{ font-size:12.5px; font-weight:600; padding:0 4px; }
.vg .vx-campos4{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.vg .vx-itens-vol{ display:flex; flex-wrap:wrap; gap:6px 14px; margin:8px 0 0; font-size:13px; }
.vg .vx-itens-vol label, .vg .vx-radio label, .vg .vx-escopo label{ display:inline-flex; gap:6px; align-items:center; min-height:24px; font-weight:400; }
.vg .vx-curto input{ max-width:8em; }
.vg .vx-dl{ display:grid; grid-template-columns:minmax(90px,34%) minmax(0,1fr); gap:6px 12px; margin:0; font-size:13px; }
.vg .vx-dl dt small{ display:block; font-weight:400; }
.vg .vx-det .vg-grid>*, .vg .vx-det .vg-card{ min-width:0; }
.vg .vx-quebra{ white-space:normal; text-align:left; height:auto; max-width:100%; overflow-wrap:anywhere; }
.vg .vx-dl dt{ color:var(--vg-muted); }
.vg .vx-dl dd{ margin:0; overflow-wrap:anywhere; }
.vg .vx-botoes{ display:flex; flex-wrap:wrap; gap:8px; }
.vg .vx-alerta{ border-left:3px solid var(--vg-warn); background:var(--vg-warn-bg); color:var(--vg-ink); padding:8px 12px; border-radius:6px; }
.vg .vx-radio, .vg .vx-escopo{ border:0; padding:0; margin:0 0 10px; display:flex; flex-wrap:wrap; gap:6px 16px; }
.vg .vx-radio legend, .vg .vx-escopo legend{ font-size:12.5px; font-weight:600; margin:0 0 4px; width:100%; }
.vg .vx-form-topo{ margin-top:0; padding-top:0; border-top:0; }
.vg .vx-det{ display:flex; flex-direction:column; gap:14px; }
/* formulários dentro do modal (fora do escopo .vg: usa os tokens do app) */
.vx-modal-form{ text-align:left; display:flex; flex-direction:column; gap:10px; max-height:60vh; overflow:auto; padding:2px; }
.vx-modal-form .field{ margin:0; }
.vx-modal-form label{ display:block; font-size:12.5px; font-weight:600; margin:0 0 4px; }
.vx-modal-form fieldset{ border:1px solid var(--border); border-radius:9px; padding:8px 10px; margin:0; display:flex; flex-wrap:wrap; gap:6px 14px; }
.vx-modal-form fieldset legend{ font-size:12.5px; font-weight:600; padding:0 4px; }
.vx-modal-form fieldset label{ display:inline-flex; gap:6px; align-items:center; font-weight:400; margin:0; }
.vx-modal-form input:not([type=checkbox]):not([type=radio]), .vx-modal-form select, .vx-modal-form textarea{ width:100%; box-sizing:border-box; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:var(--ink); font:inherit; font-size:14px; }
.vx-modal-form .vx-sub{ font-size:14px; margin:6px 0 0; }
.vx-modal-form ul{ margin:0; padding-left:18px; font-size:13px; }
@media (max-width:1100px){ .vg .vx-semana{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:720px){ .vg .vx-semana{ grid-template-columns:1fr; } .vg .vx-campos4{ grid-template-columns:1fr 1fr; } .vg .vx-dl{ grid-template-columns:1fr; } .vg .vx-dl dd{ margin-bottom:6px; } }
/* etiqueta: partes novas */
.vx-etiqueta .vx-et-topo small{ display:block; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.vx-etiqueta .vx-et-vol{ font-size:12px !important; }
.vx-etiqueta .vx-et-cod{ text-align:center; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:11px; letter-spacing:.12em; margin:-4px 0 6px; }
.vx-etiqueta .vx-et-linha{ display:flex; flex-wrap:wrap; gap:4px 14px; border-top:1px solid #bbb; padding:6px 0; }
.vx-etiqueta .vx-et-linha small{ display:block; font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; color:#444; }

/* ---------- etiqueta (prévia na tela e impressão) ---------- */
.vx-etiqueta{ width:100%; max-width:360px; box-sizing:border-box; background:#fff; color:#111; border:1.5px solid #111; border-radius:6px; padding:12px 14px; font-family:var(--font-body,system-ui,sans-serif); font-size:12px; line-height:1.35; color-scheme:light; }
.vx-etiqueta .vx-et-topo{ display:flex; justify-content:space-between; gap:8px; align-items:baseline; border-bottom:1.5px solid #111; padding-bottom:6px; margin-bottom:8px; }
.vx-etiqueta .vx-et-topo strong{ font-size:16px; letter-spacing:.06em; }
.vx-etiqueta .vx-et-topo span{ font-size:10px; text-align:right; }
.vx-etiqueta .vx-et-num{ font-size:22px; font-weight:800; letter-spacing:.04em; text-align:center; margin:2px 0 4px; }
.vx-etiqueta .vx-barras{ display:block; width:100%; height:52px; margin:0 0 8px; }
.vx-etiqueta .vx-et-bloco{ border-top:1px solid #bbb; padding:6px 0; }
.vx-etiqueta .vx-et-bloco small{ display:block; font-size:9.5px; text-transform:uppercase; letter-spacing:.06em; color:#444; }
.vx-etiqueta .vx-et-bloco strong{ display:block; font-size:14px; }
.vx-etiqueta .vg-bloco{ display:block; }
.vx-etiqueta .vx-falta{ color:#7A4F00; }
.vx-etiqueta .vx-et-pe{ border-top:1px solid #bbb; padding-top:6px; font-size:9.5px; color:#444; }
@media print{
  body.vg-imprimindo #vg-impressao.vx-imp{ display:block; padding:0; }
  body.vg-imprimindo #vg-impressao.vx-imp .vx-etiqueta{ width:10cm; max-width:none; min-height:14cm; border-radius:0; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}