:where([class^="ri-"])::before { content: "\f3c2"; }
body {
font-family: 'Inter', sans-serif;
scroll-behavior: smooth;
}
.gradient-bg {
background: linear-gradient(135deg, #3B82F6 0%, #10B981 100%);
}
.text-gradient {
background: linear-gradient(135deg, #3B82F6 0%, #10B981 100%);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
input:focus, textarea:focus, select:focus {
outline: none;
border-color: #3B82F6;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.custom-radio {
appearance: none;
-webkit-appearance: none;
width: 20px;
height: 20px;
border: 2px solid #d1d5db;
border-radius: 50%;
background-color: white;
cursor: pointer;
position: relative;
}
.custom-radio:checked {
border-color: #3B82F6;
border-width: 6px;
}
.calendar-day {
cursor: pointer;
transition: all 0.2s;
}
.calendar-day.selected {
background-color: #3B82F6;
color: white;
}
.calendar-day:not(.disabled):hover {
background-color: #e0e7ff;
}
.calendar-day.disabled {
color: #d1d5db;
cursor: not-allowed;
}
.time-slot {
cursor: pointer;
transition: all 0.2s;
}
.time-slot.selected {
background-color: #3B82F6;
color: white;
}
.time-slot:not(.disabled):hover {
background-color: #e0e7ff;
}
.time-slot.disabled {
color: #d1d5db;
cursor: not-allowed;
}
.custom-select {
appearance: none;
-webkit-appearance: none;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right 0.75rem center;
background-size: 1rem;
}
.progress-step {
position: relative;
}
.progress-step::after {
content: '';
position: absolute;
top: 50%;
left: 100%;
width: 100%;
height: 2px;
background-color: #e5e7eb;
transform: translateY(-50%);
}
.progress-step:last-child::after {
display: none;
}
.progress-step.active::after {
background-color: #3B82F6;
}
.progress-step.completed .step-number {
background-color: #3B82F6;
color: white;
}
.progress-step.active .step-number {
border-color: #3B82F6;
color: #3B82F6;
}