*{box-sizing:border-box}html,body{min-height:100%;margin:0}body,button,input{font-family:Segoe UI,Arial,sans-serif}body{background:#f7f9fb}.modal-header,.editor>header,.access-modal-header,.role-modal-header,.uat-modal-header,.ticket-modal-header{position:relative!important;background:linear-gradient(135deg,color-mix(in srgb,var(--primary, #0284c7) 8%,#ffffff),#fff)!important;border-bottom:1px solid #e2e8f0!important}.modal-header:before,.editor>header:before,.access-modal-header:before,.role-modal-header:before,.uat-modal-header:before,.ticket-modal-header:before{content:""!important;position:absolute!important;top:0!important;left:0!important;right:0!important;height:3px!important;background:linear-gradient(90deg,var(--primary, #0284c7) 0%,color-mix(in srgb,var(--primary, #0284c7) 40%,#38bdf8) 60%,transparent 100%)!important;border-top-left-radius:inherit!important;border-top-right-radius:inherit!important}body .toasts .toast{pointer-events:auto!important;z-index:9999999!important}simpus-toasts,:host(simpus-toasts),.toasts{position:fixed!important;inset:auto 24px 24px auto!important;z-index:9999999!important;pointer-events:none!important}body .toasts{display:flex!important;flex-direction:column-reverse!important;gap:12px!important;max-width:min(420px,calc(100vw - 48px))!important;pointer-events:none!important}body .toasts .toast{pointer-events:auto!important;z-index:9999999!important;position:relative!important;overflow:hidden!important}body .toasts .toast.dismissing{animation:simpus-toast-out .24s cubic-bezier(.16,1,.3,1) forwards!important;pointer-events:none!important}@keyframes simpus-toast-out{0%{opacity:1;transform:translate(0) scale(1)}to{opacity:0;transform:translate(36px) scale(.92)}}body .toasts .toast-progress-track{position:absolute!important;bottom:0!important;left:0!important;right:0!important;height:3.5px!important;background:#e2e8f0b3!important;overflow:hidden!important}body .toasts .toast-progress-bar{display:block!important;height:100%!important;width:100%!important;background:linear-gradient(90deg,var(--primary, #0284c7) 0%,color-mix(in srgb,var(--primary, #0284c7) 40%,#38bdf8) 100%)!important;transform-origin:left!important;animation-name:simpus-toast-shrink!important;animation-timing-function:linear!important;animation-fill-mode:forwards!important}body .toasts .toast.error .toast-progress-bar{background:linear-gradient(90deg,#ef4444,#f87171)!important}body .toasts .toast.info .toast-progress-bar{background:linear-gradient(90deg,#3b82f6,#60a5fa)!important}@keyframes simpus-toast-shrink{0%{transform:scaleX(1)}to{transform:scaleX(0)}}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop){position:fixed;inset:0;z-index:1050;padding:24px;background:#0f172a94;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;overflow-y:auto;animation:simpus-modal-fade .22s ease-out}@keyframes simpus-modal-fade{0%{opacity:0}to{opacity:1}}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor,.confirm,.notif-modal-card,.modal-card){border:1px solid rgba(255,255,255,.85);border-radius:20px;box-shadow:0 25px 70px -10px #0f172a52,0 10px 24px -5px #00000014,0 0 0 1px #e2e8f080;max-height:calc(100dvh - 48px);background:#fff;color:#1e293b;display:flex;flex-direction:column;overflow:hidden;animation:simpus-modal-spring .25s cubic-bezier(.16,1,.3,1)}@keyframes simpus-modal-spring{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header,.access-modal-header,.role-modal-header,.uat-modal-header,.ticket-modal-header,.modal-header),body .modal-header{position:relative!important;padding:20px 24px 18px!important;background:linear-gradient(135deg,color-mix(in srgb,var(--primary, #0284c7) 8%,#ffffff),#fff)!important;border-bottom:1px solid #edf2f7!important;display:flex!important;justify-content:space-between!important;align-items:center!important;gap:16px!important;flex-shrink:0!important;box-sizing:border-box!important;width:100%!important}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header){align-items:flex-start!important}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header,.access-modal-header,.role-modal-header,.uat-modal-header,.ticket-modal-header,.modal-header):before,body .modal-header:before{content:""!important;position:absolute!important;top:0!important;left:0!important;right:0!important;height:3.5px!important;background:linear-gradient(90deg,var(--primary, #0284c7) 0%,color-mix(in srgb,var(--primary, #0284c7) 40%,#38bdf8) 60%,transparent 100%)!important;border-top-left-radius:inherit!important;border-top-right-radius:inherit!important}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header)>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header) :is(h2,h3){font-size:19px;font-weight:800;letter-spacing:-.3px;color:#0f172a;margin:0;line-height:1.35}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header) p{font-size:13px;color:#64748b;margin:0;font-weight:500;line-height:1.45}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header,.access-modal-header,.role-modal-header,.uat-modal-header,.ticket-modal-header,.modal-header) :is(button[aria-label*=Tutup],button[aria-label="Tutup form"],button[aria-label="Tutup akses"],button[aria-label=Tutup],.btn-close,.btn-modal-close),body .modal-header .btn-close{margin-left:auto!important;display:grid!important;place-items:center!important;width:36px!important;height:36px!important;border-radius:11px!important;border:1px solid #e2e8f0!important;background:#f8fafc!important;color:#64748b!important;flex-shrink:0!important;cursor:pointer!important;padding:0!important;transition:all .2s cubic-bezier(.16,1,.3,1)!important}body :is(.dialog-shade,.notif-modal-backdrop,.modal-backdrop) :is(.editor>header,.confirm>header,.access-modal-header,.role-modal-header,.uat-modal-header,.ticket-modal-header,.modal-header) :is(button[aria-label*=Tutup],button[aria-label="Tutup form"],button[aria-label="Tutup akses"],button[aria-label=Tutup],.btn-close,.btn-modal-close):hover,body .modal-header .btn-close:hover{background:#fee2e2!important;border-color:#fecaca!important;color:#dc2626!important;transform:rotate(90deg) scale(1.05)!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-card{width:min(560px,100%)!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-send-card{width:min(680px,100%)!important}body :is(.dialog-shade,.notif-modal-backdrop) .confirm{width:min(440px,100%)!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header{position:relative;padding:24px 28px 20px!important;background:linear-gradient(180deg,#f8fafc,#fff)!important;border-bottom:1px solid #edf2f7!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:10px!important;width:100%!important;box-sizing:border-box!important;flex-shrink:0!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,#0284c7 0%,#38bdf8 60%,transparent 100%)}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header.ticket:before{background:linear-gradient(90deg,#d97706 0%,#fbbf24 60%,transparent 100%)}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header.warning:before{background:linear-gradient(90deg,#dc2626 0%,#f87171 60%,transparent 100%)}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header.success:before{background:linear-gradient(90deg,#059669 0%,#34d399 60%,transparent 100%)}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header.info:before,body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header.send-header:before{background:linear-gradient(90deg,#0284c7 0%,#38bdf8 60%,transparent 100%)}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-header-top{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;gap:12px!important;margin-bottom:2px!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-badge{display:inline-flex!important;align-items:center!important;gap:6px!important;padding:5px 12px!important;border-radius:20px!important;font-size:11px!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.5px!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-badge simpus-icon{width:14px!important;height:14px!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-badge.ticket{background:#fef3c7!important;color:#b45309!important;border:1px solid #fde68a!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-badge.warning{background:#fee2e2!important;color:#b91c1c!important;border:1px solid #fecaca!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-badge.success{background:#d1fae5!important;color:#047857!important;border:1px solid #a7f3d0!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-badge.info{background:#e0f2fe!important;color:#0369a1!important;border:1px solid #bae6fd!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-close{margin-left:auto!important;display:grid!important;place-items:center!important;width:34px!important;height:34px!important;border-radius:50%!important;border:1px solid #e2e8f0!important;background:#f8fafc!important;color:#64748b!important;cursor:pointer!important;flex-shrink:0!important;padding:0!important;transition:all .2s cubic-bezier(.16,1,.3,1)!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-close:hover{background:#fee2e2!important;border-color:#fecaca!important;color:#dc2626!important;transform:rotate(90deg) scale(1.05)!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-title{margin:2px 0 0!important;font-size:20px!important;font-weight:800!important;letter-spacing:-.3px!important;color:#0f172a!important;line-height:1.35!important;word-break:break-word!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-subtitle{margin:2px 0 0!important;font-size:13px!important;color:#64748b!important;font-weight:500!important;line-height:1.45!important}body :is(.dialog-shade,.notif-modal-backdrop) .notif-modal-meta{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:10px!important;font-size:12.5px!important;color:#64748b!important;margin-top:4px!important}body :is(.dialog-shade,.notif-modal-backdrop) .meta-item{display:inline-flex!important;align-items:center!important;gap:6px!important;font-weight:500!important}body :is(.dialog-shade,.notif-modal-backdrop) .meta-item simpus-icon{width:14px!important;height:14px!important;color:#94a3b8!important}body :is(.dialog-shade,.notif-modal-backdrop) .meta-dot{color:#cbd5e1!important;font-weight:700!important}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer){padding:16px 28px;background:#fafbfc;border-top:1px solid #edf2f7;display:flex;justify-content:flex-end;gap:10px;align-items:center;flex-shrink:0}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer) button{min-height:40px;border-radius:10px;padding:9px 20px;font-weight:600;font-size:13px;border:1px solid #e2e8f0;background:#fff;color:#475569;cursor:pointer;transition:all .15s ease}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer) button:hover{background:#f1f5f9;color:#0f172a}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer) :is(.primary,.notif-btn-primary){background:var(--primary, #0284c7);color:#fff;border:0;font-weight:700;box-shadow:0 4px 14px color-mix(in srgb,var(--primary, #0284c7) 30%,transparent)}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer) :is(.primary,.notif-btn-primary):hover{filter:brightness(1.08);transform:translateY(-1px)}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer) .danger{background:#dc2626;color:#fff;border-color:#dc2626}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer) .danger:hover{background:#b91c1c;border-color:#b91c1c}body .dialog-shade :is(input,select,textarea):focus-visible{outline:2px solid var(--primary,#20885e);outline-offset:2px}body :is(simpus-settings,simpus-application,simpus-concept,simpus-profile,simpus-login) :is(p.error,p.notice,p.warning,div.message){border:1px solid #e2e8f0;border-left:3px solid var(--primary,#20885e);border-radius:12px;padding:14px 16px;background:#fff;color:#475569;font-size:13px;line-height:1.65;box-shadow:0 2px 6px #0f172a04;overflow-wrap:anywhere}body :is(simpus-settings,simpus-application,simpus-concept,simpus-profile,simpus-login) :is(p.error,div.message.error){border-color:#fecaca;border-left-color:#dc2626;background:snow;color:#991b1b}body :is(simpus-settings,simpus-profile,simpus-login) p.warning{border-color:#fde68a;border-left-color:#d97706;background:#fffdf5;color:#92400e}@media(max-width:600px){body :is(.dialog-shade,.notif-modal-backdrop){padding:12px}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card){max-height:calc(100dvh - 24px);border-radius:18px}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor>header,.confirm>header,.notif-modal-header),body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer){padding:16px 20px}body :is(.dialog-shade,.notif-modal-backdrop) :is(.editor,.confirm,.notif-modal-card) :is(footer,.notif-modal-footer) button{flex:1}}
