.booking-page{background:linear-gradient(135deg,#eefaff,#fff);min-height:100vh;padding:160px 8% 80px}.booking-page h1{text-align:center;color:#06234b;margin-bottom:60px;font-size:48px;font-weight:800}.customer-form{flex-wrap:wrap;justify-content:center;align-items:center;gap:25px;margin-bottom:60px;display:flex}.customer-form input,.customer-form select{color:#06234b;background:#fff;border:1px solid #cfefff;border-radius:20px;outline:none;width:280px;height:70px;padding:0 25px;font-size:18px;transition:all .3s;box-shadow:0 10px 30px #0000000f}.customer-form input:focus,.customer-form select:focus{border-color:#00aeef;box-shadow:0 0 0 5px #00aeef26}.calendar-container{background:#fff;border-radius:35px;width:430px;margin:40px auto;padding:30px;box-shadow:0 25px 60px #0000001f}.react-calendar{border:none!important;width:100%!important}.react-calendar__navigation button{color:#06234b;font-size:20px;font-weight:700}.react-calendar__month-view__weekdays{color:#06234b;font-weight:700}.react-calendar__tile{color:#06234b;border-radius:18px;height:55px;font-weight:700}.visitors-box{background:#fff;border-top:6px solid #00aeef;border-radius:35px;width:520px;margin:50px auto;padding:40px;box-shadow:0 25px 60px #0000001f}.visitors-box h2{text-align:center;color:#06234b;margin-bottom:35px;font-size:32px}.visitor-row{color:#06234b;background:#f8fdff;border:1px solid #e5f6ff;border-radius:25px;justify-content:space-between;align-items:center;margin-bottom:18px;padding:20px 25px;font-size:20px;font-weight:600;transition:all .3s;display:flex}.visitor-row:hover{transform:translateY(-3px);box-shadow:0 10px 25px #00aeef1f}.visitor-row div{align-items:center;gap:18px;display:flex}.visitor-row button{color:#fff;cursor:pointer;background:#00aeef;border:none;border-radius:50%;width:45px;height:45px;font-size:25px;font-weight:700;transition:all .3s}.visitor-row button:hover{background:#008dcc;transform:scale(1.1)}.visitor-row b{font-size:24px}.summary{background:#fff;border-radius:40px;width:520px;margin:60px auto;padding:45px;position:relative;overflow:hidden;box-shadow:0 30px 70px #00000026}.summary:before{content:"";background:#00aeef;width:100%;height:7px;position:absolute;top:0;left:0}.summary h2{text-align:center;color:#06234b;margin-bottom:35px;font-size:38px}.summary p{color:#333;background:#f8fdff;border-radius:15px;justify-content:space-between;align-items:center;margin:12px 0;padding:12px 20px;font-size:20px;display:flex}.summary h3{text-align:center;color:#00aeef;margin-top:35px;font-size:40px}.summary button{color:#fff;cursor:pointer;background:#00aeef;border:none;border-radius:40px;width:300px;height:65px;margin:30px auto 0;font-size:21px;font-weight:700;transition:all .3s;display:block}.summary button:hover{background:#008dcc;transform:translateY(-4px)}.calendar-status{flex-direction:column;align-items:center;font-size:12px;font-weight:700;display:flex}@media (width<=900px){.booking-page{padding:130px 20px 60px}.booking-page h1{font-size:36px}.customer-form{flex-direction:column}.customer-form input,.customer-form select{width:100%}.calendar-container,.visitors-box,.summary{width:95%}}.calendar-filter{flex-wrap:wrap;justify-content:center;gap:12px;margin:20px 0;display:flex}.filter-btn{cursor:pointer;background:#fff;border:none;border-radius:30px;padding:12px 22px;font-size:16px;font-weight:600;transition:all .3s;box-shadow:0 4px 12px #0000001f}.filter-btn:hover{transform:translateY(-3px)}.filter-btn.active{color:#fff}.filter-btn.active.ladies{background:#ff4fa3}.filter-btn.active.family{background:#16a34a}.filter-btn.active.academy{background:#2563eb}.filter-btn.active.all{background:#111827}.react-calendar{background:#fff;border-radius:30px;padding:25px;box-shadow:0 20px 40px #0000001f;border:none!important;width:100%!important}.react-calendar__navigation{align-items:center;margin-bottom:20px;display:flex}.react-calendar__navigation button{color:#06234b;background:#f1f5f9;border:none;border-radius:15px;height:45px;font-size:18px;font-weight:700}.react-calendar__navigation button:hover{color:#fff;background:#00aeef}.react-calendar__navigation__label{font-weight:700;font-size:22px!important}.react-calendar__month-view__weekdays{color:#06234b;font-size:14px;font-weight:700;text-decoration:none!important}.react-calendar__tile{color:#06234b;border-radius:18px;height:65px;font-size:16px;font-weight:700;position:relative}.react-calendar__tile:hover{background:#e7f8ff}.react-calendar__tile--now{background:#dff5ff}.calendar-status{flex-direction:column;justify-content:center;align-items:center;margin-top:3px;font-size:10px;line-height:12px;display:flex}.calendar-status.ladies,.calendar-status.ladies span{color:#ff4fa3}.calendar-status.academy,.calendar-status.academy span{color:#009cff}.calendar-status.closed,.calendar-status.closed span{color:#e63946}.calendar-status.family,.calendar-status.family span{color:#16a34a}.calendar-status{text-align:center;font-size:16px;font-weight:700}.react-calendar__tile--active .calendar-status span{color:#fff}.react-calendar__tile{flex-direction:column;justify-content:center;align-items:center;height:70px!important;display:flex!important}.calendar-status{flex-direction:column;align-items:center;margin-top:2px;font-size:12px;line-height:12px;display:flex}.calendar-status span{font-size:9px;font-weight:700}.calendar-status{transform:translateY(2px)}.calendar-status.ladies span{color:#ff4fa3}.calendar-status.academy span{color:#009cff}.calendar-status.closed span{color:#e63946}.calendar-status.family span{color:#16a34a}.react-calendar__tile.ladies-day{color:#ff4fa3!important;background:#ffe4f2!important}.react-calendar__tile.ladies-day:hover{background:#ffc7e3!important}.react-calendar__tile.academy-day{color:#009cff!important;background:#dff5ff!important}.react-calendar__tile.academy-day:hover{background:#bdeaff!important}.react-calendar__tile.closed-day{color:#e63946!important;background:#ffe3e3!important}.react-calendar__tile.closed-day:hover{background:#ffc5c5!important}.react-calendar__tile.family-day{color:#16a34a!important;background:#e4ffe9!important}.react-calendar__tile.family-day:hover{background:#c8ffd3!important}.react-calendar__tile--active{color:#fff!important;background:#009cff!important}
