.App{display:flex;justify-content:center}.day-column{border:1px solid black;padding:10px;margin:10px;flex:1;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.time-slots{display:flex;flex-direction:column}.time-slot-row{display:flex;justify-content:space-between}.selectable-area{flex:1;border:1px dashed gray;margin-left:10px}.selected{background-color:#d0e9ff}.no-select{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.day-cell.disabled{opacity:.5}.day-cell label{display:inline-block;width:30px;height:30px;margin:5px;background-color:#f1f1f1;text-align:center;line-height:30px;border:1px solid #ddd;cursor:pointer;transition:background-color .3s}input[type=radio][value="0"]:checked+label{background-color:#f44336}input[type=radio][value="1"]:checked+label{background-color:#ff9800}input[type=radio][value="2"]:checked+label{background-color:#ffeb3b}input[type=radio][value="3"]:checked+label{background-color:#4caf50}input[type=radio]{display:none}.day-cell{display:flex;flex-direction:column;align-items:center;border:1px solid #ccc;padding:10px;margin:5px}.day-cell p{font-size:18px;margin-bottom:10px}.day-value-squares{width:30px;height:30px;margin:5px;border:1px solid #ddd;text-align:center;line-height:30px;background-color:#f1f1f1}.selector{cursor:pointer;transition:background-color .3s}.selected-0{background-color:#f44336}.selected-1{background-color:#ff9800}.selected-2{background-color:#ffeb3b}.selected-3{background-color:#4caf50}.name-input{margin:10px 0}.name-input input{width:100%;padding:5px;box-sizing:border-box}.days-container{display:flex;flex-wrap:wrap;justify-content:space-between}.day-column{flex:0 0 calc(14.28% - 10px);margin:5px}.days-container{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.values-container{display:flex;flex-direction:row;align-items:center}.values-column{flex:1;display:flex;flex-direction:column;align-items:center}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}