:root{
  --bg:#f8fafc;
  --card:#ffffff;
  --line:#e2e8f0;
  --text:#0f172a;
  --muted:#64748b;
  --dark:#0f172a;
  --accent:#111827;
  --soft:#f1f5f9;
  --success:#dcfce7;
  --success-text:#15803d;
  --warn:#fef3c7;
  --warn-text:#b45309;
  --danger:#fee2e2;
  --danger-text:#b91c1c;
}
*{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
body{margin:0;font-family:"Cairo",sans-serif;background:var(--bg);color:var(--text);font-size:14px}
.hidden{display:none!important}
.small{font-size:12px;color:var(--muted)}

/* login */
.login-screen{min-height:100vh;padding:18px}
.login-grid{max-width:1200px;margin:0 auto;min-height:calc(100vh - 36px);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:20px;align-items:center}
.hero-card,.form-card,.card,.table-card,.filters-bar{background:var(--card);border:1px solid var(--line);border-radius:24px;box-shadow:0 8px 30px rgba(15,23,42,.05)}
.hero-card{background:linear-gradient(135deg,#0f172a,#1e293b);color:#fff;padding:30px;display:flex;flex-direction:column;justify-content:space-between;min-height:580px}
.badge{display:inline-flex;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:700}
.badge.dark{background:rgba(255,255,255,.12);color:#fff}
.hero-card h1{font-size:clamp(30px,4vw,42px);line-height:1.25;margin:18px 0 12px}
.hero-card p{max-width:620px;color:#cbd5e1;line-height:1.9}
.hero-boxes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:24px}
.mini-box{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);border-radius:18px;padding:16px}
.mini-box strong{display:block;font-size:17px;margin-bottom:6px}.mini-box span{font-size:13px;color:#cbd5e1}
.form-card{padding:28px}
.form-head{display:flex;align-items:center;gap:14px;margin-bottom:20px}.form-head h2{margin:0;font-size:30px}.form-head p{margin:4px 0 0;color:var(--muted)}
.logo-box{width:56px;height:56px;border-radius:18px;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
label{display:block;margin:14px 0 8px;font-size:14px;font-weight:700;color:#334155}
input,select{width:100%;height:44px;padding:0 14px;border:1px solid var(--line);border-radius:16px;background:#fff;font-family:inherit;font-size:14px;min-width:0}
.primary-btn,.ghost-btn,.outline-btn,.menu-btn,.menu-chip{height:42px;border:none;border-radius:16px;padding:0 14px;font-family:inherit;font-weight:700;cursor:pointer;transition:.2s}
.primary-btn{background:var(--dark);color:#fff}.primary-btn:hover{opacity:.92}
.primary-btn.full{width:100%;margin-top:18px;height:48px;font-size:15px}
.ghost-btn{background:var(--soft);color:var(--text);border:1px solid var(--line)}
.outline-btn{background:#fff;border:1px solid var(--line);color:var(--text)}
.note-box{margin-top:22px;padding:16px;border-radius:18px;background:var(--soft);color:#475569}.note-box strong{display:block;margin-bottom:8px;color:var(--text)}

/* app shell */
.app-shell{display:grid;grid-template-columns:minmax(220px,250px) minmax(0,1fr);min-height:100vh;max-width:100vw;overflow:hidden}
.sidebar{background:#fff;border-left:1px solid var(--line);display:flex;flex-direction:column;min-width:0}
.sidebar-head{padding:18px;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:center}.sidebar-logo{width:46px;height:46px;border-radius:16px;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;flex:0 0 auto}
.sidebar-head h3{margin:0;font-size:16px}.sidebar-head p{margin:4px 0 0;font-size:12px;color:var(--muted)}
.sidebar-menu{padding:12px;overflow:auto;flex:1}.menu-btn{width:100%;display:flex;align-items:center;gap:12px;text-align:right;padding:12px 14px;background:transparent;border-radius:16px;color:#334155;margin-bottom:5px;height:auto;line-height:1.4}
.menu-btn:hover{background:var(--soft)}.menu-btn.active{background:var(--dark);color:#fff}
.sidebar-user{padding:14px;border-top:1px solid var(--line);display:flex;gap:12px;align-items:center}.user-avatar{width:40px;height:40px;border-radius:50%;background:var(--soft);display:flex;align-items:center;justify-content:center;font-weight:800;flex:0 0 auto}.sidebar-user strong{display:block;font-size:13px}.sidebar-user span{display:block;font-size:11px;color:var(--muted)}
.main-content{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.topbar{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.topbar h1{margin:0;font-size:clamp(20px,2.8vw,26px)}.topbar p{margin:4px 0 0;color:var(--muted);font-size:13px}.topbar-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;min-width:0}.search-input{width:min(240px,100%);background:#fff}
.mobile-menu{display:none}
.mobile-menu-bar{display:none;padding:10px 14px;border-bottom:1px solid var(--line);background:#fff;overflow:auto;white-space:nowrap;gap:8px}
.menu-chip{display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);color:#334155;margin-left:8px;padding:0 12px}
.menu-chip.active{background:var(--dark);color:#fff;border-color:var(--dark)}
.view-container{padding:18px;overflow-x:hidden}
.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px;flex-wrap:wrap}.section-head h2{margin:0;font-size:clamp(20px,2.6vw,24px)}.section-head p{margin:6px 0 0;color:var(--muted);font-size:13px}
.section-actions{display:flex;gap:8px;flex-wrap:wrap}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.stat-card{padding:16px}.stat-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.stat-top .icon{width:42px;height:42px;border-radius:15px;background:var(--soft);display:flex;align-items:center;justify-content:center;font-size:18px;flex:0 0 auto}.stat-card h3{margin:8px 0 0;font-size:clamp(24px,3vw,30px)}.stat-card p{margin:0;color:var(--muted);font-size:13px}.stat-card .delta{margin-top:8px;font-size:12px;color:var(--muted)}
.grid-2-1{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(320px,.9fr);gap:14px;margin-top:14px}
.card-head{padding:16px 16px 0}.card-head h3{margin:0;font-size:18px}.card-body{padding:16px}.mini-activity{border:1px solid var(--line);border-radius:18px;padding:12px;margin-bottom:10px}.mini-activity strong{display:block}.mini-activity .small{margin-top:4px}
.filters-bar{padding:12px;margin-bottom:14px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.filters-left,.filters-right{display:flex;gap:8px;flex-wrap:wrap;align-items:center;min-width:0}.filters-left{flex:1}.filters-left .search-input{width:min(260px,100%)}
.table-card{overflow:hidden}.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;background:#fff;min-width:780px}th,td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:right;font-size:13px;white-space:nowrap}th{background:#f8fafc;color:#334155;font-weight:800;position:sticky;top:0}.table-actions{display:flex;gap:6px}
.table-actions .outline-btn,.table-actions .primary-btn{height:36px;border-radius:14px;padding:0 12px}
.status{display:inline-flex;align-items:center;justify-content:center;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid transparent}
.status.confirmed,.status.نشط,.status.طبيعي{background:var(--success);color:var(--success-text);border-color:#bbf7d0}.status.draft{background:var(--warn);color:var(--warn-text);border-color:#fde68a}.status.cancelled,.status.نعم,.status.تنبيه{background:var(--danger);color:var(--danger-text);border-color:#fecaca}.status.مصفر{background:#fff7ed;color:#c2410c;border-color:#fdba74}.status.لا{background:#f1f5f9;color:#475569;border-color:#e2e8f0}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.info-box{padding:16px;border-radius:20px;border:1px solid var(--line);background:#fff}
.info-box strong{display:block;margin-bottom:8px}
.setting-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.setting-card{padding:18px}.setting-card h3{margin:0 0 14px}.setting-card .stack>*+*{margin-top:12px}

@media (max-width: 1400px){
  .app-shell{grid-template-columns:220px minmax(0,1fr)}
  .topbar{padding:12px 16px}
  .view-container{padding:16px}
  .grid-2-1{grid-template-columns:1fr}
}

@media (max-width: 1180px){
  .app-shell{grid-template-columns:1fr}
  .sidebar{display:none}
  .mobile-menu-bar{display:flex}
  .topbar{padding:12px 14px}
}

@media (max-width: 1100px){
  .login-grid{grid-template-columns:1fr}
  .hero-card{min-height:auto}
}

@media (max-width: 820px){
  .topbar{flex-direction:column;align-items:stretch}
  .topbar-actions{width:100%}
  .topbar-actions .search-input{flex:1;width:100%}
  .filters-left,.filters-right{width:100%}
  .filters-left .search-input{width:100%}
  .setting-grid{grid-template-columns:1fr}
}

@media (max-width: 700px){
  .login-screen{padding:12px}
  .hero-card,.form-card,.card,.table-card,.filters-bar{border-radius:20px}
  .hero-card{padding:20px}
  .hero-boxes{grid-template-columns:1fr}
  .form-card{padding:20px}
  .view-container{padding:12px}
  .stats-grid,.info-grid{grid-template-columns:1fr}
  table{min-width:640px}
}

.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.35);display:flex;align-items:center;justify-content:center;padding:16px;z-index:100}
.modal-card{width:min(760px,100%);background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 18px 50px rgba(15,23,42,.18);overflow:hidden}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px;border-bottom:1px solid var(--line)}
.modal-head h3{margin:0;font-size:22px}
.modal-body{padding:18px;display:grid;gap:14px}
.modal-actions{padding:0 18px 18px;display:flex;justify-content:flex-start;gap:8px;flex-wrap:wrap}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.modal-error{padding:10px 12px;border-radius:14px;background:#fff1f2;border:1px solid #fecdd3;color:#be123c;font-size:13px;white-space:pre-line}
@media (max-width:760px){.form-grid{grid-template-columns:1fr}.modal-card{border-radius:20px}}

.invoice-items-box{border:1px solid var(--line);border-radius:20px;padding:12px;background:#fff}
.invoice-items-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.invoice-items-table{min-width:980px}
.invoice-items-table select,.invoice-items-table input{width:100%;min-width:92px;height:40px;border:1px solid var(--line);border-radius:12px;padding:0 10px;background:#fff}
.small-btn{height:34px;padding:0 10px;border-radius:12px}
.invoice-summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.invoice-summary-grid .info-box{padding:12px;border-radius:16px}
.invoice-summary-grid .info-box span{display:block;margin-top:8px;font-weight:700;color:#0f172a}
@media (max-width: 900px){.invoice-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 600px){.invoice-summary-grid{grid-template-columns:1fr}}



/* v19 invoice form visibility improvements */
.modal-card{
  width:min(1180px, 100%);
  max-height:92vh;
  display:flex;
  flex-direction:column;
}
.modal-body{
  overflow:auto;
  max-height:calc(92vh - 150px);
}
.invoice-top-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.invoice-quick-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  align-items:end;
}
.invoice-items-box{
  border:1px solid var(--line);
  border-radius:20px;
  padding:14px;
  background:#fff;
  margin-top:2px;
}
.invoice-items-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:10px;
}
.invoice-hot-hint,.invoice-items-note{
  font-size:12px;
  color:#64748b;
  margin-top:4px;
}
.invoice-items-table{
  min-width:1260px;
}
.invoice-item-sku,.invoice-item-unit,.invoice-item-balance{
  font-weight:700;
  color:#334155;
}
.invoice-item-sku.warn,.invoice-item-balance.warn,
.row-stock-warn .invoice-item-sku,
.row-stock-warn .invoice-item-balance{
  color:#b91c1c;
}
.invoice-stock-alert{
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid #fecaca;
  background:#fff7ed;
  color:#9a3412;
  font-size:13px;
}
.invoice-stock-alert-line{margin-bottom:6px}.invoice-stock-alert-line:last-child{margin-bottom:0}.invoice-stock-alert.hidden{display:none}
@media (max-width:1100px){
  .invoice-top-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .invoice-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:760px){
  .invoice-top-grid,.invoice-quick-grid{grid-template-columns:1fr;}
  .modal-card{width:min(100%,100%);}
}


/* v20 invoice items first-look fix */
.modal-card{width:min(1280px,100%);max-height:94vh;}
.modal-body{max-height:calc(94vh - 150px);padding:16px;display:grid;gap:10px;}
.invoice-top-grid.invoice-top-grid-primary{grid-template-columns:repeat(4,minmax(0,1fr));}
.invoice-top-grid.invoice-top-grid-secondary{grid-template-columns:repeat(4,minmax(0,1fr));}
.invoice-quick-grid.invoice-quick-grid-compact{grid-template-columns:repeat(2,minmax(0,1fr));}
.invoice-items-box{margin-top:0;padding:12px;border-radius:18px;}
.invoice-items-head{margin-bottom:8px;}
.invoice-items-table{min-width:1100px;}
.invoice-items-table th,.invoice-items-table td{padding:8px 10px;}
.invoice-summary-grid{grid-template-columns:repeat(5,minmax(0,1fr));}
@media (max-width:1180px){
  .invoice-top-grid.invoice-top-grid-primary,.invoice-top-grid.invoice-top-grid-secondary{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:760px){
  .invoice-top-grid.invoice-top-grid-primary,.invoice-top-grid.invoice-top-grid-secondary,.invoice-quick-grid.invoice-quick-grid-compact{grid-template-columns:1fr;}
}

.fixed-notes{width:100%;min-height:88px;max-height:88px;height:88px;resize:none;overflow:auto;border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:#fff;}


.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:16px}
.info-box{border:1px solid #e2e8f0;border-radius:18px;padding:12px 14px;background:#fff;font-size:14px;display:flex;flex-direction:column;gap:6px}
.info-box strong{font-size:12px;color:#64748b}
.mini-activity{border:1px solid #e2e8f0;border-radius:18px;padding:12px;background:#fff;margin-bottom:10px}
.mini-activity .small{font-size:12px;color:#64748b;margin-top:4px}


/* v1.1.4 ACTIVE UI FLICKER FIX
   Applied to the real files loaded by index.html: assets/styles.v22.css + assets/app.runtime.v8.js */
html, body{
  height:100%;
  min-height:100%;
  overflow:hidden !important;
}
body{
  width:100%;
  caret-color:transparent;
}
input, textarea, select{
  caret-color:auto;
}
button,
.primary-btn,
.ghost-btn,
.outline-btn,
.menu-btn,
.menu-chip,
[role="button"]{
  caret-color:transparent;
}
button:focus:not(:focus-visible),
.primary-btn:focus:not(:focus-visible),
.ghost-btn:focus:not(:focus-visible),
.outline-btn:focus:not(:focus-visible),
.menu-btn:focus:not(:focus-visible),
.menu-chip:focus:not(:focus-visible){
  outline:none !important;
  box-shadow:none !important;
}
body.ui-saving{
  cursor:progress;
}
body.ui-saving button,
button:disabled,
.primary-btn:disabled,
.ghost-btn:disabled,
.outline-btn:disabled{
  opacity:.68;
  cursor:not-allowed;
}
.app-shell{
  height:100vh;
  min-height:100vh;
  overflow:hidden !important;
}
.sidebar{
  height:100vh;
  overflow:hidden;
}
.sidebar-menu{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-gutter:stable;
}
.main-content{
  height:100vh;
  min-height:0;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.view-container{
  min-height:0;
  overflow-x:hidden !important;
}
.table-card{
  overflow:hidden !important;
  contain:layout paint;
}
.table-wrap{
  overflow-x:auto !important;
  overflow-y:hidden !important;
  overscroll-behavior:contain;
  scrollbar-gutter:auto;
  transform:translateZ(0);
  backface-visibility:hidden;
}
/* Disabling sticky table headers removes Chrome RTL sticky repaint flicker after dynamic table refresh. */
th{
  position:static !important;
  top:auto !important;
}
.modal-overlay{
  overflow:hidden !important;
  contain:layout paint;
}
.modal-overlay.is-closing{
  display:none !important;
}
.modal-body{
  overscroll-behavior:contain;
}
*{
  -webkit-tap-highlight-color:transparent;
}
@media (max-width:1180px){
  .app-shell,.main-content{height:100vh;}
}

/* HSZ_MOBILE_LOGIN_SAFE_SCROLL_FIX_V2 */
@media (max-width: 1180px) {
  .login-screen {
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}
/* HSZ_MOBILE_LOGIN_SCROLL_FIX_V3 */
@media (max-width: 1180px) {
  .login-screen {
    height: 100dvh;
    min-height: 0 !important;
    max-height: 100dvh;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    touch-action: auto;
    box-sizing: border-box;
  }
}

/* HSZ_MOBILE_APP_FLOW_AND_ALL_TABLES_SCROLL_FIX_V1 */
@media (max-width: 1180px) {
  html,
  body {
    height: auto !important;
    min-height: 100% !important;
    overflow: auto !important;
  }

  .app-shell {
    height: auto !important;
    min-height: 100dvh !important;
    overflow: visible !important;
  }

  .main-content {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
  }

  .topbar,
  .mobile-menu-bar {
    position: static !important;
  }

  .view-container,
  .card,
  .card-body,
  .table-card {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .view-container {
    overflow: visible !important;
  }

  .table-card {
    overflow: hidden !important;
    contain: none !important;
  }

  .table-wrap {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: auto !important;
    touch-action: auto !important;
    transform: none !important;
    scrollbar-gutter: auto !important;
  }

  .table-wrap table {
    min-width: 780px !important;
  }
}


/* ===== HSZ unified colorful table system ===== */
:root{
  --panel-soft:#fbfdff;
  --panel-blue:#eef5ff;
  --panel-green:#f1fbf5;
  --panel-amber:#fff8eb;
  --panel-rose:#fff4f4;
  --table-head-1:#f4f8ff;
  --table-head-2:#eaf1ff;
  --table-row-even:#fbfdff;
  --table-row-hover:#f3f8ff;
  --table-border:#dbe7f3;
  --section-bg:#f8fbff;
  --section-border:#d9e7f7;
}

/* richer cards and table shells */
.card,
.table-card,
.filters-bar,
.setting-card,
.info-box{
  background:linear-gradient(180deg,#ffffff 0%, var(--panel-soft) 100%);
  border-color:var(--table-border);
  box-shadow:0 10px 28px rgba(15,23,42,.045);
}

.section-head{
  padding:14px 16px;
  background:linear-gradient(180deg,#ffffff 0%, var(--section-bg) 100%);
  border:1px solid var(--section-border);
  border-radius:22px;
  box-shadow:0 6px 18px rgba(15,23,42,.035);
  margin-bottom:14px;
}
.section-head.section-head-compact{
  align-items:center;
}
.section-head.section-head-compact p{
  margin:0;
  font-size:14px;
  line-height:1.9;
  color:#516273;
}

.stats-grid .stat-card:nth-child(4n+1){background:linear-gradient(135deg,#ffffff 0%, var(--panel-blue) 100%);}
.stats-grid .stat-card:nth-child(4n+2){background:linear-gradient(135deg,#ffffff 0%, var(--panel-green) 100%);}
.stats-grid .stat-card:nth-child(4n+3){background:linear-gradient(135deg,#ffffff 0%, var(--panel-amber) 100%);}
.stats-grid .stat-card:nth-child(4n+4){background:linear-gradient(135deg,#ffffff 0%, var(--panel-rose) 100%);}
.card-head{
  background:linear-gradient(180deg,#ffffff 0%, var(--section-bg) 100%);
  border-bottom:1px solid #e7eef8;
  padding-bottom:14px;
}
.card-body{padding-top:14px;}

/* true table system */
.table-card-enhanced{
  border:1px solid var(--table-border) !important;
  background:linear-gradient(180deg,#ffffff 0%, #fcfdff 100%) !important;
  box-shadow:0 12px 30px rgba(15,23,42,.05);
  padding-inline:0 !important;
}
.data-table{
  width:100%;
  min-width:980px;
  border-collapse:separate;
  border-spacing:0;
  table-layout:auto;
  background:transparent;
}
.data-table thead th{
  background:linear-gradient(180deg,var(--table-head-1) 0%, var(--table-head-2) 100%) !important;
  color:#18324a !important;
  border-bottom:1px solid var(--table-border) !important;
  font-weight:800;
}
.data-table thead th:first-child{border-top-left-radius:22px;}
.data-table thead th:last-child{border-top-right-radius:22px;}
.data-table tbody td{
  border-bottom:1px solid #e8eef6 !important;
  vertical-align:middle;
}
.data-table tbody tr:nth-child(even) td{
  background:var(--table-row-even);
}
.data-table tbody tr:hover td{
  background:var(--table-row-hover);
}

/* column sizing */
.data-table .col-w-sm{width:110px;}
.data-table .col-w-md{width:155px;}
.data-table .col-w-lg{width:220px;}
.data-table .col-w-xl{width:280px;}
.data-table .col-w-code{width:170px;}
.data-table .col-w-codeLg{width:205px;}
.data-table .col-w-actions{width:320px;}

/* alignment */
.data-table th.col-align-right,
.data-table td.cell-align-right{text-align:right;}
.data-table th.col-align-center,
.data-table td.cell-align-center{text-align:center;}
.data-table th.col-align-left,
.data-table td.cell-align-left{text-align:left; direction:ltr;}

/* per-type emphasis */
.data-table td.cell-code{font-weight:800; letter-spacing:.01em;}
.data-table td.cell-name{font-weight:700; color:#0f172a;}
.data-table td.cell-money{font-weight:700; color:#102a43;}
.data-table td.cell-date{font-weight:700; color:#243b53;}
.data-table td.cell-text{color:#334155;}
.data-table td.cell-status{padding-top:10px; padding-bottom:10px;}
.data-table td.cell-empty{
  text-align:center;
  color:#64748b;
  padding:24px;
  background:#fff;
}

/* actions must stay in one row */
.data-table td.cell-actions,
.data-table th.col-actions{
  min-width:300px;
  text-align:center;
}
.table-actions{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  justify-content:center;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.table-actions > *{
  flex:0 0 auto;
}
.table-actions .outline-btn,
.table-actions .primary-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:72px;
  white-space:nowrap;
}

/* brighter statuses */
.status.confirmed,.status.نشط,.status.طبيعي{
  background:linear-gradient(180deg,#dcfce7 0%, #c8f5d6 100%);
  color:#137333;
  border-color:#b7ebc7;
}
.status.draft{
  background:linear-gradient(180deg,#fef3c7 0%, #fde68a 100%);
  color:#9a5b00;
  border-color:#f8d66d;
}
.status.cancelled,.status.نعم,.status.تنبيه{
  background:linear-gradient(180deg,#fee2e2 0%, #fecaca 100%);
  color:#b42318;
  border-color:#f7b7b7;
}
.status.مصفر{
  background:linear-gradient(180deg,#fff7ed 0%, #ffedd5 100%);
  color:#c2410c;
  border-color:#fdba74;
}
.status.لا{
  background:linear-gradient(180deg,#f8fafc 0%, #eef2f7 100%);
  color:#475569;
  border-color:#dbe3ee;
}

/* mobile */
@media (max-width:1180px){
  .data-table{min-width:940px;}
}

textarea,input,select{font-family:"Cairo", system-ui, sans-serif !important;}


.report-export-chooser{
  align-items:center;
}
.report-export-chooser .filters-left{
  flex:1;
}
.report-export-chooser select{
  min-width:180px;
}
.modal-actions .primary-btn,
.modal-actions .outline-btn{
  min-width:96px;
}

.danger-btn{border-color:#fecaca !important;color:#b91c1c !important;background:#fff5f5 !important;}
.danger-btn:hover{background:#fee2e2 !important;}

/* HSZ ERP v1.5.0 — stock approval, actionable notifications and strict RBAC UI */
.clickable-stat{cursor:pointer;text-align:right;border:1px solid var(--border);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;font-family:"Cairo",system-ui,sans-serif;background:#fff;width:100%;}
.clickable-stat:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(15,23,42,.08);border-color:#b8c8dc;}
.notification-bell{position:relative;}
.notification-badge{position:absolute;top:-7px;right:-8px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#dc2626;color:#fff;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;border:2px solid #fff;}
.notification-panel{position:absolute;top:68px;left:22px;width:min(430px,calc(100vw - 32px));max-height:540px;overflow:auto;background:#fff;border:1px solid #dbe5f0;border-radius:16px;box-shadow:0 18px 42px rgba(15,23,42,.18);z-index:1400;padding:10px;}
.notification-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 6px 10px;border-bottom:1px solid #edf2f7;margin-bottom:6px;}
.notification-item{display:flex;flex-direction:column;gap:5px;width:100%;text-align:right;border:1px solid transparent;border-radius:12px;background:#fff;padding:10px 11px;margin-top:5px;font-family:"Cairo",system-ui,sans-serif;cursor:pointer;}
.notification-item:hover{background:#f8fafc;border-color:#e2e8f0;}
.notification-item.unread{background:#eff6ff;border-color:#bfdbfe;}
.notification-item span{font-size:12px;color:#334155;line-height:1.7;}
.notification-item small{color:#64748b;font-size:11px;direction:ltr;text-align:right;}
.notification-empty{padding:18px;text-align:center;color:#64748b;}
.filter-check{display:inline-flex;gap:6px;align-items:center;padding:8px 10px;border:1px solid #dbe5f0;border-radius:9px;background:#fff;white-space:nowrap;}
.filter-check input{width:auto;margin:0;}
.dashboard-section{margin:16px 0;}
.approval-summary .info-grid{margin-bottom:14px;}
.approval-summary .table-card{margin-top:14px;}
.status.pending_inventory_approval,.status.pending{background:#fef3c7;color:#92400e;border-color:#fde68a;}
.status.approved,.status.approved_direct{background:#dcfce7;color:#166534;border-color:#bbf7d0;}
.status.rejected,.status.unfulfillable,.status.out{background:#fee2e2;color:#b91c1c;border-color:#fecaca;}
.status.minimum,.status.low{background:#fff7ed;color:#c2410c;border-color:#fdba74;}
.status.healthy{background:#dcfce7;color:#166534;border-color:#bbf7d0;}
@media (max-width:760px){.notification-panel{left:8px;top:62px;width:calc(100vw - 16px)}.filters-left{gap:8px}.filter-check{width:100%}}

/* HSZ ERP v1.5.1 — personalized dashboard welcome without changing the approved layout */
.dashboard-welcome{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 18px;margin:0 0 16px;background:#fff;border:1px solid var(--border);}
.dashboard-welcome strong{display:block;font-size:16px;color:#0f172a;margin-bottom:4px;}
.dashboard-welcome span,.dashboard-welcome small{display:block;color:#64748b;font-size:12px;}
@media (max-width:760px){.dashboard-welcome{align-items:flex-start;flex-direction:column;gap:6px;}}


/* HSZ_V1_8_0_CUSTOMER_PICKER */
.customer-picker-field{position:relative;display:flex;flex-direction:column;gap:8px}
.customer-picker-field input[type="search"]{width:100%}
.customer-picker-selected{font-size:12px;color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:8px 10px;min-height:36px;display:flex;align-items:center}
.customer-picker-selected.selected{color:#0f172a;background:#ecfdf5;border-color:#bbf7d0;font-weight:700}
.customer-picker-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.customer-search-results{position:absolute;z-index:1005;top:88px;left:0;right:0;background:#fff;border:1px solid #dbe6f2;border-radius:14px;box-shadow:0 18px 45px rgba(15,23,42,.12);max-height:240px;overflow:auto;padding:6px}
.customer-search-row{width:100%;border:0;background:#fff;text-align:right;padding:10px;border-radius:10px;display:flex;flex-direction:column;gap:4px;cursor:pointer;color:#0f172a}
.customer-search-row:hover{background:#f1f5f9}
.customer-search-row span,.customer-search-empty{font-size:12px;color:#64748b}
.customer-search-empty{padding:12px;text-align:center}
.quick-customer-box{border:1px dashed #cbd5e1;border-radius:14px;background:#f8fafc;padding:10px;display:flex;flex-direction:column;gap:10px}
.quick-customer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
@media(max-width:700px){.quick-customer-grid{grid-template-columns:1fr}.customer-search-results{position:static;max-height:220px}}

/* HSZ_V1_8_1_CUSTOMER_DROPDOWN_SYNC_FIX */
.invoice-top-grid.invoice-top-grid-primary{
  grid-template-columns:minmax(170px,.85fr) minmax(150px,.75fr) minmax(360px,2.2fr) minmax(180px,1fr);
  align-items:start;
}
.customer-picker-select-line{display:block;width:100%}
.customer-picker-select-line select{width:100%}
.customer-picker-search-line{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.customer-picker-field{gap:6px}
.customer-search-results{top:112px;}
@media (max-width:1180px){
  .invoice-top-grid.invoice-top-grid-primary{grid-template-columns:repeat(2,minmax(0,1fr));}
  .customer-search-results{top:118px;}
}
@media (max-width:760px){
  .invoice-top-grid.invoice-top-grid-primary{grid-template-columns:1fr;}
  .customer-picker-search-line{grid-template-columns:1fr;}
  .customer-search-results{position:static;max-height:220px;}
}


/* v1.8.3 professional decision and edit reason modal improvements */
.decision-modal-card{
  width:min(1040px,96vw) !important;
  min-height:560px;
  max-height:92vh !important;
}
.decision-modal-card .modal-head{
  padding:22px 26px;
}
.decision-modal-card .modal-body{
  min-height:350px;
  padding:24px 28px !important;
}
.decision-modal-card .modal-actions{
  padding:0 28px 24px !important;
}
.decision-modal-content{
  display:grid;
  gap:18px;
}
.decision-modal-intro,
.approval-help-box{
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#f8fafc;
  color:#334155;
  line-height:1.9;
  font-weight:600;
}
.decision-note-field label{
  display:block;
  margin-bottom:8px;
  font-weight:800;
  color:#334155;
}
.decision-note-input,
.master-edit-reason{
  width:100%;
  resize:none !important;
  min-height:170px;
  line-height:1.9;
  font-size:15px;
}
.master-edit-reason{
  min-height:96px;
}
.danger-primary-btn{
  background:#b91c1c !important;
  border-color:#b91c1c !important;
}


/* HSZ v1.8.5 strict posting lock and professional message modal */
.system-message-modal-card{
  width:min(760px,94vw) !important;
  min-height:260px;
}
.system-message-box{
  padding:22px 24px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#f8fafc;
  color:#0f172a;
  line-height:2;
  font-size:16px;
}
.system-message-box.error{
  border-color:#fecaca;
  background:#fff1f2;
  color:#991b1b;
}
.decision-modal-card textarea.decision-note-input{
  resize:none !important;
}
.customer-search-results.hidden{display:none!important;}
button[disabled]{opacity:.62;cursor:not-allowed;}


/* HSZ ERP v1.8.6 — notification sound/toast and cleaner numeric entry */
.notification-settings-row{display:flex;flex-wrap:wrap;gap:8px;padding:8px 6px 10px;border-bottom:1px solid #edf2f7;margin-bottom:6px;align-items:center;justify-content:flex-start}
.notification-settings-row .small-btn{font-size:12px;padding:7px 10px;border-radius:12px}
.hsz-notification-toast{position:fixed;left:24px;bottom:24px;width:min(420px,calc(100vw - 48px));z-index:2147483600;text-align:right;border:1px solid #bfdbfe;background:#eff6ff;color:#0f172a;border-radius:18px;padding:14px 16px;box-shadow:0 20px 60px rgba(15,23,42,.22);font-family:"Cairo",system-ui,sans-serif;cursor:pointer;display:flex;flex-direction:column;gap:6px;animation:hszToastIn .18s ease-out}
.hsz-notification-toast strong{font-size:14px;color:#0b132b}.hsz-notification-toast span{font-size:12px;line-height:1.7;color:#334155}
@keyframes hszToastIn{from{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}
.hsz-bell-pulse{animation:hszBellPulse .9s ease-out 1}
@keyframes hszBellPulse{0%{transform:scale(1)}35%{transform:scale(1.28)}100%{transform:scale(1)}}
@media(max-width:760px){.hsz-notification-toast{left:12px;bottom:12px;width:calc(100vw - 24px)}}


/* HSZ ERP v1.8.8 — required item supplier, instant read notifications, safer mobile usability */
.supplier-price-manager.required-supplier-link{
  border:1px solid #dbe6f2;
  border-radius:20px;
  padding:14px;
  background:#fff;
  margin-top:4px;
}
.supplier-required-hint{
  margin-top:8px;
  color:#92400e;
  background:#fffbeb;
  border:1px solid #fde68a;
  border-radius:12px;
  padding:8px 10px;
  font-weight:700;
}
@media (max-width:760px){
  .app-shell{min-height:100svh;overflow:visible;}
  .main-content{overflow:visible;}
  .topbar{position:sticky;top:0;z-index:30;}
  .mobile-menu-bar{position:sticky;top:0;z-index:29;}
  .modal-overlay{padding:8px;align-items:stretch;justify-content:center;}
  .modal-card{width:100% !important;max-height:calc(100svh - 16px) !important;border-radius:18px;}
  .modal-head{padding:12px 14px;align-items:flex-start;}
  .modal-head h3{font-size:18px;line-height:1.5;}
  .modal-body{padding:12px !important;max-height:calc(100svh - 130px) !important;}
  .modal-actions{padding:0 12px 12px !important;gap:8px;}
  .modal-actions .primary-btn,.modal-actions .outline-btn{flex:1 1 120px;}
  .invoice-items-box{padding:10px;border-radius:16px;}
  .invoice-items-table{min-width:980px;}
  .table-actions{min-width:max-content;}
  .table-actions .outline-btn,.table-actions .primary-btn{height:34px;padding:0 10px;}
  input,select,textarea{font-size:16px;}
}

/* v1.8.9: final document statuses are labels only, not actions */
.status.status-final-locked{
  pointer-events:none;
  user-select:none;
  cursor:not-allowed;
}
.locked-status-btn[disabled],
button.locked-status-btn[disabled]{
  pointer-events:none;
  user-select:none;
}