:root {

    --radius: 16px;
    --radius-sm: 12px;

    --primary-font: "Inter", sans-serif;
    --secondary-font: "Space Grotesk", sans-serif;

    --yellow-light-bg:#fcf5e9;
    --primary-gradient:linear-gradient(221deg, #c62052, #280071);
    --primary-gradient-hover:linear-gradient(221deg, #a80234, #1f0057);


}


.p-gradient{
    background: transparent linear-gradient(221deg, #c62052, #280071) 0% 0% no-repeat padding-box;
}


.c-rounded {
    border-radius: var(--radius);
}
.c-sm-rounded {
    border-radius: var(--radius-sm);
}

/* ======= CUSTOM HEADINGS: STYLES ======== */
.custom-h1 {
    font-family: var(--secondary-font);
    line-height: 135%;
    font-size: 29px;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: -1px;
    color: var(--bs-heading-color);
}


/* ======= Icons Style ======== */
.icon {
    width: 24px;
    fill: var(--inverse-color);
    height: 24px;
}


/* ======= Input Fields ======== */
.custom-icon-input {
    position: relative;
}

.custom-icon-input input {
    border: 1.6px solid #dee2e6;
    padding: 16px 12px;
    padding-left: 50px;
    font-size: 15px;
}

.custom-icon-input input:focus {
    border: 1.6px solid #adb5bd;
}

.custom-right-icon-input{
     position: relative;
}

.custom-right-icon-input .icon {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 0px;
    right: 18px;
    bottom: 0px;
    margin: auto;
}

.custom-right-icon-input input {
    border: 1.6px solid #dee2e6;
    padding: 16px 12px;
    padding-left: 20px;
    font-size: 15px;
}

.custom-icon-input .icon {
    width: 18px;
    height: 18px;
    position: absolute;
    top: 0px;
    left: 18px;
    bottom: 0px;
    margin: auto;
}

.inp-label {
    font-size: 15px;
    color: var(--bs-heading-color);
    font-weight: 500;
    margin-bottom: 6px;
}

input:-webkit-autofill {
    background-color: transparent !important;
    -webkit-text-fill-color: #292929 !important;
    transition: background-color 5000s ease-in-out 0s;
}

.sm-input-text {
    font-size: 12px;
    color: var(--inverse-color);
    font-weight: 500;
    margin: 0px;
    padding: 0px
}