:root{--primary: #6c72ff;--primary-light: #8951ff;--primary-hover: #565cf2;--primary-soft: #eef0ff;--primary-ring: rgba(108, 114, 255, .32);--danger: #e5484d;--success: #2e9e6b;--warning: #e69512;--caution: #d98014;--bg: #f5f7fb;--surface: #ffffff;--surface-2: #fafbfd;--border: #e6e9f2;--border-strong: #d7dae6;--text: #1a1f36;--text-muted: #6b7280;--white: #ffffff;--row-hover: #f7f8fc;--nav-hover: rgba(0, 0, 104, .07);--on-primary: #ffffff;--sidebar-text: #5b6474;--sidebar-hover: rgba(108, 114, 255, .08);--topbar-border: #e6e9f2;--overlay: rgba(20, 24, 40, .45);--success-bg: #e3f6ec;--success-fg: #1c7a4d;--success-acc: #2e9e6b;--danger-bg: #fdecec;--danger-fg: #b42318;--danger-acc: #e5484d;--warning-bg: #fef3e2;--warning-fg: #92600a;--warning-acc: #e69512;--info-bg: #e6f1fe;--info-fg: #0b62c4;--info-acc: #2e90fa;--catalog-title: #f5761a;--badge-primary: #6c72ff;--highlight-bg: #fff8e6;--highlight-border: #fcd34d;--action-badge-bg: #ecedff;--action-badge-fg: #4348c7;--detail-bg: #f7f8fc;--unread-bg: #eef0ff;--chart-expired: #e5484d;--chart-warn30: #e69512;--chart-warn60: #2e90fa;--chart-healthy: #2e9e6b;--chart-grid: rgba(20, 24, 40, .08);--chart-axis: #6b7280;--font-base: Segoe UI, Tahoma, sans-serif;--fs-3xs: 10px;--fs-2xs: 11px;--fs-xs: 12px;--fs-sm: 13px;--fs-base: 14px;--fs-md: 15px;--fs-lg: 16px;--fs-xl: 18px;--fs-2xl: 20px;--fs-3xl: 22px;--fs-4xl: 28px;--space-1: 1px;--space-2: 2px;--space-3: 3px;--space-4: 4px;--space-5: 5px;--space-6: 6px;--space-8: 8px;--space-10: 10px;--space-12: 12px;--space-14: 14px;--space-16: 16px;--space-18: 18px;--space-20: 20px;--space-24: 24px;--space-40: 40px;--radius-sm: 4px;--radius: 8px;--radius-lg: 10px;--radius-pill: 12px;--border-width: 1px;--border-width-md: 3px;--border-width-lg: 4px;--shadow: 0 1px 2px rgba(20, 24, 40, .04), 0 3px 8px rgba(20, 24, 40, .05);--shadow-md: 0 4px 12px rgba(20, 24, 40, .1);--shadow-lg: 0 10px 34px rgba(20, 24, 40, .12);--shadow-dropdown: 0 8px 24px rgba(20, 24, 40, .12);--sidebar-width: 240px;--w-input-search: 220px;--w-input-filter: 160px;--w-input-filter-sm:140px;--w-input-date: 150px;--w-input-num: 70px;--w-input-qty: 60px;--w-modal: 500px;--w-confirm: 380px;--w-dropdown: 320px;--w-login-card: 360px;--logo-h-login: 185px;--logo-h-sidebar: 56px;--w-toast-min: 260px;--w-toast-max: 400px;--h-list-max: 360px;--h-search-max: 160px}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;display:flex;max-width:100%;max-height:100%;z-index:1000}.cdk-overlay-backdrop{position:absolute;inset:0;pointer-events:auto;-webkit-tap-highlight-color:transparent;opacity:0;touch-action:manipulation;z-index:1000;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}@media(prefers-reduced-motion){.cdk-overlay-backdrop{transition-duration:1ms}}.cdk-overlay-backdrop-showing{opacity:1}@media(forced-colors:active){.cdk-overlay-backdrop-showing{opacity:.6}}.cdk-overlay-dark-backdrop{background:#00000052}.cdk-overlay-transparent-backdrop{transition:visibility 1ms linear,opacity 1ms linear;visibility:hidden;opacity:1}.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,.cdk-high-contrast-active .cdk-overlay-transparent-backdrop{opacity:0;visibility:visible}.cdk-overlay-backdrop-noop-animation{transition:none}.cdk-overlay-connected-position-bounding-box{position:absolute;display:flex;flex-direction:column;min-width:1px;min-height:1px;z-index:1000}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.cdk-overlay-popover{background:none;border:none;padding:0;outline:0;overflow:visible;position:fixed;pointer-events:none;white-space:normal;color:inherit;text-decoration:none;width:100%;height:100%;inset:0 auto auto 0}.cdk-overlay-popover::backdrop{display:none}.cdk-overlay-popover .cdk-overlay-backdrop{position:fixed;z-index:auto}@font-face{font-family:Almarai;src:url(/assets/fonts/Almarai-Light.ttf) format("truetype");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:Almarai;src:url(/assets/fonts/Almarai-Regular.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Almarai;src:url(/assets/fonts/Almarai-Bold.ttf) format("truetype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Almarai;src:url(/assets/fonts/Almarai-ExtraBold.ttf) format("truetype");font-weight:800;font-style:normal;font-display:swap}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-base);background:var(--bg);color:var(--text);font-size:var(--fs-base)}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button{cursor:pointer;border:none;border-radius:var(--radius);padding:var(--space-8) var(--space-16);font-size:var(--fs-base);white-space:nowrap;transition:opacity .15s ease,background .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease}button:hover:not(:disabled){opacity:.85}button:active:not(:disabled){opacity:.7}button:disabled{opacity:.5;cursor:not-allowed}@media(prefers-reduced-motion:reduce){button{transition:none}}.btn-primary{background:var(--primary);color:var(--on-primary)}.btn-danger{background:var(--danger);color:var(--on-primary)}.btn-ghost{background:transparent;border:var(--border-width) solid var(--border);color:var(--text)}input,select,textarea{width:100%;padding:var(--space-8) var(--space-12);border:var(--border-width) solid var(--border);border-radius:var(--radius);font-size:var(--fs-base);outline:none;background:var(--surface);color:var(--text)}input:focus,select:focus,textarea:focus{border-color:var(--primary)}table{width:100%;border-collapse:collapse}th,td{padding:var(--space-10) var(--space-12);text-align:left;border-bottom:var(--border-width) solid var(--border)}th{background:var(--bg);font-weight:600;color:var(--text-muted)}tr:hover td{background:var(--row-hover)}.section-container{max-width:1440px;margin-inline:auto;padding-inline:var(--space-24);padding-block:var(--space-40)}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:var(--space-20);margin-bottom:var(--space-16)}.badge{display:inline-block;padding:var(--space-2) var(--space-8);border-radius:var(--radius-pill);font-size:var(--fs-xs);font-weight:600}.badge-success{background:var(--success-bg);color:var(--success-fg)}.badge-danger{background:var(--danger-bg);color:var(--danger-fg)}.badge-warning{background:var(--warning-bg);color:var(--warning-fg)}.badge-info{background:var(--info-bg);color:var(--info-fg)}.error-msg{color:var(--danger);font-size:var(--fs-sm);margin-top:var(--space-4)}.loading{text-align:center;padding:var(--space-40);color:var(--text-muted)}.shell{--primary-light: var(--primary-hover)}.shell input:focus,.shell select:focus,.shell textarea:focus{border-color:var(--primary);box-shadow:0 0 0 var(--border-width-md) var(--primary-ring)}.shell .btn-primary:focus-visible,.shell .btn-ghost:focus-visible,.shell .btn-danger:focus-visible{outline:none;box-shadow:0 0 0 var(--border-width-md) var(--primary-ring)}.shell button{font-weight:600}.shell .btn-primary:hover:not(:disabled){background:var(--primary-hover);opacity:1}.shell .btn-ghost:hover:not(:disabled){border-color:var(--border-strong);background:var(--surface-2);opacity:1}.page-area .card{border:var(--border-width) solid var(--border);box-shadow:var(--shadow)}.page-area table{font-variant-numeric:tabular-nums}.page-area thead th{background:var(--surface-2);color:var(--text-muted);font-size:var(--fs-2xs);font-weight:700;text-transform:uppercase;letter-spacing:.05em}.page-area tbody tr:hover td{background:var(--surface-2)}.shell .page-header{flex-wrap:wrap;row-gap:var(--space-12)}.shell .header-actions{flex-wrap:wrap;row-gap:var(--space-8)}.shell .search-input{max-width:100%}.shell .card:has(>table),.shell .modal-body:has(>table){overflow-x:auto}.shell .page-area .form-grid{grid-template-columns:1fr}@media(min-width:40rem){.shell .page-area .form-grid{grid-template-columns:1fr 1fr}}.deleted-tabs{display:flex;gap:var(--space-4);margin-bottom:var(--space-16)}.deleted-tabs .tab{background:transparent;border:var(--border-width) solid var(--border);color:var(--text-muted);font-weight:600;padding:var(--space-6) var(--space-16)}.deleted-tabs .tab.active{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}.row-deleted td{opacity:.7}
