@import "/variables.css";

.torque-display {
    font-family: var(--font-family-01);
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-lg);
    line-height: var(--line-height-sm);
}

.torque-heading-xlarge,
.torque-heading-large {
    font-family: var(--font-family-01);
    font-weight: var(--font-weight-md);
    line-height: var(--line-height-sm);
}

.torque-heading-xlarge {
    font-size: var(--font-size-2xl);
}

.torque-heading-large {
    font-size: var(--font-size-xl);
}

.torque-heading-medium,
.torque-heading-small {
    font-family: var(--font-family-01);
    font-weight: var(--font-weight-md);
    line-height: var(--line-height-md);
}

.torque-heading-medium {
    font-size: var(--font-size-lg);
}

.torque-heading-small {
    font-size: var(--font-size-md);
}

.torque-paragraph {
    font-family: var(--font-family-01);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-sm);
    line-height: var(--line-height-md);
}

.torque-subtitle {
    font-family: var(--font-family-01);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-sm);
    line-height: var(--line-height-md);
}

.torque-paragraph__highlight {
    font-family: var(--font-family-01);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-lg);
    line-height: var(--line-height-md);
}

.torque-label-enabled-xs,
.torque-label-enabled-sm,
.torque-label-enabled-md,
.torque-label-enabled-lg,
.torque-legal-terms {
    font-family: var(--font-family-01);
}

.torque-label-enabled-sm,
.torque-label-enabled-md,
.torque-label-enabled-lg {
    font-weight: var(--font-weight-md);
}

.torque-label-enabled-sm{
    line-height: var(--line-height-sm);
}

.torque-label-enabled-md {
    line-height: var(--line-height-md);
}

.torque-label-enabled-lg,
.torque-legal-terms {
    line-height: var(--line-height-xs);
}

.torque-label-enabled-md, .torque-label-enabled-lg {
    line-height: var(--line-height-md);
}

.torque-label-enabled-xs {
    font-size: var(--font-size-3xs);
}

.torque-label-enabled-sm {
    font-size: var(--font-size-2xs);
}

.torque-label-enabled-md {
    font-size: var(--font-size-xs);
}

.torque-label-enabled-lg {
    font-size: var(--font-size-sm);
}

.torque-label-active-sm {
    font-size: var(--font-size-2xs);
    font-weight: var(--font-weight-sm);
    line-height: var(--line-height-md);
}

.torque-label-active-xs {
    font-size: var(--font-size-3xs);
    font-weight: var(--font-weight-xs);
    line-height: var(--line-height-md);
}

.torque-lp-badge {
    display: flex;
    align-items: center;
    justify-content: center;
}

.torque-lp-badge-sm {
    width: var(--spacing-layout-sm);
    height: var(--spacing-layout-sm);
    border-radius: var(--spacing-token-xs);
}

.torque-lp-badge-md {
    width: var(--spacing-layout-md);
    height: var(--spacing-layout-md);
    border-radius: var(--spacing-token-sm);
}

.torque-lp-badge-4xl {
    width: var(--spacing-token-4xl);
    height: var(--spacing-token-4xl);
    border-radius: var(--spacing-token-4xl);
}

.torque-lp-badge-primary-lightest {
    background-color: var(--brandcolor-primary-lightest);
}

.torque-lp-badge-neutralcolor-lightest {
    background-color: var(--neutralcolor-lightest);
}

.torque-lp-badge-sm__icon {
    width: var(--spacing-token-sm);
    height: var(--spacing-token-sm);
}

.torque-lp-badge-md__icon {
    width: var(--spacing-token-md);
    height: var(--spacing-token-md);
}

.torque-lp-badge-lg__icon {
    width: var(--spacing-token-lg);
    height: var(--spacing-token-lg);
    padding: 2px;
}

.torque-lp-badge-xl__icon {
    width: var(--spacing-token-xl);
    height: var(--spacing-token-xl);
}

.torque-lp-badge-4xl__icon {
    width: var(--spacing-token-4xl);
    height: var(--spacing-token-4xl);
}

.torque-legend {
    font-family: var(--font-family-01);
    font-size: var(--font-size-2xs);
    font-weight: var(--font-weight-md);
    line-height: var(--line-height-md);
}

.torque-bl-active {
    border-left: 1px solid var(--brandcolor-primary-medium);
}

.torque-btn-label{
    border: none;
    background: none;
}

.torque-btn-full-width {
    display: block;
    width: 100%;
    padding: var(--spacing-token-2xs) 0;
    text-align: center;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    text-decoration: none;
    transition: var(--dur) ease-in-out all;
}

.torque-btn-full-width:active,
.torque-btn-full-width:hover,
.torque-btn-full-width:focus,
.torque-link:active,
.torque-link:hover,
.torque-link:focus {
    filter: brightness(0.8);
}

.torque-input-text {
    position: relative;
    display: block;
    width: 100%;
    padding: 20px 0 8px 0;
    border: none;
    border-bottom: 1px solid var(--neutralcolor-dark);
    font-size: var(--font-size-2xs);
    outline: none;
}


.torque-floating-input-container {
    position: relative;
}

.torque-floating-label {
    position: absolute;
    left: 0;
    top: var(--spacing-token-sm);
    width: 100%;
    transition: var(--dur) ease-in-out all;
    -webkit-transition: all var(--dur) ease-in-out;
    -moz-transition: all var(--dur) ease-in-out;
}

.torque-input-text:focus + .torque-floating-label,
.torque-input-text:focus + .error + .torque-floating-label,
.torque-input-text:not(:placeholder-shown) + .torque-floating-label,
.torque-input-text:not(:placeholder-shown) + .error + .torque-floating-label {
    font-size: var(--font-size-3xs);
    color: var(--brandcolor-primary-medium);
    top: var(--spacing-token-4xs);
}

.torque-input-text:required:invalid:not(:placeholder-shown),
.torque-input-text.error {
    border-color: var(--feedbackcolor-error-light);
}

.torque-input-text:required:invalid:not(:placeholder-shown)
+ .torque-floating-label,
.error + .torque-floating-label {
    color: var(--feedbackcolor-error-medium);
}

.torque-input-text:not(:focus):not(.valid) + .error + .torque-floating-label::after {
    content: '';
    width: 18px;
    height: 18px;
    background: url("../../images/interface/fechar-erro.svg") no-repeat center;
    position: absolute;
    right: 0;
}

.torque-input-text:not(:focus):not(.valid):not(:placeholder-shown) + .error + .torque-floating-label::after{
    top: 18px;
}

.torque-input-text:disabled {
    cursor: not-allowed;
    background-color: transparent;
    border-color: var(--neutralcolor-medium);
}

.torque-input-text:disabled + .torque-floating-label, .torque-input-text:disabled + .error + .torque-floating-label {
    cursor: not-allowed;
    color: var(--neutralcolor-medium);
}

.torque-legal-terms {
    font-size: var(--font-size-3xs);
}

.torque-text-uppercase {
    text-transform: uppercase;
}

.torque-reset-line-height {
    line-height: 1;
}

.torque-font-sm {
    font-weight: var(--font-weight-sm);
}

.torque-font-md {
    font-weight: var(--font-weight-md);
}

.torque-max-width-7xl{
    max-width: var(--spacing-layout-7xl);
}

.torque-link {
    text-decoration: none;
    color: var(--brandcolor-primary-medium);
}