@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);@import url(https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css);*{box-sizing:border-box;font-family:Poppins,sans-serif;margin:0;padding:0}body{background-color:#eff3f8}button{background-color:transparent;border:none;cursor:pointer;outline:none}a{text-decoration:none}.app-container{padding:2rem .5rem}.app-container .calendar-box{background-color:#fff;border-radius:1rem;height:calc(100vh - 4rem);margin:auto;max-width:1200px;position:relative;width:100%}.app-container .calendar-box .pad-x{padding:0 2.5rem}@media only screen and (max-width:1024px){.app-container .calendar-box .pad-x{padding:0 1.5rem}}.app-container .calendar-box .header{align-items:center;border-bottom:1px solid #dfe5f0;display:flex;justify-content:space-between}.app-container .calendar-box .header .title{align-items:center;color:#1b222b;display:flex;font-size:1.5rem;font-weight:600;height:80px;padding-bottom:.25rem;position:relative;width:-webkit-max-content;width:max-content}.app-container .calendar-box .header .title:before{background-color:#16d899;border-radius:.5rem;bottom:-2px;content:"";height:4px;left:0;position:absolute;width:100%}.app-container .calendar-box .header .header-buttons{align-items:center;display:flex;gap:.5rem}.app-container .calendar-box .header .header-buttons .header-button{align-items:center;background-color:#eff3f8;border-radius:.5rem;color:#1b222b;display:flex;font-size:.9rem;gap:.75rem;padding:.75rem 1.25rem}.app-container .calendar-box .header .header-buttons .header-button .country-logo{border-radius:50%;height:18px;width:18px}.app-container .calendar-box .error-msg,.app-container .calendar-box .success-msg,.app-container .calendar-box .warning-msg{border-radius:.25rem;font-size:.7rem;margin-top:.25rem;padding:.4rem .5rem;width:100%}.app-container .calendar-box .error-msg{background-color:#fce9e5;border:1px solid #f19c87;color:#e12a02}.app-container .calendar-box .success-msg{background-color:#edf6eb;border:1px solid #add59f;color:#48a02e}.app-container .calendar-box .warning-msg{background-color:#fff8e6;border:1px solid #f9d69e;color:#efa333}.dates .date-times{align-items:center;border-bottom:1px solid #dfe5f0;display:grid;grid-template-columns:150px calc(100% - 150px);height:60px;width:100%}.dates .date-times .date-year{align-items:center;border-right:1px solid #dfe5f0;display:flex;flex-direction:row;font-size:.9rem;gap:.25rem;height:100%;justify-content:space-between;padding:0 1rem 0 0}.dates .date-times .date-year .year-btn{color:#7c828c;padding:.25rem;transition:all .2s}.dates .date-times .date-year .year-btn:active{-webkit-transform:scale(.9);transform:scale(.9)}.dates .date-times .date-months{height:100%;position:relative}.dates .date-times .date-months .months{align-items:center;display:grid;grid-template-columns:repeat(12,1fr);height:100%;overflow-x:auto}.dates .date-times .date-months .months .month{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:center;min-width:65px;position:relative;transition:all .25s}.dates .date-times .date-months .months .month:hover{background-color:#eff3f8;color:#fff}.dates .date-times .date-months .months .month .month-name{background-color:transparent;border-radius:.25rem;color:#7c828c;padding:.25rem .5rem;transition:all .25s;width:-webkit-max-content;width:max-content}.dates .date-times .date-months .months .month.active .month-name{background-color:#16d899;color:#fff}.dates .date-times .date-months .months .month .month-fill{background-color:#16d899;border-radius:50%;bottom:8px;display:none;height:5px;position:absolute;width:5px}.dates .date-times .date-months .months .month.fill .month-fill{display:block}@media only screen and (max-width:1024px){.dates .date-times .date-months .months:after,.dates .date-times .date-months .months:before{content:"";height:100%;position:absolute;top:0;width:2rem;z-index:9}.dates .date-times .date-months .months:before{background:linear-gradient(90deg,#fff,transparent);left:0}.dates .date-times .date-months .months:after{background:linear-gradient(270deg,#fff,transparent);right:0}}.dates .date-days{border-bottom:1px solid #dfe5f0;position:relative}.dates .date-days .days{align-items:center;display:grid;height:60px;overflow-x:auto;position:relative}.dates .date-days .days .day-btn{align-items:center;display:flex;height:100%;justify-content:center;min-width:35px;transition:all .25s}.dates .date-days .days .day-btn .day{background-color:transparent;border-radius:.25rem;color:#7c828c;font-size:.8rem;padding:.25rem .4rem}.dates .date-days .days .day-btn .day-fill{background-color:#16d899;border-radius:50%;bottom:7px;display:none;height:4px;position:absolute;width:4px}.dates .date-days .days .day-btn.fill .day-fill{display:block}.dates .date-days .days .day-btn.active .day{background-color:#16d899;color:#fff}.dates .date-days .days .day-btn:hover{background-color:#eff3f8}.dates .date-days:after,.dates .date-days:before{content:"";height:100%;position:absolute;top:0;width:2rem;z-index:9}.dates .date-days:before{background:linear-gradient(90deg,#fff,transparent);left:0}.dates .date-days:after{background:linear-gradient(270deg,#fff,transparent);right:0}.content-grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:400px calc(100% - 400px)}@media screen and (max-width:850px){.content-grid{grid-template-columns:repeat(1,1fr)}.content.month-content{display:none}}.content .day-info{align-items:center;display:flex;gap:.5rem;justify-content:space-between}.content .day-info .day-title{color:#1b222b;font-size:1.5rem;font-weight:600;padding:1.5rem 0}.content .day-info .day-title .month-day{color:#a2a6b7;font-size:.6rem;font-weight:400;padding-left:.25rem}.content .day-info .add-btn{background-color:#16d899;border:1px dashed #16d899;border-radius:.5rem;color:#fff;font-size:.9rem;padding:1rem 1.5rem;transition:all .25s}.content .day-info .add-btn .bi{padding-right:.5rem}.content .day-info .add-btn:hover{background-color:transparent;color:#1b222b}.content .day-info .add-btn:active{-webkit-transform:scale(.8);transform:scale(.8)}.content .tasks{display:flex;flex-direction:column;gap:1rem;height:calc(100vh - 370px);overflow:auto}.content .tasks .task-item{align-items:center;background-color:#fff;border:1px solid #dfe5f0;border-radius:.75rem;cursor:pointer;display:flex;flex-direction:row;gap:.5rem;justify-content:space-between;padding:1rem 1.5rem}.content .tasks .task-item.past{background-color:#eff3f8;border-color:#dfe5f0;color:#7c828c}.content .tasks .task-item.red{background-color:#fce9e5;border-color:#f19c87;color:#e12a02}.content .tasks .task-item.blue{background-color:#f3f6ff;border-color:#9eb0fd;color:#2046fc}.content .tasks .task-item.green{background-color:#edf6eb;border-color:#add59f;color:#48a02e}.content .tasks .task-item.orange{background-color:#fff8e6;border-color:#f9d69e;color:#efa333}.content .tasks .task-item.purple{background-color:#f0ebfb;border-color:#b493fa;color:#735bf2}.content .tasks .task-item.done .task-text,.content .tasks .task-item.done .task-time{text-decoration:line-through}.content .tasks .task-item .task-info{display:flex;flex-direction:column;gap:.25rem}.content .tasks .task-item .task-info .task-time{align-items:center;display:flex;font-size:.75rem;gap:.5rem}.content .tasks .task-item .task-info .task-time .time-dot{border-radius:50%;height:8px;width:8px}.content .tasks .task-item .task-info .task-time .time-dot.past{background-color:#7c828c}.content .tasks .task-item .task-info .task-time .time-dot.red{background-color:#e12a02}.content .tasks .task-item .task-info .task-time .time-dot.blue{background-color:#2046fc}.content .tasks .task-item .task-info .task-time .time-dot.green{background-color:#48a02e}.content .tasks .task-item .task-info .task-time .time-dot.orange{background-color:#efa333}.content .tasks .task-item .task-info .task-time .time-dot.purple{background-color:#735bf2}.content .tasks .task-item .task-info .task-time .time-past{font-size:.5rem}.content .tasks .task-item .task-info .task-text{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;font-size:.8rem;overflow:hidden;text-overflow:ellipsis}.content .tasks .task-item .task-info .task-text.month-text{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.content .tasks .task-item .arrows{align-items:center;display:flex;justify-content:flex-end}.content .tasks .task-item .arrows .bi{font-size:.75rem}.content .tasks .task-item .arrows .animation{opacity:0;-webkit-transform:translateX(-40px);transform:translateX(-40px)}.content .tasks .task-item .arrows .animation:first-child{transition:all .5s}.content .tasks .task-item .arrows .animation:nth-child(2){transition:all .25s}.content .tasks .task-item:hover .arrows .animation{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}.form-area{background-color:rgba(0,0,0,.3);border-radius:1rem;display:grid;height:100%;left:0;opacity:0;place-items:center;pointer-events:none;position:absolute;top:0;transition:all .25s;width:100%;z-index:99}.form-area.visible{opacity:1;pointer-events:visible}.form-area.visible .form{-webkit-transform:scale(1);transform:scale(1)}.form-area .form{background-color:#fff;border-radius:1rem;display:flex;flex-direction:column;gap:.75rem;max-width:450px;padding:1.5rem;position:relative;-webkit-transform:scale(.25);transform:scale(.25);transition:all .25s;width:100%}.form-area .form .form-header{align-items:flex-start;display:flex;justify-content:space-between}.form-area .form .form-header .form-title{color:#1b222b;font-size:1.5rem;font-weight:600;margin-bottom:.5rem;padding-bottom:.5rem;position:relative;width:-webkit-max-content;width:max-content}.form-area .form .form-header .form-title:before{background-color:#16d899;border-radius:.5rem;bottom:0;content:"";height:4px;left:0;position:absolute;width:100%}.form-area .form .form-header .popup-buttons{align-items:center;display:flex;gap:.5rem}.form-area .form .form-header .popup-buttons .popup-btn{align-items:center;background-color:#eff3f8;border:1px solid #dfe5f0;border-radius:.5rem;color:#7c828c;display:flex;font-size:.8rem;gap:.25rem;outline:none;padding:.5rem}.form-area .form .form-header .popup-buttons .popup-btn.red{background-color:#fce9e5;border:1px solid #f19c87;color:#e12a02}.form-area .form .input-box{display:flex;flex-direction:column;gap:.25rem;width:100%}.form-area .form .input-box .form-info{align-items:center;background-color:#eff3f8;border:1px solid #dfe5f0;border-radius:.5rem;color:#7c828c;display:flex;font-size:.9rem;gap:.5rem;padding:.75rem 1rem}.form-area .form .input-box label{color:#1b222b;font-size:1rem;font-weight:500}.form-area .form .input-box .input{border:1px solid #dfe5f0;border-radius:.5rem;color:#1b222b;font-size:1rem;outline:none;padding:.75rem 1rem;width:100%}.form-area .form .input-box .input::-webkit-input-placeholder{color:#a2a6b7}.form-area .form .input-box .input::placeholder{color:#a2a6b7}.form-area .form .input-box .input.text-input{height:100px;resize:none}.form-area .form .input-box .color-buttons{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;height:100%;justify-content:flex-start}.form-area .form .input-box .color-buttons .color-btn{border:1px dotted transparent;border-radius:50%;display:grid;height:28px;place-items:center;width:28px}.form-area .form .input-box .color-buttons .color-btn.active.red{border-color:#e12a02}.form-area .form .input-box .color-buttons .color-btn.active.blue{border-color:#2046fc}.form-area .form .input-box .color-buttons .color-btn.active.green{border-color:#48a02e}.form-area .form .input-box .color-buttons .color-btn.active.orange{border-color:#efa333}.form-area .form .input-box .color-buttons .color-btn.active.purple{border-color:#735bf2}.form-area .form .input-box .color-buttons .color-btn label{border-radius:50%;cursor:pointer;height:22px;width:22px}.form-area .form .input-box .color-buttons .color-btn label.red{background-color:#e12a02}.form-area .form .input-box .color-buttons .color-btn label.blue{background-color:#2046fc}.form-area .form .input-box .color-buttons .color-btn label.green{background-color:#48a02e}.form-area .form .input-box .color-buttons .color-btn label.orange{background-color:#efa333}.form-area .form .input-box .color-buttons .color-btn label.purple{background-color:#735bf2}.form-area .form .input-box .radio-input{display:none}.form-area .form .input-box .status-labels{grid-gap:.5rem;align-items:center;display:grid;gap:.5rem;grid-template-columns:repeat(2,1fr)}.form-area .form .input-box .status-labels .status-label{align-items:flex-start;border:1px solid #dfe5f0;border-radius:.5rem;color:#1b222b;cursor:pointer;display:flex;flex-direction:column;font-size:.7rem;font-weight:400;padding:.75rem 1rem;transition:all .25s}.form-area .form .input-box .status-labels .status-label .label-detail{color:#a2a6b7;font-size:.5rem}.form-area .form .input-box .status-labels input:checked+.status-label{border-color:#16d899}.form-area .form .submit-btn{background-color:#16d899;border-radius:.5rem;color:#fff;cursor:pointer;padding:.75rem .5rem;transition:all .25s}.form-area .form .submit-btn:hover{-webkit-transform:scale(1.02);transform:scale(1.02)}.form-area .form .submit-btn:active{-webkit-transform:scale(.8);transform:scale(.8)}
/*# sourceMappingURL=main.3f3744d7.css.map*/