:root {
    /*--color-teal: #38bdf8;*/
    /*--bg-teal: #f0f9ff;*/
    /*dark*/
    /*--bg-dark-card: #1f2124;*/
}

.img-register {
    background-image: url(../image/register-night-new.png);
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: contain;
}

html.dark input[type='checkbox'] {
    background-color: #222222;
}

input[type='checkbox'] {
    color: var(--color-teal) !important;
    border-radius: 2px;
}

input[type='checkbox'] {
    color: var(--color-teal) !important;
    background: white;
    border-radius: 2px;
}

[type='checkbox']:focus {
    box-shadow: none !important;
}

/* Change autocomplete styles in WebKit */
html.dark input:-webkit-autofill,
html.dark input:-webkit-autofill:hover,
html.dark input:-webkit-autofill:focus,
html.dark textarea:-webkit-autofill,
html.dark textarea:-webkit-autofill:hover,
html.dark textarea:-webkit-autofill:focus,
html.dark select:-webkit-autofill,
html.dark select:-webkit-autofill:hover,
html.dark select:-webkit-autofill:focus {
    border-bottom: 1px solid var(--color-teal);
    -webkit-text-fill-color: white;
    -webkit-box-shadow: 0 0 0px 1000px #222222 inset;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
    border-bottom: 1px solid var(--color-teal);
    -webkit-text-fill-color: #222222;
    -webkit-box-shadow: 0 0 0px 1000px var(--text-slate-50) inset;
}

[type='radio'] {
    color: var(--color-teal);
    border-color: #222222;
    height: 20px;
    width: 20px;
}

[type='radio']:checked {
    border-color: #222222;
}

[type='checkbox']:focus,
[type='radio']:focus {
    --tw-ring-offset-color: #222222;
    --tw-ring-color: var(--color-teal);
}

.opacity-5 {
    opacity: 0.05;
}

html.dark .button-register:disabled {
    background-color: var(--color-teal) !important;
    opacity: .3;
}

.button-register:disabled {
    background-color: var(--bg-teal) !important;
    box-shadow: none !important;
    color: black;
}
