/* Scara — Tracking page styles. Modern, accessible, scoped under .scara-tracking.
   Tokens herdados do tema (global.css): --brand, --text, --muted, --white,
   --gray-light, --gray-soft, --radius, --radius-sm, --shadow, --transition. */

.scara-tracking {
    /* Tokens próprios, sincronizados com a paleta do site */
    --scara-c-bg:        var(--gray-light, #f7f7f7);
    --scara-c-card:      var(--white, #ffffff);
    --scara-c-border:    rgba(10, 35, 66, 0.12);
    --scara-c-text:      var(--text, #111827);
    --scara-c-muted:     var(--muted, #6b7280);
    --scara-c-accent:    var(--brand, #0A2342);
    --scara-c-success:   #16a34a;
    --scara-c-warn:      #d97706;
    --scara-c-danger:    #c53030;
    --scara-c-detail:    var(--gray-soft, #f2f5f9);
    --scara-radius:      14px;
    --scara-radius-sm:   10px;
    --scara-shadow:      0 1px 3px rgba(10, 35, 66, 0.06), 0 1px 2px rgba(10, 35, 66, 0.04);
    --scara-shadow-lg:   0 24px 50px rgba(10, 35, 66, 0.18);

    max-width: 920px;
    margin: 40px auto;
    padding: 0 16px;
    color: var(--scara-c-text);
    font-family: inherit;
    line-height: 1.5;
}

.scara-tracking * { box-sizing: border-box; }
.scara-tracking [hidden] { display: none !important; }

/* Header (alinhado ao hero do site: tipografia densa, brand-coloured) */
.scara-tracking__header { text-align: center; margin-bottom: 28px; }
.scara-tracking__title {
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    margin: 0 0 10px;
    color: var(--scara-c-text);
    letter-spacing: -0.02em;
    font-weight: 800;
    line-height: 1.15;
}
.scara-tracking__subtitle { color: var(--scara-c-muted); margin: 0; font-size: 1.05rem; line-height: 1.6; }

/* Login CTA (substitui o antigo form de CPF). Mesmo visual do .btn--primary
   do tema: pill branco-em-brand, sombra brand-glow, hover sobe. */
.scara-tracking__login {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin-bottom: 28px;
}
.scara-tracking__login-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 32px;
    border-radius: 999px;
    background: var(--brand, #0A2342);
    color: #ffffff;
    border: 0;
    font: inherit;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    box-shadow: 0 12px 28px rgba(10, 35, 66, 0.18);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.scara-tracking__login-btn:hover,
.scara-tracking__login-btn:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(10, 35, 66, 0.24);
    outline: none;
}
.scara-tracking__login-btn svg {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}
.scara-tracking__login-hint {
    margin: 0;
    color: var(--scara-c-muted);
    font-size: 0.92rem;
}

/* Estado vazio: card grande no mesmo padrão visual dos cards do site
   (header-cart__dropdown, header-user__dropdown, brand-tinted radius). */
.scara-tracking__empty {
    background: var(--white, #ffffff);
    border: 1px solid rgba(10, 35, 66, 0.12);
    border-radius: 14px;
    box-shadow: 0 20px 36px rgba(10, 35, 66, 0.12);
    padding: 48px 32px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
.scara-tracking__empty-icon {
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--brand-soft, rgba(10, 35, 66, 0.08));
    color: var(--brand, #0A2342);
    margin-bottom: 4px;
}
.scara-tracking__empty-icon svg {
    width: 32px;
    height: 32px;
}
.scara-tracking__empty-title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text, #111827);
    letter-spacing: -0.01em;
}
.scara-tracking__empty-text {
    margin: 0;
    color: var(--muted, #6b7280);
    font-size: 0.98rem;
    max-width: 420px;
    line-height: 1.55;
}
.scara-tracking__empty-cta {
    margin-top: 8px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border-radius: 999px;
    background: var(--brand, #0A2342);
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
    font-size: 0.92rem;
    box-shadow: 0 12px 28px rgba(10, 35, 66, 0.18);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.scara-tracking__empty-cta:hover,
.scara-tracking__empty-cta:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(10, 35, 66, 0.24);
    color: #ffffff;
}

/* Legado: form de CPF removido do front; mantido apenas como
   placeholder para evitar regras quebradas em cache antigo. */
.scara-tracking__msg { margin: 0; min-height: 22px; color: var(--scara-c-muted); font-size: 14px; }
.scara-tracking__msg.is-error   { color: var(--scara-c-danger); }
.scara-tracking__msg.is-success { color: var(--scara-c-success); }

/* Results */
.scara-tracking__results { margin-bottom: 28px; }
.scara-tracking__results-title { font-size: 20px; margin: 0 0 16px; font-weight: 600; }

.scara-tracking__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 14px;
}

/* Card */
.scara-tracking-card {
    background: var(--scara-c-card);
    border: 1px solid var(--scara-c-border);
    border-radius: var(--scara-radius);
    overflow: hidden;
    box-shadow: var(--scara-shadow);
    transition: box-shadow 0.2s, border-color 0.2s;
}
.scara-tracking-card:hover {
    box-shadow: var(--scara-shadow-lg);
    border-color: #d1d8e6;
}
.scara-tracking-card.is-open {
    border-color: #c7cedd;
}

.scara-tracking-card__summary {
    width: 100%;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: transparent;
    border: 0;
    cursor: pointer;
    text-align: left;
    font: inherit;
    color: inherit;
}
.scara-tracking-card__summary:hover { background: rgba(15, 23, 42, 0.01); }
.scara-tracking-card__summary:focus-visible {
    outline: 3px solid rgba(15, 23, 42, 0.15);
    outline-offset: -3px;
}

.scara-tracking-card__thumb {
    width: 72px;
    height: 72px;
    border-radius: var(--scara-radius-sm);
    overflow: hidden;
    background: var(--scara-c-bg);
    border: 1px solid var(--scara-c-border);
    flex: 0 0 auto;
}
.scara-tracking-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.scara-tracking-card__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}
.scara-tracking-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.scara-tracking-card__id {
    font-weight: 700;
    font-size: 17px;
    color: var(--scara-c-text);
}
.scara-tracking-card__status {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    background: #eef2ff;
    color: #4338ca;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.scara-tracking-card__status.is-completed,
.scara-tracking-card__status.is-shipped,
.scara-tracking-card__status.is-me-delivered { background: #dcfce7; color: #166534; }
.scara-tracking-card__status.is-on-hold,
.scara-tracking-card__status.is-pending { background: #ffedd5; color: #92400e; }
.scara-tracking-card__status.is-cancelled,
.scara-tracking-card__status.is-refunded,
.scara-tracking-card__status.is-failed,
.scara-tracking-card__status.is-me-cancelled,
.scara-tracking-card__status.is-me-undelivered { background: #fee2e2; color: #991b1b; }
.scara-tracking-card__status.is-processing,
.scara-tracking-card__status.is-me-posted { background: #e0f2fe; color: #075985; }
/* generated / released: "Pedido enviado" — same warm tone as the badge
   inside the detail panel so the summary and the timeline stay aligned. */
.scara-tracking-card__status.is-me-generated,
.scara-tracking-card__status.is-me-released { background: #ecfeff; color: #155e75; }

.scara-tracking-card__meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    color: var(--scara-c-muted);
}
.scara-tracking-card__meta > span { position: relative; }
.scara-tracking-card__meta > span:not(:last-child)::after {
    content: "•";
    position: absolute;
    right: -9px;
    top: 0;
    font-size: 10px;
    opacity: 0.5;
}

.scara-tracking-card__bottom {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
}
.scara-tracking-card__total {
    font-weight: 700;
    color: var(--scara-c-text);
}
.scara-tracking-card__payment {
    color: var(--scara-c-muted);
}

.scara-tracking-card__meta [data-card-delivery] {
    color: var(--scara-c-success);
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.scara-tracking-card__meta [data-card-delivery]::before {
    content: "📅";
    font-size: 11px;
}

.scara-tracking-card__chevron {
    width: 10px;
    height: 10px;
    border: 2px solid var(--scara-c-muted);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    transition: transform 0.2s;
    flex: 0 0 auto;
}
.scara-tracking-card.is-open .scara-tracking-card__chevron {
    transform: rotate(-135deg);
    margin-top: 6px;
}

/* Card detail (accordion body) */
.scara-tracking-card__detail {
    background: var(--scara-c-detail);
    border-top: 1px solid var(--scara-c-border);
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.25s ease;
}
.scara-tracking-card__detail[hidden] {
    display: none;
}
.scara-tracking-card.is-open .scara-tracking-card__detail {
    grid-template-rows: 1fr;
}
.scara-tracking-card.is-open .scara-tracking-card__detail[hidden] {
    display: grid;
}
.scara-tracking-card__detail > .scara-tracking-detail {
    overflow: hidden;
    padding: 24px;
}

/* Detail block */
.scara-tracking-detail__pay {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #7c2d12;
    border-radius: var(--scara-radius-sm);
    padding: 14px 18px;
    margin-bottom: 18px;
    font-size: 14px;
}
.scara-tracking-detail__pay p { margin: 0; }
.scara-tracking-detail__pay-btn {
    display: inline-block;
    background: var(--scara-c-warn);
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    padding: 10px 18px;
    border-radius: var(--scara-radius-sm);
    transition: background 0.15s;
    white-space: nowrap;
}
.scara-tracking-detail__pay-btn:hover { background: #b45309; }

.scara-tracking-detail__section {
    background: var(--scara-c-card);
    border: 1px solid var(--scara-c-border);
    border-radius: var(--scara-radius-sm);
    padding: 18px;
}
.scara-tracking-detail__section h3,
.scara-tracking-detail__events > h3 {
    font-size: 13px;
    margin: 0 0 12px;
    color: var(--scara-c-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
}

/* Timeline */
.scara-tracking-timeline {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    display: flex;
    justify-content: space-between;
    position: relative;
    gap: 8px;
}
.scara-tracking-timeline:not(:has(li:nth-child(2))) {
    justify-content: center;
}
.scara-tracking-timeline:not(:has(li:nth-child(2)))::before {
    display: none;
}
.scara-tracking-timeline::before {
    content: "";
    position: absolute;
    top: 14px;
    left: 20px;
    right: 20px;
    height: 2px;
    background: var(--scara-c-border);
    z-index: 0;
}
.scara-tracking-timeline li {
    position: relative;
    flex: 1;
    text-align: center;
    padding: 38px 4px 0;
    color: var(--scara-c-muted);
    font-size: 12px;
    z-index: 1;
}
.scara-tracking-timeline li::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid var(--scara-c-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    box-sizing: border-box;
}
.scara-tracking-timeline li.is-done { color: var(--scara-c-text); font-weight: 600; }
.scara-tracking-timeline li.is-done::before {
    background: var(--scara-c-success);
    border-color: var(--scara-c-success);
    color: #fff;
    content: "✓";
}
.scara-tracking-timeline li.is-cancelled.is-done::before,
.scara-tracking-timeline li.is-failed.is-done::before,
.scara-tracking-timeline li.is-refunded.is-done::before {
    background: var(--scara-c-danger);
    border-color: var(--scara-c-danger);
}
.scara-tracking-timeline li strong { display: block; margin-bottom: 2px; font-weight: 600; }
.scara-tracking-timeline li small { display: block; color: var(--scara-c-muted); }

/* Grid: Itens | Endereço na primeira linha, "Envio" sempre em baixo
   ocupando 100% da largura (mesmo comportamento em todos os viewports). */
.scara-tracking-detail__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 16px;
}
.scara-tracking-detail__grid > .scara-tracking-detail__section:nth-child(3) {
    grid-column: 1 / -1;
}

/* Loader principal (busca inicial da lista de pedidos via AJAX).
   Reaproveita o keyframe `scara-tracking-spin` definido abaixo para a
   animação rotativa do spinner. Hidden por padrão — o JS mostra
   ([data-scara-tracking-loader].hidden = false) antes do fetch e
   oculta ao terminar. */
.scara-tracking__loader {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 56px 16px;
    text-align: center;
}
.scara-tracking__loader[hidden] { display: none !important; }
.scara-tracking__loader-spinner {
    width: 44px;
    height: 44px;
    border: 4px solid var(--scara-c-border);
    border-top-color: var(--scara-c-accent);
    border-radius: 50%;
    animation: scara-tracking-spin 0.9s linear infinite;
}
.scara-tracking__loader-text {
    color: var(--scara-c-muted);
    font-size: 0.95rem;
    letter-spacing: 0.01em;
}

/* Loading state on a freshly-opened card detail */
.scara-tracking-card__detail.is-loading > .scara-tracking-detail {
    position: relative;
    min-height: 180px;
    color: transparent;
    pointer-events: none;
}
.scara-tracking-card__detail.is-loading > .scara-tracking-detail::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    border: 3px solid var(--scara-c-border);
    border-top-color: var(--scara-c-success);
    border-radius: 50%;
    color: var(--scara-c-muted);
    animation: scara-tracking-spin 0.8s linear infinite;
}
.scara-tracking-card__detail.is-loading > .scara-tracking-detail > * {
    visibility: hidden;
}
@keyframes scara-tracking-spin {
    to { transform: rotate(360deg); }
}

/* Items list */
.scara-tracking-detail__items {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}
.scara-tracking-detail__item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid var(--scara-c-border);
}
.scara-tracking-detail__item:first-child { border-top: 0; padding-top: 0; }
.scara-tracking-detail__item-thumb {
    width: 56px;
    height: 56px;
    border-radius: var(--scara-radius-sm);
    overflow: hidden;
    background: var(--scara-c-bg);
    border: 1px solid var(--scara-c-border);
    flex: 0 0 auto;
}
.scara-tracking-detail__item-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.scara-tracking-detail__item-body {
    flex: 1;
    min-width: 0;
}
.scara-tracking-detail__item-name {
    display: block;
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 2px;
}
.scara-tracking-detail__item-sku {
    display: block;
    font-size: 12px;
    color: var(--scara-c-muted);
}
.scara-tracking-detail__item-qty {
    font-size: 13px;
    color: var(--scara-c-muted);
    margin-right: 8px;
}
.scara-tracking-detail__item-subtotal {
    font-weight: 700;
    font-size: 14px;
    white-space: nowrap;
}

/* Address */
.scara-tracking-detail__address {
    font-style: normal;
    line-height: 1.6;
    color: var(--scara-c-text);
    font-size: 14px;
}

/* Shipping DL */
.scara-tracking-detail__ship {
    margin: 0;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 14px;
    font-size: 14px;
    align-items: start;
}
.scara-tracking-detail__ship dt {
    font-weight: 600;
    color: var(--scara-c-muted);
    padding-top: 2px;
    white-space: nowrap;
}
.scara-tracking-detail__ship dd { margin: 0; }
.scara-tracking-detail__ship dd.is-pending {
    color: var(--scara-c-muted);
    font-style: italic;
}
.scara-tracking-detail__ship dd a[aria-disabled="true"] {
    color: var(--scara-c-muted);
    cursor: default;
    pointer-events: none;
    text-decoration: none;
}

/* Track-on-carrier button */
.scara-tracking-track-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: transparent;
    color: var(--scara-c-accent);
    border: 1px solid var(--scara-c-border);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
    box-sizing: border-box;
    line-height: 1.3;
    white-space: nowrap;
    max-width: 100%;
}
.scara-tracking-track-btn:hover {
    background: var(--scara-c-detail);
    border-color: var(--scara-c-accent);
    color: var(--scara-c-accent);
    text-decoration: none;
}
.scara-tracking-track-btn:focus-visible {
    outline: 2px solid var(--scara-c-accent);
    outline-offset: 2px;
}
.scara-tracking-track-btn[aria-disabled="true"] {
    color: var(--scara-c-muted);
    border-color: var(--scara-c-border);
    background: transparent;
    pointer-events: none;
    cursor: default;
}
.scara-tracking-track-btn__icon {
    width: 13px;
    height: 13px;
    flex: none;
}
/* O tema pode tornar o <span> interno display:block, o que quebra o
 * nowrap do <a> pai e faz o texto do botão quebrar em várias linhas.
 * Forçamos display:inline para garantir uma linha só. */
.scara-tracking-track-btn > span {
    display: inline;
    white-space: nowrap;
}

/* Events */
.scara-tracking-detail__events {
    background: var(--scara-c-card);
    border: 1px solid var(--scara-c-border);
    border-radius: var(--scara-radius-sm);
    padding: 18px;
    margin-top: 16px;
}
.scara-tracking-events { list-style: none; padding: 0; margin: 0; }
.scara-tracking-events li {
    padding: 12px 0;
    border-top: 1px dashed var(--scara-c-border);
    font-size: 14px;
}
.scara-tracking-events li:first-child { border-top: 0; padding-top: 0; }
.scara-tracking-events__top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}
.scara-tracking-events time {
    color: var(--scara-c-muted);
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    font-size: 13px;
}
.scara-tracking-events__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--scara-c-success);
}
.scara-tracking-events__label { font-weight: 600; }
.scara-tracking-events__locale {
    display: block;
    font-size: 13px;
    color: var(--scara-c-muted);
    margin-left: 18px;
}
.scara-tracking-events li.is-canceled .scara-tracking-events__label { color: var(--scara-c-danger, #b91c1c); }
.scara-tracking-events li.is-canceled .scara-tracking-events__dot { background: var(--scara-c-danger, #b91c1c); }
.scara-tracking-events li:not(.is-done) { opacity: 0.5; }

/* Status badge in detail header */
.scara-tracking-detail__section h3 { display: flex; align-items: center; gap: 10px; }
.scara-tracking-detail__status {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    background: #e5e7eb;
    color: #374151;
}
.scara-tracking-detail__status[data-status="pending"]      { background: #fef3c7; color: #92400e; }
.scara-tracking-detail__status[data-status="paid"]         { background: #dbeafe; color: #1e40af; }
.scara-tracking-detail__status[data-status="generated"]    { background: #e0e7ff; color: #3730a3; }
.scara-tracking-detail__status[data-status="released"]     { background: #cffafe; color: #155e75; }
.scara-tracking-detail__status[data-status="posted"]       { background: #dcfce7; color: #166534; }
.scara-tracking-detail__status[data-status="delivered"]    { background: #bbf7d0; color: #14532d; }
.scara-tracking-detail__status[data-status="canceled"]     { background: #fee2e2; color: #991b1b; }
.scara-tracking-detail__status[data-status="undelivered"]  { background: #fee2e2; color: #991b1b; }
.scara-tracking-detail__status[data-source="cache"] {
    outline: 1px dashed currentColor;
    outline-offset: -2px;
}

/* Responsive */
@media (max-width: 640px) {
    .scara-tracking { margin: 24px auto; }
    .scara-tracking__title { font-size: 24px; }
    .scara-tracking__form { padding: 16px; }
    .scara-tracking-card__summary { grid-template-columns: 1fr auto; gap: 12px; }
    .scara-tracking-card__thumb { display: none; }
    .scara-tracking-card__top { flex-direction: column; align-items: flex-start; }
    .scara-tracking-card__meta { flex-wrap: wrap; }
    .scara-tracking-card__chevron { width: 8px; height: 8px; }

    .scara-tracking-card__detail > .scara-tracking-detail { padding: 16px; }

    .scara-tracking-timeline {
        flex-wrap: wrap;
        gap: 16px;
    }
    .scara-tracking-timeline::before { display: none; }
    .scara-tracking-timeline li {
        flex: 1 1 calc(50% - 16px);
        padding: 0 0 0 36px;
        text-align: left;
    }
    .scara-tracking-timeline li::before {
        left: 0;
        transform: none;
        top: 0;
    }

    .scara-tracking-detail__grid { grid-template-columns: 1fr; }
}

/* Small screens: 1 column, "Envio" continua ocupando 100% (mantém o
   grid-column da regra base). */
@media (max-width: 1100px) {
    .scara-tracking-detail__grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .scara-tracking-card__detail,
    .scara-tracking-card__chevron,
    .scara-tracking-card,
    .scara-tracking__submit {
        transition: none;
    }
}