:root {
  --cd-primary: hsl(var(--primary));
  --cd-primary-dark: #075d42;
  --cd-ink: hsl(var(--foreground));
  --cd-muted: hsl(var(--muted-foreground));
  --cd-line: hsl(var(--border));
  --cd-soft: hsl(var(--secondary));
  --cd-canvas: hsl(var(--background));
  --cd-white: #fff;
  --cd-danger: #a52c2c;
  --cd-shadow: 0 14px 36px rgba(18, 33, 28, 0.08);
}

.crossdock-page { background: var(--cd-canvas); }
.crossdock-page .sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.cd-skip-link { position: fixed; z-index: 11000; top: 8px; left: 8px; padding: 10px 16px; background: #fff; color: var(--cd-primary); transform: translateY(-150%); transition: transform .2s; }
.cd-skip-link:focus { transform: none; }
[hidden] { display: none !important; }

/* Página pública: usa el mismo hero, intro, tarjetas y botones del inicio. */
.cd-public-hero .hero-bg img { object-position: center 48%; }
.cd-public-hero .hero-overlay { background: linear-gradient(90deg, rgba(3, 39, 29, .84) 0%, rgba(3, 39, 29, .68) 44%, rgba(3, 39, 29, .16) 100%); }
.cd-public-hero .hero-content { max-width: 720px; }
.cd-public-hero .hero-content h1 { max-width: 680px; }
.cd-public-hero .hero-buttons i { font-size: .9em; }
.cd-service-features { background: #fff; }
.cd-four-columns { grid-template-columns: repeat(4, 1fr); }
.cd-service-features .feature-icon i { color: var(--cd-primary); font-size: 27px; }
.cd-demo-banner { min-height: 46px; padding: 10px max(24px, calc((100% - 1200px) / 2)); display: flex; align-items: center; justify-content: center; gap: 14px; color: #16342b; background: #dff5e8; border-bottom: 1px solid #c6e7d5; font-size: 13px; }
.cd-demo-banner strong { color: var(--cd-primary); text-transform: uppercase; letter-spacing: .08em; }
.cd-demo-banner a { color: var(--cd-primary); font-weight: 700; text-decoration: underline; }

/* Navegación propia del servicio, integrada debajo del encabezado global. */
.cd-module-nav { position: sticky; z-index: 35; top: var(--site-shell-header-height, 88px); background: rgba(255, 255, 255, .98); border-bottom: 1px solid var(--cd-line); box-shadow: 0 4px 14px rgba(18, 33, 28, .035); }
.cd-module-nav-inner { min-height: 58px; display: flex; align-items: stretch; gap: 28px; overflow-x: auto; }
.cd-module-nav a { position: relative; display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto; color: var(--cd-muted); font: 600 14px/1 var(--font-body); }
.cd-module-nav a:hover, .cd-module-nav a[aria-current="page"] { color: var(--cd-primary); }
.cd-module-nav a[aria-current="page"]::after { position: absolute; content: ""; right: 0; bottom: 0; left: 0; height: 3px; background: var(--cd-primary); border-radius: 3px 3px 0 0; }

.cd-app { min-height: calc(100vh - 88px); background: var(--cd-canvas); }
.cd-content { padding-top: 38px; padding-bottom: 88px; }
.cd-narrow { max-width: 1060px; }
.cd-app-heading { margin-bottom: 26px; display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; }
.cd-app-heading h2 { margin: 0 0 8px; color: var(--cd-ink); font: 700 clamp(30px, 4vw, 42px)/1.12 var(--font-heading); letter-spacing: -.025em; }
.cd-app-heading p { margin: 0; color: var(--cd-muted); font-size: 16px; }
.cd-eyebrow { display: block; margin: 0 0 8px !important; color: var(--cd-primary) !important; font: 700 12px/1.3 var(--font-body) !important; letter-spacing: .12em; text-transform: uppercase; }
.cd-account-name { display: inline-flex; margin-top: 12px; padding: 6px 11px; border-radius: 999px; background: var(--cd-soft); color: var(--cd-primary); font-size: 13px; font-weight: 600; }
.cd-heading-actions, .cd-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.crossdock-private .btn { min-height: 44px; padding: .7rem 1.2rem; font-size: 14px; white-space: nowrap; }
.crossdock-private .btn-outline { color: var(--cd-primary); border-color: var(--cd-line); background: #fff; }
.crossdock-private .btn-outline:hover { background: var(--cd-soft); border-color: #c8d8d0; }
.cd-button-full { width: calc(100% - 48px); margin: 0 24px; }

.cd-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 20px; }
.cd-kpis article { position: relative; min-height: 106px; padding: 22px 24px; background: #fff; border: 1px solid var(--cd-line); border-radius: var(--radius); }
.cd-kpis span { display: block; color: var(--cd-muted); font-size: 13px; font-weight: 600; }
.cd-kpis strong { display: block; margin-top: 7px; color: var(--cd-primary); font: 700 32px/1 var(--font-heading); }
.cd-kpis i { position: absolute; right: 22px; top: 30px; color: #cfe1da; font-size: 25px; }

.cd-batch-panel { margin-bottom: 20px; padding: 22px 24px; display: flex; align-items: center; justify-content: space-between; gap: 26px; flex-wrap: wrap; background: linear-gradient(135deg, #fff 0%, #eef8f3 100%); border: 1px solid #cfe3d9; border-radius: var(--radius); }
.cd-batch-copy { display: flex; align-items: center; gap: 16px; flex: 1 1 460px; }
.cd-batch-icon { width: 48px; height: 48px; display: grid; place-items: center; flex: 0 0 auto; color: #fff; background: var(--cd-primary); border-radius: 12px; font-size: 21px; }
.cd-batch-copy h2 { margin: 0 0 3px; color: var(--cd-ink); font-size: 20px; }
.cd-batch-copy p { margin: 0; color: var(--cd-muted); font-size: 14px; line-height: 1.5; }
.cd-batch-actions { display: flex; gap: 9px; flex-wrap: wrap; }
.cd-upload-result { width: 100%; padding: 13px 15px; border-radius: 9px; font-size: 13px; }
.cd-upload-result.is-loading { background: #eef5f2; color: var(--cd-muted); }
.cd-upload-result.is-success { background: #e2f5e9; color: #1b633e; }
.cd-upload-result.is-error { background: #fdecec; color: #8e2929; }
.cd-upload-result strong { display: block; margin-bottom: 5px; }
.cd-upload-result ul { margin: 0; padding-left: 20px; }

.cd-panel { overflow: hidden; background: #fff; border: 1px solid var(--cd-line); border-radius: var(--radius); box-shadow: 0 8px 26px rgba(18, 33, 28, .035); }
.cd-panel + .cd-panel { margin-top: 20px; }
.cd-panel-heading { padding: 22px 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--cd-line); }
.cd-panel-heading h2 { margin: 0 0 3px; color: var(--cd-ink); font-size: 20px; }
.cd-panel-heading p { margin: 0; color: var(--cd-muted); font-size: 14px; }
.cd-updated { color: var(--cd-muted); font-size: 12px; white-space: nowrap; }
.cd-stock-tools { padding: 16px 20px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid var(--cd-line); }
.cd-search { min-width: 260px; height: 44px; padding: 0 13px; display: flex; align-items: center; gap: 9px; flex: 1 1 320px; color: var(--cd-muted); background: var(--cd-canvas); border: 1px solid var(--cd-line); border-radius: 10px; }
.cd-search:focus-within { border-color: var(--cd-primary); box-shadow: 0 0 0 3px rgba(10, 118, 82, .12); }
.cd-search input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--cd-ink); font: 500 14px var(--font-body); }
.cd-filter-group { display: flex; padding: 4px; background: var(--cd-soft); border-radius: 10px; }
.cd-filter-group button { padding: 9px 12px; border: 0; border-radius: 7px; background: none; color: var(--cd-muted); cursor: pointer; font: 600 12px var(--font-body); white-space: nowrap; }
.cd-filter-group button.is-active { color: var(--cd-primary); background: #fff; box-shadow: 0 2px 8px rgba(18, 33, 28, .08); }
.cd-check, .cd-page-size { color: var(--cd-muted); font-size: 12px; font-weight: 600; white-space: nowrap; }
.cd-check input { accent-color: var(--cd-primary); }
.cd-page-size select { margin-left: 4px; padding: 7px 26px 7px 8px; border: 1px solid var(--cd-line); border-radius: 8px; color: var(--cd-ink); background: #fff; font: 600 12px var(--font-body); }
.cd-result-line { min-height: 43px; padding: 9px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--cd-muted); border-bottom: 1px solid var(--cd-line); font-size: 12px; }
.cd-clear-button, .cd-selection-clear { border: 0; background: transparent; color: #8f3838; cursor: pointer; font: 600 12px var(--font-body); }
.cd-clear-button i { margin-right: 5px; }
.cd-status { padding: 38px 24px; color: var(--cd-muted); text-align: center; }
.cd-status i { margin-right: 8px; color: var(--cd-primary); }
.cd-status.is-error { color: var(--cd-danger); }
.cd-table-wrap { overflow-x: auto; }
.cd-table { width: 100%; border-collapse: collapse; }
.cd-table th { padding: 12px 18px; color: #64756e; background: #f8fbf9; border-bottom: 1px solid var(--cd-line); text-align: left; font: 700 11px/1.3 var(--font-body); letter-spacing: .06em; text-transform: uppercase; }
.cd-table td { padding: 14px 18px; color: var(--cd-ink); border-bottom: 1px solid #edf2f0; font-size: 14px; vertical-align: middle; }
.cd-table tbody tr:hover { background: #fbfdfc; }
.cd-table tbody tr:last-child td { border-bottom: 0; }
.cd-code { color: var(--cd-primary-dark) !important; font: 700 12px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace !important; }
.cd-material-name { display: block; font-weight: 600; }
.cd-material-class { display: block; margin-top: 3px; color: var(--cd-muted); font-size: 11px; }
.cd-lot-badge { display: inline-flex; padding: 5px 8px; color: #53665e; background: #eef4f1; border-radius: 999px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.cd-stock-amount { font-weight: 700; white-space: nowrap; }
.cd-stock-zero { color: var(--cd-muted); font-size: 12px; white-space: nowrap; }
.cd-quantity { display: inline-grid; grid-template-columns: 38px 70px 38px; align-items: center; overflow: hidden; border: 1px solid var(--cd-line); border-radius: 9px; }
.cd-quantity button { height: 38px; border: 0; background: #f4f8f6; color: var(--cd-primary); cursor: pointer; font-size: 18px; }
.cd-quantity button:disabled { color: #acb8b3; cursor: not-allowed; }
.cd-quantity input { width: 70px; height: 38px; border: 0; border-right: 1px solid var(--cd-line); border-left: 1px solid var(--cd-line); outline: 0; text-align: center; color: var(--cd-ink); font: 700 14px var(--font-body); }
.cd-pagination { padding: 15px; display: flex; justify-content: center; gap: 6px; border-top: 1px solid var(--cd-line); }
.cd-pagination button { width: 38px; height: 38px; border: 1px solid var(--cd-line); border-radius: 8px; color: var(--cd-primary); background: #fff; cursor: pointer; }
.cd-pagination button.is-active { color: #fff; background: var(--cd-primary); border-color: var(--cd-primary); }

.cd-selection-bar { position: fixed; z-index: 80; left: 50%; bottom: 20px; width: min(calc(100% - 40px), 920px); padding: 13px 14px 13px 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; transform: translateX(-50%); color: #fff; background: #123d30; border: 1px solid rgba(255,255,255,.13); border-radius: 14px; box-shadow: 0 18px 46px rgba(7, 40, 31, .3); }
.cd-selection-bar strong, .cd-selection-bar span { display: block; }
.cd-selection-bar span { color: rgba(255,255,255,.68); font-size: 12px; }
.cd-selection-actions { display: flex; align-items: center; gap: 10px; }
.cd-selection-clear { color: rgba(255,255,255,.82); padding: 10px; }

.cd-breadcrumb { display: flex; align-items: center; gap: 9px; margin: 0 0 22px; color: var(--cd-muted); font-size: 13px; }
.cd-breadcrumb a, .cd-text-link { color: var(--cd-primary); font-weight: 700; }
.cd-breadcrumb i { font-size: 8px; }
.cd-request-layout { display: grid; grid-template-columns: 1.15fr .85fr; gap: 20px; align-items: start; }
.cd-review-list { padding: 0 24px; }
.cd-review-item { padding: 18px 0; display: grid; grid-template-columns: 1fr auto; gap: 18px; border-bottom: 1px solid var(--cd-line); }
.cd-review-item:last-child { border-bottom: 0; }
.cd-review-item h3 { margin: 2px 0; font-size: 15px; }
.cd-review-item p { margin: 0; color: var(--cd-muted); font-size: 12px; }
.cd-review-quantity { text-align: right; }
.cd-review-quantity strong { display: block; color: var(--cd-primary); font-size: 18px; }
.cd-review-quantity span { color: var(--cd-muted); font-size: 11px; }
.cd-request-form { padding-bottom: 24px; }
.cd-request-form > label, .cd-field-grid label { display: block; margin: 18px 0 0; padding: 0 24px; color: var(--cd-ink); font-size: 13px; font-weight: 600; }
.cd-request-form input, .cd-request-form select, .cd-request-form textarea { width: 100%; margin-top: 7px; padding: 11px 12px; border: 1px solid var(--cd-line); border-radius: 9px; color: var(--cd-ink); background: #fff; font: 500 14px var(--font-body); }
.cd-request-form textarea { resize: vertical; }
.cd-field-grid { display: grid; grid-template-columns: 1fr 1fr; }
.cd-field-grid label + label { padding-left: 0; }
.cd-form-notice { margin: 21px 24px; padding: 14px; display: flex; gap: 12px; background: var(--cd-soft); border-radius: 10px; }
.cd-form-notice i { margin-top: 3px; color: var(--cd-primary); }
.cd-form-notice p, .cd-form-notice strong, .cd-form-notice span { display: block; margin: 0; }
.cd-form-notice strong { font-size: 13px; }
.cd-form-notice span { color: var(--cd-muted); font-size: 11px; }
.cd-payload-diagnostics { margin: 0 24px 21px; padding: 13px 14px; border: 1px dashed var(--cd-line); border-radius: 10px; background: #f8faf9; }
.cd-payload-diagnostics summary { color: var(--cd-ink); font-size: 13px; font-weight: 700; cursor: pointer; }
.cd-payload-diagnostics p { margin: 9px 0; color: var(--cd-muted); font-size: 11px; }
.cd-payload-diagnostics pre { max-height: 360px; margin: 0; padding: 12px; overflow: auto; border-radius: 8px; background: #15231e; color: #e9f3ee; font: 12px/1.5 monospace; white-space: pre-wrap; word-break: break-word; }
.cd-button-full:disabled { cursor: not-allowed; opacity: .55; }
.cd-dry-run { margin: 0 24px 18px; padding: 11px; color: #715d12; background: #fff9df; border: 1px solid #eadc9f; border-radius: 8px; font-size: 12px; }
.cd-success { padding: 55px 28px; color: var(--cd-ink); background: #fff; border: 1px solid var(--cd-line); border-radius: var(--radius); text-align: center; }
.cd-success > i { width: 60px; height: 60px; margin: 0 auto 18px; display: grid; place-items: center; color: #fff; background: var(--cd-primary); border-radius: 50%; font-size: 24px; }
.cd-success h2 { margin: 4px 0; font-size: 32px; }
.cd-success > p:not(.cd-eyebrow) { color: var(--cd-muted); }
.cd-success .cd-actions { justify-content: center; }

.cd-status-badge { padding: 8px 13px; color: var(--cd-primary); background: #dff2eb; border-radius: 999px; font-size: 12px; font-weight: 700; }
.cd-detail-meta { margin-bottom: 20px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cd-detail-meta article { padding: 18px; background: #fff; border: 1px solid var(--cd-line); border-radius: var(--radius); }
.cd-detail-meta span, .cd-detail-meta strong { display: block; }
.cd-detail-meta span { color: var(--cd-muted); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; }
.cd-detail-meta strong { margin-top: 5px; font-size: 14px; }
.cd-documents { padding: 0 24px 24px; display: grid; gap: 10px; }
.cd-document { padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--cd-line); border-radius: 10px; }
.cd-document div { display: flex; align-items: center; gap: 12px; }
.cd-document i { color: var(--cd-primary); font-size: 19px; }
.cd-document strong, .cd-document span { display: block; }
.cd-document span { color: var(--cd-muted); font-size: 11px; }
.cd-request-document-list { padding: 24px; display: grid; gap: 12px; }
.cd-request-document-card { padding: 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--cd-line); border-radius: var(--radius); }
.cd-request-document-card h2 { margin: 0 0 4px; font-size: 17px; }
.cd-request-document-card p { margin: 0; color: var(--cd-muted); font-size: 12px; }
.cd-toast-region { position: fixed; z-index: 12000; right: 18px; bottom: 18px; display: grid; gap: 8px; }
.cd-toast { max-width: 390px; padding: 14px 17px; color: #fff; background: var(--cd-primary); border-radius: 10px; box-shadow: var(--cd-shadow); font-size: 13px; }
.cd-toast.is-error { background: #8f3030; }

.cd-receipt-actions { margin-bottom: 20px; display: flex; justify-content: space-between; }
.cd-receipt { padding: 42px; background: #fff; border: 1px solid var(--cd-line); box-shadow: var(--cd-shadow); }
.cd-receipt > header { padding-bottom: 27px; display: flex; align-items: center; justify-content: space-between; border-bottom: 3px solid var(--cd-primary); }
.cd-receipt > header img { width: 170px; }
.cd-receipt > header div { text-align: right; }
.cd-receipt > header p { margin: 0; color: var(--cd-primary); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.cd-receipt > header h1 { margin: 3px 0 0; font-size: 28px; }
.cd-receipt-meta { padding: 26px 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.cd-receipt-meta div { padding: 14px; background: var(--cd-soft); border-radius: 8px; }
.cd-receipt-meta span, .cd-receipt-meta strong { display: block; }
.cd-receipt-meta span { color: var(--cd-muted); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.cd-receipt-meta strong { margin-top: 4px; font-size: 14px; }
.cd-receipt-meta .cd-receipt-wide { grid-column: 1 / -1; }
.cd-receipt > footer { padding-top: 24px; color: var(--cd-muted); font-size: 11px; text-align: center; }

@media (max-width: 980px) {
  .cd-four-columns { grid-template-columns: repeat(2, 1fr); }
  .cd-stock-tools { flex-wrap: wrap; }
  .cd-search { min-width: 100%; }
  .cd-request-layout { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .cd-demo-banner { align-items: flex-start; flex-direction: column; gap: 2px; }
  .cd-module-nav-inner { gap: 22px; }
  .cd-module-nav a { min-height: 52px; }
  .cd-content { padding-top: 28px; padding-bottom: 78px; }
  .cd-app-heading { align-items: flex-start; flex-direction: column; }
  .cd-heading-actions { width: 100%; }
  .cd-heading-actions .btn { flex: 1; }
  .cd-kpis { grid-template-columns: 1fr; }
  .cd-batch-panel { padding: 19px; }
  .cd-batch-actions, .cd-batch-actions .btn { width: 100%; }
  .cd-batch-copy { align-items: flex-start; }
  .cd-filter-group { width: 100%; overflow-x: auto; }
  .cd-filter-group button { flex: 1; }
  .cd-table thead { display: none; }
  .cd-table, .cd-table tbody, .cd-table tr, .cd-table td { display: block; width: 100%; }
  .cd-table tr { padding: 16px; border-bottom: 1px solid var(--cd-line); }
  .cd-table td { padding: 3px 0; border: 0; }
  .cd-table td:nth-child(4), .cd-table td:last-child { margin-top: 9px; }
  .cd-selection-bar { bottom: 10px; align-items: stretch; flex-direction: column; }
  .cd-selection-bar span { display: none; }
  .cd-selection-actions, .cd-selection-actions .btn { width: 100%; }
  .cd-selection-actions .btn { flex: 1; }
  .cd-field-grid { grid-template-columns: 1fr; }
  .cd-field-grid label + label { padding-left: 24px; }
  .cd-detail-meta { grid-template-columns: 1fr; }
  .cd-document, .cd-request-document-card { align-items: flex-start; flex-direction: column; }
  .cd-four-columns { grid-template-columns: 1fr; }
  .cd-receipt { padding: 22px; }
  .cd-receipt > header { align-items: flex-start; flex-direction: column; gap: 18px; }
  .cd-receipt > header div { text-align: left; }
  .cd-receipt-meta { grid-template-columns: 1fr; }
  .cd-receipt-actions { gap: 10px; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

@media print {
  .site-header, .footer, .cd-module-nav, .cd-receipt-actions, .cd-toast-region { display: none !important; }
  body { padding-top: 0 !important; background: #fff !important; }
  .cd-content { padding: 0; }
  .cd-receipt { padding: 0; border: 0; box-shadow: none; }
  .container { width: 100%; max-width: none; }
  .cd-receipt .cd-table { display: table; }
  .cd-receipt .cd-table thead { display: table-header-group; }
  .cd-receipt .cd-table tbody { display: table-row-group; }
  .cd-receipt .cd-table tr { display: table-row; padding: 0; border: 0; }
  .cd-receipt .cd-table td { display: table-cell; width: auto; padding: 10px; border-bottom: 1px solid #ddd; }
}