/* custom.css */
:root {
    --primary-color: #29bbb0;
    --primary-color-hover: #23a59c;
    --white: #ffffff;
    --gray: #808080;
    --gray-light: #979797;
    --text-gray: #4A4A4A;
    --dark-gray: #616161;
}


input[type="radio"] {
    appearance: none;
    width: 20px;
    height: 20px;
    border: 2px solid  var(--dark-gray);
    border-radius: 50%;
    position: relative;
}


input[type="radio"]::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--dark-gray);
    transition: transform 0.2s ease-in-out;
}

input[type="radio"]:checked {
    border: 2px solid var(--primary-color) !important;
}

input[type="radio"]:checked::before {
    transform: translate(-50%, -50%) scale(1);
    background-color: var(--primary-color) !important;
}

input[type="radio"][disabled]::before {
   background-color: #f2f2f2 !important;
}

input[type="radio"][disabled] {
    border: 2px solid #f2f2f2 !important;
}

.requirement-circle {
    width: 12px;
    height: 12px;
    border: 1px solid  var(--dark-gray) !important;
}

.custom-password-ctrl {
    border-right-style: none !important;
}

.custom-password-field {
    border-left-style: none;
    border-bottom-right-radius: 8px;
    border-top-right-radius: 8px;
}

.custom-password-field:focus  {
    outline: none;
    border: 1px solid #29bbb0;
}

.btn-primary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: var(--white) !important;
}

.btn-link {
    color: var(--primary-color) !important;
}

.input-focus {
    outline: none;
    border: 1px solid #29bbb0;
}

.btn-link:hover,
.btn-link:active,
.btn-link:focus {
    color: var(--primary-color) !important;
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus {
    background-color: var(--primary-color-hover) !important;
    border-color: var(--primary-color-hover) !important;
    box-shadow: none !important;
    color: var(--white) !important;
}

.btn-primary:disabled {
    border: none !important;
    background-color: #f2f2f2 !important;
    color: #8c9194 !important;
}

.is-valid,
.is-invalid
{
 background-image: none !important;
}

.is-invalid:hover,
.is-invalid:active,
.is-invalid:focus {
    box-shadow: none !important;
}

.is-valid:hover,
.is-valid:active,
.is-valid:focus {
    box-shadow: none !important;
}

.text-gray {
    color: var(--text-gray) !important;
}

.text-gray-light {
    color: var(--gray-light) !important;
}

.text-success {
    color: #058027 !important;
}

.bg-success-light {
    background-color: #E8FFEB !important;
}

.gap-0 {
    gap: 0 !important;
}

.gap-1 {
    gap: 0.25rem !important;
}

.gap-2 {
    gap: 0.5rem !important;
}

.gap-3 {
    gap: 1rem !important;
}

.gap-4 {
    gap: 1.5rem !important;
}

.gap-5 {
    gap: 3rem !important;
}
