.user-management{padding:7rem 0 2rem}.user-management *{box-sizing:border-box}.user-management .page-title{display:block;font-size:24px;margin-bottom:12px;width:100%}.user-management .tabs{width:240px}.user-management .tabs ul{list-style-type:none;padding:0}.user-management .tabs li{align-items:center;color:#283679;cursor:pointer;display:flex;font-weight:400;gap:.75rem;height:3rem;padding:10px 20px}.user-management .tabs .active{background:#eef2ff}.user-management .tabs-content{box-shadow:0 4px 8px 0 rgba(0,0,0,.1);flex-grow:1;padding:24px;width:50%}.user-management .tabs-content .tab-title{font-size:24px;width:100%}.user-management .required{color:red}.user-management .flex{display:flex;flex-wrap:nowrap}.user-management .flex-wrap{flex-wrap:wrap}.user-management .flex-gap{gap:20px}.user-management .title{font-size:36px;font-style:normal;font-weight:500;line-height:44px;width:100%}.user-management .label{display:block;font-size:14px;margin-bottom:4px}.user-management input{background:#fefefe;border:1px solid #eaecf0;border-radius:4px!important;box-sizing:border-box;height:44px;padding:0 12px;width:100%}.user-management input::-moz-placeholder{color:#667085;font-size:14px;line-height:20px}.user-management input::placeholder{color:#667085;font-size:14px;line-height:20px}.user-management .gap-12{gap:12px}.user-management .gap-24{gap:24px}.user-management .text-center{text-align:center}.user-management .text-right{text-align:right}.user-management .col-12{width:100%}.user-management .col-6{width:calc(50% - 10px)}.user-management h1,.user-management p{margin:0;padding:0}.user-management .submit-button{align-items:center;background:#283679;border:none;border-radius:4px;box-sizing:border-box;color:#fff;padding:12px 20px}.user-management .link{color:#0d6efd;cursor:pointer;text-decoration:underline}.user-management .input-group{position:relative}.user-management .input-group .icon{cursor:pointer;opacity:.5;position:absolute;right:10px;top:50%;transform:translateY(-50%);transition:.3s cubic-bezier(.075,.82,.165,1)}.user-management .input-group .icon:hover{opacity:1}.user-management .student-content{display:flex;flex-direction:column;gap:8px;margin:12px 0}.user-management .student-content__card{align-items:center;border:1px solid #eaecf0;border-radius:8px;display:flex;gap:1.5rem;padding:1rem}.user-management .student-content__card .student-content__order{display:flex;flex-direction:column;gap:8px;width:100%}.user-management .student-content__card .student-content__order .order-cancel{font-size:14px;font-weight:400}.user-management .student-content__card .student-content__order .order-cancel span{color:#1890ff;cursor:pointer}.user-management .student-content__card .student-content__info{display:flex;width:100%}.user-management .student-content__card .student-content__info .fee-info{display:flex;flex:3;flex-direction:column;gap:4px}.user-management .student-content__card .student-content__info .fee-info__name{font-size:16px;line-height:24px}.user-management .student-content__card .student-content__info .fee-info__deadline{color:#475467;font-size:14px;font-weight:300;line-height:20px}.user-management .student-content__card .student-content__info .fee-info__deadline ul{padding:4px 0 0 24px}.user-management .student-content__card .student-content__info .fee-price{align-items:flex-end;display:flex;flex:1;flex-direction:column;justify-content:center}.user-management .student-content__card .student-content__info .fee-price__amount{font-weight:700}.user-management .student-content__card .review-info__fee{color:#475467;font-size:14px;font-weight:350;line-height:20px}.user-management .student-content__card .review-info__fee ul{padding:4px 0 0 24px}.user-management .student-content__button{display:flex;justify-content:flex-end;margin:12px 0}.user-management .student-content__button button{background:#283679;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:6px 24px}.user-management .student-content__line{background-color:gray;height:1px;margin:16px 0}.user-management .student-content .summary-footer{display:flex;flex-direction:column;gap:1rem}.user-management .student-content .summary-footer__content{display:flex;justify-content:space-between}.user-management .student-content .summary-footer__content .amount{font-weight:700}.user-management .student-content .payment-method{display:flex;flex-direction:column;gap:1rem}.user-management .student-content .payment-method__description .title{font-size:24px;font-weight:500}.user-management .student-content .payment-method__card{border:1px solid #eaecf0;border-radius:8px;padding:1rem}.user-management .student-content .payment-method__card .content-input{display:flex;gap:1rem;margin-bottom:.5rem}.user-management .student-content .payment-method__card .content-image{margin-left:24px}.user-management .student-content .payment-term{display:flex;flex-direction:column;gap:.5rem}.user-management .student-content .payment-term__title{font-size:24px;font-weight:500}.user-management .student-content .payment-term__confirm{align-items:center;display:flex;gap:.75rem}.user-management .student-content .btn-confirm{display:flex;gap:1rem}.user-management .student-content .btn-confirm .pay-now{background:#283679;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:6px 24px}.user-management .student-content .btn-confirm .pay-later{background:#fff;border:1px solid #283679;border-radius:4px;color:#283679;cursor:pointer;padding:6px 24px}.user-management .form-change-password{display:flex;flex-direction:column;gap:1rem;width:50%}@media screen and (max-width:767px){.user-management .react-section{box-shadow:none;padding:20px}.user-management .col-6{width:100%}.user-management .flex{display:block}.user-management .tabs{width:100%}.user-management .tabs ul{display:flex;font-size:14px}.user-management .tabs li{cursor:pointer;display:flex;flex-grow:1;gap:.25rem;height:2rem;justify-content:center;padding:8px 0}.user-management .tabs .active{background:#eef2ff}.user-management .tabs-content{box-shadow:0 4px 8px 0 rgba(0,0,0,.1);padding:24px;width:100%}.user-management .tabs-content .tab-title{font-size:24px;width:100%}.user-management .tabs-content .flex-gap{display:flex;flex-direction:column;gap:8px}.user-management .tabs-content .student-content .student-content__info{display:flex;flex-direction:column;gap:4px;width:100%}.user-management .tabs-content .student-content .student-content__info .fee-price{align-items:flex-start;display:flex;flex-direction:column}.user-management .tabs-content .student-content .student-content__info .fee-price__title{display:none}.user-management .tabs-content .student-content__button button{width:100%}.user-management .tabs-content .student-content .btn-confirm{display:flex;flex-direction:column;gap:1rem}.user-management .form-change-password,.user-management .submit-button,.user-management .tabs-content .student-content .btn-confirm button{width:100%}}.user-management .message-success{color:#06b906}.user-management .message-error{color:red}.user-management .text-bold{font-weight:700}.user-management .submit-button:disabled{background:#d3d3d3;cursor:not-allowed}.user-management .show-error{border-color:red!important;outline:none!important}.popup-overlay{align-items:center;background:rgba(0,0,0,.5);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0}.popup{background:#fff;border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.1);height:250px;text-align:center;width:500px}.popup .title-area{align-items:center;background-color:#283679;display:flex;justify-content:start;padding:20px;width:100%}.popup .title-area .title-popup{color:#fff}.popup .note-popup{border-bottom:1px solid #d3d3d3;padding:20px}.popup-buttons{align-items:center;-moz-column-gap:20px;column-gap:20px;display:flex;justify-content:end;margin-top:20px;padding:0 20px}.popup-buttons button{border:none;border-radius:5px;cursor:pointer;padding:10px 20px}.popup-buttons button:first-of-type{background-color:#ddd}.popup-buttons button:last-of-type{background-color:#283679;color:#fff}.done-payment{height:100vh;width:100%}.alert-area,.done-payment{align-items:center;display:flex;justify-content:center}.alert-area{box-shadow:0 4px 8px 0 rgba(0,0,0,.2);flex-direction:column;padding:100px 50px 40px;position:relative;row-gap:30px;width:900px}.alert-image{position:absolute;top:-100px}.alert-title{font-size:36px;font-weight:600}.alert-content{font-size:16px}.button-undo{background-color:#fff;border:2px solid #283679;border-radius:4px;color:#283679;padding:12px 20px}