.rf-inscription {
max-width: 1040px;
margin: 0 auto;
padding: 20px;
background: #f7f7f9;
border: 1px solid #e2e4ea;
border-radius: 14px;
}
.rf-inscription h2 {
margin-top: 0;
margin-bottom: 18px;
}
.rf-step {
margin-bottom: 18px;
}
.rf-step h3 {
margin: 0 0 8px;
font-size: 18px;
}
.rf-inscription label,
.rf-inscription select {
display: block;
margin-bottom: 8px;
}
.rf-inscription select,
.rf-inscription input[type="text"],
.rf-inscription input[type="email"] {
width: 100%;
max-width: 560px;
padding: 10px 12px;
border: 1px solid #ced4df;
border-radius: 8px;
background: #fff;
}
.rf-calendar-card {
border: 1px solid #d8dde8;
border-radius: 14px;
background: #fff;
padding: 18px;
max-width: 860px;
margin: 0 auto;
}
.rf-calendar-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-bottom: 12px;
}
#rf-calendar-title {
margin: 0;
font-size: 30px;
text-transform: capitalize;
}
.rf-calendar-nav {
border: 0;
background: #ffb803;
color: #2a2a2a;
font-size: 32px;
line-height: 1;
width: 72px;
height: 72px;
border-radius: 10px;
cursor: pointer;
}
.rf-calendar-nav:hover {
background: #e5a400;
}
.rf-weekdays,
.rf-calendar-grid {
display: grid;
grid-template-columns: repeat(7, minmax(0, 1fr));
gap: 12px;
}
.rf-weekday {
text-align: center;
font-weight: 700;
color: #5f6878;
padding: 6px 0;
}
.rf-day {
position: relative;
width: 100%;
aspect-ratio: 1 / 1;
border: 0;
border-radius: 8px;
background: #ffe6a6;
color: #3a3a3a;
font-size: 30px;
cursor: pointer;
}
.rf-day:hover:not(:disabled) {
background: #ffd56b;
}
.rf-day-number {
font-size: 24px;
font-weight: 500;
}
.rf-day-selected {
background: #ffb803;
color: #1f1f1f;
}
.rf-day-disabled,
.rf-day:disabled {
background: #f0f2f6;
color: #ccd0d8;
cursor: not-allowed;
}
.rf-day-empty {
visibility: hidden;
}
.rf-day-past {
opacity: 0.65;
}
.rf-slots-list {
display: grid;
gap: 8px;
}
.rf-slot-item {
display: flex;
align-items: center;
gap: 10px;
background: #fff;
padding: 10px 12px;
border: 1px solid #e1e6f0;
border-radius: 8px;
}
.rf-slot-content {
font-weight: 500;
}
.rf-empty-message {
margin: 0;
color: #666d7c;
font-style: italic;
}
.rf-inscription button[type="submit"] {
margin-top: 8px;
background: #ffb803;
color: #2a2a2a;
border: 0;
padding: 11px 18px;
border-radius: 8px;
cursor: pointer;
}
.rf-inscription button[type="submit"]:disabled {
background: #cfcfcf;
color: #5d5d5d;
cursor: not-allowed;
opacity: 0.9;
}
#rf-feedback {
margin-top: 14px;
font-weight: 600;
}
.rf-selected-recap-help {
margin: 0 0 10px;
font-size: 14px;
line-height: 1.45;
color: #444;
max-width: 640px;
}
.rf-selected-slots-summary {
max-width: 640px;
}
.rf-selected-slots-empty {
margin: 0;
padding: 12px 14px;
background: #fff;
border: 1px dashed #ced4df;
border-radius: 8px;
font-size: 14px;
color: #555;
}
.rf-selected-slots-list {
margin: 0;
padding: 0;
list-style: none;
}
.rf-selected-slot-row {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 10px 12px;
margin-bottom: 8px;
background: #fff;
border: 1px solid #e2e4ea;
border-radius: 8px;
font-size: 15px;
}
.rf-selected-slot-text {
flex: 1;
min-width: 200px;
}
.rf-remove-selected-slot {
border: 0;
background: transparent;
color: #b45309;
text-decoration: underline;
cursor: pointer;
font-size: 14px;
padding: 4px 0;
}
.rf-remove-selected-slot:hover {
color: #7c2d12;
}
@media (max-width: 860px) {
.rf-calendar-nav {
width: 50px;
height: 50px;
font-size: 24px;
}
#rf-calendar-title {
font-size: 24px;
}
.rf-day-number {
font-size: 18px;
}
}