﻿@import url("../shared/ordertrackinglitecommon.css");
.fade {
  opacity: 1;
}

.tab-content,
.order-tracking {
  max-width: 70vw;
  margin-left: 50px;
}

.order-line {
  margin-left: 13px;
}

.separating-line {
  height: 1px;
  margin-left: -20px;
  background-color: var(--components-divider-default-border-color, #EEE);
}

.parcel-details > * {
  vertical-align: middle;
}

.parcel-content {
  padding-top: 27px;
}

img.parcel-delivery-type-icon {
  padding-bottom: 0;
}

.parcel-item-image {
  margin-right: 16px !important;
}

.parcel-header-order-date {
  color: var(--text-primary, #000);
  font-family: var(--global-body-3-font-family);
  font-weight: var(--global-body-3-font-weight);
  font-style: var(--global-body-3-font-style);
  text-transform: var(--global-body-3-text-transform);
  text-decoration: var(--global-body-3-text-decoration);
  font-size: var(--global-body-3-font-size);
  letter-spacing: var(--global-body-3-letter-spacing);
  line-height: var(--global-body-3-line-height);
}

.order-tracking-lite-order-number-container {
  display: flex;
  flex-direction: row;
  margin-top: 10px;
  margin-bottom: 10px;
}

.order-tracking-text {
  color: var(--text-primary, #000);
  font-family: var(--global-h2-font-family);
  font-weight: var(--global-h2-font-weight);
  font-style: var(--global-h2-font-style);
  text-transform: var(--global-h2-text-transform);
  text-decoration: var(--global-h2-text-decoration);
  font-size: var(--global-h2-font-size);
  letter-spacing: var(--global-h2-letter-spacing);
  line-height: var(--global-h2-line-height);
}

.order-number {
  color: var(--text-primary, #000);
  font-family: var(--global-body-1-font-family);
  font-weight: var(--global-body-1-font-weight);
  font-style: var(--global-body-1-font-style);
  text-transform: var(--global-body-1-text-transform);
  text-decoration: var(--global-body-1-text-decoration);
  font-size: var(--global-body-1-font-size);
  letter-spacing: var(--global-body-1-letter-spacing);
  line-height: var(--global-body-1-line-height);
}

.container {
  padding-left: 30px !important;
  width: 95% !important;
}
.container .body-content footer.order-tracking p {
  font-family: var(--global-body-2-font-family);
  font-weight: var(--global-body-2-font-weight);
  font-style: var(--global-body-2-font-style);
  text-transform: var(--global-body-2-text-transform);
  text-decoration: var(--global-body-2-text-decoration);
  font-size: var(--global-body-2-font-size);
  letter-spacing: var(--global-body-2-letter-spacing);
  line-height: var(--global-body-2-line-height);
  color: var(--text-primary, #000);
  margin-bottom: 20px;
}
.container .body-content footer.order-tracking p a {
  font-family: var(--global-body-1-link-font-family);
  font-weight: var(--global-body-1-link-font-weight);
  font-style: var(--global-body-1-link-font-style);
  text-transform: var(--global-body-1-link-text-transform);
  text-decoration: var(--global-body-1-link-text-decoration);
  font-size: var(--global-body-1-link-font-size);
  letter-spacing: var(--global-body-1-link-letter-spacing);
  line-height: var(--global-body-1-link-line-height);
  color: var(--primary-main, #8E44AD);
}
.container .body-content footer.order-tracking p a:focus {
  border-radius: var(--action-checkbox-border-radius, 4px);
  outline: 2px solid var(--interactive-focus-default-outline-color, #1D89DD);
  outline-offset: 1px;
  color: var(--components-link-primary-enabled-text-color, #007A7A);
}
.container .body-content footer.order-tracking p a:hover {
  color: var(--components-link-primary-hovered-text-color, #7F3D9B);
}
.container #need-assistance #footer-text {
  font-family: var(--global-body-1-font-family);
  font-weight: var(--global-body-1-font-weight);
  font-style: var(--global-body-1-font-style);
  text-transform: var(--global-body-1-text-transform);
  text-decoration: var(--global-body-1-text-decoration);
  font-size: var(--global-body-1-font-size);
  letter-spacing: var(--global-body-1-letter-spacing);
  line-height: var(--global-body-1-line-height);
  color: var(--text-primary, #000);
  margin-top: 10px;
}

.order-tracking-nav {
  max-width: 70vw;
  margin-left: 50px;
}
.order-tracking-nav .nav.nav-tabs {
  border-bottom: 1px solid var(--secondary-main, #000);
  color: var(--text-primary, #000);
  background-color: var(--components-tab-default-default-active-background-color, #FFF);
  font-family: var(--global-body-1-font-family);
  font-weight: var(--global-body-1-font-weight);
  font-style: var(--global-body-1-font-style);
  text-transform: var(--global-body-1-text-transform);
  text-decoration: var(--global-body-1-text-decoration);
  font-size: var(--global-body-1-font-size);
  letter-spacing: var(--global-body-1-letter-spacing);
  line-height: var(--global-body-1-line-height);
}
.order-tracking-nav .nav-tabs p {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  padding: 0;
  height: 32px;
  width: 120px;
  min-width: 86px;
  cursor: pointer;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
  text-transform: uppercase !important;
}
.order-tracking-nav .nav-tabs p.border-active.active {
  border-top: 5px solid var(--components-tab-default-default-active-border-top-color, #8E44AD);
  border-left: 1px solid var(--components-tab-default-default-active-border-color, #000);
  border-right: 1px solid var(--components-tab-default-default-active-border-color, #000);
  font-family: var(--global-body-3-font-family);
  font-weight: var(--global-body-3-font-weight);
  font-style: var(--global-body-3-font-style);
  text-transform: var(--global-body-3-text-transform);
  text-decoration: var(--global-body-3-text-decoration);
  font-size: var(--global-body-3-font-size);
  letter-spacing: var(--global-body-3-letter-spacing);
  line-height: var(--global-body-3-line-height);
  color: var(--components-tab-default-default-active-border-color, #000);
}
.order-tracking-nav .nav-tabs p.border-inactive {
  border: 1px solid var(--components-tab-default-default-enabled-border-color, #949494);
  border-top-width: 1px;
  border-bottom-style: none;
  margin-bottom: 0 !important;
  padding-top: 4px;
}
.order-tracking-nav .nav-tabs p:nth-child(1) {
  border-top-left-radius: 4px;
}
.order-tracking-nav .nav-tabs p:nth-child(3) {
  border-top-right-radius: 4px;
}

.order-tracking-lite-order-number-container .order-number {
  margin-top: 3px;
  margin-bottom: 1px;
}

#expected-details .parcel-accordion,
#delivered-details .parcel-accordion,
#returned-details .parcel-accordion {
  height: 50px;
  border: 1px solid var(--components-divider-default-border-color, #EEE);
  background-color: var(--background-main, #F7F7F7);
  display: flex;
  flex: 1 0;
  justify-content: space-between;
  padding: 0 12px 0 16px;
  align-items: center;
}
#expected-details .parcel-accordion:not(.collapsed),
#delivered-details .parcel-accordion:not(.collapsed),
#returned-details .parcel-accordion:not(.collapsed) {
  border-bottom: none;
}
#expected-details .no-recent-items-to-display,
#delivered-details .no-recent-items-to-display,
#returned-details .no-recent-items-to-display {
  margin-top: 0;
}

body .tab-content .parcel-pill-options-column {
  flex-direction: column;
}
body .tab-content .parcel,
body .tab-content .returned-items-content {
  border-bottom: 1px solid var(--components-divider-default-border-color, #EEE);
  border-left: 1px solid var(--components-divider-default-border-color, #EEE);
  border-right: 1px solid var(--components-divider-default-border-color, #EEE);
}
body .tab-content .parcel .parcel-details,
body .tab-content .returned-items-content .parcel-details {
  padding: 0 16px 0 4px;
}
body .tab-content .parcel .parcel-details .parcel-number,
body .tab-content .returned-items-content .parcel-details .parcel-number {
  margin-top: 18px;
  margin-left: 0;
}
body .tab-content .parcel .parcel-content,
body .tab-content .returned-items-content .parcel-content {
  width: 48.4%;
}
body .tab-content .parcel .parcel-pill-options-content,
body .tab-content .returned-items-content .parcel-pill-options-content {
  width: auto;
}
body .tab-content .returned-items-content .returned-items-address {
  margin: 0 0 16px 0;
  max-width: 100%;
  text-align: left;
  color: var(--text-primary, #000);
  font-family: var(--global-body-1-font-family);
  font-weight: var(--global-body-1-font-weight);
  font-style: var(--global-body-1-font-style);
  text-transform: var(--global-body-1-text-transform);
  text-decoration: var(--global-body-1-text-decoration);
  font-size: var(--global-body-1-font-size);
  letter-spacing: var(--global-body-1-letter-spacing);
  line-height: var(--global-body-1-line-height);
}
body .tab-content .returned-items-content .returned-items-list {
  margin-top: 15px;
  width: 100%;
}
body .tab-content .returned-items-content .returned-items-narrow-list {
  width: 100%;
}

#newOrderTracking.tab-content {
  padding: 8px 0;
}
#newOrderTracking.tab-content .returned-items-list .returned-item-description {
  margin-left: 8px;
}
#newOrderTracking.tab-content .returned-items-list .returned-item-description p.returned-item-name {
  letter-spacing: normal;
}

.tracking-row {
  display: flex;
  justify-content: space-between;
}

.tracking-column {
  width: 416px;
}

.tracking-column-fit {
  flex-basis: auto;
  background: none !important;
  border: none !important;
  border-radius: unset !important;
  display: block !important;
  margin-right: 29px;
}

.parcel-pill-options {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 12px;
  padding: 0 16px;
}
.parcel-pill-options .parcel-pill-option {
  width: 162px;
  height: 32px;
  padding: 0 16px 0 16px;
  justify-content: center;
  align-items: center;
  display: flex;
  border-radius: var(--components-button-default-border-radius, 22px);
  border: 1px solid var(--components-button-outlined-secondary-enabled-border-color, #000);
  background: var(--components-button-outlined-secondary-enabled-background-color, #FFF);
  color: var(--components-button-outlined-secondary-enabled-contrast-text-color, #000);
  font-family: var(--global-body-1-font-family);
  font-weight: var(--global-body-1-font-weight);
  font-style: var(--global-body-1-font-style);
  text-transform: var(--global-body-1-text-transform);
  text-decoration: var(--global-body-1-text-decoration);
  font-size: var(--global-body-1-font-size);
  letter-spacing: var(--global-body-1-letter-spacing);
  line-height: var(--global-body-1-line-height);
}
.parcel-pill-options .gnr-pill-option {
  text-decoration: underline !important;
}
.parcel-pill-options .gnr-pill-disable {
  text-decoration: underline !important;
}

.parcel-content-items {
  flex-grow: 3;
}
