/* ==========================================================================
   Dragon Global Trade — base: reinicio, tipografía, utilidades, accesibilidad
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
/* WCAG 2.4.11 Foco no oculto: el desplazamiento por foco reserva el espacio de las barras fijas/sticky. --reserve-top y --reserve-bottom los mide
   shell.js (DGT.shell.reserve) sobre .acceso-savebar, .compras-sticky, .logistica-sum, etc.; sin barras valen 0 y rige solo la cabecera/barra inferior. */
html { scroll-padding-top: max(calc(var(--topbar-h) + 16px), var(--reserve-top, 0px)); scroll-padding-bottom: max(calc(var(--tabbar-h) + 16px), var(--reserve-bottom, 0px)); }
body {
  margin: 0; min-height: 100vh; min-height: 100dvh;
  background: var(--sys-bg); color: var(--sys-text);
  font-family: var(--font-sans); font-size: var(--type-body-l-size); line-height: var(--type-body-l-lh);
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
}
:lang(zh) { line-break: strict; word-break: normal; }
:lang(zh) body { font-weight: 400; }
h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol { margin: 0; }
ul[role="list"], ol[role="list"], .reset-list { list-style: none; padding: 0; margin: 0; }
img, svg, video, canvas { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; }
a { color: var(--sys-link); text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
table { border-collapse: collapse; border-spacing: 0; }
hr { border: 0; border-top: 1px solid var(--sys-border); margin: var(--ref-space-6) 0; }
[hidden] { display: none !important; }
::selection { background: var(--sys-primary-container); color: var(--sys-on-primary-container); }

/* ---------- Escala tipográfica (roles) ---------- */
.t-display  { font-family: var(--font-display); font-size: var(--type-display-size); line-height: var(--type-display-lh); font-weight: 600; letter-spacing: var(--type-tracking-display); }
.t-headline-l { font-family: var(--font-display); font-size: var(--type-headline-l-size); line-height: var(--type-headline-l-lh); font-weight: 600; letter-spacing: var(--type-tracking-display); }
.t-headline-m { font-family: var(--font-display); font-size: var(--type-headline-m-size); line-height: var(--type-headline-m-lh); font-weight: 600; }
.t-title-l  { font-size: var(--type-title-l-size); line-height: var(--type-title-l-lh); font-weight: 650; }
.t-title-m  { font-size: var(--type-title-m-size); line-height: var(--type-title-m-lh); font-weight: 600; }
.t-body-l   { font-size: var(--type-body-l-size); line-height: var(--type-body-l-lh); }
.t-body-m   { font-size: var(--type-body-m-size); line-height: var(--type-body-m-lh); }
.t-label-l  { font-size: var(--type-label-l-size); line-height: var(--type-label-l-lh); font-weight: 600; letter-spacing: var(--type-tracking-label); }
.t-label-s  { font-size: var(--type-label-s-size); line-height: var(--type-label-s-lh); font-weight: 600; letter-spacing: 0.04em; }
:lang(zh) .t-label-s { letter-spacing: 0; }
.t-mono     { font-family: var(--font-mono); font-size: 0.92em; }
.t-num, .num { font-variant-numeric: tabular-nums lining-nums; font-feature-settings: "tnum" 1, "lnum" 1; }
.num--nowrap { white-space: nowrap; } /* importes y cifras con unidad: nunca se parten (CD3-02); ver también .money */
.t-eyebrow  { font-size: var(--type-label-s-size); font-weight: 650; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sys-text-2); }
:lang(zh) .t-eyebrow { letter-spacing: 0.04em; text-transform: none; }
.muted   { color: var(--sys-text-2); }
.subtle  { color: var(--sys-text-3); }
.text-end { text-align: end; }
.nowrap { white-space: nowrap; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- Accesibilidad ---------- */
.sr-only, .visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
:focus { outline: none; }
:focus-visible { outline: 3px solid var(--sys-focus); outline-offset: 2px; border-radius: var(--ref-radius-xs); }
[tabindex="-1"]:focus { outline: none; }
.skip-link {
  position: fixed; inset-block-start: 8px; inset-inline-start: 8px; z-index: 200;
  transform: translateY(-200%); background: var(--sys-surface-inverse); color: var(--sys-on-surface-inverse);
  padding: 12px 16px; border-radius: var(--ref-radius-md); font-weight: 600; text-decoration: none; min-height: var(--tap); display: inline-flex; align-items: center;
}
.skip-link:focus { transform: none; }
@media (forced-colors: active) { :focus-visible { outline-color: Highlight; } }

/* ---------- Movimiento: animaciones con propósito, respetan reduced-motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}
:root[data-motion="reduce"] *, :root[data-motion="reduce"] *::before, :root[data-motion="reduce"] *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }

/* ---------- Utilidades de layout ---------- */
.stack { display: flex; flex-direction: column; gap: var(--gap); }
.stack-s { display: flex; flex-direction: column; gap: var(--ref-space-3); }
.stack-l { display: flex; flex-direction: column; gap: var(--section-gap); }
.row { display: flex; align-items: center; gap: var(--ref-space-3); flex-wrap: wrap; }
.row-nowrap { display: flex; align-items: center; gap: var(--ref-space-3); }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: var(--ref-space-4); flex-wrap: wrap; }
.spacer { flex: 1 1 auto; }
.grid { display: grid; gap: var(--gap); }
.grid-auto { display: grid; gap: var(--gap); grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.grid-2 { display: grid; gap: var(--gap); grid-template-columns: 1fr; }
.grid-3 { display: grid; gap: var(--gap); grid-template-columns: 1fr; }
.grid-4 { display: grid; gap: var(--gap); grid-template-columns: repeat(2, 1fr); }
@media (min-width: 600px) { .grid-2 { grid-template-columns: repeat(2, 1fr); } .grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 840px) { .grid-3 { grid-template-columns: repeat(3, 1fr); } .grid-4 { grid-template-columns: repeat(4, 1fr); } }
.cols-main-aside { display: grid; gap: var(--gap); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { .cols-main-aside { grid-template-columns: minmax(0, 1fr) 360px; align-items: start; } }
.mt-0 { margin-block-start: 0; } .mt-3 { margin-block-start: var(--ref-space-3); } .mt-5 { margin-block-start: var(--ref-space-5); } .mt-7 { margin-block-start: var(--ref-space-7); }
.mb-3 { margin-block-end: var(--ref-space-3); } .mb-5 { margin-block-end: var(--ref-space-5); }
.w-full { width: 100%; }
.hide-compact { display: none; } @media (min-width: 600px) { .hide-compact { display: revert; } }
.show-compact { display: revert; } @media (min-width: 600px) { .show-compact { display: none !important; } }
.hide-medium-down { display: none; } @media (min-width: 840px) { .hide-medium-down { display: revert; } }

/* ---------- Iconos ---------- */
.ic { width: 1.25em; height: 1.25em; flex: none; stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.ic--sm { width: 1em; height: 1em; } .ic--lg { width: 1.5em; height: 1.5em; } .ic--xl { width: 2em; height: 2em; }
.ic-fill { fill: currentColor; stroke: none; }

/* ---------- Scrollbars discretas ---------- */
@supports (scrollbar-width: thin) { * { scrollbar-width: thin; scrollbar-color: var(--sys-border-strong) transparent; } }

/* ---------- Impresión (documentos y reportes) ---------- */
@media print {
  .sidebar, .rail, .tabbar, .topbar, .skip-link, .toast-region, .no-print { display: none !important; }
  body { background: #fff; color: #000; }
}

/* Sprite de íconos: oculto sin estilos inline */
.sprite-host { position: absolute; width: 0; height: 0; overflow: hidden; }
.sprite-host svg { width: 0; height: 0; }
.no-scroll { overflow: hidden !important; }
.skeleton.ctl { height: 44px; border-radius: var(--c-radius-control); }
.boot-msg { padding: var(--ref-space-9) var(--ref-space-5); text-align: center; color: var(--sys-text-2); }