*{box-sizing:border-box;margin:0;padding:0}body{font-family:Work Sans,sans-serif;background-color:#fbfbfb;color:#213f7d99;line-height:1.5}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:0;font-weight:500;color:#213f7d}label{display:block;font-size:14px;color:#545f7d;margin-bottom:4px;font-weight:500}button{border-radius:6px;cursor:pointer;font-weight:500}input,select{width:100%;padding:14px 10px;margin-bottom:12px;border:1px solid #dcdcdc;border-radius:8px;font-size:14px;background:#fff;color:#333;outline:none;transition:border-color .2s}input:focus,select:focus{border-color:#39cdcc;box-shadow:0 0 0 2px #39cdcc33}.app-header{display:flex;flex-wrap:wrap;height:90px;gap:12px;justify-content:space-between;align-items:center;padding:20px 32px;background-color:#fff;box-shadow:0 2px 4px #0000000d;position:sticky;top:0;z-index:20}@media (max-width: 768px){.app-header{height:180px}}.app-header .hamburger{display:none;font-size:1.51rem;background:none;border:none}@media (max-width: 768px){.app-header .hamburger{display:block}}.app-header .logo{width:150px}@media (max-width: 768px){.app-header .logo{width:90px}}.app-header__search-container{display:flex;flex-grow:1;max-width:400px;height:45px;border-radius:8px;overflow:hidden;border:1px solid #d3d9e5}.app-header__search-input{flex-grow:1;padding:12px 16px;border:none;margin-top:10px;font-size:14px;color:#213f7d}.app-header__search-input::placeholder{color:#213f7d99}.app-header__search-input:focus{outline:none;box-shadow:none}.app-header__search-button{padding:12px;width:60px;background-color:#39cdcc;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease-in-out}.app-header__nav-items{display:flex;align-items:center;gap:20px}.app-header__nav-link{font-size:14px;color:#213f7d;font-weight:500;transition:color .2s ease-in-out}.app-header__nav-link:hover{color:#39cdcc}.app-header__notification-icon{width:24px;height:24px;color:#213f7d99;cursor:pointer;transition:color .2s ease-in-out}.app-header__notification-icon:hover{color:#213f7d}.app-header__profile{display:flex;align-items:center;gap:8px;cursor:pointer}.app-header__avatar{width:40px;height:40px;border-radius:9999px;object-fit:cover;border:2px solid #39cdcc}.app-header__username{font-size:16px;font-weight:600;color:#213f7d}.app-header__dropdown-arrow{width:16px;height:16px;color:#213f7d99}.sidebar{width:283px;position:fixed;top:90px;left:0;height:calc(100vh - 90px);overflow-y:auto;background-color:#fff;box-shadow:2px 0 8px #0000000d;display:flex;flex-direction:column;gap:8px;font-size:14px;transform:translate(0);transition:none}.sidebar__item{display:flex;align-items:center;gap:12px;padding:10px 16px;font-weight:500;color:#213f7d99;cursor:pointer}.sidebar__item:hover{background:#f6fafa}.sidebar__item.active{background:#f3fcfc;color:#1a73e8;border-left:4px solid #39cdcc}.sidebar__item.active .sidebar__label{font-weight:600}.sidebar__group{margin-top:16px}.sidebar__group-title{font-size:12px;color:#213f7d;margin:0 0 6px 16px;text-transform:uppercase}.sidebar .close-btn{display:none}.sidebar .logout-icon-container{display:flex;gap:20px;margin-left:28px;margin-top:24px;margin-bottom:32px;cursor:pointer}@media (max-width: 768px){.sidebar{top:0;height:100vh;z-index:100;transform:translate(-100%);transition:transform .3s ease-in-out}.sidebar.open{transform:translate(0);transition:transform .3s ease-in-out}.sidebar .close-btn{display:block;margin-top:16px;margin-left:16px}}.user-page{display:flex;flex-direction:column;padding:24px;gap:40px}.user-page h5{font-size:24px}.reset-btn-container{display:flex;justify-content:end;margin-bottom:12px}.reset-btn-container .reset-btn{width:60px}.user-table-container{position:relative;overflow-x:auto;overflow-y:hidden;background:#fff;border-radius:8px;padding:12px}.user-table-container table{width:100%;border-collapse:collapse;font-size:14px}.user-table-container table thead{background-color:#fff}.user-table-container table thead th{text-align:left;padding:20px;color:#545f7d;font-weight:600;font-size:12px;position:relative;cursor:pointer}.user-table-container table thead th svg{margin-left:4px;vertical-align:middle}.user-table-container table thead .header-filter{display:flex;align-items:center;gap:8px}.user-table-container table tbody tr{border-top:1px solid #f0f0f0}.user-table-container table tbody tr td{padding:12px;color:#545f7d;font-size:14px;font-weight:400}.user-table-container table tbody tr:hover{background-color:#f5f8fa}.user-table-container .filter-popup{position:absolute;top:60px;z-index:20;background:#fff;box-shadow:0 8px 24px #959da533;padding:24px;border-radius:8px;min-width:280px;height:500px;overflow-y:auto}.user-table-container .filter-popup .fields{margin-bottom:8px}.user-table-container .filter-popup .filter-actions{display:flex;justify-content:space-between;margin-top:4px;gap:28px;padding-bottom:24px}.user-table-container .filter-popup button{width:100%}.badge{padding:4px 8px;border-radius:12px;font-size:14px;font-weight:400;text-transform:capitalize}.badge--active{background:#ebf8f4;color:#39cd62}.badge--inactive{background:#f2f2f2;color:#545f7d}.badge--pending{background:#fff9e6;color:#e9b200}.badge--blacklisted{background:#fff9e6;color:#e4033b}.menu-cell{position:relative}.menu-cell .menu-btn{background:none;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center}.menu-cell .menu-dropdown{position:absolute;top:100%;right:0;background:#fff;border:1px solid #eee;box-shadow:0 4px 6px #0000001a;border-radius:4px;width:180px;padding:8px 0;z-index:10}.menu-cell .menu-dropdown .menu-item{width:100%;display:flex;align-items:center;gap:8px;padding:8px 12px;border:none;background:transparent;cursor:pointer;font-size:14px;color:#213f7d}.menu-cell .menu-dropdown .menu-item:hover{background:#f5f5f5}.pagination-container{display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding:16px 0;border-top:1px solid #d3d9e5}.pagination-container .pagination-info{display:flex;align-items:center;gap:8px;font-size:14px;color:#213f7d}.pagination-container .pagination-info span{color:#545f7d}.pagination-container .pagination-info .items-per-page-select{width:28%;padding:4px 8px;border:1px solid #d3d9e5;border-radius:4px;background:#213f7d1a;font-size:14px;color:#213f7d;outline:none;cursor:pointer}.pagination-container .pagination-info .items-per-page-select:focus{border-color:#39cdcc}.pagination-container .pagination-controls{display:flex;align-items:center;gap:4px}.pagination-container .pagination-controls .pagination-arrow{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid #d3d9e5;background:#213f7d1a;border-radius:4px;cursor:pointer;transition:all .2s ease;color:#213f7d}.pagination-container .pagination-controls .pagination-arrow:hover:not(:disabled){background:#fbfbfb;border-color:#39cdcc}.pagination-container .pagination-controls .pagination-arrow:disabled{opacity:.5;cursor:not-allowed;background:#f9f9f9}.pagination-container .pagination-controls .pagination-number{display:flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 8px;border:1px solid #d3d9e5;background:#fff;border-radius:4px;cursor:pointer;transition:all .2s ease;font-size:14px;color:#545f7d;font-weight:400}.pagination-container .pagination-controls .pagination-number:hover:not(:disabled):not(.active){background:#f5f5f5;border-color:#39cdcc}.pagination-container .pagination-controls .pagination-number.active{background:#39cdcc;border-color:#39cdcc;color:#fff;font-weight:500}.pagination-container .pagination-controls .pagination-number.ellipsis{border:none;background:transparent;cursor:default}.pagination-container .pagination-controls .pagination-number.ellipsis:hover{background:transparent;border:none}.pagination-container .pagination-controls .pagination-number:disabled{cursor:not-allowed;background:transparent;border:none}.card{display:flex;flex-direction:column;background:#fff;border-radius:8px;box-shadow:0 2px 8px #0000000d;padding:28px;gap:.5rem;flex:1;min-width:200px}.card__icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center}.card__title{text-transform:uppercase;font-size:14px;color:#545f7d;font-weight:500;margin:0}.card__value{font-size:24px;font-weight:600;color:#213f7d;margin:0}.card--purple .card__icon{background:#df18ff1a;color:#df18ff}.card--blue .card__icon{background:#5718ff1a;color:#5718ff}.card--orange .card__icon{background:#f55f441a;color:#f55f44}.card--red .card__icon{background:#ff33661a;color:#f36}.loginContainer{font-family:Nunito Sans,sans-serif;display:flex;width:100%;min-height:100vh;background-color:#fff;box-shadow:0 4px 10px #0000000d}@media (max-width: 768px){.loginContainer{flex-direction:column;justify-content:flex-start;min-height:100vh}}.loginContainer .illustrationSection{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:24px;background:linear-gradient(to right,#fff,#fdfdfd 60%)}.loginContainer .illustrationSection .logo{width:180px;margin-bottom:64px}.loginContainer .illustrationSection .illustrationImage{max-width:80%;height:auto}@media (max-width: 768px){.loginContainer .illustrationSection{display:none}}.loginContainer .formSection{flex:1;display:flex;flex-direction:column;justify-content:center;background-color:#fff}@media (max-width: 768px){.loginContainer .formSection{width:100%;justify-content:center}}.loginContainer .formSection .section-content{padding:60px}.loginContainer .formSection .welcomeHeading{font-size:40px;font-weight:700;color:#213f7d;margin-bottom:8px;line-height:1}@media (max-width: 768px){.loginContainer .formSection .welcomeHeading{font-size:48px}}.loginContainer .formSection .enterDetailsText{font-size:20px;color:#213f7d99;margin-bottom:64px;font-weight:400}@media (max-width: 768px){.loginContainer .formSection .enterDetailsText{font-size:16px;margin-bottom:32px}}.loginContainer .formSection .loginForm{width:100%;max-width:400px}@media (max-width: 768px){.loginContainer .formSection .loginForm{max-width:100%}}.loginContainer .formSection .loginForm .inputGroup{position:relative;margin-bottom:24px}.loginContainer .formSection .loginForm .inputGroup input{padding-right:64px}.loginContainer .formSection .loginForm .inputGroup .showHideToggle{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#39cdcc;font-size:14px;font-weight:600;cursor:pointer;text-transform:uppercase}.loginContainer .formSection .loginForm .forgotPasswordLink{display:block;margin-top:8px;margin-bottom:32px;color:#39cdcc;text-decoration:none;font-weight:600;font-size:14px;text-transform:uppercase}.loginContainer .formSection .loginForm .forgotPasswordLink:hover{text-decoration:underline}.loginContainer .formSection .loginForm .loginButton{padding:12px;font-size:16px;width:100%;text-transform:uppercase}.user-page{color:#545f7d;padding:24px}.user-page .btn-back{border-radius:none;outline:none;border:none;background:none;color:#213f7d;cursor:pointer}.user-page .header{display:flex;justify-content:space-between;align-items:center;font-size:24px;margin-bottom:16px}@media (max-width: 912px){.user-page .header{font-size:14px}}@media (max-width: 768px){.user-page .header{flex-direction:column;font-size:16px;align-items:start;gap:24px}}.user-page .actions{display:flex;gap:8px}@media (max-width: 768px){.user-page .actions{flex-direction:column;gap:20px}}.user-page .actions .btn{border-radius:12px;width:200px;padding:16px;font-weight:768;cursor:pointer;text-transform:uppercase}@media (max-width: 1024px){.user-page .actions .btn{width:150px}}@media (max-width: 768px){.user-page .actions .btn{width:310px}}@media (max-width: 480px){.user-page .actions .btn{width:290px}}.user-page .actions .btn.danger{border:1px solid red;color:red;background:#fff}.user-page .actions .btn.success{border:1px solid #39cd62;color:green;background:#fff}.profile-card{background:#fff;padding:24px;border-radius:8px;box-shadow:0 1px 3px #0000001a;margin-bottom:24px}.profile-card .user-summary{display:flex;flex-wrap:wrap;justify-content:space-between;margin-bottom:16px;gap:8px}@media (max-width: 768px){.profile-card .user-summary{flex-direction:column;align-items:start}}.profile-card .user-summary .avatar{width:80px;height:80px;background:#f5f6fa;border-radius:50%;display:flex;align-items:center;justify-content:center}.profile-card .user-summary .info h3{margin:0;font-size:20px}@media (max-width: 768px){.profile-card .user-summary .info h3{font-size:14px}}.profile-card .user-summary .info p{margin:4px 0}@media (max-width: 768px){.profile-card .user-summary .info p{font-size:14px}}@media (max-width: 768px){.profile-card .user-summary .info{display:flex;width:100%;justify-content:space-between;align-items:center}}.profile-card .user-summary .tier{text-align:center;font-size:14px}@media (max-width: 768px){.profile-card .user-summary .tier{display:flex;width:100%;justify-content:space-between;align-items:center}}.profile-card .user-summary .balance{width:50%}.profile-card .user-summary .balance h4{font-size:20px;color:#213f7d}@media (max-width: 768px){.profile-card .user-summary .balance h4{font-size:14px}}@media (max-width: 768px){.profile-card .user-summary .balance p{font-size:12px}}@media (max-width: 768px){.profile-card .user-summary .balance{display:flex;justify-content:space-between;width:100%;align-items:center}}.placeholder{background:#fff;padding:24px;border-radius:8px;box-shadow:0 1px 3px #0000001a}.user-details{background-color:#fff;padding:24px}.user-details .user-details-sections .details-section{margin-bottom:32px;border-bottom:1px solid #eff1f5;padding-bottom:32px}.user-details .user-details-sections .details-section h3{font-size:16px;font-weight:500;margin-bottom:32px;color:#213f7d}.user-details .user-details-sections .details-section .details-grid{display:flex;flex-wrap:wrap;gap:32px}.user-details .user-details-sections .details-section .details-grid .details-item{width:30%}@media (max-width: 1024px){.user-details .user-details-sections .details-section .details-grid .details-item{width:25%}}@media (max-width: 768px){.user-details .user-details-sections .details-section .details-grid .details-item{display:flex;justify-content:space-between;align-items:center;width:100%}}.user-details .user-details-sections .details-section .details-grid .details-item .label{font-size:12px;color:#545f7d;text-transform:uppercase;font-weight:400;white-space:normal;overflow-wrap:break-word;word-break:break-word}@media (max-width: 768px){.user-details .user-details-sections .details-section .details-grid .details-item .label{font-size:14px}}.user-details .user-details-sections .details-section .details-grid .details-item .value{font-size:16px;color:#213f7d;font-weight:500;white-space:normal;overflow-wrap:break-word;word-break:break-word}@media (max-width: 768px){.user-details .user-details-sections .details-section .details-grid .details-item .value{font-size:14px}}.user-tabs{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding-bottom:4px}.user-tabs .tab{padding:8px 16px;border:none;background:none;cursor:pointer;color:#545f7d;font-size:14px;font-weight:500}.user-tabs .tab.active{color:#39cdcc;border-bottom:2px solid #39cdcc;font-weight:600}.page-slide-enter,.page-slide-exit{position:absolute;width:100%;top:0;left:0}.page-slide-enter{opacity:0;transform:translate(50px)}.page-slide-enter-active{opacity:1;transform:translate(0);transition:opacity .8s ease-out,transform .8s ease-out}.page-slide-exit{opacity:1;transform:translate(0)}.page-slide-exit-active{opacity:0;transform:translate(-50px);transition:opacity .8s ease-out,transform .8s ease-out}.page-content-wrapper{position:relative;width:100%;height:auto;overflow:visible}.page-content-wrapper>div{position:relative}.main-layout{display:flex;flex-direction:column;min-height:100vh}.main-layout .main-content{display:flex;margin-left:283px}@media (max-width: 768px){.main-layout .main-content{margin-left:0}}.main-layout .page-content{flex:1;padding:24px;transition:opacity .3s;position:relative;overflow-x:hidden}@media (max-width: 768px){.main-layout .page-content.overlay-active{opacity:.4;pointer-events:none}}.card-container{display:flex;flex-wrap:wrap;gap:1rem}@media (max-width: 768px){.card-container{flex-direction:column}}.btn-outline{background-color:#fff;border:1px solid #213f7d;padding:12px}.teal-btn{background:#39cdcc;color:#fff;border:none;padding:12px}.teal-btn:hover{background:#2bbcbf}