@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;700&display=swap";:root{--t-pageBg: linear-gradient(145deg, #eef4ff 0%, #e8f0fe 45%, #f0f6ff 100%);--t-headerBg: rgba(238,244,255,.9);--t-headerBorder: rgba(30,64,175,.1);--t-cardBg: rgba(255,255,255,.78);--t-cardBgHover: rgba(255,255,255,.98);--t-cardBorder: rgba(30,64,175,.1);--t-cardBorderHover: rgba(37,99,235,.32);--t-dropdownBg: rgba(255,255,255,.98);--t-dropdownBorder: rgba(30,64,175,.12);--t-textPrimary: #0f172a;--t-textSecondary: #334155;--t-textMuted: #64748b;--t-textDimmed: #94a3b8;--t-inputBg: rgba(255,255,255,.88);--t-inputBgFocus: #ffffff;--t-inputBorder: rgba(30,64,175,.15);--t-inputBorderFocus: rgba(37,99,235,.5);--t-inputText: #0f172a;--t-inputPlaceholder: rgba(100,116,139,.55);--t-filterBg: rgba(255,255,255,.65);--t-filterBorder: rgba(30,64,175,.12);--t-filterText: #64748b;--t-filterActiveBg: rgba(37,99,235,.1);--t-filterActiveBorder: rgba(37,99,235,.45);--t-filterActiveText: #1d4ed8;--t-accent: #2563eb;--t-accentGlow: rgba(37,99,235,.25);--t-accentSoft: rgba(37,99,235,.1);--t-green: #059669;--t-greenGlow: rgba(5,150,105,.6);--t-greenSoft: rgba(5,150,105,.08);--t-greenBorder: rgba(5,150,105,.2);--t-amber: #b45309;--t-amberSoft: rgba(180,83,9,.08);--t-amberBorder: rgba(180,83,9,.2);--t-divider: rgba(30,64,175,.08);--t-dividerAlt: rgba(30,64,175,.1);--t-blob1: rgba(37,99,235,.07);--t-blob2: rgba(99,102,241,.06);--t-scrollTrack: #e8f0fe;--t-scrollThumb: #93c5fd;--t-toggleBg: rgba(30,64,175,.07);--t-toggleBorder: rgba(30,64,175,.14);--t-toggleText: #475569;--t-statLabel: #64748b;--t-profileBg: rgba(37,99,235,.07);--t-profileBorder: rgba(37,99,235,.15);--t-profileText: #1e3a8a;--t-cardShadow: 0 2px 12px rgba(30,64,175,.07);--t-cardShadowHover: 0 18px 40px rgba(30,64,175,.15), 0 0 0 1px rgba(37,99,235,.12);--t-resetBg: rgba(37,99,235,.08);--t-resetBorder: rgba(37,99,235,.25);--t-resetText: #1d4ed8;--t-heroShimmer: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.6) 50%, transparent 65%)}body.dark-theme,.dark-theme,html.dark-theme{--t-pageBg: linear-gradient(145deg, #070d1a 0%, #0d1627 45%, #0f172a 100%);--t-headerBg: rgba(7,13,26,.88);--t-headerBorder: rgba(255,255,255,.07);--t-cardBg: rgba(255,255,255,.045);--t-cardBgHover: rgba(255,255,255,.09);--t-cardBorder: rgba(255,255,255,.08);--t-cardBorderHover: rgba(255,255,255,.22);--t-dropdownBg: rgba(10,15,30,.98);--t-dropdownBorder: rgba(255,255,255,.1);--t-textPrimary: #f1f5f9;--t-textSecondary: #94a3b8;--t-textMuted: #475569;--t-textDimmed: #64748b;--t-inputBg: rgba(255,255,255,.07);--t-inputBgFocus: rgba(255,255,255,.09);--t-inputBorder: rgba(255,255,255,.1);--t-inputBorderFocus: rgba(59,130,246,.5);--t-inputText: #e2e8f0;--t-inputPlaceholder: rgba(148,163,184,.45);--t-filterBg: rgba(255,255,255,.04);--t-filterBorder: rgba(255,255,255,.08);--t-filterText: #64748b;--t-filterActiveBg: rgba(59,130,246,.18);--t-filterActiveBorder: rgba(59,130,246,.5);--t-filterActiveText: #60a5fa;--t-accent: #3b82f6;--t-accentGlow: rgba(59,130,246,.4);--t-accentSoft: rgba(59,130,246,.15);--t-green: #34d399;--t-greenGlow: rgba(52,211,153,.8);--t-greenSoft: rgba(52,211,153,.1);--t-greenBorder: rgba(52,211,153,.25);--t-amber: #fbbf24;--t-amberSoft: rgba(251,191,36,.25);--t-amberBorder: rgba(251,191,36,.3);--t-divider: rgba(255,255,255,.06);--t-dividerAlt: rgba(255,255,255,.07);--t-blob1: rgba(59,130,246,.12);--t-blob2: rgba(99,102,241,.1);--t-scrollTrack: #0a0f1e;--t-scrollThumb: #1e3a5f;--t-toggleBg: rgba(255,255,255,.07);--t-toggleBorder: rgba(255,255,255,.12);--t-toggleText: #94a3b8;--t-statLabel: #475569;--t-profileBg: rgba(255,255,255,.06);--t-profileBorder: rgba(255,255,255,.1);--t-profileText: #cbd5e1;--t-cardShadow: 0 4px 16px rgba(0,0,0,.18);--t-cardShadowHover: 0 24px 48px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.1);--t-resetBg: rgba(59,130,246,.15);--t-resetBorder: rgba(59,130,246,.3);--t-resetText: #60a5fa;--t-heroShimmer: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.05) 50%, transparent 65%)}.react-dashboard{font-family:Outfit,sans-serif!important;color:var(--t-textPrimary)!important;background:var(--t-pageBg);min-height:100vh;transition:background .45s ease;width:100vw;overflow-x:hidden;margin:0;padding:0}.react-dashboard ::-webkit-scrollbar{width:6px}.react-dashboard ::-webkit-scrollbar-track{background:var(--t-scrollTrack)}.react-dashboard ::-webkit-scrollbar-thumb{background:var(--t-scrollThumb);border-radius:3px}@keyframes shimmerPass{0%{background-position:-200% center}to{background-position:200% center}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseDot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.5)}}@keyframes cardIn{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.card-in{animation:cardIn .48s cubic-bezier(.23,1,.32,1) both}.react-dashboard input::placeholder{color:var(--t-inputPlaceholder)!important;opacity:1!important}.react-dashboard input:focus{outline:none!important}.pfbtn:hover{background:var(--t-filterBg)!important}.catbtn:hover{filter:brightness(1.07)}.profile-dropdown-btn:hover{background:var(--t-profileBg)!important}.search-input-field:focus{border-color:var(--t-inputBorderFocus)!important;background:var(--t-inputBgFocus)!important;box-shadow:0 0 0 3px var(--t-accentSoft)!important}vaadin-app-layout::part(drawer){display:none!important}vaadin-app-layout::part(navbar){display:none!important}vaadin-app-layout{--vaadin-app-layout-navbar-offset-size: 0px !important}[theme~="mis2.0fe"]{--lumo-space-m: 0px;--lumo-space-l: 0px}html,body{margin:0!important;padding:0!important;height:100%}vaadin-app-layout{background:linear-gradient(135deg,#667eea,#764ba2)!important;background-attachment:fixed}.enhanced-main-content{background:linear-gradient(135deg,#667eea,#764ba2)!important;min-height:100vh;height:100%;padding:20px;padding-top:0!important;background-attachment:fixed;margin:0!important}.enhanced-header{background:#fffffff2!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 20px 40px #0000001a!important;margin-bottom:0!important;padding:30px!important;height:70px}.logo-enhanced{width:60px;height:60px;border-radius:15px;box-shadow:0 8px 25px #00000026}.header-title-enhanced{background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:30px;font-weight:600;margin:0!important}.user-menu-enhanced{background:linear-gradient(135deg,#667eea,#764ba2)!important;border-radius:50px!important;color:#fff!important;padding:2px 16px!important}.search-container{background:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:50px;padding:5px 25px;box-shadow:0 10px 30px #0000001a;margin:30px auto;width:300px;max-width:90%;height:30px}.filter-buttons{display:flex;justify-content:center;gap:15px;margin-bottom:30px;flex-wrap:wrap}.filter-btn-inactive{background:#fff3!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3)!important;color:#fff!important;border-radius:25px!important;font-weight:600;transition:all .3s ease}.filter-btn-inactive:hover{background:#fffffff2!important;color:#667eea!important;transform:translateY(-2px);box-shadow:0 10px 25px #0000001a}.filter-btn-active{background:#fff!important;color:#667eea!important;border:1px solid rgba(255,255,255,.3)!important;border-radius:25px!important;font-weight:600;box-shadow:0 4px 15px #0000001a!important;transition:all .3s ease}.main-title-enhanced{text-align:center;color:#fff;font-size:2.2rem;font-weight:600;margin-bottom:40px;text-shadow:0 2px 20px rgba(0,0,0,.3)}.services-grid-enhanced{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:25px;margin-bottom:40px;width:100%;justify-content:center;align-items:stretch}.app-card-enhanced{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:30px;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;box-shadow:0 10px 30px #0000001a;border:1px solid rgba(255,255,255,.2);position:relative;overflow:hidden;width:100%;box-sizing:border-box;min-width:280px;max-width:100%;min-height:250px;height:100%;display:flex;flex-direction:column;justify-content:flex-start}.app-card-enhanced:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;border-radius:20px 20px 0 0;transition:all .3s ease}.app-card-enhanced:hover:before{height:8px;box-shadow:0 0 15px #0003}.app-card-enhanced:hover{transform:translateY(-8px);box-shadow:0 20px 50px #00000026}.app-icon-enhanced{width:70px;height:70px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:28px;color:#fff;margin-bottom:20px;box-shadow:0 8px 25px #00000026}.app-title-enhanced{font-size:1.4rem;font-weight:700;color:#2d3748;margin-bottom:12px;line-height:1.3}.app-description-enhanced{color:#64748b;font-size:.95rem;line-height:1.5;margin-bottom:10px;flex-grow:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;text-overflow:ellipsis}.status-active{background:#22c55e1a;color:#22c55e;padding:6px 12px;border-radius:20px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.service-gradient-eparlimen:before{background:linear-gradient(135deg,#667eea,#764ba2)}.service-gradient-spln:before{background:linear-gradient(135deg,#f093fb,#f5576c)}.service-gradient-meja-bantuan:before{background:linear-gradient(135deg,#4facfe,#00f2fe)}.service-gradient-e-tempah:before{background:linear-gradient(135deg,#43e97b,#38f9d7)}.service-gradient-pinict:before{background:linear-gradient(135deg,#fa709a,#fee140)}.service-gradient-e-psikologi:before{background:linear-gradient(135deg,#ff416c,#ff4b2b)}.service-gradient-kehadiran:before{background:linear-gradient(135deg,#ffecd2,#fcb69f)}.service-gradient-sppp:before{background:linear-gradient(135deg,#a18cd1,#fbc2eb)}.service-gradient-pelekat-kenderaan:before{background:linear-gradient(135deg,#fad0c4,#ffd1ff)}.service-gradient-pas-keselamatan:before{background:linear-gradient(135deg,#ff9a9e,#fecfef)}.service-gradient-e-jemputan:before{background:linear-gradient(135deg,#11998e,#38ef7d)}.service-gradient-e-undian:before{background:linear-gradient(135deg,#00c6ff,#0072ff)}.service-gradient-default:before{background:linear-gradient(135deg,#84fab0,#8fd3f4)}@media (max-width: 768px){.services-grid-enhanced{grid-template-columns:1fr;gap:20px}.filter-buttons{justify-content:flex-start;overflow-x:auto;padding-bottom:10px}.main-title-enhanced{font-size:1.8rem}}.logo-container{display:flex;align-items:center;flex-grow:0;flex-shrink:0;margin-right:auto;padding-left:16px}.logo{flex-grow:0;flex-shrink:0;max-height:70px;width:auto;object-fit:contain;padding:3px}.header{color:#012970}.button-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:2rem;justify-content:center}.button-content{display:flex;flex-direction:column;align-items:left;justify-content:left;text-align:left;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;width:100%;height:100%;margin:30px 10px 30px 30px}.app-button{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;white-space:normal;word-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;box-shadow:0 2px 5px #0000001a;border-radius:8px;padding:.5rem;height:150px;width:100%;transition:transform .3s ease,box-shadow .3s ease,background-color .3s ease;background:linear-gradient(135deg,var(--lumo-primary-color) 0%,var(--lumo-primary-color-50pct) 100%);background-color:var(--lumo-primary-color);color:var(--lumo-primary-contrast-color)}.app-button:hover{transform:scale(.95);box-shadow:0 4px 8px #0003;background-color:#0056b3;background:linear-gradient(135deg,var(--lumo-primary-color-50pct) 0%,var(--lumo-primary-color) 100%)}.app-title{font-size:24px;font-weight:500;margin-bottom:.5rem}.app-description{font-size:12px;color:#f5f5f5}@media (max-width: 599px){.button-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 600px) and (max-width: 959px){.button-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 960px){.button-grid{grid-template-columns:repeat(5,1fr)}}.standard-font{color:#012970}.standard-font-white{color:#fff}.white-background::part(input-field){height:20px;background-color:#fff}.card-offline{position:relative;cursor:not-allowed!important;background-color:#f8f9fa}.card-offline:hover{transform:none!important;box-shadow:var(--lumo-box-shadow-xs)!important}.card-offline .app-icon-enhanced,.card-offline .app-title-enhanced,.card-offline .app-description-enhanced{opacity:.5;filter:grayscale(100%)}.coming-soon-badge{position:absolute;top:10px;right:10px;background-color:#ffd900;color:#000;font-size:.7rem;font-weight:700;padding:4px 10px;border-radius:4px;z-index:20;opacity:1!important;box-shadow:0 2px 4px #0003;pointer-events:none}.landing-page-background{background-image:url(./landing-page-bg-DP_h3F8G.png);background-size:cover;background-position:center;background-repeat:no-repeat;padding-top:100px}.image-container{display:flex;justify-content:center;align-items:center;height:100%}.transparent-header{background-color:transparent;position:fixed;top:0;left:0;width:100%;z-index:1000;display:flex;justify-content:start;align-items:center;padding:10px;height:70px;transition:background-color .3s ease,padding .3s ease}.transparent-header.scrolled{background-color:#fff;box-shadow:0 0 18px #0000001a}.page-header-horizontal-layout{padding:var(--lumo-space-xl);width:100%;display:flex;justify-content:flex-start;align-items:center!important}.landing-page-title-logo{flex-grow:0;flex-shrink:0;max-height:60px;width:auto;object-fit:contain;padding:3px}.landing-page-title{color:#012970;margin:0;font-size:30px;font-weight:700;font-family:Nunito,sans-serif}@keyframes slideUp{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:slideUp .6s ease-out forwards}@keyframes zoomIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.zoom-in-wrapper{animation:zoomIn .8s ease-in-out}@keyframes floatAnimation{0%{transform:translateY(0)}50%{transform:translateY(-20px)}to{transform:translateY(0)}}.floating-image{animation:floatAnimation 3s ease-in-out infinite;max-width:100%;height:auto}.sso-main-layout{display:flex;width:100%;height:100%;padding:var(--lumo-space-m);gap:var(--lumo-space-m)}.sso-left-layout{width:50%;padding:var(--lumo-space-xl);display:flex;font-size:17px;font-family:Nunito,sans-serif;color:#6c6a6a;flex-direction:column;align-items:flex-start;gap:var(--lumo-space-m)}.sso-right-layout{width:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.landing-page-subtitle{color:#012970;margin:0;font-size:40px;font-weight:700;line-height:56px}.justify-text{text-align:justify}.login-button{background-color:#4154f1;color:#fff;font-weight:400;font-size:18px;line-height:1.35;width:170px;height:50px;display:flex;align-items:center;justify-content:center;gap:8px;transition:background-color .3s ease}.login-button:hover{background-color:#003f84}.login-button:hover .arrow-icon{transform:translate(6px);transition:transform .3s ease}.classic-floating-button{position:fixed;bottom:80px;right:40px;background-color:#ffd900;color:#000;border-radius:30px;box-shadow:0 4px 6px #0003;font-weight:600;z-index:100;cursor:pointer;border:none;transition:all .3s ease}.classic-floating-button:hover{transform:translateY(-3px);box-shadow:0 8px 15px #0000004d;background-color:#e6c300}@media (max-width: 600px){.classic-floating-button{bottom:20px;right:20px;font-size:14px;padding:10px 20px}}.page-footer{background-color:#fff;padding:50px 16px;text-align:center;font-size:14px;color:#444}.footer-policies{margin-bottom:4px}.footer-department{white-space:pre-line}.contact-content-layout{max-width:800px;margin:50px auto;padding:40px;background:#fffffff2;border-radius:10px;box-shadow:0 4px 6px #0000001a}.contact-title{color:#005fdb;text-align:center;margin-bottom:20px}.contact-intro{text-align:center;font-size:1.1rem;margin-bottom:40px;color:#333}.contact-section{background:#f8f9fa;padding:30px;border-radius:8px;text-align:center;flex:1}.contact-icon{width:48px;height:48px;color:#005fdb;margin-bottom:15px}.contact-section-title{color:#005fdb;margin-bottom:15px}.contact-email{font-size:1.2rem;color:#005fdb;text-decoration:none;font-weight:500}.contact-email:hover{text-decoration:underline}.contact-person{margin:20px 0}.contact-name{font-weight:600;color:#333;margin-bottom:5px}.contact-phone{font-size:1.1rem;color:#005fdb;text-decoration:none}.contact-phone:hover{text-decoration:underline}.back-button{margin-top:30px;background-color:#005fdb;color:#fff;padding:12px 30px;border-radius:5px;cursor:pointer}.back-button:hover{background-color:#0047a8}@media (max-width: 768px){.contact-sections-horizontal{flex-direction:column}}