*{padding:0;margin:0;outline-color:#12395d}h1,h2{color:#12395d}.login-container{width:100%;max-width:400px;margin:0 auto}.login-container .login-content{background-color:#fff;border-radius:1rem;padding:3rem 2rem;text-align:center;box-shadow:0 10px 25px #00000040}.login-container .login-content .logo{width:120px;height:auto;margin-bottom:2rem;filter:brightness(0) saturate(100%) invert(20%) sepia(51%) saturate(1234%) hue-rotate(195deg) brightness(95%) contrast(90%)}.login-container .login-content h1{font-size:2rem;font-weight:700;color:#12395d;margin:0 0 .5rem}.login-container .login-content p{color:#6b7280;margin:0 0 2rem;font-size:1rem}.login-container .login-content .login-button{width:100%;background:linear-gradient(135deg,#12395d,#1d5c96);color:#fff;border:none;border-radius:.5rem;padding:1rem 1.5rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #12395d4d}.login-container .login-content .login-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #12395d66}.login-container .login-content .login-button:active{transform:translateY(0)}.input-container{margin-bottom:1.5rem}.input-container input{width:100%;padding:1rem;border:2px solid #e5e7eb;border-radius:.5rem;font-size:1rem;transition:border-color .2s}.input-container input:focus{outline:none;border-color:#12395d}.input-container input:disabled{background-color:#f9fafb;cursor:not-allowed}.input-container input::placeholder{color:#9ca3af}.submit-button{width:100%;background:linear-gradient(135deg,#12395d,#1d5c96);color:#fff;border:none;border-radius:.5rem;padding:1rem 1.5rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-bottom:1rem}.submit-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 15px #12395d4d}.submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.back-button{width:100%;background:transparent;color:#12395d;border:2px solid #12395d;border-radius:.5rem;padding:.75rem 1.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.back-button:hover:not(:disabled){background-color:#12395d;color:#fff}.back-button:disabled{opacity:.6;cursor:not-allowed}@media screen and (max-width: 480px){.login-container{padding:1rem}.login-container .login-content{padding:2rem 1.5rem}.login-container .login-content h1{font-size:1.5rem}.login-container .login-content .logo{width:100px}}.card{display:flex;justify-content:space-between;border-radius:8px;box-shadow:0 10px 25px #00000040;overflow:hidden;transition:box-shadow .3s ease;margin:10px;max-width:95%;width:40%}.card-no-style{box-shadow:none}.card h2,.card h3{color:#12395d}.card p{color:#1d5c96}.card-icon{display:flex;justify-content:left;align-items:center;font-size:2rem;margin-right:2rem}.card-content{flex:1}.card-content-title{display:flex;justify-content:space-between}.card-content-title h2{margin:0}.card-title{font-size:1.25rem;font-weight:700;margin-bottom:.5rem;text-align:left}.card-title-with-cta{display:flex;justify-content:space-between}.card-title-with-cta>button{height:50px;background-color:#1d5c96}.card-body{font-size:1rem;text-align:left}@media screen and (max-width: 768px){.card{width:90%;margin:15px}.card-title{font-size:1rem!important}.card-body{font-size:.8rem!important}.card-icon{font-size:1rem;margin-right:1rem}}.account-card{width:-webkit-fill-available;justify-items:center;flex-direction:row-reverse}.account-card .card-icon{font-size:1rem}.self-service-card{width:-webkit-fill-available}@media screen and (max-width: 768px){.self-service-card{margin:5px}.self-service-card.card{margin:0;margin-bottom:.5rem}}.recent-activity-card,.recent-activity-item-card,.cta-panel-card{width:100%}.recent-activity-list .card{width:-webkit-fill-available}.recent-activity-list>div{width:100%}.profile-info h2{margin:0;padding:0}.recent-activity-panel{justify-content:center;margin-bottom:.5rem}.recent-activity-panel .card{width:inherit}.card .recent-activity-item-card .card-no-style{margin:5px}@media screen and (max-width: 768px){.card .recent-activity-item-card .card-no-style.card.recent-activity-item-card.card-no-style{margin:0 0 2px}}.cta-button-holder{height:-webkit-fill-available;align-self:anchor-center}.cta-button-holder .cta-button{border-radius:8px;padding:20px;border:none}.layout-container{margin:0 auto;justify-content:center;min-height:100vh}.layout-container:not(:has(.login-container)){margin-bottom:.5rem}.layout-nav{display:flex;justify-content:space-between;align-items:center;background-color:#f3f4f6;border-bottom:1px solid #ddd;width:-webkit-fill-available}.layout-body{display:flex;justify-content:flex-start;min-height:calc(100vh - 150px)}.back-button{background:transparent;border:none;cursor:pointer;font-size:1.25rem;color:#12395d;transition:color .3s ease}.back-button:hover{color:#12395d}.keja-logo{display:flex;align-items:center}.keja-logo-title{font-weight:700;font-size:1.25rem;color:#12395d}.logo-image{width:50px;height:50px;margin-right:10px}.keja-profile{display:flex;align-items:center;margin-right:1rem}.profile-text{font-size:16px;color:#12395d;margin-left:.75rem}.toggle-sidebar-btn{background-color:#12395d;display:none;background-color:transparent;border:none;cursor:pointer;font-size:1.25rem;color:#12395d;margin-right:10px}.content{flex-grow:1;transition:margin-left .3s ease}.content.sidebar-closed{margin-left:60px}@media screen and (max-width: 768px){.content.sidebar-open,.content.sidebar-closed{margin-left:0}}main.content{width:100%;justify-items:center;min-height:inherit}main.content>div{width:100%;justify-items:center;min-height:inherit}.dashboard-container .cta-card-content .card{width:inherit}@media screen and (max-width: 768px){.dashboard-container{margin:.2rem;text-align:-webkit-center}}.support-container>:nth-child(2){width:inherit;padding:0!important}.support-ticket-tray{padding:0}.support-ticket-tray>:nth-child(1) h2.card-title{margin:5px}.summary-panel{width:inherit;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.summary-panel .card{width:inherit}@media screen and (max-width: 768px){.summary-panel{margin:0 auto;min-width:-webkit-fill-available;display:flex;flex-direction:column}.summary-panel .card{width:100%}}.summary-panel-content{display:flex;justify-content:space-between}.summary-panel-content h2{color:#fff;margin:0}.cta-panel{display:flex}.self-service-panel{display:flex;justify-content:space-around;width:inherit}@media screen and (max-width: 768px){.self-service-panel{flex-wrap:wrap}}.ssp-card-content{display:flex;flex-direction:column}.ssp-card-content .title{display:flex}.recent-activity-item{display:flex;justify-content:space-between;margin:1rem}.tenant-info ul{list-style:none;text-align:left}@media screen and (max-width: 768px){.cta-button{width:100%}.cta-button span{margin-right:.5rem}}@media screen and (max-width: 768px){.card.cta-panel-card.cta-card{display:grid;gap:1rem;grid-template-columns:repeat(6,1fr);grid-template-columns:repeat(1,1fr) 1fr;margin:2px 0 0}.card.cta-panel-card.cta-card>:nth-child(1){grid-column:1}.card.cta-panel-card.cta-card>:nth-child(2){grid-column:3/span 4}.card.cta-panel-card.cta-card>:last-child{grid-column:1/span 6}.recent-activity-card{margin:5px 0 0}aside{display:none}}.sidebar-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:999;display:none}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center}.modal{background-color:#fff;border-radius:10px;padding:30px;width:90%;max-width:400px;position:relative}@media screen and (max-width: 768px){.modal{padding:10px}}.modal-content h2{color:#12395d;font-size:1rem;text-align:left}.modal-content .input-container{margin-bottom:20px;text-align:left}.modal-content input{width:100%;padding:10px;border:1px solid #12395d;border-radius:5px;font-size:1rem;background-color:#12395d33;color:#12395d}@media screen and (max-width: 768px){.modal-content input{width:90%}}.modal-content button{color:#fff;background-color:#12395d}.modal span{color:#12395d}.close-button{position:absolute;top:10px;right:10px;background:none;border:none;font-size:1.5rem;cursor:pointer;color:#12395d}.login-container{min-height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(to bottom right,#1d5c96,#12395d);font-family:Arial,sans-serif}.login-container h1,.login-container h2{color:#fff}.login-container .submit-button{background:linear-gradient(to right,#1d5c96,#12395d);color:#fff;border:none;padding:12px 24px;font-size:1rem;font-weight:700;border-radius:8px;cursor:pointer;transition:opacity .3s ease;width:100%;margin:10px}@media screen and (max-width: 768px){.login-container .submit-button{width:90%}}.login-container .login-button{background-color:#fff;color:#12395d;border:none;padding:12px 24px;font-size:1rem;font-weight:700;border-radius:8px;cursor:pointer;transition:background-color .3s ease;margin-top:1rem}.login-container .login-content{text-align:center;color:#fff;background-color:#fff}.terms-body p{color:#1d5c96;text-align:left}.terms-body span{margin-bottom:2rem}@media screen and (max-width: 768px){.support-stats{flex-wrap:wrap}}.sidebar-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;z-index:40}@media screen and (max-width: 768px){.sidebar-overlay{display:block}}@media screen and (min-width: 769px){.sidebar-overlay{display:none}}.modern-sidebar{position:fixed;top:0;left:0;z-index:50;height:100vh;width:250px;background-color:#fff;border-right:1px solid #ddd;transform:translate(-100%);transition:transform .3s ease-in-out;box-shadow:0 4px 6px #0000001a}.modern-sidebar.open{transform:translate(0);display:block}@media screen and (min-width: 769px){.modern-sidebar{position:relative;transform:translate(0);z-index:auto}}.modern-sidebar .sidebar-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid #ddd}.modern-sidebar .sidebar-header .sidebar-brand{display:flex;align-items:center;gap:.75rem}.modern-sidebar .sidebar-header .sidebar-brand .brand-icon{display:flex;justify-content:center;align-items:center;width:2rem;height:2rem;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-radius:.5rem;color:#fff;font-size:.875rem}.modern-sidebar .sidebar-header .sidebar-brand .brand-text h3{font-size:.875rem;font-weight:600;color:#12395d;margin:0}.modern-sidebar .sidebar-header .sidebar-brand .brand-text p{font-size:.75rem;color:#6b7280;margin:0}.modern-sidebar .sidebar-header .sidebar-close-btn{background:none;border:none;cursor:pointer;padding:.25rem;border-radius:.375rem;color:#6b7280;transition:background-color .2s}.modern-sidebar .sidebar-header .sidebar-close-btn:hover{background-color:#f3f4f6}@media screen and (min-width: 769px){.modern-sidebar .sidebar-header .sidebar-close-btn{display:none}}.modern-sidebar .sidebar-nav{padding:1rem}.modern-sidebar .sidebar-nav .nav-section .nav-label{font-size:.75rem;font-weight:500;color:#6b7280;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem;margin-top:0}.modern-sidebar .sidebar-nav .nav-section .nav-item{width:100%;display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.375rem;font-size:.875rem;font-weight:500;background:none;border:none;cursor:pointer;transition:all .2s;color:#374151;margin-bottom:.25rem}.modern-sidebar .sidebar-nav .nav-section .nav-item:hover{background-color:#f3f4f6}.modern-sidebar .sidebar-nav .nav-section .nav-item.active{background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1d4ed8}.modern-sidebar .sidebar-nav .nav-section .nav-item.active .nav-icon{color:#1d4ed8}.modern-sidebar .sidebar-nav .nav-section .nav-item .nav-icon{font-size:.875rem;color:#6b7280;transition:color .2s}.modern-sidebar .sidebar-nav .nav-section .nav-item .nav-text{flex:1;text-align:left}.modern-sidebar .sidebar-footer{position:absolute;bottom:0;left:0;right:0;padding:1rem;border-top:1px solid #ddd}.modern-sidebar .sidebar-footer .profile-button{width:100%;display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:.375rem;font-size:.875rem;font-weight:500;background:none;border:none;cursor:pointer;transition:background-color .2s;color:#374151}.modern-sidebar .sidebar-footer .profile-button:hover{background-color:#f3f4f6}.modern-sidebar .sidebar-footer .profile-button .profile-avatar{display:flex;justify-content:center;align-items:center;width:2rem;height:2rem;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-radius:.5rem;color:#fff;font-size:.875rem}.modern-sidebar .sidebar-footer .profile-button .profile-info{text-align:left;flex:1}.modern-sidebar .sidebar-footer .profile-button .profile-info .profile-name{font-weight:500;margin:0}.modern-sidebar .sidebar-footer .profile-button .profile-info .profile-subtitle{font-size:.75rem;color:#6b7280;margin:0}.layout-container{min-height:100vh;background-color:#f3f4f6}.layout-container .layout-nav{display:flex;justify-content:space-between;align-items:center;background-color:#fff;border-bottom:1px solid #ddd;padding:.75rem 1rem}.layout-container .layout-nav .nav-left{display:flex;align-items:center;gap:1rem}.layout-container .layout-nav .nav-left .mobile-menu-btn{background:none;border:none;cursor:pointer;padding:.5rem;border-radius:.375rem;color:#6b7280;transition:background-color .2s}.layout-container .layout-nav .nav-left .mobile-menu-btn:hover{background-color:#f3f4f6}@media screen and (min-width: 769px){.layout-container .layout-nav .nav-left .mobile-menu-btn{display:none}}.layout-container .layout-nav .nav-left .back-button{background:none;border:none;cursor:pointer;padding:.5rem;border-radius:.375rem;color:#6b7280;transition:background-color .2s}.layout-container .layout-nav .nav-left .back-button:hover{background-color:#f3f4f6}.layout-container .layout-nav .nav-left .page-title{font-size:1.25rem;font-weight:600;color:#12395d;margin:0}.layout-container .layout-nav .profile-btn{background:none;border:none;cursor:pointer;padding:.5rem;border-radius:.375rem;color:#6b7280;transition:background-color .2s}.layout-container .layout-nav .profile-btn:hover{background-color:#f3f4f6}.layout-container .layout-body{display:flex}.layout-container .layout-body .main-content{flex:1}@media screen and (min-width: 769px){.layout-container .layout-body .main-content{margin-left:0}}.layout-container .layout-body .main-content .content-wrapper{padding:.5rem}.simple-layout{min-height:100vh;background:linear-gradient(135deg,#12395d,#1d5c96);display:flex;align-items:center;justify-content:center;padding:1rem}.payment-modal .modal-overlay{background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.payment-modal .modal-content{background:#fff;border-radius:12px;box-shadow:0 20px 40px #00000026;max-width:500px;width:90vw;max-height:90vh;overflow:hidden}@media (max-width: 768px){.payment-modal .modal-content{width:95vw;margin:20px}}.payment-modal-wrapper{display:flex;flex-direction:column;min-height:400px}.payment-modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px 24px 0;border-bottom:1px solid #e5e7eb;margin-bottom:24px}@media (max-width: 768px){.payment-modal-header{padding:20px 20px 0;margin-bottom:20px}}.payment-modal-title{font-size:1.5rem;font-weight:600;color:#1f2937;margin:0}@media (max-width: 768px){.payment-modal-title{font-size:1.25rem}}.payment-modal-close{background:transparent;border:none;color:#6b7280;cursor:pointer;padding:8px;border-radius:6px;transition:all .2s ease}.payment-modal-close:hover{background:#f3f4f6;color:#374151}.payment-modal-close:disabled{opacity:.5;cursor:not-allowed}.payment-modal-content{padding:0 24px 24px;flex:1}@media (max-width: 768px){.payment-modal-content{padding:0 20px 20px}}.payment-step{display:flex;flex-direction:column;gap:24px}@media (max-width: 768px){.payment-step{gap:20px}}.payment-details-card{background:linear-gradient(135deg,#f8fafc,#e2e8f0);border:1px solid #e2e8f0;border-radius:12px;padding:20px;border-left:4px solid #7db0de}.payment-details-header{display:flex;align-items:center;gap:8px;margin-bottom:16px}.payment-details-header h3{font-size:1.1rem;font-weight:600;color:#12395d;margin:0}.payment-details-header svg{color:#7db0de}.payment-details-content{display:flex;flex-direction:column;gap:12px}.payment-detail-row{display:flex;justify-content:space-between;align-items:center}.payment-detail-row .label{font-weight:500;color:#6b7280}.payment-detail-row .value{font-weight:600;color:#12395d}.payment-detail-row .value.amount{color:#059669;font-size:1.1rem}.phone-selection-section .section-header{display:flex;align-items:center;gap:8px;margin-bottom:16px}.phone-selection-section .section-header h4{font-size:1rem;font-weight:600;color:#1f2937;margin:0}.phone-selection-section .section-header svg{color:#6b7280}.phone-options{display:flex;flex-direction:column;gap:12px}.phone-option{background:#fff;border:2px solid #e5e7eb;border-radius:12px;padding:16px;cursor:pointer;transition:all .3s ease;text-align:left;width:100%}.phone-option:hover{border-color:#3b82f6;background:#f8fafc;transform:translateY(-1px);box-shadow:0 4px 12px #3b82f626}.phone-option.selected{border-color:#3b82f6;background:#eff6ff;box-shadow:0 4px 12px #3b82f633}.phone-option:disabled{opacity:.6;cursor:not-allowed;transform:none}.phone-option-content .phone-option-title{font-weight:600;color:#1f2937;margin-bottom:4px}.phone-option-content .phone-option-subtitle{font-size:.875rem;color:#6b7280}.phone-input-container{margin-top:8px}.phone-input-container .phone-input{width:100%;padding:12px 16px;border:2px solid #e5e7eb;border-radius:8px;font-size:1rem;transition:border-color .2s ease}.phone-input-container .phone-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.phone-input-container .input-help{margin-top:8px;font-size:.75rem;color:#6b7280}.error-message{display:flex;align-items:center;gap:8px;background:#fef2f2;border:1px solid #fecaca;color:#dc2626;padding:12px 16px;border-radius:8px;font-size:.875rem}.error-message svg{flex-shrink:0}.payment-actions{display:flex;flex-direction:column;gap:12px}.payment-actions button{width:fit-content}@media (min-width: 768px){.payment-actions{flex-direction:row;justify-content:space-between}}.pay-button{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;border:none;padding:14px 24px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #3b82f64d}.pay-button:hover:not(:disabled){background:linear-gradient(135deg,#1d4ed8,#1e40af);transform:translateY(-2px);box-shadow:0 6px 16px #3b82f666}.pay-button:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}@media (min-width: 768px){.pay-button{flex:1;margin-right:12px}}.cancel-button{background:transparent;color:#6b7280;border:2px solid #e5e7eb;padding:14px 24px;border-radius:8px;font-size:1rem;cursor:pointer;transition:all .3s ease}.cancel-button:hover{border-color:#6b7280;color:#374151;background:#f9fafb}@media (min-width: 768px){.cancel-button{flex:0 0 auto;min-width:120px}}.processing-step,.verification-step,.success-step,.failed-step{text-align:center;padding:40px 20px}@media (max-width: 768px){.processing-step,.verification-step,.success-step,.failed-step{padding:30px 15px}}.processing-step h3,.verification-step h3,.success-step h3,.failed-step h3{font-size:1.5rem;font-weight:600;color:#1f2937;margin:16px 0 8px}@media (max-width: 768px){.processing-step h3,.verification-step h3,.success-step h3,.failed-step h3{font-size:1.25rem}}.processing-step .step-message,.verification-step .step-message,.success-step .step-message,.failed-step .step-message{color:#6b7280;font-size:1rem;line-height:1.5;margin-bottom:24px}.step-icon{margin-bottom:16px}.step-icon .spinner{color:#3b82f6;animation:spin 1s linear infinite}.step-icon.success svg{color:#059669;animation:successPulse .6s ease-out}.step-icon.failed svg{color:#dc2626}.verification-instructions{background:#f9fafb;border-radius:12px;padding:24px;text-align:left;margin-top:24px}.verification-instructions h4{font-size:1rem;font-weight:600;color:#1f2937;margin:0 0 16px}.instruction-list{list-style:none;padding:0;margin:0 0 24px}.instruction-list li{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px;font-size:.875rem;color:#374151;line-height:1.4}.instruction-list li:last-child{margin-bottom:0}.step-number{background:#dbeafe;color:#1d4ed8;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;flex-shrink:0;margin-top:2px}.payment-summary{border-top:1px solid #e5e7eb;padding-top:16px;margin-top:16px}.payment-summary .summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:.875rem}.payment-summary .summary-row:last-child{margin-bottom:0}.payment-summary .summary-row span:first-child{font-weight:500;color:#6b7280}.payment-summary .summary-row span:last-child{font-weight:600;color:#1f2937}.auto-close-message{margin-top:16px;font-size:.875rem;color:#6b7280}.failed-actions{display:flex;flex-direction:column;gap:12px;margin-top:24px}@media (min-width: 768px){.failed-actions{flex-direction:row;justify-content:center}}.retry-button{background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #3b82f64d}.retry-button:hover{background:linear-gradient(135deg,#1d4ed8,#1e40af);transform:translateY(-2px);box-shadow:0 6px 16px #3b82f666}@media (min-width: 768px){.retry-button{margin-right:12px}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes successPulse{0%{transform:scale(.8);opacity:.5}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@media (max-width: 640px){.payment-modal .modal-content{width:100vw;height:100vh;max-height:100vh;border-radius:0;margin:0}.payment-modal-header{padding:16px;margin-bottom:16px}.payment-modal-content{padding:0 16px 16px}.payment-step{gap:16px}.payment-details-card,.verification-instructions{padding:16px}}.card.payment-new-number{width:auto;border:1px solid #e2e8f0;border-radius:12px;padding:20px}
