/* Your shipments + Upload your shipments on every Navo tracking app (Stefan 31.10.2026). Rules copied from navo24-web example-apps.css. */
.xa-ic-upload { --i: url(/example-site/icons/upload.svg); } .xa-ic-tag { --i: url(/example-site/icons/tag.svg); } .xa-ic-x { --i: url(/example-site/icons/x.svg); } .xa-ic-package { --i: url(/example-site/icons/package.svg); } .xa-ic-ship { --i: url(/example-site/icons/ship.svg); } .xa-ic-plane { --i: url(/example-site/icons/plane.svg); } .xa-ic-truck { --i: url(/example-site/icons/truck.svg); } .xa-ic-train { --i: url(/example-site/icons/train-front.svg); }
.xa-sect-h { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-3); }
.xa-sect-h h2 { margin: 0; font: var(--fw-semibold) var(--fs-2) var(--font-display); color: var(--text-primary); }
.xa-drop { display: flex; flex-direction: column; align-items: center; gap: var(--sp-3); padding: var(--sp-8) var(--sp-6); border: 1.5px dashed var(--border-strong); border-radius: var(--r-card, 12px); text-align: center; cursor: pointer; color: var(--text-secondary); }
.xa-drop:hover, .xa-drop.on, .xa-drop:focus-visible { border-color: var(--accent); background: var(--accent-wash); color: var(--text-primary); outline: none; }
.xa-drop .xa-ic { width: 24px; height: 24px; }
.xa-found { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-3); }
.xa-drop-sm { padding: var(--sp-6) var(--sp-5); }
.xa-mine { padding: var(--sp-5) var(--sp-7) 0; }
.xa-mine:empty { display: none; }
.xa-tagf { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-3); }
.xa-tagf .mini-tag { cursor: pointer; gap: var(--sp-2); }
.xa-tagf .mini-tag.on { background: var(--accent-wash); color: var(--accent); border-color: var(--accent); }
.xa-mine-l { display: flex; flex-direction: column; border: 1px solid var(--divider); border-radius: var(--radius-8); max-height: 280px; overflow: auto; }
.xa-mine-r { display: flex; align-items: center; border-bottom: 1px solid var(--divider); }
.xa-mine-r:last-child { border-bottom: 0; }
.xa-mine-o { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-1); padding: var(--sp-3) var(--sp-4); border: 0; background: none; text-align: left; cursor: pointer; color: var(--text-primary); }
.xa-mine-o:hover, .xa-mine-o:focus-visible { background: var(--bg-sunken); outline: none; }
.xa-mine-o .field-help .xa-ic { width: 12px; height: 12px; }
.xa-tags-ro { display: flex; flex-wrap: wrap; gap: var(--sp-1); }
.xa-tags-ro .mini-tag { font-size: 11px; padding: 0 var(--sp-3); }
.xa-mine-x { margin-right: var(--sp-2); width: 28px; height: 28px; }
.xa-mine-x .xa-ic { width: 14px; height: 14px; }
.nx-ships { display: flex; flex-direction: column; }
.nx-up { padding: var(--sp-5) var(--sp-7) var(--sp-6); }
.nx-ships .xa-tool, .xa-mine-x { display: grid; place-items: center; border: 0; border-radius: var(--radius-8); background: none; color: var(--text-secondary); cursor: pointer; }
.nx-ships .xa-tool:hover { background: var(--bg-sunken); color: var(--text-primary); }
.xa-mine .xa-ic, .xa-tagf .xa-ic { width: 12px; height: 12px; }
.xa-mine-x .xa-ic { width: 14px !important; height: 14px !important; }
.nx-up .xa-drop .xa-ic { width: 24px; height: 24px; }