:root{--main-background-color:#ffffff;--color-black:#333;--color-grey:#999999;--color-primary:#007aff;--color-secondary:#f2f2f7;--color-red:#ff0000;--color-orange:#ffa41b;--color-light-blue:#dcedff;--color-green:#1dd882;--color-light-yellow:#fff5d0}body,html{margin:0;padding:0;height:100%;width:100%;overscroll-behavior:none;overflow:hidden;overflow-y:auto;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:relative;background-color:var(--main-background-color)}body{overscroll-behavior-y:contain;padding-top:env(safe-area-inset-top);padding-right:env(safe-area-inset-right);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);font-family:"SF Pro Display",sans-serif}input,select,textarea{font-size:16px;-webkit-user-select:text;user-select:text}.background{position:fixed;left:0;top:0;right:0;z-index:1;height:30dvh;background-image:url(/asset-webview/hris/images/bg-hris.png);background-repeat:no-repeat;background-size:100% auto;background-position:top;border-bottom-left-radius:100px;border-bottom-right-radius:100px;overflow:hidden}.header{display:flex;padding:2.5rem 1rem 0 1rem;margin-bottom:16px;z-index:2;position:relative;margin-bottom:20px}.header .btn-link{outline:0;background:0 0;border:none;cursor:pointer;padding:0;text-decoration:none;transition:all .2s ease;display:flex;align-items:center;column-gap:8px;padding:0 4px;border-radius:4px}.header .btn-link span{font-weight:400;color:#333;font-size:17px;line-height:22px}.header .btn-link:active{background-color:rgba(255,164,27,.25)}.body{display:flex;flex-direction:column;margin:0;position:relative;z-index:2;padding:0 1.75rem}.body .tab-control-container{display:flex;align-items:center;gap:17px;padding-left:1.5rem;margin-bottom:23px}.body .tab-control-container .tab-control{position:relative;font-weight:600;font-size:17px;line-height:22px;letter-spacing:-.43px;color:var(--color-black);background:0 0;border:none;cursor:pointer;padding:0;font-size:inherit;font-family:inherit;text-decoration:none;transition:all .2s ease;width:auto;height:33px}.body .tab-control-container .tab-control.active::after{content:"";position:absolute;bottom:0;left:0;width:21px;height:6px;background-color:var(--color-black);border-radius:100px;bottom:0;left:50%;transform:translate(-50%,50%)}.body .tab-content-container{display:flex;width:100%}.body .tab-content-container .tab-content{display:none;width:100%}.body .tab-content-container .tab-content.active{display:block}.body .tab-content-container .tab-content .box{display:flex;flex-direction:column;width:100%;height:65dvh;background-color:#fff;border-radius:10px;padding:1.75rem 1.8rem;box-shadow:0 4px 10px 0 rgba(140,140,140,.25)}.body .tab-content-container .tab-content .box .box-title{font-weight:600;font-size:20px;line-height:25px;letter-spacing:-.45px;color:var(--color-black);margin-bottom:33px}.body .tab-content-container .tab-content .box .box-content{display:flex;flex-direction:column;gap:24px}.body .tab-content-container .tab-content .box .box-content .box-row{display:flex;flex-direction:column;gap:4px}.body .tab-content-container .tab-content .box .box-content .box-row .box-label{font-weight:400;font-size:17px;line-height:22px;letter-spacing:-.43px;color:var(--color-grey)}.body .tab-content-container .tab-content .box .box-content .box-row .box-value{font-weight:400;font-size:17px;line-height:22px;letter-spacing:-.43px;color:var(--color-black)}.body .tab-content-container .tab-content #box-dokumen.box .box-content{flex-grow:1;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;gap:4px}.body .tab-content-container .tab-content #box-dokumen.box .box-content .content-empty{font-weight:400;font-size:15px;line-height:22px;letter-spacing:-.43px}.body .tab-content-container .tab-content #box-dokumen.box .box-content .list-item{display:flex;align-items:center;width:100%;min-height:58px;box-shadow:0 4px 10px 0 rgba(195,195,195,.25);background-color:#fff;border-radius:8px;text-decoration:none;column-gap:18px}.body .tab-content-container .tab-content #box-dokumen.box .box-content .list-item .list-label{display:flex;flex-direction:column;row-gap:1px}.body .tab-content-container .tab-content #box-dokumen.box .box-content .list-item .list-label .list-title{font-weight:400;font-size:17px;line-height:22px;color:#333}.body .tab-content-container .tab-content #box-dokumen.box .box-content .list-item .action-image{margin-left:auto}.body .tab-content-container .tab-content #timeline-history.box .box-content{flex-grow:1;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;gap:0}.body .tab-content-container .tab-content #timeline-history.box .box-content .text-label{font-weight:590;font-size:20px;line-height:25px;letter-spacing:-.45px;color:var(--color-primary);margin-bottom:6px}.body .tab-content-container .tab-content #timeline-history.box .box-content .subtext-label{font-weight:400;font-size:17px;line-height:22px;letter-spacing:-.43px;color:var(--color-black)}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline{max-width:600px;margin-top:30px}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item{display:flex;gap:13px;position:relative;padding-bottom:65px}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item:not(:last-child)::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--color-grey);z-index:1;transform:translate(10px,16px)}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item.has-approved:not(:last-child)::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--color-green);z-index:1;transform:translate(10px,16px)}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item:last-child{padding-bottom:0}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item img{position:relative;height:20px;width:20px;z-index:2}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .icon-container.on-progress{height:20px;width:20px;border-radius:999px;background-color:var(--color-light-blue);border:1px solid var(--color-light-blue);display:flex;justify-content:center;align-items:center}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .icon-container.on-progress .icon-bullet{height:10px;width:10px;background-color:var(--color-primary);border-color:var(--color-primary);border-radius:999px}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .icon-container{height:20px;width:20px;display:flex;justify-content:center;align-items:center;border:1px solid var(--color-grey);border-radius:999px;background-color:var(--main-background-color);position:relative;z-index:2}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .item-content{flex:1;display:flex;flex-direction:column;gap:4px}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .item-content .item-title{font-weight:600;font-size:17px;line-height:22px;letter-spacing:-.43px;color:var(--color-black)}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .item-content .item-details{display:flex;gap:9px;align-items:center}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .item-content .item-details .detail-title{font-weight:400;font-size:12px;line-height:16px;letter-spacing:0;color:var(--color-grey)}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .item-content .item-details .badge{background-color:var(--color-light-yellow);border:1px solid var(--color-light-yellow);color:var(--color-orange);width:fit-content;height:24px;padding:0 4px;display:flex;justify-content:center;align-items:center;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0}.body .tab-content-container .tab-content #timeline-history.box .box-content .timeline .timeline-item .subitem-content{font-weight:400;font-size:12px;line-height:16px;letter-spacing:0;color:var(--color-grey)}.footer{position:absolute;width:100%;bottom:0;transform:translateY(-30%);display:flex;flex-direction:column;align-items:center;padding:0 1.75rem;gap:4px}.footer .btn-primary{display:flex;justify-content:center;align-items:center;width:100%;outline:0;background:0 0;border:none;cursor:pointer;text-decoration:none;transition:all .2s ease;background-color:var(--color-primary);color:var(--main-background-color);font-weight:400;font-size:17px;line-height:22px;letter-spacing:-.43px;padding:12px 0;border-radius:6px}.footer .btn-primary:active{background-color:#0058b5}.footer .btn-secondary{display:flex;justify-content:center;align-items:center;width:100%;outline:0;background:0 0;border:none;cursor:pointer;text-decoration:none;transition:all .2s ease;background-color:var(--color-secondary);color:var(--color-red);font-weight:400;font-size:17px;line-height:22px;letter-spacing:-.43px;padding:12px 0;border-radius:6px}.footer .btn-secondary:active{background-color:#e5e5ea}#form-offcanvas{border-radius:30px 30px 0 0;min-height:45dvh}#form-offcanvas h5{font-weight:600;font-size:20px;line-height:25px;letter-spacing:-.45px}#form-offcanvas .offcanvas-body{display:flex;flex-direction:column;row-gap:10px;overflow:hidden}#form-offcanvas .offcanvas-body .form-group{position:relative;height:100%;width:100%;display:flex}#form-offcanvas .offcanvas-body .form-group .form-control{border:1px solid #e5f2ff;background-color:#f4f9ff;border-radius:8px}#form-offcanvas .offcanvas-body .btn-primary{width:100%;height:46px;display:flex;justify-content:center;align-items:center;background-color:var(--color-orange);color:#333;border-radius:6px;border:1px solid var(--color-orange);margin-top:36px}#form-offcanvas .offcanvas-body .btn-primary:active{background-color:#cc7a00!important;border-color:#cc7a00!important}.alert-primary{background-color:rgba(255,164,27,1);border-color:rgba(255,164,27,1);position:fixed;transform:translateX(-25%);top:60px;left:30%;right:0;z-index:9999;border-radius:10px}