:root{--bg-app: #F4F6F8;--surface: #FFFFFF;--surface-soft: #F8FAFC;--text-primary: #111827;--text-secondary: #6B7280;--text-muted: #9CA3AF;--border: #E5E7EB;--primary: #168BFF;--primary-hover: #0878E5;--success: #16A34A;--warning: #EAB308;--danger: #EF4444;--info: #3B82F6;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--shadow-soft: 0 6px 20px rgba(17, 24, 39, .06);--sidebar-width: 264px;--sidebar-collapsed-width: 76px;--content-max-width: 1600px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:IBM Plex Sans Arabic,Inter,Tajawal,Arial,sans-serif;background-color:var(--bg-app);color:var(--text-primary);direction:inherit;text-align:start;min-height:100vh;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,.text-page-title{font-size:24px;font-weight:600;line-height:1.3;color:var(--text-primary)}h2,.text-section-title{font-size:18px;font-weight:600;line-height:1.4;color:var(--text-primary)}h3,.text-card-title{font-size:16px;font-weight:600;line-height:1.4;color:var(--text-primary)}p,body,.text-body{font-size:14px;font-weight:400;line-height:1.5}small,.text-secondary{font-size:13px;font-weight:400;color:var(--text-secondary)}.text-muted{font-size:12px;color:var(--text-muted)}.text-kpi{font-size:28px;font-weight:700;line-height:1.2}a{color:var(--primary);text-decoration:none;transition:color .15s ease}a:hover{color:var(--primary-hover)}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}button,input,select,textarea{font-family:inherit;font-size:inherit}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-4)}.card-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);padding-bottom:var(--space-3)}.card-title{font-size:16px;font-weight:600;color:var(--text-primary)}.card-body{flex:1}.card-footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);border-top:1px solid var(--border);padding-top:var(--space-3)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:var(--radius-sm, 6px);font-family:inherit;font-weight:600;cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:all .18s cubic-bezier(.4,0,.2,1);min-width:40px;touch-action:manipulation;text-decoration:none}.btn-sm{height:32px;padding-inline:var(--space-3);font-size:13px;border-radius:8px}.btn-md{height:42px;padding-inline:var(--space-4, 16px);font-size:14px;border-radius:10px}.btn-lg{height:48px;padding-inline:var(--space-5);font-size:16px;border-radius:12px}.btn-primary{background-color:var(--primary, #168bff);color:#fff;border-color:transparent;box-shadow:0 2px 6px #168bff40}.btn-primary:hover:not(:disabled){background-color:color-mix(in srgb,var(--primary, #168bff) 90%,#000);border-color:transparent;box-shadow:0 4px 12px #168bff59;transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0);box-shadow:0 1px 3px #168bff33}.btn-primary:focus-visible{outline:2px solid var(--primary, #168bff);outline-offset:2px}.btn-secondary{background-color:var(--surface, #ffffff);color:var(--text-primary, #0f172a);border-color:var(--border, #cbd5e1);box-shadow:0 1px 2px #0000000a}.btn-secondary:hover:not(:disabled){background-color:var(--surface-soft, #f8fafc);border-color:color-mix(in srgb,var(--primary, #168bff) 40%,var(--border, #cbd5e1));color:var(--primary, #168bff)}.btn-secondary:focus-visible{outline:2px solid var(--primary, #168bff);outline-offset:2px}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn-ghost{background-color:transparent;color:var(--text-secondary);border-color:transparent}.btn-ghost:hover:not(:disabled){background-color:var(--surface-soft);color:var(--text-primary)}.btn-danger{background-color:var(--danger);color:#fff;border-color:var(--danger)}.btn-danger:hover:not(:disabled){background-color:#dc2626;border-color:#dc2626}.btn-icon{width:40px;height:40px;padding:0;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center}.btn:disabled,.btn.is-disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn.is-loading{position:relative;color:transparent!important;pointer-events:none}.btn.is-loading:after{content:"";position:absolute;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:btn-spin .6s linear infinite;color:#fff}.btn-secondary.is-loading:after,.btn-ghost.is-loading:after{color:var(--text-primary)}@keyframes btn-spin{to{transform:rotate(360deg)}}.form-group{display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--space-4)}.form-label{font-size:14px;font-weight:500;color:var(--text-primary)}.form-label .required-mark{color:var(--danger);margin-inline-start:var(--space-1)}.form-input,.form-control,.form-select,.form-textarea{width:100%;height:42px;padding-inline:var(--space-3);background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:14px;transition:border-color .15s ease,box-shadow .15s ease}.is-hidden{display:none!important}.form-textarea{height:auto;min-height:80px;padding-block:var(--space-2);resize:vertical}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #168bff26}.form-input.is-invalid,.form-select.is-invalid,.form-textarea.is-invalid{border-color:var(--danger)}.form-input.is-invalid:focus,.form-select.is-invalid:focus,.form-textarea.is-invalid:focus{box-shadow:0 0 0 3px #ef444426}.form-helper{font-size:12px;color:var(--text-secondary)}.form-error{font-size:12px;color:var(--danger);font-weight:500}.table-container{width:100%;overflow-x:auto;background-color:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft)}.table{width:100%;border-collapse:collapse;text-align:start;font-size:14px}.table th{background-color:var(--surface-soft);color:var(--text-secondary);font-weight:600;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);white-space:nowrap}.table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--border);color:var(--text-primary);vertical-align:middle}.table tbody tr:last-child td{border-bottom:none}.table tbody tr:hover{background-color:var(--surface-soft)}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:4px 10px;border-radius:9999px;font-size:12px;font-weight:500;line-height:1;white-space:nowrap}.badge-success{background-color:#dcfce7;color:#15803d}.badge-warning{background-color:#fef9c3;color:#a16207}.badge-danger{background-color:#fee2e2;color:#b91c1c}.badge-info{background-color:#dbeafe;color:#1d4ed8}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#11182766;display:flex;align-items:center;justify-content:center;padding:var(--space-4);z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal{background-color:var(--surface);border-radius:var(--radius-lg);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;width:min(100%,560px);max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.modal-header{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.modal-title{font-size:18px;font-weight:600}.modal-body{padding:var(--space-5);overflow-y:auto;flex:1}.modal-footer{padding:var(--space-4) var(--space-5);border-top:1px solid var(--border);display:flex;align-items:center;justify-content:flex-end;gap:var(--space-3);background-color:var(--surface-soft)}.skeleton{background:linear-gradient(90deg,#e5e7eb 25%,#f3f4f6,#e5e7eb 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;border-radius:var(--radius-sm);display:inline-block}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.spinner{width:24px;height:24px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:btn-spin .8s linear infinite;display:inline-block}.empty-state,.error-state{text-align:center;padding:var(--space-8) var(--space-4);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3)}.error-state-icon{color:var(--danger);margin-bottom:var(--space-2)}.retry-btn{margin-top:var(--space-3)}.pagination{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-top:var(--space-4);color:var(--text-secondary)}.pagination-actions{display:flex;align-items:center;gap:var(--space-2)}.pagination-page,.pagination-summary{font-size:13px}@media (max-width: 767px){.pagination{align-items:stretch;flex-direction:column}.pagination-actions{justify-content:space-between}}.app-boot-loading{min-height:100vh;display:flex;align-items:center;justify-content:center;gap:var(--space-3);color:var(--text-secondary)}.network-banner{position:sticky;top:0;z-index:3000;padding:var(--space-2) var(--space-4);background:var(--warning);color:var(--text-primary);text-align:center;font-size:13px;font-weight:500}.empty-state-title,.error-state-title{font-size:16px;font-weight:600;color:var(--text-primary)}.empty-state-desc,.error-state-desc{font-size:14px;color:var(--text-secondary);max-width:400px}.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar-width, 264px) minmax(0,1fr);background:var(--bg-app);transition:grid-template-columns .24s cubic-bezier(.4,0,.2,1)}.app-shell.is-sidebar-collapsed{grid-template-columns:var(--sidebar-collapsed-width, 76px) minmax(0,1fr)}.main-wrapper{min-width:0;min-height:100vh;display:flex;flex-direction:column}.app-sidebar{position:sticky;inset-block-start:0;z-index:200;width:var(--sidebar-width, 264px);height:100vh;display:flex;flex-direction:column;overflow:hidden;background:var(--surface, #fff);border-inline-end:1px solid var(--border, #e5e7eb);box-shadow:0 1px 3px #0f172a0a;transition:width .24s cubic-bezier(.4,0,.2,1),transform .28s cubic-bezier(.4,0,.2,1)}.app-shell.is-sidebar-collapsed .app-sidebar{width:var(--sidebar-collapsed-width, 76px)}.app-sidebar__header{min-height:64px;flex:0 0 auto;display:flex;align-items:center;gap:var(--space-2, 8px);padding-inline:var(--space-3, 12px);border-bottom:1px solid var(--border, #e5e7eb)}.app-sidebar__brand{min-width:0;flex:1 1 auto;display:flex;align-items:center;gap:var(--space-2, 8px);color:var(--text-primary, #111827);text-decoration:none}.app-sidebar__brand-mark,.app-sidebar__icon,.app-sidebar__collapse-btn,.app-sidebar__close-btn,.mobile-menu-btn{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}.app-sidebar__brand-mark{width:36px;height:36px;border-radius:10px;color:var(--primary, #168bff);background:#168bff1a}.app-sidebar__brand-name{min-width:0;font-size:14px;font-weight:700;color:var(--text-primary, #111827);white-space:nowrap}.app-sidebar__collapse-btn,.app-sidebar__close-btn{width:36px;height:36px;border:1px solid var(--border, #e5e7eb);border-radius:10px;background:var(--surface, #fff);color:var(--text-secondary, #6b7280);cursor:pointer}.app-sidebar__close-btn{display:none;border-color:transparent;background:transparent}.app-sidebar__collapse-btn:hover,.app-sidebar__close-btn:hover{background:var(--surface-soft, #f8fafc);color:var(--primary, #168bff)}.app-sidebar__collapse-btn:focus-visible,.app-sidebar__close-btn:focus-visible,.app-sidebar__link:focus-visible,.mobile-menu-btn:focus-visible,.app-sidebar__user:focus-visible{outline:2px solid var(--primary, #168bff);outline-offset:2px}.app-sidebar__chevron{transition:transform .24s cubic-bezier(.4,0,.2,1)}.app-shell.is-sidebar-collapsed .app-sidebar__chevron,html[dir=ltr] .app-sidebar__chevron{transform:rotate(180deg)}html[dir=ltr] .app-shell.is-sidebar-collapsed .app-sidebar__chevron{transform:rotate(0)}.app-sidebar__nav{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding-block:var(--space-3, 12px);scrollbar-width:thin;scrollbar-color:var(--border, #e5e7eb) transparent}.app-sidebar__nav::-webkit-scrollbar{width:4px}.app-sidebar__nav::-webkit-scrollbar-thumb{background:var(--border, #e5e7eb);border-radius:999px}.app-sidebar__group+.app-sidebar__group{margin-block-start:var(--space-3, 12px)}.app-sidebar__group-title{margin:0 0 var(--space-2, 8px);padding-inline:var(--space-4, 16px);font-size:11px;font-weight:700;color:var(--text-muted, #9ca3af);letter-spacing:0}.app-sidebar__list{list-style:none;margin:0;padding:0 var(--space-2, 8px);display:flex;flex-direction:column;gap:3px}.app-sidebar__item{position:relative}.app-sidebar__item.is-hidden{display:none}.app-sidebar__link{position:relative;min-height:46px;display:flex;align-items:center;gap:var(--space-3, 12px);padding-block:10px;padding-inline:12px;border-radius:10px;color:var(--text-secondary, #6b7280);font-size:14px;font-weight:500;line-height:1.35;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:background-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease}.app-sidebar__link:hover{background:var(--surface-soft, #f8fafc);color:var(--text-primary, #111827);transform:translateY(-1px)}.app-sidebar__link:active{transform:scale(.985)}.app-sidebar__link.is-active{background:#168bff1a;color:var(--primary, #168bff);font-weight:700;box-shadow:inset 0 0 0 1px #168bff14}.app-sidebar__link.is-active:before{content:"";position:absolute;inset-block:8px;inset-inline-start:-8px;width:3px;border-radius:999px;background:var(--primary, #168bff)}.app-sidebar__icon{width:22px;height:22px;color:var(--text-muted, #9ca3af)}.app-sidebar__icon svg{width:20px;height:20px}.app-sidebar__link:hover .app-sidebar__icon,.app-sidebar__link.is-active .app-sidebar__icon{color:var(--primary, #168bff)}.app-sidebar__label{min-width:0;flex:1 1 auto}.app-shell.is-sidebar-collapsed .app-sidebar__brand-name,.app-shell.is-sidebar-collapsed .app-sidebar__group-title,.app-shell.is-sidebar-collapsed .app-sidebar__label,.app-shell.is-sidebar-collapsed .app-sidebar__user-info{display:none}.app-shell.is-sidebar-collapsed .app-sidebar__brand{justify-content:center}.app-shell.is-sidebar-collapsed .app-sidebar__link{justify-content:center;gap:0;padding-inline:0}.app-shell.is-sidebar-collapsed .app-sidebar__footer{padding-inline:0;display:flex;justify-content:center}.app-sidebar__footer{flex:0 0 auto;padding:var(--space-3, 12px);border-top:1px solid var(--border, #e5e7eb);background:var(--surface-soft, #f8fafc)}.app-sidebar__user{display:flex;align-items:center;gap:var(--space-2, 8px);min-width:0;padding:6px 8px;border-radius:10px}.app-sidebar__user-avatar,.user-avatar{width:36px;height:36px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;background:var(--primary, #168bff);color:#fff;font-size:14px;font-weight:700}.app-sidebar__user-info,.user-info{min-width:0;display:flex;flex-direction:column}.app-sidebar__user-name,.user-name{overflow:hidden;color:var(--text-primary, #111827);font-size:13px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.app-sidebar__user-role,.user-role{overflow:hidden;color:var(--text-secondary, #6b7280);font-size:11px;text-overflow:ellipsis;white-space:nowrap}.sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:900;opacity:0;visibility:hidden;pointer-events:none;border:0;border-radius:0;padding:0;background:#0f172a75;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);cursor:pointer;transition:opacity .24s ease,visibility .24s ease}.sidebar-overlay.is-visible{opacity:1;visibility:visible;pointer-events:auto}body.sidebar-mobile-open{overflow:hidden!important}.topbar{position:sticky;inset-block-start:0;z-index:90;height:64px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4, 16px);padding-inline:var(--space-6, 24px);background:var(--surface, #fff);border-bottom:1px solid var(--border, #e5e7eb)}.topbar-left,.topbar-right,.user-profile{min-width:0;display:flex;align-items:center;gap:var(--space-3, 12px)}.mobile-menu-btn{display:none}.page-title{margin:0;color:var(--text-primary, #111827);font-size:20px;font-weight:600}.main-content{flex:1 1 auto;width:min(100%,var(--content-max-width, 1600px));margin-inline:auto;padding:var(--space-6, 24px)}.database-compatibility-notice{margin:var(--space-4, 16px) var(--space-6, 24px) 0;padding:var(--space-3, 12px) var(--space-4, 16px);border:1px solid #fde68a;border-radius:var(--radius-md, 12px);background:#fffbeb;color:#92400e;font-size:13px;line-height:1.5}.app-footer{padding:var(--space-4, 16px) var(--space-6, 24px);border-top:1px solid var(--border, #e5e7eb);color:var(--text-muted, #9ca3af);font-size:12px;text-align:center}.sidebar-tooltip{position:fixed;z-index:1200;max-width:min(280px,calc(100vw - 24px));display:flex;align-items:center;gap:var(--space-3, 12px);padding:10px 12px;border:1px solid var(--border, #e5e7eb);border-radius:10px;background:var(--surface, #fff);box-shadow:0 14px 36px #0f172a24;color:var(--text-primary, #111827);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(2px);transition:opacity .16s ease,visibility .16s ease,transform .16s ease}.sidebar-tooltip.is-visible{opacity:1;visibility:visible;transform:translateY(0)}.sidebar-tooltip__icon{width:32px;height:32px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--primary, #168bff);background:#168bff1a;font-size:13px;font-weight:700}.sidebar-tooltip__icon svg{width:18px;height:18px}.sidebar-tooltip__content{min-width:0;display:flex;flex-direction:column;gap:2px}.sidebar-tooltip__title{color:var(--text-primary, #111827);font-size:13px;font-weight:700;line-height:1.35}.sidebar-tooltip__description{color:var(--text-secondary, #6b7280);font-size:11px;line-height:1.45;white-space:normal}@media (min-width: 768px) and (max-width: 1199px){.app-shell{grid-template-columns:var(--sidebar-collapsed-width, 76px) minmax(0,1fr)}.app-sidebar{width:var(--sidebar-collapsed-width, 76px)}.app-sidebar__collapse-btn{display:none}}@media (max-width: 767px){.app-shell{grid-template-columns:1fr}.app-sidebar{position:fixed;inset-block:0;inset-inline-start:0;z-index:1000;width:min(86vw,320px);max-width:calc(100vw - 24px);height:100dvh;transform:translate(105%);box-shadow:0 18px 48px #0f172a38}html[dir=ltr] .app-sidebar{transform:translate(-105%)}.app-sidebar.app-sidebar--mobile-open{transform:translate(0)}.app-sidebar__collapse-btn{display:none}.app-sidebar__close-btn{display:inline-flex}.app-shell.is-sidebar-collapsed .app-sidebar__brand-name,.app-shell.is-sidebar-collapsed .app-sidebar__group-title,.app-shell.is-sidebar-collapsed .app-sidebar__label,.app-shell.is-sidebar-collapsed .app-sidebar__user-info,.app-sidebar__brand-name,.app-sidebar__group-title,.app-sidebar__label{display:initial}.app-sidebar__user-info{display:flex}.app-sidebar__link,.app-shell.is-sidebar-collapsed .app-sidebar__link{justify-content:flex-start;gap:var(--space-3, 12px);padding-inline:14px}.app-sidebar__footer,.app-shell.is-sidebar-collapsed .app-sidebar__footer{display:block;padding:var(--space-3, 12px)}.mobile-menu-btn{display:inline-flex}.topbar{padding-inline:var(--space-4, 16px)}.topbar .user-info{display:none}.main-content{padding:var(--space-4, 16px)}.sidebar-tooltip{display:none}}@media (prefers-reduced-motion: reduce){.app-shell,.app-sidebar,.app-sidebar__chevron,.app-sidebar__link,.sidebar-overlay,.sidebar-tooltip{transition:none!important;animation:none!important}}