@import"https://fonts.googleapis.com/css?family=Roboto:300";:root{background:#76b852;font-family:Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{list-style:none;text-decoration:none;box-sizing:border-box}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-height:100vh;min-width:100vw}h1{font-size:3.2em;line-height:1.1}.card{padding:2em}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}}.dashboard-main{display:grid;grid-template-columns:1fr 2fr;align-content:center;align-items:center;max-width:700px;gap:20px}.myAppointments{display:grid;grid-template-columns:1fr 1fr 1fr;padding:15px 0;gap:40px}@media screen and (max-width: 768px){.dashboard-main{gap:10px}.myAppointments{grid-template-columns:1fr 1fr;gap:10px}}.apo{display:flex;flex-direction:column;justify-content:space-around;align-items:center;border:2px solid rgba(0,0,0,.2);padding:10px 15px;font-weight:700;transition:all .1s ease-in;gap:10px;border-top:10px solid #4caf50}.apo span{font-size:12px;color:#000c}.apo button{border:none;background:none;font-size:10px;cursor:pointer}.apo:hover{box-shadow:0 10px 10px #0003;border-color:#4caf50;cursor:pointer}.logout-btn{background-color:#fb4141;border:none;padding:5px 10px;cursor:pointer;color:#fff}.logout-btn:hover{box-shadow:0 2px 5px #0003}.dashboard__left-side{display:flex;flex-direction:column;min-height:350px;justify-content:space-between;border-right:3px solid rgba(0,0,0,.1);padding:20px 20px 10px 10px}.left-list{display:flex;flex-direction:column;align-items:flex-start;gap:20px}.left-list span{border-bottom:3px solid rgba(0,0,0,.2);padding:15px 15px 20px;width:100%;text-align:start;transition:all .1s ease-in;cursor:pointer}@media screen and (max-width: 920px){.dashboard__left-side{padding:0 5px 0 0}.left-list span{padding:15px 10px;font-size:14px}.apo{padding:5px 10px}}.left-list span:hover,.left-list span.active{background-color:#0000001a;border-bottom-color:#4caf50}.dashboard__right-side{color:#fb4141;font-weight:700;padding:20px}.login-page{padding:8% 0 0;margin:auto}@media screen and (min-width: 1024px){.login-page{min-width:360px}}.form{position:relative;z-index:1;background:#fff;max-width:360px;margin:0 auto 100px;padding:45px;text-align:center;box-shadow:0 0 20px #0003,0 5px 5px #0000003d}.form input{font-family:Roboto,sans-serif;outline:0;background:#f2f2f2;width:100%;border:0;margin:0 0 5px;padding:15px;box-sizing:border-box;font-size:14px}.form button{font-family:Roboto,sans-serif;text-transform:uppercase;outline:0;background:#4caf50;width:100%;border:0;padding:15px;color:#fff;font-size:14px;-webkit-transition:all .3 ease;transition:all .3 ease;cursor:pointer}.form button:hover,.form button:active,.form button:focus{background:#43a047}.form .message{margin:15px 0 0;color:#b3b3b3;font-size:12px}.form .message a{color:#4caf50;text-decoration:none}.form .register-form{display:none}.login-form{display:flex;flex-direction:column;gap:.6rem}.login-input{display:flex;flex-direction:column;align-items:flex-start}.error{font-size:12px;color:red;margin-bottom:10px}.submit-btn{margin-top:15px}.main{position:relative;z-index:1;background:#fff;margin:0 auto 100px;padding:30px 45px;text-align:center;box-shadow:0 0 20px #0003,0 5px 5px #0000003d;display:grid;border-top:10px solid #4caf50}.main h2{padding-bottom:20px;border-bottom:4px solid #4caf50}.apo-main{display:grid;grid-template-columns:1fr 3fr;align-content:center;gap:15px}@media screen and (max-width: 768px){.main{padding:30px 20px}.apo-main{gap:10px}}.weekDays{display:flex;flex-direction:column;align-items:flex-start;border-right:3px solid rgba(0,0,0,.1);padding:10px 15px 10px 0;justify-content:space-between;gap:15px}.weekDays .day{border-bottom:3px solid rgba(0,0,0,.2);padding:15px 15px 10px;width:100%;text-align:start;transition:all .1s ease-in;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.weekDays .day span{font-size:12px;color:#0009}@media screen and (max-width: 768px){.weekDays{padding-right:5px}.weekDays .day{padding:15px 5px}}.weekDays .day:hover,.weekDays .day.active{background-color:#0000001a;border-bottom-color:#4caf50}.apoTimes{display:grid;grid-template-columns:1fr 1fr 1fr;padding:15px 0;align-items:center;justify-items:center;gap:20px}@media screen and (max-width: 768px){.apoTimes{grid-template-columns:1fr 1fr;gap:5px}}.apoTime{display:flex;flex-direction:column;border:2px solid rgba(0,0,0,.2);font-weight:700;transition:all .1s ease-in;border-top:10px solid #4caf50}.apoTime:not(.reserved):hover{box-shadow:0 10px 10px #0003;border-color:#4caf50}.apoTime button{background-color:#4caf50;border:none;padding:7px 9px;border-radius:5px;margin:10px;cursor:pointer;color:#fff}.apoTime button:disabled{cursor:default}.apoTime span{padding:10px}.apoTime.reserved{opacity:.4}.link{justify-self:end;color:gray;font-weight:500;font-size:14px}.link:hover{color:#000}
