:root{margin:0;padding:0;box-sizing:border-box;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400}body{background-color:#f0fff0}h3,h1,p{margin:0}.red{color:red!important}.card{width:50%;margin:1rem auto;min-height:90vh}.card .header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.logoutIcon{font-size:1.5rem;color:red}.card .header .headerText{text-align:center}.logos{width:30%;display:flex;align-items:center}.card .header .roomifyLogo{width:25%;cursor:pointer}.input{display:flex;justify-content:space-between;flex-direction:row}.inputReservation{display:grid;grid-template-columns:1fr 1fr;gap:10px}.reservationPickers{width:50%}.modalDetails span{font-weight:lighter}.input .selectInput{width:38%}.input .timePicker{width:28%}.input .searchButton{width:32%}.ghostInput{color:#000!important;background-color:#fff!important}.output{min-height:100px}.output h4{margin:10px}.rooms{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px;padding:10px}.allRooms{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:10px}.createRoom{border-radius:10px;padding:1rem;background-color:#fff;text-align:center;margin:1rem 0}.createRoomForm{width:75%;margin:0 auto;box-sizing:border-box}.roomCard{background-color:#87cefa58}footer{text-align:center;font-size:1rem;opacity:50%;font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif}.reservationHeader{font-weight:600!important}.reservationBody{width:70%;margin:0 auto;display:grid;gap:12px}.reservationBody div{display:flex;gap:10px}.finalNote{width:50%;border:2px solid forestgreen;margin:0 auto;padding:1rem;border-radius:10px;text-align:center;margin-top:2rem}.finalNote h4{font-family:sans-serif;font-style:normal}.statistics{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.home{padding:0 1rem}.home h2{text-align:center;font-weight:500}.widthFull,.reservInput div{width:100%}.reservInput{margin-bottom:0}.fadedInputs{background-color:#fff!important;color:#000!important}.skeleton{padding:1rem}.loadingSpin{display:flex;justify-content:center;color:#3b7e00;margin:2rem 0}.form{padding:2rem;background-color:#fff;border-radius:10px}.formItem{margin:10px 0}.loginPrimaryButton{margin:15px 0;text-align:center}.loginPrimaryButton button{width:100%}.loginSmallButton{margin:15px 0;text-align:center}.loginSmallButton button{width:40%}.description{color:#696969}.dashboard{display:grid;grid-template-columns:1fr}.dashboardMenu{background-color:transparent;display:flex}.roomsArea{padding:0 1rem}.usersArea{margin:1rem 0}.myReservations{display:grid;gap:1rem}.myReservationCard{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;justify-content:space-between}.myReservationCard .myReservationDetails{display:flex;flex-direction:column;justify-content:center}.drawerItems{width:100%;height:40px;display:flex;justify-content:start;align-items:center;gap:10px;font-size:16px;color:#000;transition:all ease .4s;padding:10px}.drawerItems:hover{background-color:#1675fb;color:#fff!important}.header_buttons{display:flex}@media only screen and (max-width: 1024px){.card{width:60%;padding:0}.rooms{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:10px}}@media only screen and (max-width: 840px){.card{width:100%;padding:0}.card .header .roomifyLogo{width:25%}.rooms{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:10px}}@media only screen and (max-width: 600px){.card{width:100%;padding:0}.card .header .roomifyLogo{width:35%}.rooms{display:grid;grid-template-columns:1fr;gap:15px;padding:10px}.input{display:flex;align-items:center;flex-direction:column;gap:8px;padding:0}.input .selectInput,.input .timePicker,.input .searchButton{width:100%}.reservationBody{width:100%;padding:0}.inputReservation .selectInputReservation,.inputReservation .timePickerReservation{width:100%}.finalNote{width:80%}.statistics{display:grid;grid-template-columns:1fr;gap:1rem}.home h2{font-size:larger;font-weight:600}.loginPrimaryButton button{width:100%}.form{padding:1rem;background-color:transparent;border-radius:10px}.allRooms{display:grid;grid-template-columns:1fr;gap:15px;padding:10px}.dashboardMenu{background-color:#fff}.myReservationCard{font-size:10px}}