.container{width:98%;margin:1% auto 0;background-color:#f0f0f0;border-radius:.625rem}h1{margin:auto;font-size:2em;text-align:center;color:#20a53a}html,body{height:100%;margin:0}body{padding-top:var(--nav-h, 3.5rem);background:linear-gradient(135deg,#74ebd5,#acb6e5);background-repeat:no-repeat;background-attachment:fixed}.appointment-date{padding:.5rem;font-size:1rem;color:#333;background-color:#f0f8ff;border:.125rem solid #aaa;border-radius:.375rem}input[type=checkbox]{display:none}.time-slot{display:flex;width:100%;border:1px solid #ccc;flex-wrap:wrap;border-right:none;border-bottom:none}.time-slot-item{position:relative;width:25%;height:3.75rem;box-sizing:border-box;background:#f0fdf4;border-right:1px solid #ccc;border-bottom:1px solid #ccc}label{display:flex;align-items:center;justify-content:center;width:100%;height:100%;text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none}.week-time-slot-option:checked+label{color:#fff;background:#3b82f6;border:none}.time-slot-item input[type=checkbox]:checked+label{color:#fff;background:#3b82f6;border:none}.button{width:100%;height:2.5rem;color:#fff;background-color:#4f46e5;border:none;border-radius:.375rem;cursor:pointer}.button-box{width:100%;margin-top:.5rem;margin-bottom:.5rem;background-color:#fff}#appointment-date{width:40%;padding:.5rem;margin:0 .5rem .5rem;font-size:1rem;color:#374151;background:linear-gradient(135deg,#f0f8ff,#e0f2fe);border-radius:.5rem;transition:all .3s ease;cursor:pointer}.date-controls{display:flex;align-items:center;justify-content:center;margin-bottom:.3rem}.date-display-box{position:sticky;top:var(--nav-h, 3.5rem);z-index:1;display:flex;align-items:center;justify-content:space-around;width:100%;height:1.5rem;padding:0 1rem;color:#4a5568;background-color:#edf2f7;border-radius:.375rem}.date-display{width:45%;height:100%;background-color:#f1f5f9;border:1px solid #d6dee7;border-radius:.2rem;cursor:pointer}.week-time-slot-option{width:100%;height:2.5rem;padding:.625rem 1.25rem;font-size:1rem;color:#333;background:linear-gradient(to right,#dbeafe,#ede9fe);border:.0625rem solid #ccc;border-radius:.375rem;cursor:pointer}.week-range{flex:1 1 0;border-right:1px solid #000}.week-range:first-child{border-left:1px solid #000}.week-range:first-child .week-time-slot-item{color:#374151;background-color:#eef2ff}.week-date{position:sticky;top:calc(var(--nav-h, 3.5rem) + 1.5rem);z-index:1;flex:1;padding:.5rem;text-align:center;color:#4a5568;background-color:#edf2f7;border-bottom:1px solid #cbd5e0}.no-date-display .week-date{top:var(--nav-h, 3.5rem)}.week-time-slot-item{position:relative;width:100%;height:2.2rem;box-sizing:border-box;text-align:center;background:#f0fdf4;border-right:1px solid #ccc;border-bottom:1px solid #ccc}.highlight{font-weight:700;color:red}.highlight~.week-time-slot-item{background-color:#e0f2fe}.week-time-slot-item.disabled-slot,.disabled-slot{background:#f3f4f6}.disabled-slot input[type=checkbox]:hover+label,.no-login-slot input[type=checkbox]:hover+label{cursor:not-allowed}.button-hidden{display:none}.weekly-text{font-size:17px}.page-btn.button{display:flex;align-items:center;justify-content:center;text-decoration:none}.page-btn{margin:.5rem 0}