@import "https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Poppins:wght@400;500;600;700&display=swap";*{box-sizing:border-box;margin:0;padding:0}a{text-decoration:none}li{list-style:none}:root{--poppins:"Poppins", sans-serif;--lato:"Lato", sans-serif;--light:#f9f9f9;--blue:#3c91e6;--light-blue:#cfe8ff;--grey:#eee;--dark-grey:#aaa;--dark:#342e37;--red:#db504a;--yellow:#ffce26;--light-yellow:#fff2c6;--orange:#fd7238;--light-orange:#ffe0d3}html{overflow-x:hidden}body.dark{--light:#0c0c1e;--grey:#060714;--dark:#fbfbfb}body{background:#f5f7fb;overflow-x:hidden}.logo{align-items:center;gap:10px;display:flex}.logo img{height:12vh}nav a{color:#333;margin:0 15px;font-weight:500;text-decoration:none}.hero{background-image:url(./background-ClSKpv9i.png);background-position:bottom;background-repeat:no-repeat;background-size:100vw;justify-content:space-between;align-items:center;padding:0;display:flex}.hero-left{width:50%;margin-left:40px}.hero-left h1{color:#3f51b5;margin-bottom:20px;font-size:48px}.hero-left p{color:#333;margin-bottom:25px;font-size:18px;line-height:1.6}.hero-left img{height:8vh}.hero-right{justify-content:center;width:45%;display:flex}.hero-right img{object-fit:cover;width:100%}@media (width<=520px){.navbar{gap:8px;padding:10px 12px}.logo img{height:42px}.navbar-actions{gap:6px;min-width:0}.navbar nav a{margin:0 0 0 6px;font-size:12px}.hero{background-position:bottom;background-size:auto 100%;flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:22px;min-height:auto;padding:26px 28px 0;overflow:hidden}.hero-left{width:100%;margin-left:0}.hero-left h1{margin-bottom:16px;font-size:34px;line-height:1.12}.hero-left p{max-width:100%;margin-bottom:20px;font-size:15px;line-height:1.55}.hero-right{aspect-ratio:16/10;justify-content:center;width:calc(100% + 96px);margin:0 -48px;overflow:hidden}.hero-right img{object-fit:cover;object-position:center;width:100%;height:100%;max-height:none;margin:0;display:block;transform:translate(-13%)}.decor img,.hero-left img{height:42px}}@media (width<=380px){.logo img{height:36px}.navbar nav a{margin-left:5px;font-size:11px}.hero{padding:22px 22px 0}.hero-left h1{font-size:30px}.hero-left p{font-size:14px}.hero-right img{width:156%;max-height:none;transform:translate(-4%)}.hero-right{width:calc(100% + 76px);margin:0 -38px}}.navbar{background:#f8faff;border-bottom:3px solid #3f51b5;justify-content:space-between;align-items:center;padding:20px 60px;display:flex;box-shadow:0 8px 24px #3f51b52e,0 0 26px #3f51b538}.logo{flex-shrink:0;align-items:center;gap:10px;display:flex}.logo img{width:auto;height:9vh;max-height:72px}.navbar-actions{align-items:center;gap:18px;display:flex}.navbar nav{align-items:center;display:flex}.navbar nav a{color:#333;white-space:nowrap;margin:0 15px;font-weight:500;text-decoration:none}.navbar .navbar-login{color:#fff;background:#3f51b5;border-radius:999px;justify-content:center;align-items:center;min-width:72px;height:40px;padding:0 18px;font-weight:700;text-decoration:none;display:flex;box-shadow:0 8px 18px #3f51b53d}.navbar .navbar-login:hover{background:#334296}.btn-primary{color:#fff;cursor:pointer;background:#3f51b5;border:none;border-radius:25px;padding:10px 20px;font-weight:600;text-decoration:none;display:inline-block}@media (width<=768px){.navbar{padding:14px 24px}.logo img{height:64px}.navbar-actions{gap:12px}.navbar nav a{margin:0 8px;font-size:15px}}@media (width<=520px){.navbar{gap:8px;padding:10px 12px}.logo img{height:42px}.navbar-actions{flex:1;justify-content:flex-end;gap:6px;min-width:0}.navbar nav{flex-wrap:wrap;justify-content:flex-end;row-gap:4px}.navbar nav a{margin:0 0 0 6px;font-size:12px}.navbar .navbar-login{min-width:58px;height:34px;padding:0 12px;font-size:12px}}@media (width<=380px){.navbar{padding:10px}.logo img{height:36px}.navbar-actions{align-items:flex-end;gap:5px}.navbar nav a{margin-left:5px;font-size:11px}}.site-footer{color:#f8fafc;background:#18233f;padding:54px 64px 22px}.footer-container{grid-template-columns:minmax(240px,.9fr) 1.6fr;gap:56px;max-width:1180px;margin:0 auto;display:grid}.footer-brand img{background:#fff;border-radius:12px;width:280px;height:auto;margin-bottom:18px;padding:12px 16px;box-shadow:0 12px 24px #0000002e}.footer-brand p{color:#cbd5e1;max-width:390px;line-height:1.7;font-family:var(--lato)}.footer-socials{gap:10px;margin-top:22px;display:flex}.footer-socials span{color:#fff;text-transform:uppercase;background:#ffffff14;border:1px solid #ffffff2e;border-radius:50%;place-items:center;width:38px;height:38px;font-size:13px;font-weight:700;display:grid}.footer-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;display:grid}.footer-column h3{color:#fff;font-size:17px;font-family:var(--poppins);margin-bottom:16px}.footer-column a{color:#cbd5e1;font-family:var(--lato);margin-bottom:11px;line-height:1.45;transition:color .2s,transform .2s;display:block}.footer-column a:hover{color:#9bd8ff;transform:translate(3px)}.footer-bottom{color:#94a3b8;max-width:1180px;font-size:14px;font-family:var(--lato);border-top:1px solid #ffffff1f;justify-content:space-between;gap:20px;margin:40px auto 0;padding-top:22px;display:flex}@media (width<=900px){.site-footer{padding:44px 28px 22px}.footer-container{grid-template-columns:1fr;gap:36px}.footer-links{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-bottom{flex-direction:column}}@media (width<=560px){.site-footer{padding:38px 20px 22px}.footer-brand img{width:min(240px,100%);margin-bottom:16px;padding:10px 14px}.footer-links{grid-template-columns:1fr}}.layanan{background-image:url(./background-ClSKpv9i.png);background-position:bottom;background-repeat:no-repeat;background-size:cover;min-height:calc(100vh - 90px);padding:54px 60px 70px}.layanan-header{max-width:760px;margin-bottom:34px}.layanan-header span{color:#3f51b5;font-size:15px;font-weight:700}.layanan-header h1{color:#3f51b5;margin:10px 0 14px;font-size:42px}.layanan-header p{color:#333;font-size:18px;line-height:1.6}.layanan-container{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;display:grid}.layanan-card{background:#fff;border:1px solid #e6e9f5;border-radius:18px;padding:26px;transition:all .3s;box-shadow:0 10px 24px #3f51b514}.layanan-card:hover{transform:translateY(-8px);box-shadow:0 16px 32px #3f51b524}.layanan-icon{background:#e9edfb;border-radius:16px;justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:18px;display:flex}.layanan-icon i{color:#3f51b5;font-size:28px}.layanan-card h3{color:#3f51b5;margin-bottom:10px;font-size:20px}.layanan-card p{color:#333;font-size:15px;line-height:1.6}@media screen and (width<=1000px){.layanan-container{grid-template-columns:repeat(2,minmax(0,1fr))}}@media screen and (width<=620px){.layanan{padding:34px 22px 50px}.layanan-header h1{font-size:32px}.layanan-container{grid-template-columns:1fr}}.panduan{background-image:url(./background-ClSKpv9i.png);background-position:bottom;background-repeat:no-repeat;background-size:cover;min-height:calc(100vh - 90px);padding:54px 60px 70px}.panduan-header{max-width:760px;margin-bottom:34px}.panduan-header span{color:#3f51b5;font-size:15px;font-weight:700}.panduan-header h1{color:#3f51b5;margin:10px 0 14px;font-size:42px}.panduan-header p{color:#333;font-size:18px;line-height:1.6}.panduan-container{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;display:grid}.panduan-card{background:#fff;border:1px solid #e6e9f5;border-radius:18px;padding:26px;transition:all .3s;box-shadow:0 10px 24px #3f51b514}.panduan-card:hover{transform:translateY(-8px);box-shadow:0 16px 32px #3f51b524}.panduan-role{color:#3f51b5;margin-bottom:16px;font-size:13px;font-weight:700}.panduan-card h3{color:#3f51b5;margin-bottom:12px;font-size:21px;line-height:1.35}.panduan-card p{color:#333;font-size:15px;line-height:1.6}@media screen and (width<=900px){.panduan-container{grid-template-columns:1fr}}@media screen and (width<=620px){.panduan{padding:34px 22px 50px}.panduan-header h1{font-size:32px}}.login-page{background-color:#243f9a;background-image:linear-gradient(#243f9a14,#243f9ad1),url(./background-posyandu-7xbLiivh.png);background-position:top;background-repeat:no-repeat;background-size:100%;justify-content:center;align-items:center;width:100%;min-height:100dvh;display:flex;position:relative;overflow:hidden}.login-page:before{content:"";-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#1e3c9699;width:100%;height:100%;position:absolute;inset:0}.card{text-align:center;background:#ffffffd9;border-radius:15px;flex-direction:column;padding:30px;display:flex;box-shadow:0 10px 30px #0003}.title{color:#2c3e50;margin-bottom:20px;font-size:22px;font-weight:700}.input-group input{background:0 0;border:none;border-bottom:2px solid #555;outline:none;width:100%;padding:8px 5px}.btn-login{color:#fff;cursor:pointer;background:#3f51b5;border:none;border-radius:20px;width:100%;margin-top:15px;padding:10px 20px}.btn-login:hover{opacity:.9}.login-message{border-radius:8px;margin-top:14px;padding:10px 12px;font-size:13px;font-weight:600}.login-message.success{color:#2e7d32;background:#e8f5e9}.login-message.error{color:#c62828;background:#ffebee}@media (width<=480px){.login-page{background-size:100%;align-items:flex-start;width:100%;height:auto;min-height:100dvh;padding:76px 18px 28px}.back-home{top:18px;left:18px}.container{max-width:340px}.card{padding:24px 20px}}.register-page{background-color:#243f9a;background-image:linear-gradient(#243f9a14,#243f9ad1),url(./background-posyandu-7xbLiivh.png);background-position:top;background-repeat:no-repeat;background-size:100%;justify-content:center;align-items:center;width:100%;min-height:100dvh;padding:32px 16px;display:flex;position:relative;overflow:hidden}.register-page:before{content:"";-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00329680;width:100%;height:100%;position:absolute;inset:0}.back-home{z-index:3;color:#000;background:#fff;border-radius:10px;justify-content:center;align-items:center;width:44px;height:44px;text-decoration:none;display:flex;position:absolute;top:24px;left:24px;box-shadow:0 8px 20px #0000002e}.back-home i{font-size:24px}.container{z-index:2;width:100%;max-width:400px;position:relative}.logo-box{text-align:center;background:#ffffffe6;border-radius:15px;margin-bottom:15px;padding:20px 15px}.logo-box img{width:220px;max-width:100%}.card{text-align:center;background:#ffffffd9;border-radius:15px;flex-direction:column;max-height:calc(100vh - 64px);padding:30px;display:flex;overflow-y:auto;box-shadow:0 10px 25px #0003}.title{margin-bottom:5px;font-size:22px;font-weight:700}.subtitle{color:#555;margin-bottom:20px;font-size:13px}.input-group{text-align:left;margin-bottom:15px}.input-group label{font-size:13px;font-weight:700}.input-group input,.input-group select{background:0 0;border:none;border-bottom:2px solid #555;outline:none;width:100%;padding:8px 5px}.password-field{position:relative}.password-field input{padding-right:38px}.password-toggle{color:#000;cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;width:30px;height:30px;padding:0;display:flex;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.password-toggle i{font-size:20px}.hint{color:#777;font-size:11px}.btn-register{color:#fff;cursor:pointer;background:#3f51b5;border:none;border-radius:20px;width:100%;margin-top:15px;padding:10px 20px}.btn-register:hover{opacity:.9}.register-message{border-radius:8px;margin-top:14px;padding:10px 12px;font-size:13px;font-weight:600}.register-message.success{color:#2e7d32;background:#e8f5e9}.register-message.error{color:#c62828;background:#ffebee}.footer{margin-top:15px;font-size:13px}.footer a{color:#3f51b5;font-weight:700;text-decoration:none}@media (width<=480px){.register-page{background-size:100%;align-items:flex-start;width:100%;min-height:100dvh;padding:76px 18px 28px}.back-home{top:18px;left:18px}.container{max-width:340px}.card{max-height:none;padding:24px 20px}}#content main .head-title .left .breadcrumb li{color:var(--dark)}#content main .head-title .left .breadcrumb li a{color:var(--dark-grey);pointer-events:none}#content main .head-title .left .breadcrumb li a.active{color:var(--blue);pointer-events:unset}#content main .head-title .left .breadcrumb li button{color:var(--dark-grey);cursor:pointer;background:0 0;border:0;padding:0;font-family:inherit;font-size:14px}#content main .monitor-summary{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}#content main .monitor-summary li{flex-direction:column;align-items:flex-start;gap:16px;min-width:0}#content main .monitor-summary li .text h3{overflow-wrap:break-word;word-break:normal;white-space:normal;font-size:18px;line-height:1.3}#content main .monitor-summary li .text{width:100%;min-width:0}#content main .table-action,#content main .icon-action,#content main .small-button{cursor:pointer;border:0;font-family:inherit}#content main .table-action{border-radius:8px;align-items:center;gap:8px;min-height:36px;padding:0 14px;font-size:14px;font-weight:600;display:inline-flex}#content main .icon-action{border:1px solid var(--dashboard-border);width:36px;height:36px;color:var(--dark);background:#eef4fb;border-radius:8px;justify-content:center;align-items:center;display:inline-flex}#content main .icon-action .bx{font-size:18px}#content main .table-data .form-panel{flex-basis:100%;width:100%}#content main .table-data .order table.kader-table{min-width:980px}#content main .table-data .order table.kader-table th:last-child,#content main .table-data .order table.kader-table td.action-cell{min-width:260px}#content main .row-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}#content main .table-data .order table.kader-table td.action-cell .row-actions{flex-wrap:nowrap}#content main .row-actions button{color:var(--blue);cursor:pointer;background:#e9f5ff;border:0;border-radius:8px;padding:8px 12px;font-family:inherit;font-size:12px;font-weight:600}#content main .table-data .order table.kader-table td.action-cell .row-actions button{white-space:nowrap;min-height:34px;line-height:1}#content main .row-actions button.success{color:#2e7d32;background:#2e7d321f}#content main .row-actions button.warning{color:#9a6b00;background:#ffc10733}#content main .row-actions button:disabled{cursor:not-allowed;opacity:.65}#content main .kader-status{border-radius:999px;justify-content:center;min-width:86px;padding:6px 12px;font-size:11px;font-weight:700;display:inline-flex}#content main .kader-status.active{color:#2e7d32;background:#2e7d321f}#content main .kader-status.inactive{background:var(--light-orange);color:var(--orange)}#content main .empty-cell{color:var(--dark-grey);text-align:center}#content main .table-pagination button{border:1px solid var(--dashboard-border);color:var(--dark);cursor:pointer;background:#eef4fb;border-radius:8px;min-height:34px;padding:0 12px;font-family:inherit;font-size:13px;font-weight:600}#content main .admin-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}#content main .admin-profile-grid>div{border:1px solid var(--dashboard-border);background:#f5f9fd;border-radius:8px;padding:14px 16px}#content main .admin-profile-grid span{color:var(--dark-grey);margin-bottom:4px;font-size:12px;display:block}#content main .admin-profile-grid strong{color:var(--dark);font-size:14px;font-weight:600}#content main .monitor-detail-meta{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:20px;display:grid}#content main .monitor-detail-meta>div{border:1px solid var(--dashboard-border);background:#f5f9fd;border-radius:8px;min-width:0;padding:14px 16px}#content main .monitor-detail-meta span{color:var(--dark-grey);margin-bottom:4px;font-size:12px;display:block}#content main .monitor-detail-meta strong{color:var(--dark);overflow-wrap:break-word;font-size:14px;font-weight:600;display:block}#content main .admin-form{flex-direction:column;gap:18px;width:100%;display:flex}#content main .admin-form.compact-form{width:100%;max-width:none}#content main .admin-form .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}#content main .admin-form .form-group{flex-direction:column;gap:8px;display:flex}#content main .admin-form .form-group.full{grid-column:1/-1}#content main .admin-form label{color:var(--dark);font-size:13px;font-weight:600}#content main .admin-form input,#content main .admin-form select,#content main .admin-form textarea{border:1px solid var(--dashboard-border);width:100%;color:var(--dark);background:#fff;border-radius:8px;outline:none;padding:11px 12px;font-family:inherit;font-size:14px}#content main .admin-form select,#content main .chart-filter select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23342E37' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 18px center;background-repeat:no-repeat;background-size:16px;padding-right:48px}#content main .admin-form textarea{resize:vertical;min-height:98px}#content main .admin-form input:focus,#content main .admin-form select:focus,#content main .admin-form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px #3c91e61f}#content main .admin-form input[readonly]{color:var(--dark-grey);background:#eef4fb}#content main .admin-form .form-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;display:flex}#content main .admin-form button{cursor:pointer;border:0;border-radius:8px;padding:11px 16px;font-family:inherit;font-size:14px;font-weight:600}#content main .admin-form button:disabled{opacity:.65;cursor:not-allowed}#content main .btn-primary{background:var(--blue);color:var(--light)}#content main .btn-secondary{border:1px solid var(--dashboard-border);color:var(--dark);background:#eef4fb}#content main .form-alert{border-radius:8px;margin-top:20px;padding:12px 14px;font-size:14px;font-weight:500}#content main .form-alert.success{color:#146c43;background:#e8f6ee}#content main .form-alert.error{color:#b42318;background:#fdecec}#content main .quick-actions button{border:1px solid var(--dashboard-border);color:var(--dark);cursor:pointer;background:#f5f9fd;border-radius:8px;align-items:center;gap:12px;padding:16px;font-family:inherit;font-size:14px;font-weight:600;display:flex}#content main .quick-actions button .bx{background:var(--light-blue);width:40px;height:40px;color:var(--blue);border-radius:8px;justify-content:center;align-items:center;font-size:20px;display:inline-flex}#content main .chart-filter input,#content main .chart-filter select{border:1px solid var(--dashboard-border);color:var(--dark);background-color:#fff;border-radius:8px;outline:none;height:42px;padding:0 12px;font-family:inherit;font-size:14px}#content main .chart-filter input:focus,#content main .chart-filter select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #3c91e61f}#content main .chart-filter select:disabled{color:var(--dark-grey);cursor:not-allowed;background-color:#eef4fb}#content main .small-button{border:1px solid var(--dashboard-border);color:var(--dark);background:#eef4fb;border-radius:8px;min-height:42px;padding:0 14px;font-size:14px;font-weight:600}#content main .small-button:disabled{cursor:not-allowed;opacity:.6}@media screen and (width<=768px){#content main .admin-profile-grid,#content main .monitor-detail-meta,#content main .admin-form .form-grid{grid-template-columns:1fr}#content main .admin-form .form-actions{justify-content:stretch}#content main .admin-form .form-actions button{flex:160px}#content main .table-data.dashboard-masonry{grid-template-columns:1fr}#content main .dashboard-masonry .dashboard-chart-panel{grid-row:auto}#content main .chart-filter,#content main .chart-summary{grid-template-columns:1fr}#content main .table-pagination{flex-direction:column;align-items:stretch}#content main .table-pagination>div{justify-content:space-between}#content main .table-data>div{padding:16px}#content main .table-data .order table{table-layout:fixed;min-width:680px}#content main .table-data .order table th,#content main .table-data .order table td{text-overflow:ellipsis;white-space:nowrap;padding-right:12px;overflow:hidden}#content main .table-data .order table th:last-child,#content main .table-data .order table td:last-child{white-space:normal;overflow:visible}#content main .row-actions{flex-wrap:nowrap}}#content nav{height:56px;font-family:var(--lato);z-index:1000;background:#26327f;align-items:center;gap:24px;padding:0 24px;display:flex;position:sticky;top:0;left:0}#content nav:before{content:"";border-radius:50%;width:40px;height:40px;position:absolute;bottom:-40px;left:0;box-shadow:-20px -20px #26327f}#content nav a{color:var(--dark)}#content nav .bx.bx-menu{cursor:pointer;color:#fff}#content nav .nav-link{font-size:16px;transition:all .3s}#content nav .nav-link:hover{color:var(--blue)}#content nav form{width:100%;max-width:400px;margin-right:auto}#content nav form .form-input{align-items:center;height:36px;display:flex}#content nav form .form-input input{background:var(--grey);width:100%;height:100%;color:var(--dark);border:none;border-radius:36px 0 0 36px;outline:none;flex-grow:1;padding:0 16px}#content nav form .form-input button{background:var(--blue);width:36px;height:100%;color:var(--light);cursor:pointer;border:none;border-radius:0 36px 36px 0;outline:none;justify-content:center;align-items:center;font-size:18px;display:flex}#content nav .notification{font-size:20px;position:relative}#content nav .notification .num{border:2px solid var(--light);background:var(--red);width:20px;height:20px;color:var(--light);border-radius:50%;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex;position:absolute;top:-6px;right:-6px}#content nav .profile img{object-fit:cover;border-radius:50%;width:36px;height:36px}#content nav .switch-mode{background:var(--grey);cursor:pointer;border-radius:25px;min-width:50px;height:25px;display:block;position:relative}#content nav .switch-mode:before{content:"";background:var(--blue);border-radius:50%;width:21px;transition:all .3s;position:absolute;top:2px;bottom:2px;left:2px}#content nav #switch-mode:checked+.switch-mode:before{left:calc(100% - 23px)}#sidebar{z-index:2000;width:280px;height:100%;font-family:var(--lato);scrollbar-width:none;background:#3f51b5;transition:all .3s;position:fixed;top:0;left:0;overflow-x:hidden}#sidebar::-webkit-scrollbar{display:none}#sidebar.hide{width:60px}#sidebar .brand{height:56px;color:var(--light);z-index:500;box-sizing:content-box;background:#26327f;align-items:center;padding-top:16px;padding-bottom:20px;font-size:24px;font-weight:700;display:flex;position:sticky;top:0;left:0}#sidebar .brand:after{content:"";background:#ffffffbf;border-radius:999px;height:3px;position:absolute;bottom:0;left:0;right:0}#sidebar .brand .bx{justify-content:center;min-width:60px;font-size:28px;display:flex}#sidebar .brand .brand-info{flex-direction:column;margin-top:8px;line-height:1.15;display:flex;overflow:hidden}#sidebar .brand .user-name{text-overflow:ellipsis;white-space:nowrap;opacity:.85;max-width:190px;font-size:13px;font-weight:500;overflow:hidden}#sidebar .brand .online-status{color:#dfffe5;align-items:center;gap:6px;margin-top:4px;font-size:12px;font-weight:600;display:flex}#sidebar .brand .online-dot{background:#2ecc71;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 3px #2ecc712e}#sidebar .side-menu{width:100%;margin-top:24px}#sidebar .side-menu li{background:0 0;border-radius:48px 0 0 48px;height:48px;margin-left:6px;padding:4px}#sidebar .side-menu li.active{background:#f5f7fb;position:relative}#sidebar .side-menu li.active:before{content:"";z-index:-1;border-radius:50%;width:40px;height:40px;position:absolute;top:-40px;right:0;box-shadow:20px 20px #f5f7fb}#sidebar .side-menu li.active:after{content:"";z-index:-1;border-radius:50%;width:40px;height:40px;position:absolute;bottom:-40px;right:0;box-shadow:20px -20px #f5f7fb}#sidebar .side-menu li a{width:100%;height:100%;color:var(--light);white-space:nowrap;background:#3f51b5;border-radius:48px;align-items:center;font-size:16px;display:flex;overflow-x:hidden}#sidebar .side-menu.top li.active a{color:silver}#sidebar.hide .side-menu li a{width:40px;transition:width .3s}#sidebar .side-menu li a.logout{color:var(--red)}#sidebar .side-menu.top li a:hover{color:var(--blue)}#sidebar .side-menu li a .bx{justify-content:center;min-width:40px;display:flex}#content{--dashboard-surface:#fff;--dashboard-border:#dde8f3;--dashboard-shadow:0 14px 34px #27374d14;--dashboard-blue-soft:#eef7ff;--dashboard-yellow-soft:#fff8df;--dashboard-orange-soft:#fff0e9;--dashboard-green-soft:#edf8ef;width:calc(100% - 280px);transition:all .3s;position:relative;left:280px}#sidebar.hide~#content{width:calc(100% - 60px);left:60px}#content main{width:100%;font-family:var(--poppins);background:linear-gradient(#f3f7fd 0%,#eef4fb 100%);max-height:calc(100vh - 56px);padding:36px 24px;overflow-y:auto}#content main .head-title{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}#content main .head-title .left h1{color:var(--dark);margin-bottom:10px;font-size:36px;font-weight:600}#content main .head-title .left .breadcrumb{align-items:center;gap:16px;display:flex}#content main .head-title .left .breadcrumb li{color:var(--dark);align-items:center;gap:16px;display:flex}#content main .head-title .left .breadcrumb li button{color:var(--dark-grey);font:inherit;cursor:pointer;background:0 0;border:0;padding:0}#content main .head-title .left .breadcrumb li button.active,#content main .head-title .left .breadcrumb li button:disabled{color:var(--blue);cursor:default}#content main .head-title .left .breadcrumb li button:not(:disabled):hover{color:var(--blue)}#content main .head-title .btn-download{background:var(--blue);height:36px;color:var(--light);border-radius:36px;justify-content:center;align-items:center;gap:10px;padding:0 16px;font-weight:500;display:flex}#content main .box-info{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;margin-top:36px;display:grid}#content main .box-info li{background:var(--dashboard-surface);border:1px solid var(--dashboard-border);box-shadow:var(--dashboard-shadow);border-radius:16px;align-items:center;gap:24px;padding:24px;display:flex}#content main .box-info li:first-child{background:linear-gradient(135deg, var(--dashboard-surface) 0%, var(--dashboard-blue-soft) 100%);border-color:#cfe8ff}#content main .box-info li:nth-child(2){background:linear-gradient(135deg, var(--dashboard-surface) 0%, var(--dashboard-yellow-soft) 100%);border-color:#ffe9a3}#content main .box-info li:nth-child(3){background:linear-gradient(135deg, var(--dashboard-surface) 0%, var(--dashboard-orange-soft) 100%);border-color:#ffd5c6}#content main .box-info li:nth-child(4){background:linear-gradient(135deg, var(--dashboard-surface) 0%, var(--dashboard-green-soft) 100%);border-color:#cdebd3}#content main .box-info li .bx{border-radius:10px;justify-content:center;align-items:center;width:80px;height:80px;font-size:36px;display:flex}#content main .box-info li:first-child .bx{background:var(--light-blue);color:var(--blue)}#content main .box-info li:nth-child(2) .bx{background:var(--light-yellow);color:var(--yellow)}#content main .box-info li:nth-child(3) .bx{background:var(--light-orange);color:var(--orange)}#content main .box-info li:nth-child(4) .bx{color:#2e7d32;background:#e5f5e7}#content main .box-info li .text h3{color:var(--dark);font-size:24px;font-weight:600}#content main .box-info li .text p{color:var(--dark)}#content main .table-data{width:100%;color:var(--dark);flex-wrap:wrap;gap:24px;margin-top:24px;display:flex}#content main .table-data>div{border:1px solid var(--dashboard-border);background:var(--dashboard-surface);box-shadow:var(--dashboard-shadow);border-radius:16px;padding:24px;overflow-x:auto}#content main .table-data.dashboard-masonry{grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1.35fr) minmax(320px,.85fr);align-items:stretch;display:grid}#content main .table-data.dashboard-masonry>div{min-width:0;height:100%}#content main .dashboard-masonry .dashboard-chart-panel{grid-row:1/3}#content main .dashboard-masonry .order:not(.dashboard-chart-panel){flex-direction:column;display:flex}#content main .table-data .head{justify-content:flex-end;align-items:center;gap:16px;margin-bottom:24px;display:flex}#content main .table-data .head h3{margin-right:auto;font-size:24px;font-weight:600}#content main .table-data .head .bx{cursor:pointer}#content main .table-data .head button{margin-left:0}#content main .head-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;margin-left:auto;display:flex}#content main .table-data .order{flex-grow:1;flex-basis:500px;width:100%;min-width:0}#content main .table-data .order table{border-collapse:collapse;width:100%}#content main .table-data .order table th{color:#4f5f72;text-align:left;border-bottom:1px solid var(--dashboard-border);background:#f5f9fd;padding-top:12px;padding-bottom:12px;font-size:13px}#content main .table-data .order table td{border-bottom:1px solid #edf2f7;padding:16px 0}#content main .table-data .order table tr td:first-child{padding-left:6px;display:table-cell}#content main .table-data .order table td img{object-fit:cover;border-radius:50%;width:36px;height:36px}#content main .table-data .order table tbody tr:hover{background:#f7fbff}#content main .table-data .order table tr td .status{color:var(--light);border-radius:20px;padding:6px 16px;font-size:10px;font-weight:700}#content main .table-data .order table tr td .status.completed{background:var(--blue)}#content main .table-data .order table tr td .status.process{background:var(--yellow)}#content main .table-data .order table tr td .status.pending{background:var(--orange)}#content main .table-data .todo{flex-grow:1;flex-basis:300px}#content main .table-data .todo .todo-list{width:100%}#content main .table-data .todo .todo-list li{background:var(--grey);border-radius:10px;justify-content:space-between;align-items:center;width:100%;margin-bottom:16px;padding:14px 20px;display:flex}#content main .table-data .todo .todo-list li .bx{cursor:pointer}#content main .table-data .todo .todo-list li.completed{border-left:10px solid var(--blue)}#content main .table-data .todo .todo-list li.not-completed{border-left:10px solid var(--orange)}#content main .table-data .todo .todo-list li:last-child{margin-bottom:0}#content main .table-data .form-panel{flex-basis:100%;width:100%;overflow-x:visible}#content main .kader-form{flex-direction:column;gap:24px;width:100%;display:flex}#content main .login-context{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:8px;display:grid}#content main .login-context>div{border:1px solid var(--dashboard-border);background:#f5f9fd;border-radius:8px;padding:14px 16px}#content main .login-context span{color:var(--dark-grey);margin-bottom:4px;font-size:12px;display:block}#content main .login-context strong{color:var(--dark);font-size:14px;font-weight:600}#content main .dashboard-profile-grid{margin-bottom:0}#content main .kader-form .form-section{border:1px solid var(--dashboard-border);background:#f8fbff;border-radius:10px;padding:20px}#content main .kader-form .form-section h4{color:var(--dark);margin-bottom:16px;font-size:18px;font-weight:600}#content main .kader-form.compact-form{gap:16px;width:100%}#content main .kader-form .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}#content main .kader-form .form-group{flex-direction:column;gap:8px;display:flex}#content main .kader-form .form-group.full{grid-column:1/-1}#content main .kader-form label{color:var(--dark);font-size:13px;font-weight:500}#content main .kader-form input,#content main .kader-form select,#content main .kader-form textarea{border:1px solid var(--dashboard-border);width:100%;color:var(--dark);font-family:var(--poppins);background:#fff;border-radius:8px;outline:none;padding:12px 14px;font-size:14px}#content main .kader-form textarea{resize:vertical;min-height:92px}#content main .kader-form input:focus,#content main .kader-form select:focus,#content main .kader-form textarea:focus{border-color:var(--blue);background:var(--light)}#content main .kader-form .form-alert{border-radius:8px;padding:12px 14px;font-size:14px;font-weight:500}#content main .page-alert{margin-top:24px}#content main .kader-form .form-alert.success{background:var(--light-blue);color:var(--blue)}#content main .kader-form .form-alert.error{background:var(--light-orange);color:var(--orange)}#content main .page-alert.success{background:var(--light-blue);color:var(--blue);border-radius:8px;padding:12px 14px}#content main .page-alert.error{background:var(--light-orange);color:var(--orange);border-radius:8px;padding:12px 14px}#content main .kader-form .form-actions{justify-content:flex-end;gap:12px;display:flex}#content main .kader-form button{cursor:pointer;font-family:var(--poppins);border:0;border-radius:8px;min-height:42px;padding:0 18px;font-size:14px;font-weight:600}#content main .kader-form button:disabled{cursor:not-allowed;opacity:.7}#content main .kader-form .btn-primary{background:var(--blue);color:var(--light)}#content main .kader-form .btn-secondary{background:var(--grey);color:var(--dark)}#content main .small-button{border:1px solid var(--dashboard-border);color:var(--dark);cursor:pointer;font-family:var(--poppins);background:#eef4fb;border-radius:8px;min-height:36px;padding:0 14px;font-size:14px;font-weight:600}#content main .detail-form-panel{border:1px solid var(--dashboard-border);background:#f8fbff;border-radius:10px;margin-bottom:20px;padding:20px}#content main .detail-form-panel .head h3{font-size:18px}#content main .table-action,#content main .icon-action,#content main .row-actions button,#content main .quick-actions button{cursor:pointer;font-family:var(--poppins);border:0;font-weight:600}#content main .table-action{border-radius:8px;align-items:center;gap:6px;min-height:36px;padding:0 14px;display:inline-flex}#content main .table-action.primary{background:var(--blue);color:var(--light)}#content main .table-action.success{color:#fff;background:#2e7d32}#content main .icon-action{border:1px solid var(--dashboard-border);color:var(--dark);background:#eef4fb;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;margin-left:0;display:inline-flex}#content main .row-actions{flex-wrap:wrap;gap:8px;display:flex}#content main .row-actions button{color:var(--blue);background:#e9f5ff;border-radius:8px;padding:8px 12px}#content main .row-actions button.danger{background:var(--light-orange);color:var(--orange)}#content main .empty-cell{color:var(--dark-grey);text-align:center;padding:24px 0;font-size:14px}#content main .table-pagination{border-top:1px solid #edf2f7;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;padding-top:16px;display:flex}#content main .table-pagination span{color:var(--dark-grey);font-size:13px}#content main .table-pagination>div{align-items:center;gap:10px;display:flex}#content main .table-pagination strong{color:var(--dark);text-align:center;min-width:46px;font-size:13px;font-weight:600}#content main .table-pagination button{border:1px solid var(--dashboard-border);color:var(--dark);cursor:pointer;font-family:var(--poppins);background:#eef4fb;border-radius:8px;min-height:34px;padding:0 12px;font-size:13px;font-weight:600}#content main .table-pagination button:hover{background:#e8f3ff;border-color:#cfe8ff}#content main .table-pagination button:disabled{cursor:not-allowed;opacity:.55}#content main .quick-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}#content main .quick-actions button{border:1px solid var(--dashboard-border);color:var(--dark);text-align:left;background:#f5f9fd;border-radius:10px;align-items:center;gap:12px;min-height:58px;padding:14px 16px;display:flex}#content main .quick-actions button .bx{color:var(--blue);font-size:24px}#content main .quick-actions button:hover,#content main .small-button:hover,#content main .icon-action:hover{background:#e8f3ff;border-color:#cfe8ff}#content main .dashboard-chart-panel{flex-basis:640px}#content main .chart-filter{grid-template-columns:repeat(2,minmax(160px,1fr)) auto;align-items:end;gap:12px;margin-bottom:18px;display:grid}#content main .chart-filter>div{flex-direction:column;gap:8px;display:flex}#content main .chart-filter label{color:var(--dark);font-size:13px;font-weight:500}#content main .chart-filter input{border:1px solid var(--dashboard-border);color:var(--dark);font-family:var(--poppins);background:#fff;border-radius:8px;outline:none;height:42px;padding:0 12px;font-size:14px}#content main .chart-filter input:focus{background:var(--light);border-color:var(--blue)}#content main .chart-filter .small-button:disabled{cursor:not-allowed;opacity:.6}#content main .chart-wrap{width:100%;height:320px;min-height:320px;position:relative}#content main .chart-empty{color:var(--dark-grey);text-align:center;background:#f5f9fd;border:1px dashed #b8c8d9;border-radius:8px;justify-content:center;align-items:center;height:100%;font-size:14px;display:flex}#content main .chart-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px;display:grid}#content main .chart-summary>div{border:1px solid var(--dashboard-border);background:#f5f9fd;border-radius:8px;padding:12px 14px}#content main .kader-form select,#content main .chart-filter select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23342E37' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 18px center;background-repeat:no-repeat;background-size:16px;padding-right:48px}#content main .chart-summary span{color:var(--dark-grey);margin-bottom:4px;font-size:12px;display:block}#content main .chart-summary strong{color:var(--dark);font-size:14px;font-weight:600}#content main .kader-form input[readonly]{color:var(--dark-grey)}@media screen and (width<=768px){#content main .login-context,#content main .kader-form .form-grid{grid-template-columns:1fr}#content main .kader-form .form-actions{flex-direction:column-reverse}#content main .quick-actions,#content main .table-data.dashboard-masonry{grid-template-columns:1fr}#content main .dashboard-masonry .dashboard-chart-panel{grid-row:auto}#content main .chart-filter,#content main .chart-summary{grid-template-columns:1fr}#content main .table-pagination{flex-direction:column;align-items:stretch}#content main .table-pagination>div{justify-content:space-between}#content main .table-data .head{flex-wrap:wrap;align-items:stretch}#content main .table-data .head button{margin-left:0}#content main .table-data>div{padding:16px}#content main .table-data .order table{table-layout:fixed;min-width:640px}#content main .table-data .order table th,#content main .table-data .order table td{text-overflow:ellipsis;white-space:nowrap;padding-right:12px;overflow:hidden}#content main .table-data .order table th:last-child,#content main .table-data .order table td:last-child{white-space:normal;overflow:visible}#content main .row-actions{flex-wrap:nowrap}}
