:where([class^="ri-"])::before { content: "\f3c2"; }
body {
font-family: 'Poppins', sans-serif;
background-color: #111827;
color: #e5e7eb;
}
.custom-shadow {
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}
.custom-checkbox {
display: flex;
align-items: center;
position: relative;
cursor: pointer;
}
.custom-checkbox input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkmark {
height: 20px;
width: 20px;
background-color: #374151;
border-radius: 4px;
position: relative;
}
.custom-checkbox:hover input ~ .checkmark {
background-color: #4B5563;
}
.custom-checkbox input:checked ~ .checkmark {
background-color: #d00024;
}
.checkmark:after {
content: "";
position: absolute;
display: none;
}
.custom-checkbox input:checked ~ .checkmark:after {
display: block;
}
.custom-checkbox .checkmark:after {
left: 7px;
top: 3px;
width: 6px;
height: 12px;
border: solid white;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.password-toggle {
position: absolute;
right: 16px;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
color: #9ca3af;
}
.social-login-btn {
transition: all 0.2s ease;
}
.social-login-btn:hover {
transform: translateY(-2px);
}