/* assets/return-shipping-protection.css */
/*
All CSS variables are defined in the snippets/css-variables.liquid file.
 */
.rl-return-guard-checkout-container {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-direction: column;
}

.rl-return-guard-embedded {
  display: flex;
  align-items: end;
  cursor: pointer;
  flex-direction: column;
}

.rl-order-subtotal-container {
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.rl-order-subtotal {
  min-width: fit-content;
  font-size: var(--rg-main-text-font-size);
}
/* Title text */
.rl-order-subtotal-title {
  font-size: var(--rg-main-text-font-size);
  margin: auto 0;
}
/* Subtitle text */
.rl-order-subtotal-subtitle {
  font-size: var(--rg-description-font-size);
  margin: auto 0;
}

.rl-return-guard-header-container {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 10px;
}
.rl-return-guard-item-subtotal {
  min-width: fit-content;
  font-size: var(--rg-main-text-font-size);
}
/* Title text */
.rl-return-guard-title {
  font-size: var(--rg-main-text-font-size);
  margin: auto 0;
}
/* Subtitle text */
.rl-return-guard-subtitle {
  font-size: var(--rg-description-font-size);
  margin: auto 0;
}
/* Text inside checkout button */
.rl-return-guard-button-text.loading {
  display: none;
}

.checkout-link {
  color: var(--rg-checkout-link-color);
  font-size: var(--rg-checkout-link-font-size);
  text-decoration: none;
  cursor: pointer;
}

.checkout-link:hover {
  text-decoration: underline;
  cursor: pointer;
}

.checkout-button {
  margin-top: var(--rg-checkout-button-margin-top);
  margin-bottom: var(--rg-checkout-button-margin-bottom);
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}

/**
Spinner animation
 */

.rl-spinner-ring {
  /* change color here */
  color: currentColor;
}
.rl-spinner, .rl-spinner div {
  box-sizing: border-box;
}
.rl-spinner {
  display: none;
  position: relative;
  width: 24px;
  height: 24px;
  /* keep centered */
  margin: auto;
}
.rl-spinner.loading {
  display: inline-block;
}
.rl-spinner div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 19.2px;
  height: 19.2px;
  margin: 2.4px;
  border: 2.4px solid currentColor;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: currentColor transparent transparent transparent;
}
.rl-spinner div:nth-child(1) {
  animation-delay: -0.45s;
}
.rl-spinner div:nth-child(2) {
  animation-delay: -0.3s;
}
.rl-spinner div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}