tracking-form { display: block; }
.mandde-tracking-form { text-align: left; color: var(--azul-mandde); }
.tracking-input-row { display: flex; gap: .75rem; }
.tracking-input-row input { min-width: 0; min-height: 52px; border-color: #8798ae; color: #022f73; caret-color: #022f73; }
.tracking-input-row input::placeholder { color: #596b82; }
.tracking-submit { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 52px; padding: .75rem 1.4rem; background: var(--naranja-mandde); color: #1c2534; white-space: nowrap; border: 0; }
.tracking-submit:hover { background: #e96400; color: #101722; }
.tracking-submit:disabled { background: #c6ced8; }
.tracking-form-help { color: #4e5d70; font-size: .875rem; }
.tracking-form-error { color: #a92220; font-size: .875rem; min-height: 1.35rem; margin-top: .35rem; }
.mandde-tracking-form input[aria-invalid="true"] { border-color: #a92220; }
tracking-form :focus-visible, .tracking-page :focus-visible { outline: 3px solid #022f73; outline-offset: 3px; box-shadow: none; }
.tracking-page { max-width: 1080px; padding-bottom: 1rem; color: #24354c; }
.tracking-page ::selection { background: #ffdbbf; color: #022f73; }
.tracking-breadcrumb { display: flex; gap: .8rem; flex-wrap: wrap; font-size: .875rem; margin-bottom: 2rem; }
.tracking-page a { color: #022f73; text-underline-offset: .2em; }
.tracking-heading h1 { color: #022f73; font-weight: 750; font-size: clamp(2rem, 5vw, 2.75rem); margin-bottom: .65rem; }
.tracking-heading p { color: #536277; max-width: 65ch; margin-bottom: 1.6rem; }
.tracking-search-panel { background: #f0f4fa; padding: 1.5rem; border-radius: 12px; }
.tracking-announcement { min-height: 2.7rem; padding: .8rem 0; font-size: .9rem; color: #4e5d70; }
.tracking-shipment { border: 1px solid #d5dde8; border-radius: 14px; overflow: hidden; background: #fff; }
.tracking-summary { padding: 1.75rem; background: #022f73; color: white; display: flex; gap: 1rem; justify-content: space-between; align-items: flex-start; }
.tracking-summary h2 { font-size: clamp(1.4rem, 4vw, 1.9rem); font-weight: 700; margin: .25rem 0 .65rem; overflow-wrap: anywhere; }
.tracking-summary p { color: #e2eafb; font-size: .875rem; }
.tracking-guide-label { overflow-wrap: anywhere; margin-bottom: .5rem; }
.tracking-status-badge { background: #e9f3ff; color: #022f73; padding: .4rem .8rem; font-size: .8rem; font-weight: 700; border-radius: 999px; white-space: nowrap; }
.tracking-status-badge.is-issue { color: #703400; background: #ffe2c8; }
.tracking-route { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; padding: 1.5rem 1.75rem; margin: 0; border-bottom: 1px solid #e0e5ec; }
.tracking-route dt { color: #536277; font-size: .875rem; font-weight: 400; }
.tracking-route dd { font-size: 1.15rem; font-weight: 650; color: #022f73; margin: .35rem 0 0; overflow-wrap: anywhere; }
.tracking-progress-section, .tracking-history, .tracking-evidence { padding: 1.75rem; }
.tracking-shipment h3 { color: #022f73; font-size: 1.2rem; font-weight: 700; margin-bottom: 1.25rem; }
.tracking-progress { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 1rem; margin-bottom: 0; }
.tracking-progress li { display: flex; flex-direction: column; gap: .6rem; color: #536277; font-size: .8rem; position: relative; }
.tracking-step-icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid #8798ae; border-radius: 50%; background: #fff; position: relative; z-index: 1; }
.tracking-progress li:not(:last-child)::after { content: ''; position: absolute; top: 18px; left: 36px; width: calc(100% + 1rem - 36px); height: 1px; background: #cad3e0; }
.tracking-progress .is-complete .tracking-step-icon { color: #fff; background: #022f73; border-color: #022f73; }
.tracking-progress .is-complete { color: #022f73; font-weight: 600; }
.tracking-progress [aria-current] .tracking-step-icon { background: #ff6f00; border-color: #ff6f00; color: #1c2534; }
.tracking-history { border-top: 1px solid #e0e5ec; }
.tracking-history ol { list-style: none; margin: 0; padding: 0; }
.tracking-history li { display: grid; grid-template-columns: 175px minmax(0,1fr); gap: 1rem; padding: 1rem 0; border-bottom: 1px solid #edf0f5; }
.tracking-history li:last-child { border: 0; padding-bottom: 0; }
.tracking-history time { color: #536277; font-size: .875rem; font-variant-numeric: tabular-nums; }
.tracking-history strong { color: #24354c; font-size: .95rem; }
.tracking-history p { margin: .5rem 0 0; overflow-wrap: anywhere; }
.tracking-evidence { background: #f5f7fa; }
.tracking-evidence-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.tracking-evidence-button { border: 1px solid #8798ae; color: #022f73; background: white; min-height: 44px; padding: .6rem 1rem; }
.tracking-evidence-button:hover, .tracking-evidence-button[aria-pressed="true"] { color: white; background: #022f73; border-color: #022f73; }
.tracking-preview { margin-top: 1.4rem; }
.tracking-preview-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem; }
.tracking-preview img { display: block; max-width: 100%; max-height: 650px; object-fit: contain; margin: 0 auto; }
.tracking-image-error { color: #a92220; margin-top: .75rem; }
.tracking-ally-note:empty { display: none; }
.tracking-ally-note { padding: 1rem 1.75rem; margin: 0; }
.tracking-issue { padding: 1.25rem 1.75rem; background: #fff1e5; color: #703400; }
.tracking-issue p { margin: .5rem 0; }
.tracking-empty { padding: 2rem; text-align: center; background: #f0f4fa; border-radius: 12px; }
.tracking-empty svg { margin-bottom: 1rem; color: #022f73; }
.tracking-empty h2 { color: #022f73; font-size: 1.5rem; font-weight: 700; }
.tracking-empty p { max-width: 60ch; margin: .75rem auto; overflow-wrap: anywhere; }
body-rastreo { display: block; }
@media (max-width: 767px) {
  .tracking-summary { flex-direction: column; padding: 1.25rem; }
  .tracking-route { gap: 1rem; padding: 1.25rem; }
  .tracking-progress-section, .tracking-history, .tracking-evidence { padding: 1.25rem; }
  .tracking-progress { grid-template-columns: 1fr; gap: 0; }
  .tracking-progress li { flex-direction: row; align-items: center; gap: .9rem; padding-bottom: 1rem; font-size: .9rem; min-height: 52px; }
  .tracking-progress li:last-child { padding-bottom: 0; }
  .tracking-progress li:not(:last-child)::after { top: 36px; left: 18px; height: calc(100% - 36px); width: 1px; }
  .tracking-step-icon { flex-shrink: 0; }
  .tracking-history li { grid-template-columns: 1fr; gap: .35rem; }
}
@media (max-width: 480px) {
  .tracking-input-row { flex-direction: column; }
  .tracking-search-panel { padding: 1.1rem; }
  .tracking-breadcrumb { margin-bottom: 1.5rem; }
  .tracking-evidence-actions > button { flex: 1 1 calc(50% - .75rem); }
  .tracking-route dd { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-bg-animation img { animation: none; }
  .tracking-page *, tracking-form * { scroll-behavior: auto; transition: none; }
}
.tracking-page { scroll-margin-top: 7rem; }
.tracking-page .tracking-preview { scroll-margin-bottom: 6rem; }
.tracking-loading { margin: 0 0 1.5rem; }
.tracking-loading p { margin: 0 0 .65rem; color: #022f73; font-size: .9rem; }
.tracking-loading-track { height: 8px; background: #dce5f1; border-radius: 999px; overflow: hidden; }
.tracking-loading-fill { height: 100%; width: 0; background: #ff6f00; border-radius: inherit; }
.tracking-announcement:empty { min-height: 0; padding: 0; margin-bottom: 1.25rem; }
/* Persistent actions reserve their real height, including mobile safe areas. */
:root { --quick-actions-height: 88px; }
body { padding-bottom: var(--quick-actions-height); }
barra-accion { display: block; }
.tracking-result-actions { margin: 1rem 0; text-align: right; }
.tracking-image-link { display: block; text-align: center; margin-top: 1rem; }
.tracking-loading { padding: 2rem 0 3rem; text-align: center; }
.tracking-loading p { text-align: center; font-size: 1.05rem; margin-bottom: 1.2rem; }
.tracking-loading-track { height: 14px; width: 100%; }
.tracking-parcel-animation { width: min(320px, 100%); height: 120px; margin: 0 auto .75rem; display: block; }
.tracking-moving-parcel { animation: tracking-parcel-delivery 2.8s cubic-bezier(.16,1,.3,1) infinite; }
.tracking-delivery-van { animation: tracking-van-ride 2.8s ease-in-out infinite; }
.tracking-motion-lines { animation: tracking-travel-lines 1.4s ease-in-out infinite; }
@keyframes tracking-parcel-delivery {
  0%, 12% { transform: translateX(0); opacity: 1; }
  60% { transform: translateX(104px); opacity: 1; }
  72%, 100% { transform: translateX(104px); opacity: 0; }
}
@keyframes tracking-van-ride { 0%, 60%, 100% { transform: translateY(0); } 75%, 90% { transform: translateY(-2px); } 82% { transform: translateY(1px); } }
@keyframes tracking-travel-lines { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
@media (max-width: 767px) {
  .tracking-input-row { flex-direction: column; gap: 1.25rem; }
  .mandde-service-modal { padding: 0 !important; bottom: var(--quick-actions-height); height: calc(100dvh - var(--quick-actions-height)); }
  .mandde-service-modal .modal-dialog { margin: 0; max-width: none; width: 100%; height: 100%; min-height: 0; }
  .mandde-service-modal .modal-content { height: 100%; border: 0; border-radius: 0; }
  .mandde-service-modal .modal-header { position: absolute; top: 0; right: 0; z-index: 2; padding: .5rem; border: 0; }
  .mandde-service-modal .modal-title { display: none; }
  .mandde-service-modal .btn-close { margin: 0; padding: .75rem; background-color: white; border: 1px solid #8798ae; border-radius: 50%; }
  .mandde-service-modal .modal-body { flex: 1; min-height: 0; }
  .mandde-service-modal .ratio { height: 100%; min-height: 0 !important; }
  .mandde-service-modal .ratio::before { padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .tracking-parcel-animation * { animation: none; }
  .tracking-motion-lines { opacity: .5; }
}
/* Compact field sized for twenty characters plus its clear control. */
.mandde-tracking-form { text-align: center; }
.tracking-input-row { justify-content: center; align-items: center; flex-direction: row; }
.tracking-input-wrap { position: relative; flex: 0 1 auto; width: calc(22ch + 3.75rem); max-width: 100%; font-size: 1.125rem; }
.tracking-input-wrap input { width: 100%; font-size: inherit; padding-right: 3rem; }
.tracking-clear { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: #022f73; border-radius: 6px; }
.tracking-clear:hover { background: #e9eff8; }
.tracking-result-actions { margin: 1.5rem 0 0; text-align: center; }
@media (max-width: 575px) {
  .tracking-input-row { flex-direction: column; width: min(calc(22ch + 3.75rem), 100%); margin-inline: auto; font-size: 1.125rem; }
  .tracking-input-wrap { width: 100%; }
  .tracking-input-row > .tracking-submit { width: 100%; }
}

/* Banner typography only: two-pixel increase, with brand-blue supporting copy. */
#contenido-rastreo .card-title { font-size: calc(1.275rem + .3vw + 2px) !important; }
#contenido-rastreo .tracking-banner-description { color: var(--azul-mandde); font-size: 1.125rem; }
#contenido-rastreo .mandde-tracking-form { font-size: 1.125rem; }
#contenido-rastreo .tracking-input-wrap { font-size: 1.25rem; }
#contenido-rastreo .tracking-submit { font-size: 1.125rem; }
#contenido-rastreo .tracking-form-help { color: var(--azul-mandde); font-size: 1rem; }
#contenido-rastreo .tracking-form-error { font-size: 1rem; }
@media (min-width: 1200px) {
  #contenido-rastreo .card-title { font-size: 1.625rem !important; }
}