.now{background-color:#000}.habit{font-size:25px;font-weight:bolder}.add-new{font-size:15px;font-weight:600;margin-bottom:10px;text-align:left}.add-habit-container{box-shadow:0 0 5px #6b6a6a40;padding:12px}body{display:flex}.add-habit-container button{box-shadow:0 0 3px #b7b6b5;border:none;background-color:#fff;padding:4px 30px;border-radius:5px;font-weight:700;margin-left:7px}.add-container{display:flex;gap:10px}.add-container input{width:250px;height:40px;box-shadow:0 0 3px #b7b6b5;border:none;padding-right:20px;text-indent:4px;border-radius:5px}.container{margin-top:15px;padding:10px;box-shadow:0 0 5px #6f827740}.habits{text-align:left;font-weight:700;margin-bottom:5px}.mark-container{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;margin-bottom:8px;box-shadow:0 0 5px #6f827740;border-radius:6px;background-color:#fff}.mark-container p{margin:0;width:80px;flex-shrink:0}.second-container{display:flex;gap:10px;flex-shrink:0;flex-wrap:wrap;max-width:200px}.mark-container button{flex:1;max-width:20%;margin-left:10px;border:none;background-color:#fff;border-radius:6px;box-shadow:0 0 5px #6f827740;padding:6px 10px;font-weight:550;cursor:pointer;white-space:normal;overflow:visible;text-overflow:unset}.second-container{display:flex;flex-direction:row;gap:10px}.mark-wrapper{position:relative;width:20px;height:20px}.✔{position:absolute;top:0;left:0;width:100%;height:100%;font-size:14px;font-weight:700;text-align:center;line-height:20px;border-radius:4px;background-color:#20c620;color:#fff;box-shadow:0 0 4px #0003;z-index:1}.✖{color:red;position:absolute;top:0;left:0;width:100%;height:100%;font-size:14px;font-weight:700;text-align:center;line-height:20px;border-radius:4px;background-color:#fff;box-shadow:0 0 4px #0003;z-index:1}.custom-box.mark-✖{color:red;background-color:#fff}.select-overlay{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;z-index:2;cursor:pointer;appearance:none}.mark-wrapper:hover .custom-box{box-shadow:0 0 3px #0006;cursor:pointer}.mark-wrapper:after{content:"▼";position:absolute;right:-10px;top:1px;font-size:10px;color:gray;z-index:0}.container-stats{position:relative;box-shadow:0 0 5px #6f827740;text-align:left;font-weight:500;padding:5px;margin-top:15px}.container-stats span{position:absolute;right:10px}.stats{font-weight:700}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center;font-family:Montserrat}.big-container{box-shadow:0 0 5px #6f827740;padding:20px;width:400px}