#titleModelCancelSubscription{
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem;
}

#cancelSubscription .modal-body{
    gap: 1.5rem;
    background-color: var(--layer-02);
}

#cancelSubscription .modal-body .warning{
    color: var(--tint-orange);
    background-color: var(--tint-orange-inverse);
    border: 1px solid var(--tint-orange);
}

#cancelSubscription .modal-body .warning p {
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1rem;
}

#cancelSubscription .modal-body p.title{
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.125rem;
}

#cancelSubscription .modal-body p.question{
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.25rem;
}


#cancelSubscription .modal-body div.input{
    padding: 0.375rem 0rem;
}

#cancelSubscription .modal-body div.input label{
    flex: 1 0 0;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.125rem;
}

#cancelSubscription .modal-body div.feedback{
    padding: 0rem 1.875rem;
}

#cancelSubscription .modal-body textarea{
    padding: 0.375rem 0.5rem;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.125rem;
}

#cancelSubscription .modal-body textarea::placeholder{
    font-style: italic;
}



.spinner {
    height: 1rem;
    width: 1rem;
    border: 3px solid transparent;
    border-top: 3px solid var(--bs-btn-hover-color);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
  
@keyframes spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
}