:root{--bg:#f3f6f8;--bg-elevated:#fff;--ink:#13242f;--muted:#5d7382;--line:#d7e2e8;--brand:#0f6e7c;--brand-dark:#0b4f59;--brand-soft:#e6f4f6;--accent:#c9842f;--success:#1f8a5b;--danger:#c23b3b;--warning:#c9851a;--shadow:0 10px 30px #13242f14;--radius:18px;--sidebar:270px;--font:"Manrope", "IBM Plex Sans Arabic", sans-serif;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--touch-min:44px}[dir=rtl]{--font:"IBM Plex Sans Arabic", "Manrope", sans-serif}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;min-height:100%;overflow-x:hidden}html,body,#root{max-width:100%;min-height:100%}body{font-family:var(--font);color:var(--ink);background:radial-gradient(circle at top left, #0f6e7c14, transparent 28%), radial-gradient(circle at top right, #c9842f14, transparent 24%), linear-gradient(180deg, #eef4f6 0%, var(--bg) 40%, #eef3f5 100%);padding-top:var(--safe-top);padding-bottom:var(--safe-bottom);padding-left:var(--safe-left);padding-right:var(--safe-right);margin:0;overflow-x:hidden}body.drawer-open{touch-action:none;overflow:hidden}img,svg,canvas,video{max-width:100%;height:auto}.responsive-media,.product-image,.receipt-image{object-fit:cover;border-radius:12px;width:auto;max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;max-width:100%}button{cursor:pointer}input,select,textarea{line-height:1.35;font-size:16px!important}.app-shell{grid-template-columns:var(--sidebar) 1fr;width:100%;max-width:100%;min-height:100dvh;display:grid;overflow-x:hidden}.sidebar{color:#eff7f8;height:100dvh;padding:1.25rem 1rem;padding-top:calc(1.25rem + var(--safe-top));padding-bottom:calc(1.25rem + var(--safe-bottom));-webkit-overflow-scrolling:touch;background:linear-gradient(#103944 0%,#0d2f38 55%,#0b2830 100%);flex-direction:column;gap:1rem;display:flex;position:sticky;top:0;overflow:auto}.brand{border-bottom:1px solid #ffffff14;padding:.75rem .85rem 1rem}.brand h1{letter-spacing:.02em;word-break:break-word;margin:0;font-size:1.25rem}.brand p{color:#eff7f8b3;word-break:break-word;margin:.35rem 0 0;font-size:.85rem}.sidebar-close{display:none}.nav-link{min-height:var(--touch-min);color:#eff7f8d1;border-radius:12px;align-items:center;gap:.75rem;padding:.75rem .9rem;transition:all .2s;display:flex}.nav-link:hover,.nav-link.active{color:#fff;background:#ffffff14}.nav-link.active{box-shadow:inset 3px 0 0 var(--accent)}[dir=rtl] .nav-link.active{box-shadow:inset -3px 0 0 var(--accent)}.main{width:100%;min-width:0;max-width:100%;padding:1.25rem 1.5rem 2rem;overflow-x:hidden}.topbar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow);background:#ffffffc7;border:1px solid #d7e2e8e6;border-radius:16px;justify-content:space-between;align-items:center;gap:.75rem;max-width:100%;margin-bottom:1.25rem;padding:.85rem 1rem;display:flex}.topbar-left{flex:1;align-items:center;gap:.65rem;min-width:0;display:flex}.topbar-text{min-width:0;overflow:hidden}.topbar h2{white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:1.2rem;overflow:hidden}.topbar-user{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;overflow:hidden}.topbar-actions{flex-shrink:0;align-items:center;gap:.6rem;display:flex}.btn{min-height:var(--touch-min);background:var(--brand);color:#fff;border:none;border-radius:12px;justify-content:center;align-items:center;gap:.35rem;padding:.7rem 1rem;font-weight:600;transition:all .2s;display:inline-flex}.btn:hover{background:var(--brand-dark)}.btn.secondary{background:var(--brand-soft);color:var(--brand-dark)}.btn.danger{background:var(--danger)}.btn.ghost{color:inherit;border:1px solid var(--line);background:0 0}.btn:disabled{opacity:.6;cursor:not-allowed}.btn.icon-btn{width:var(--touch-min);min-width:var(--touch-min);padding:0}.btn-excel{background:#1f7a46}.btn-excel:hover{background:#176338}.btn-pdf{background:#b42318}.btn-pdf:hover{background:#912018}.reports-actions{width:100%;max-width:100%}.reports-actions select,.reports-actions input[type=date],.reports-actions .btn{min-height:var(--touch-min);border-radius:12px;font-size:16px}.reports-actions select,.reports-actions input[type=date]{border:1px solid var(--line);background:#fff;max-width:100%;padding:.65rem}.reports-check{min-height:var(--touch-min);border:1px solid var(--line);white-space:nowrap;background:#fff;border-radius:12px;align-items:center;gap:.45rem;padding:.35rem .55rem;display:inline-flex}.reports-check input{width:18px;height:18px}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:.8s linear infinite spin}.card{background:var(--bg-elevated);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);max-width:100%;padding:1.1rem;overflow:hidden}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-bottom:1rem;display:grid}.stat-card{border:1px solid var(--line);box-shadow:var(--shadow);background:linear-gradient(160deg,#fff 0%,#f7fbfc 100%);border-radius:18px;min-width:0;padding:1.1rem;animation:.45s both rise;overflow:hidden}.stat-card:nth-child(2){animation-delay:50ms}.stat-card:nth-child(3){animation-delay:.1s}.stat-card:nth-child(4){animation-delay:.15s}.stat-card .label{color:var(--muted);word-break:break-word;margin-bottom:.4rem;font-size:.9rem}.stat-card .value{color:var(--brand-dark);word-break:break-word;overflow-wrap:anywhere;font-size:clamp(1.05rem,4vw,1.55rem);font-weight:800;line-height:1.25}.panel-grid{grid-template-columns:1.2fr 1fr;gap:1rem;max-width:100%;display:grid}.chart-box{width:100%;min-width:0;max-width:100%;height:260px;overflow:hidden}.table-wrap{-webkit-overflow-scrolling:touch;width:100%;max-width:100%;overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{text-align:start;border-bottom:1px solid var(--line);white-space:nowrap;padding:.8rem .65rem}th{color:var(--muted);font-size:.85rem;font-weight:700}tr:hover td{background:#f8fbfc}.badge{border-radius:999px;align-items:center;max-width:100%;padding:.25rem .55rem;font-size:.78rem;font-weight:700;display:inline-flex}.badge.success{color:var(--success);background:#e8f7ef}.badge.danger{color:var(--danger);background:#fdecec}.badge.warning{color:var(--warning);background:#fff5e8}.badge.info{background:var(--brand-soft);color:var(--brand-dark)}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;display:grid}.form-grid.one{grid-template-columns:1fr}.field{flex-direction:column;gap:.35rem;min-width:0;display:flex}.field label{color:var(--muted);font-size:.88rem;font-weight:600}.field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--danger)}.field-error{color:var(--danger);font-size:.82rem;font-weight:600}.field input,.field select,.field textarea{border:1px solid var(--line);min-height:var(--touch-min);background:#fff;border-radius:12px;width:100%;padding:.8rem .85rem}.field textarea{resize:vertical;min-height:90px}.field-inline{align-items:stretch;gap:.5rem;width:100%;display:flex}.field-inline>*{min-width:0}.field-inline input{flex:1}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;max-width:100%;margin-bottom:1rem;display:flex}.toolbar-actions{flex-wrap:wrap;gap:.5rem;width:auto;display:flex}.toolbar-actions .btn,.toolbar-actions input,.toolbar-actions select{min-height:var(--touch-min)}.auth-page{min-height:100dvh;padding:calc(1.25rem + var(--safe-top)) 1rem calc(1.25rem + var(--safe-bottom));background:linear-gradient(135deg,#0f6e7ceb,#0b2830f2),url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");place-items:center;display:grid}.auth-card{background:#fffffff5;border-radius:24px;width:min(440px,100%);padding:1.5rem;animation:.5s rise;box-shadow:0 20px 50px #00000040}.auth-card h1{color:var(--brand-dark);margin:0 0 .35rem;font-size:clamp(1.35rem,5vw,1.75rem)}.auth-card .subtitle{color:var(--muted);margin:0 0 1.4rem}.auth-alert{color:#8a5a10;word-break:break-word;background:#fff5e8;border-radius:12px;margin-bottom:1rem;padding:.75rem .9rem;font-size:.92rem}.error-box,.success-box{word-break:break-word;overflow-wrap:anywhere;border-radius:12px;margin-bottom:1rem;padding:.75rem .9rem}.error-box{color:var(--danger);background:#fdecec}.success-box{color:var(--success);background:#e8f7ef}.modal-backdrop{z-index:60;background:#0a181e73;place-items:end center;padding:0;animation:.2s fade;display:grid;position:fixed;inset:0;overflow:hidden}.modal-backdrop.nested{z-index:70;background:#0a181e8c}.modal{-webkit-overflow-scrolling:touch;width:min(720px,100%);max-height:min(92dvh,92vh);padding:1.25rem;padding-bottom:calc(1.25rem + var(--safe-bottom));background:#fff;border-radius:20px;max-width:calc(100% - 1.5rem);margin:auto;overflow:auto;box-shadow:0 24px 60px #00000040}.modal.modal-wide{width:min(980px,96vw);max-width:min(980px,100% - 1.5rem)}.modal.modal-panel{flex-direction:column;max-height:85dvh;padding-bottom:1rem;display:flex;overflow:hidden}.modal.modal-panel .modal-header{flex:none;margin-bottom:.75rem}.modal h3{word-break:break-word;margin:0;font-size:1.1rem}.modal-header{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.cats-modal-body{flex-direction:column;flex:auto;gap:.75rem;min-height:0;display:flex;overflow:hidden}.cats-sticky-top{border-bottom:1px solid var(--line);flex-direction:column;flex:none;gap:.65rem;padding-bottom:.35rem;display:flex}.cats-edit-banner{background:var(--brand-soft);color:var(--brand-dark);border-radius:10px;padding:.45rem .7rem;font-size:.9rem;font-weight:600}.cats-form{gap:.65rem;margin:0}.cats-form .field{margin:0}.cats-form-actions{flex-wrap:wrap;grid-column:1/-1;justify-content:flex-end;gap:.5rem;display:flex}.cats-toolbar{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.cats-search{min-height:var(--touch-min);border:1px solid var(--line);border-radius:12px;flex:220px;max-width:100%;padding:.65rem .8rem;font-size:16px}.cats-filters{flex-wrap:wrap;gap:.35rem;display:flex}.cats-filter-btn{min-height:40px;padding:.45rem .8rem}.cats-filter-btn.active{background:var(--brand);color:#fff;border-color:var(--brand)}.cats-list-scroll{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex:auto;min-height:0;overflow:auto}.cats-table-wrap{width:100%;max-width:100%;overflow:visible}.cats-table{border-collapse:separate;border-spacing:0;width:100%}.cats-table thead th{z-index:2;border-bottom:1px solid var(--line);white-space:nowrap;background:#eef4f6;padding:.55rem .65rem;font-size:.86rem;position:sticky;top:0}.cats-table tbody td{vertical-align:middle;border-bottom:1px solid #d7e2e8d9;padding:.45rem .65rem;font-size:.92rem}.cats-table tbody tr:nth-child(2n) td{background:#f7fafb}.cats-table tbody tr.is-editing td{background:#e8f4f6}.cats-table tbody tr:hover td{background:#eef7f8}.cats-row-actions{gap:.35rem}.cats-row-actions .btn{min-height:36px;padding:.4rem .7rem;font-size:.86rem}.cats-cards{display:none}.modal-actions{background:linear-gradient(#ffffffb3,#fff 35%);flex-wrap:wrap;justify-content:flex-end;gap:.6rem;margin-top:1rem;padding-top:.75rem;display:flex;position:sticky;bottom:0}.modal-actions .btn{min-width:120px}.row-actions{flex-wrap:wrap;gap:.45rem;display:flex}.empty{text-align:center;color:var(--muted);padding:2rem 1rem}.mobile-toggle{display:none}.sidebar-overlay{opacity:0;pointer-events:none;transition:opacity .2s;display:none}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fade{0%{opacity:0}to{opacity:1}}@media (width<=1100px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.panel-grid{grid-template-columns:1fr}}@media (width<=860px){.app-shell{grid-template-columns:1fr}.sidebar-overlay{z-index:45;background:#0006;display:block;position:fixed;inset:0}.sidebar-overlay.open{opacity:1;pointer-events:auto}.sidebar{z-index:50;width:min(86vw,320px);max-width:100%;transition:transform .28s;position:fixed;top:0;bottom:0;box-shadow:0 0 40px #00000040}[dir=ltr] .sidebar{left:0;right:auto;transform:translate(-105%)}[dir=rtl] .sidebar{left:auto;right:0;transform:translate(105%)}.sidebar.open{transform:translate(0)!important}.sidebar-close{align-self:flex-end;margin:.15rem .25rem 0;display:inline-flex}.mobile-toggle{display:inline-flex}.main{padding:.85rem;padding-bottom:calc(1.25rem + var(--safe-bottom))}.topbar{align-items:flex-start;gap:.5rem;padding:.75rem}.topbar h2{font-size:1.05rem}.topbar-user{font-size:.82rem}.topbar-actions .btn{padding-inline:.75rem;font-size:.9rem}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.stat-card{padding:.9rem}.stat-card .value{font-size:1.15rem}.form-grid{grid-template-columns:1fr}.toolbar{align-items:stretch}.toolbar>h3{width:100%;margin:0}.toolbar-actions{width:100%}.toolbar-actions>*{flex:100%}.toolbar .btn,.toolbar-actions .btn{width:100%}.reports-actions{grid-template-columns:1fr;gap:.5rem;display:grid}.reports-actions .btn-excel,.reports-actions .btn-pdf,.reports-actions .btn{width:100%;max-width:100%}.reports-check{justify-content:flex-start;width:100%}.field-inline{flex-direction:column}.field-inline .btn{width:100%}.modal-backdrop{place-items:end center;padding:0}.modal{width:100%;max-width:100%;max-height:calc(100dvh - var(--safe-top) - .5rem);padding:1rem 1rem calc(1rem + var(--safe-bottom));border-radius:20px 20px 0 0;margin:0}.modal.modal-wide,.modal.modal-panel{width:100%;max-width:100%;max-height:calc(100dvh - var(--safe-top) - .5rem)}.modal-actions{flex-direction:column-reverse}.modal-actions .btn{width:100%;min-width:0}.cats-form-actions{flex-direction:column-reverse}.cats-form-actions .btn{width:100%}.cats-toolbar{flex-direction:column;align-items:stretch}.cats-search{flex:auto;width:100%}.cats-filters{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;display:grid}.cats-filter-btn{width:100%;min-width:0;padding-inline:.35rem;font-size:.85rem}.cats-table-wrap{display:none}.cats-cards{flex-direction:column;gap:.65rem;max-width:100%;padding-bottom:.25rem;display:flex;overflow-x:hidden}.cats-card{border:1px solid var(--line);background:#fff;border-radius:14px;flex-direction:column;gap:.65rem;max-width:100%;padding:.85rem;display:flex}.cats-card.is-editing{border-color:var(--brand);background:#f3fafb}.cats-card-main{justify-content:space-between;align-items:flex-start;gap:.6rem;display:flex}.cats-card-names{flex-direction:column;gap:.2rem;min-width:0;display:flex}.cats-card-names strong,.cats-card-names span{word-break:break-word}.cats-card-names span{color:var(--muted);font-size:.9rem}.cats-card-meta{color:var(--muted);font-size:.88rem}.cats-card .cats-row-actions{grid-template-columns:1fr;width:100%;display:grid}.cats-card .cats-row-actions .btn{width:100%;min-height:var(--touch-min)}.chart-box{height:220px}.table-wrap{overflow:visible}.table-wrap table,.table-wrap thead,.table-wrap tbody,.table-wrap th,.table-wrap td,.table-wrap tr{width:100%;display:block}.table-wrap thead{display:none}.table-wrap tr{border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:16px;margin-bottom:.75rem;padding:.9rem 1rem}.table-wrap tr:hover td{background:0 0}.table-wrap td{white-space:normal;text-align:end;border-bottom:1px solid #d7e2e8a6;justify-content:space-between;align-items:flex-start;gap:.75rem;padding:.55rem 0;display:flex}.table-wrap td:last-child{border-bottom:none;padding-bottom:0}.table-wrap td:before{content:attr(data-label);color:var(--muted);text-align:start;flex:0 0 42%;max-width:48%;font-size:.82rem;font-weight:700}.table-wrap td>*{max-width:58%}.table-wrap td .row-actions,.table-wrap td.actions-cell{flex-wrap:wrap;justify-content:flex-end}.table-wrap td.actions-cell{flex-direction:column;align-items:stretch}.table-wrap td.actions-cell:before{flex:none;max-width:100%;margin-bottom:.35rem}.table-wrap td.actions-cell .row-actions,.table-wrap td.actions-cell .btn{width:100%;max-width:100%}.table-wrap td .empty{text-align:center;width:100%;max-width:100%}.table-wrap tr td[colspan]{text-align:center;display:block}.table-wrap tr td[colspan]:before{display:none}.row-actions .btn{width:100%}}@media (width<=374px){.stats-grid{grid-template-columns:1fr}.main{padding:.7rem}.topbar-actions .btn span.lang-full{display:none}.auth-card{padding:1.15rem}.stat-card .value{font-size:1.05rem}}@media (width<=359px){.stats-grid{grid-template-columns:1fr}}