.shipment-list { max-width:1600px;margin:auto;color:var(--navy-900);container-type:inline-size; }
.sl-header { display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:22px; }
.sl-header h1 { font-size:26px;letter-spacing:-.7px;margin:6px 0; }
.sl-header p { margin:0;font-size:13px; }
.sl-eyebrow { font-size:10px;letter-spacing:.12em;font-weight:700;color:var(--text-muted); }
.sl-actions,.sl-row-actions { display:flex;gap:8px;align-items:center; }
.sl-notice { font-size:12px;color:var(--text-muted);margin:0 0 16px; }
.sl-notice:empty { display:none; }
.sl-notice-warning { padding:10px 14px;border-left:3px solid var(--coral-500);background:var(--coral-050); }
.sl-tabs { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px; }
.sl-tabs button { border-color:transparent;background:transparent;color:var(--text-muted);padding:9px 14px;min-height:40px; }
.sl-tabs button[aria-pressed=true] { color:var(--navy-900);background:var(--bg-raised);border-color:var(--border);box-shadow:0 2px 4px #10306008; }
.sl-controls { display:flex;align-items:end;gap:14px;padding:18px;background:var(--bg-raised);border:1px solid var(--border);border-radius:12px 12px 0 0; }
.sl-controls label { display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:600;color:var(--text-muted); }
.sl-controls input,.sl-controls select { font:inherit;font-size:13px;color:var(--navy-900);background:var(--bg-raised);border:1px solid var(--border-strong);border-radius:7px;padding:9px 11px;min-height:40px;max-width:100%; }
.sl-controls input:focus,.sl-controls select:focus { outline:2px solid var(--mint-500);outline-offset:2px; }
.sl-search { flex:1;min-width:180px;max-width:460px; }
.sl-sort { margin-left:auto;font-size:11px;color:var(--text-muted);padding-bottom:12px;white-space:nowrap; }
.sl-summary { font-size:12px;padding:13px 18px;background:var(--bg-subtle);border:1px solid var(--border);border-top:0;color:var(--text-muted); }
.sl-table { background:var(--bg-raised);border:1px solid var(--border);border-top:0;border-radius:0 0 12px 12px;overflow:hidden; }
.sl-row,.sl-table-head { display:grid;grid-template-columns:minmax(150px,1.05fr) minmax(170px,1.3fr) minmax(100px,.7fr) minmax(112px,.8fr) minmax(190px,1.35fr) 76px;gap:18px;align-items:center;padding:18px; }
.sl-table-head { font-size:10px;line-height:1.4;text-transform:uppercase;letter-spacing:.055em;color:var(--text-muted);padding-top:12px;padding-bottom:12px;border-bottom:1px solid var(--border); }
.sl-row { border-bottom:1px solid var(--border);font-size:13px;min-height:86px;padding-top:14px;padding-bottom:14px; }
.sl-row:last-child { border-bottom:0; }.sl-row:hover { background:var(--bg-subtle); }
.sl-row>div { min-width:0;overflow-wrap:anywhere; }
.sl-identity,.sl-cargo,.sl-updated { display:flex;flex-direction:column;gap:6px; }
.sl-title-button,.sl-message-button { border:0;background:none;padding:0;text-align:left;font:inherit;color:var(--navy-700);font-weight:650;cursor:pointer; }
.sl-title-button { font-size:13px; }.sl-title-button:hover,.sl-message-button:hover { text-decoration:underline; }
.sl-title-button:focus-visible,.sl-message-button:focus-visible { outline:2px solid var(--mint-500);outline-offset:4px; }
.sl-secondary { font-size:11px;color:var(--text-muted);line-height:1.5; }.sl-updated { font-variant-numeric:tabular-nums; }
.sl-tags { display:flex;flex-wrap:wrap;gap:5px;margin-top:7px; }
.sl-tag { display:inline-flex;align-items:center;gap:4px;padding:3px 7px;background:var(--navy-050);color:var(--navy-700);border:1px solid var(--border);border-radius:6px;font-size:10px;line-height:1.4;font-weight:500; }
.sl-tag-warning { color:var(--coral-700);border-color:var(--coral-200);background:var(--coral-050); }
.sl-pagination { display:flex;gap:12px;align-items:center;justify-content:flex-end;flex-wrap:wrap;font-size:12px;color:var(--text-muted);padding:16px 0; }
.sl-pagination>span:first-child { margin-right:auto; }.sl-empty { padding:42px 20px;text-align:center;color:var(--text-muted);font-size:14px; }
.shipment-list-panel { width:min(740px,100vw);max-width:100vw; }.shipment-list-panel .shipment-panel-body { padding:22px 26px; }
.shipment-list-panel .sl-tabs { position:sticky;top:-22px;background:var(--bg-raised);padding:8px 0;z-index:1;border-bottom:1px solid var(--border); }
.sl-fields { display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0; }.sl-field dt { color:var(--text-muted);font-size:11px;margin-bottom:6px; }
.sl-field dd { margin:0;font-size:13px;line-height:1.5;overflow-wrap:anywhere; }.sl-message { padding:18px 0;border-bottom:1px solid var(--border); }
.sl-message h3 { font-size:12px;margin:0 0 10px;line-height:1.5;overflow-wrap:anywhere; }.sl-message .shipment-message { font-size:13px;margin:12px 0; }
.sl-attachment { border:1px solid var(--border);border-radius:9px;background:var(--bg-subtle);padding:14px;margin:12px 0; }.sl-attachment .sl-tag { margin-right:6px; }
.sl-attachment p,.sl-context { font-size:12px;line-height:1.6;color:var(--text-muted);margin-bottom:0; }.sl-context { flex-basis:100%; }
.sl-timeline h3 { font-size:14px;margin-top:24px; }.sl-event { padding:15px 0;border-bottom:1px solid var(--border);font-size:12px; }
.sl-event time { float:right;color:var(--text-muted); }.sl-event p { white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.6; }
.sl-link { display:block;font-size:12px;color:var(--navy-700);margin:18px 0;font-weight:600; }
/* El iframe es un documento de otro origen: sin pointer-events el mouse podria meter el foco ahi dentro pasando por encima del enlace externo, que es la unica ruta interactiva real. */
.sl-map { width:100%;aspect-ratio:16/10;max-width:100%;margin:14px 0;border:1px solid var(--border);border-radius:9px;overflow:hidden;background:var(--bg-subtle); }
.sl-map iframe { width:100%;height:100%;border:0;pointer-events:none; }
.sl-group-fields { border:0;padding:0;min-width:0; }
@media(max-width:1200px) {
 .sl-row,.sl-table-head { grid-template-columns:minmax(130px,1fr) minmax(150px,1.2fr) 100px minmax(110px,.8fr) minmax(160px,1.2fr);gap:12px; }
 .sl-row-actions { grid-column:5; }.sl-table-head>span:last-child { display:none; }
}
@media(max-width:850px) {
 .sl-header { align-items:start;flex-direction:column;gap:14px; }.sl-controls { flex-wrap:wrap; }.sl-search { max-width:none;flex-basis:100%; }.sl-sort { margin-left:0; }
 .sl-table-head { display:none; }.sl-row { grid-template-columns:1fr 1fr;gap:12px;padding:18px; }
 .sl-identity { grid-column:1; }.sl-cargo { grid-column:1/-1;grid-row:2; }.sl-state { grid-column:2;grid-row:1;justify-self:end; }
 .sl-updated { grid-column:1;grid-row:3; }.sl-evidence { grid-column:1/-1;grid-row:4; }.sl-row-actions { grid-column:2;grid-row:3;justify-self:end; }
 .sl-title-button,.sl-message-button { min-height:30px; }.sl-pagination { gap:8px; }
}
@media(max-width:480px) {
 .shipment-list-panel .shipment-panel-body { padding:16px; }.sl-fields { gap:16px; }.sl-controls { gap:10px;padding:14px; }
 .sl-controls select { width:100%; }.sl-controls label:not(.sl-search) { flex:1; }.sl-sort { width:100%;padding:0; }.sl-actions { flex-wrap:wrap; }
 .sl-header h1 { font-size:24px; }.sl-pagination { justify-content:space-between; }.sl-pagination>span:first-child { flex-basis:100%; }.sl-event time { float:none;display:block;margin-top:5px; }
}
@media(prefers-reduced-motion:reduce) { .shipment-list *,.shipment-list-panel * { scroll-behavior:auto!important; } }
@container(max-width:1080px) {
 .sl-row,.sl-table-head { grid-template-columns:minmax(125px,1fr) minmax(145px,1.2fr) 100px minmax(105px,.8fr) minmax(155px,1.2fr);gap:12px; }
 .sl-row-actions { grid-column:5; }.sl-table-head>span:last-child { display:none; }
}
@container(max-width:820px) {
 .sl-table-head { display:none; }.sl-row { grid-template-columns:1fr 1fr;gap:12px;padding:18px; }
 .sl-identity { grid-column:1; }.sl-cargo { grid-column:1/-1;grid-row:2; }.sl-state { grid-column:2;grid-row:1;justify-self:end; }
 .sl-updated { grid-column:1;grid-row:3; }.sl-evidence { grid-column:1/-1;grid-row:4; }.sl-row-actions { grid-column:2;grid-row:3;justify-self:end; }
 .sl-header { align-items:start;flex-direction:column;gap:14px; }.sl-controls { flex-wrap:wrap; }.sl-search { max-width:none;flex-basis:100%; }.sl-sort { margin-left:0; }
}