.header{background-color:#00384d;padding:20px 120px;color:white;border-bottom:1px solid rgb(127,127,127);position:sticky;top:0;z-index:3000;transition:all .3s ease-in-out;width:100%}.menu-container{position:relative;display:inline-block;margin-left:-5px}.menu-popup{position:absolute;top:140%;right:0;background-color:white;border-radius:8px;box-shadow:0 4px 10px rgba(0,0,0,.15);z-index:999;min-width:160px;animation:fadeIn .2s ease-in-out}.popup-arrow{position:absolute;top:-8px;right:10px;width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:8px solid #fff;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}.menu-item{display:flex;padding:10px 15px;font-size:14px;gap:10px;color:#333;text-decoration:none;cursor:pointer;transition:background-color .2s}.menu-item:hover{background-color:#f2f2f2;border-radius:6px}.menu-icon{margin-top:4px}.menu-item.logout{color:red}.loading-container{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:9999}.box,.loading-container{display:flex;justify-content:center;align-items:center}.box{width:120px;height:120px;background-color:rgb(255,255,255);flex-direction:column;border-radius:10px;padding:20px}.circular-left-right{animation:fanRotate45 1.5s ease-in-out infinite;transform-origin:center}@keyframes fanRotate45{0%{transform:rotate(-45deg)}50%{transform:rotate(45deg)}to{transform:rotate(-45deg)}}.header-container{justify-content:space-between}.header-container,.logo{display:flex;align-items:center}.logo{gap:8px}.logo-img{width:130px;height:auto}.nav,.nav ul{display:flex;align-items:center}.nav ul{list-style:none;gap:20px;margin:0;padding:0}.nav ul li a{color:white;font-size:16px}.nav ul li a,.nav ul li a:hover{text-decoration:none}.login-btn-1{background:transparent;border:1px solid white;padding:6px 14px;border-radius:8px;font-size:15px}.hamburger,.login-btn-1{color:white;cursor:pointer}.hamburger{font-size:28px;background:none;border:none;margin-left:1px}.hamburger,.jszzy{display:none}.manage{display:flex}@media (max-width:780px){.header{padding:20px 17px}.desktop-nav{display:none}.hamburger{display:block;margin-left:6px}.mobile-nav{display:block;width:100%;background:#00384d;margin-top:0;overflow:hidden;max-height:0;opacity:0;pointer-events:none;transition:max-height .4s ease,opacity .3s ease}.mobile-nav.open{max-height:600px;opacity:1;pointer-events:auto}.mobile-nav ul{flex-direction:column;gap:15px;align-items:flex-start;margin-top:20px}.mobile-nav ul li{width:100%}.dropbtn,.login-btn-1,.mobile-nav ul li a{display:block;width:100%;text-align:left}.mobile-nav .dropdown-content{position:relative;box-shadow:none;border-radius:0;margin-top:50px}}.mobile-actions{display:none;align-items:center;gap:8px;color:white}.mobile-actions a{color:white;text-decoration:none;font-size:15px}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:9999}.loading-box,.loading-overlay{display:flex;justify-content:center;align-items:center}.loading-box{width:auto;height:auto;background:#ebebeb;flex-direction:column}.spinner{width:30px;height:30px;border:2px solid rgba(0,0,0,.1);border-top:6px solid #000000;border-radius:50%;animation:spin 1s linear infinite}.loading-text{margin-top:15px;font-size:1.2rem;color:#333;font-weight:600}@media (max-width:780px){.mobile-actions{display:flex}}@media (min-width:781px){.mobile-nav{display:none!important}}.dropdown-alt{position:relative;display:inline-block}.dropdown-btn{background-color:transparent;color:rgb(255,255,255);border:none;border-radius:6px;cursor:pointer;font-size:14px;display:flex;align-items:center;gap:6px;margin-top:3px}.arrow{font-size:12px}.dropdown-menu{position:absolute;top:110%;font-size:13px;left:0;background-color:white;border:1px solid #ccc;box-shadow:0 4px 8px rgba(0,0,0,.1);z-index:20}.dropdown-option{padding:15px;cursor:pointer;color:black;transition:background .2s}.dropdown-option:hover{background-color:#f0f0f0}.table-wrapper{max-height:400px;overflow-x:auto}.transaction-table{width:100%;border-collapse:collapse;font-size:15px}.transaction-table td,.transaction-table th{padding:8px 10px;border-bottom:1px solid #e0e0e0;text-align:left}.transaction-table th{background:#f7f7f7;font-weight:600}.credit,.debit{font-weight:500}.pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:15px}.pagination button{padding:5px 12px;cursor:pointer;background-color:rgb(231,231,231);border-radius:30px}.transactions-list{display:flex;flex-direction:column;gap:10px}.transaction-item{display:flex;justify-content:space-between;align-items:center;background:#fafafa;border:1px solid #ececec;border-radius:10px;padding:10px 14px}.transaction-info{display:flex;flex-direction:column}.tx-title{font-size:14px;font-weight:500;color:#333;margin:0}.tx-date{font-size:12px;color:#777}.tx-amount{font-size:14px}.tx-amount.credit{color:#000000}.tx-amount.debit{color:#e74c3c}.transactions-list{max-height:335px;overflow-y:auto;padding-right:6px}.transactions-list::-webkit-scrollbar{width:5px}.transactions-list::-webkit-scrollbar-thumb{background:#cfcfcf;border-radius:4px}.transactions-list{scrollbar-width:thin;scrollbar-color:#cfcfcf transparent}.modal-overlayer{background:rgba(0,0,0,.45);z-index:999}.modal-boxes{background:#de2525;padding:18px;display:flex;flex-direction:column}.animate-modal{animation:modalPop .35s ease}@keyframes modalPop{0%{transform:scale(.85) translateY(20px);opacity:0}to{transform:scale(1) translateY(0);opacity:1}}.modal-title{margin-bottom:12px;color:black;text-align:center;font-weight:700}.transaction-list{flex:1;overflow-y:auto;padding-right:6px}.fade-in{animation:fadeInList .4s ease}@keyframes fadeInList{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.transaction-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid #eee;font-size:13px}.tx-date{color:black}.tx-amount{font-weight:600}.credit{color:green}.debit{color:red}.refund{color:rgb(32,111,221)}.wallet-loader{flex:1}.modal-actionses{margin-top:10px;text-align:center}.transaction-list::-webkit-scrollbar{width:6px}.transaction-list::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px}.transaction-list::-webkit-scrollbar-thumb:hover{background:#aaa}.transaction-list{scrollbar-width:thin;scrollbar-color:#ccc transparent}.modal-overlayer{position:fixed;inset:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;opacity:0;animation:fadeIn .3s ease forwards;z-index:1000}.modal-boxess{width:auto;min-width:700px;max-width:750px}.modal-boxes,.modal-boxess{background:#fff;padding:20px 24px;border-radius:10px;text-align:left;transform:scale(.9);animation:scaleIn .3s ease forwards}.modal-boxes{width:360px}.modal-rows{width:100%;margin-bottom:12px}.modal-labels{display:block;font-size:13px;font-weight:600;color:#222;margin-bottom:6px}.modal-input-fields{width:100%;padding:10px 12px;border-radius:6px;border:1.5px solid #d7d7d7;outline:#007aff;font-size:14px;outline:none;color:black}.modal-input-field:focus{border-color:#007aff}.modal-actionses{margin-top:18px;display:flex;justify-content:flex-end;gap:12px}.btns{padding:8px 18px;cursor:pointer;background:#ebebeb;color:black;border:1px solid rgb(207,207,207);border-radius:8px;font-size:13px;font-weight:500}.btns:hover{background-color:rgb(219,219,219)}.btns.dangers{background:linear-gradient(135deg,#4a90e2,#007aff);border:1px solid #007aff;color:white}.btns.dangers:hover{background:linear-gradient(135deg,#007aff,#0056b3)}.btns:disabled{opacity:.6;cursor:not-allowed}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.9)}to{transform:scale(1)}}.wallet-btn{padding:6px 14px;color:white;border:none;border-radius:6px;font-size:14px;transition:.3s;transition:background .9s ease,transform .2s ease}.topup-btn,.wallet-btn{background:linear-gradient(135deg,#4a90e2,#007aff);cursor:pointer}.topup-btn:hover,.wallet-btn:hover{background:linear-gradient(135deg,#007aff,#0056b3);transform:scale(1.03)}.wallet-dropdown{position:absolute;top:80%;right:100px;min-width:220px;max-width:90vw;background:#fff;font-family:Jost,sans-serif;border-radius:8px;box-shadow:0 6px 14px rgba(0,0,0,.15);animation:dropdownFadeIn .2s ease-in-out;overflow:hidden}.wallet-dropdown h2{padding:8px 12px;font-size:15px;font-weight:600;color:#333;margin:0}.wallet-balance-container{padding:0 12px;display:flex;gap:3px}.wallet-balance{background:#fafafa;margin:6px 0;border-radius:6px;border:1px solid #ececec;padding:8px 10px;display:flex;align-items:center;gap:8px}.wallet-icon{font-size:20px;color:#007aff;flex-shrink:0}.wallet-info{display:flex;flex-direction:column;justify-content:center}.wallet-info p{margin:0;font-size:12px;color:#555}.wallet-info h3{margin:2px 0 0;font-size:15px;font-weight:600;color:#007aff}.wallet-balance.credit .wallet-icon,.wallet-balance.credit h3{color:#e67e22}.wallet-loader{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px 0;text-align:center;color:#444}.spinner-w{width:35px;height:35px;border:4px solid #ddd;border-top-color:#007bff;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:10px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.error-text{text-align:center;color:red;font-weight:500;padding:10px 0}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}