.text-sm {
    font-size: 0.875rem;
}
.text-xs {
    font-size: 0.75rem;
}



/** BUTTONS **/
.btn {
    border-radius: 0.45rem !important;
}

.btn-icon-only {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;
    border-radius: 50% !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-xs {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    line-height: 1.5;
    border-radius: 0.2rem;
}
.btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5;
    border-radius: 0.2rem;
}

/** END BUTTONS **/




/** INPUTS **/
.input-content {
    position: relative;
}

.input-content:hover > input,
.input-content:hover > select,
.input-content:hover > textarea {
    border-color: var(--primary-soft-border);
}

.input-content:hover > label {
    color: var(--primary-light);
}

.input-content .input-icon {
    position: absolute;
    top: 50%;
    left: 0.75rem;
    transform: translateY(-50%);
    color: var(--primary);
}

.input-content input,
.input-content select,
.input-content textarea {
    border: 2px solid var(--border-light);
    border-radius: 0.35rem;
}

.input-content input:focus,
.input-content select:focus,
.input-content textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 0.15rem rgba(42, 110, 82, 0.25);
}

.input-content label {
    color: var(--primary);
    font-size: 0.875rem;
    margin-bottom: 0.1rem;
    font-weight: 400;
}

.input-content input:disabled {
    background-color: var(--light);
    color: var(--dark);
    cursor: not-allowed;
}





/*** INPUTS IN TABLE **/
table tr td input {
    width: 100%;
    border: 1px solid var(--border-light);
    border-radius: 0 !important;
    height: 2.25rem;
    padding: 0.15rem 0.15rem !important;
}

table tr td input:focus {
    border-color: var(--primary) !important;
    box-shadow: none !important;
}





/** TEXTS **/
p {
    font-size: 0.875rem;
    line-height: 1.5;
    margin-bottom: 0.35rem;
}




/** CARDS **/
.card {
    border-radius: 0.5rem;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-light);
}

.card .card-title {
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--primary);
}

.card .card-header {
    border-bottom: 1px solid var(--light);
    background-color: var(--white);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--primary);
}

.card .card-body {
    padding: 1rem;
}

.card .card-footer {
    border-top: 1px solid var(--light);
    background-color: var(--white);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--primary);
}




/*** BLOCK UI START ***/
.custom-loader {
    width: 50px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(farthest-side, var(--primary) 94%, #0000) top/8px 8px no-repeat, conic-gradient(#0000 30%, var(--primary));
    -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 8px), #000 0);
    animation: l13 1s infinite linear;
}

@keyframes l13 {
    100% {
        transform: rotate(1turn)
    }
}

.blockUI.blockOverlay {
    z-index: 9999 !important;
}

.blockUI.blockMsg.blockPage {
    padding: 8px !important;
    color: var(--primary-dark) !important;
    border: none !important;
    border-radius: 15px;
    font-size: 10pt;
    z-index: 9999999 !important;
    top: 50% !important;
    background-color: var(--white) !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    max-width: 225px;
}

.blockUI.blockMsg.blockElement {
    position: absolute !important;
    padding: 8px !important;
    color: var(--primary-dark) !important;
    border: none !important;
    border-radius: 15px;
    font-size: 10pt;
    z-index: 100 !important;
    top: 50% !important;
    background-color: var(--gray-light) !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    max-width: 200px;
}
/**  BLOCK UI END ***/