/* ==========================================================================
   ERP - AdminLTE/Becreative style (Bootstrap 3 + FontAwesome 4, RTL)
   ========================================================================== */
:root{
  --blue:#108fc6; --blue-dark:#0d70c6; --red:#dd4b39; --aqua:#00c0ef;
  --green:#00a65a; --yellow:#f39c12; --purple:#605ca8; --olive:#3d9970;
  --sidebar:#222d32; --sidebar-hover:#1e282c;
  --text:#555; --text-muted:#999; --line:#e7e7e7; --bg:#f4f4f4; --white:#fff;
  --link:#108fc6;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  font-family:'Cairo','Segoe UI',Tahoma,Arial,sans-serif;
  background:var(--bg); color:var(--text); font-size:16px; line-height:1.6; font-weight:500;
}
a{color:var(--blue); text-decoration:none}

/* Icon color helpers (FontAwesome) */
.text-red{color:#dd4b39!important}
.text-yellow{color:#f39c12!important}
.text-aqua{color:#00c0ef!important}
.text-blue{color:#0073b7!important}
.text-green{color:#00a65a!important}
.text-orange{color:#ff851b!important}
.text-olive{color:#3d9970!important}
.text-fuchsia{color:#f012be!important}
.text-purple{color:#605ca8!important}
.text-gray{color:#d2d6de!important}
.text-teal{color:#00d2b3!important}
.text-success{color:#00a65a!important}

/* ==========================================================================
   LAYOUT WRAPPER
   ========================================================================== */
.wrapper{min-height:100%;}

/* ==========================================================================
   TOP NAVBAR (main-header)
   ========================================================================== */
.main-header{
  position:fixed; top:0; left:0; right:230px; height:50px; z-index:1030;
  background:#fff; border-bottom:1px solid #e2e2e2;
}
.main-header .logo{
  display:none; position:fixed; top:0; right:0; width:230px; background:#fff;
}
.main-header .navbar{
  min-height:50px; border:none; margin:0;
}
.navbar-static-top{position:relative}
.sidebar-toggle{
  float:right; background:transparent; background-image:none; padding:15px;
  display:block; color:#000; line-height:20px; font-size:16px; cursor:pointer;
  -webkit-transition:background .3s; transition:background .3s;
}
.sidebar-toggle:hover{background:#f0f0f0}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0)}
.navbar-right{float:left}
.navbar-right .nav{list-style:none; margin:0; padding:0}
.navbar-right .nav>li{display:inline-block; position:relative}
.topbar-title{
  color:#000; font-size:15px; font-weight:700; padding-right:16px; padding-left:8px;
  line-height:50px;
}
.topbar-title .fa{margin-left:6px}
.user-menu-top{line-height:50px}
.user-dropdown{color:#000; padding:0 12px; display:inline-block; line-height:50px; cursor:pointer}
.user-dropdown:hover{background:#f0f0f0}
.avatar-sm{width:30px; height:30px; line-height:30px; font-size:14px; vertical-align:middle}
.user-dropdown .hidden-xs{margin:0 6px}
.dropdown-menu{
  position:absolute; left:0; top:100%; z-index:1000; display:none;
  float:left; min-width:190px; padding:5px 0; margin:2px 0 0; font-size:14px;
  list-style:none; background:#fff; border:1px solid rgba(0,0,0,.15); border-radius:4px;
  box-shadow:0 6px 12px rgba(0,0,0,.175); text-align:right;
}
.dropdown-menu.open{display:block}
.dropdown-menu>li>a{display:block; padding:8px 18px; clear:both; color:#333; white-space:nowrap}
.dropdown-menu>li>a:hover{background:#f5f5f5; color:#262626}
.dropdown-menu>li>a>.fa{width:18px; text-align:center; margin-left:6px}
.dropdown-header{display:block; padding:6px 18px; font-size:12px; color:#999; white-space:nowrap; border-bottom:1px solid #eee; margin-bottom:4px}
.divider{height:1px; margin:5px 0; overflow:hidden; background-color:#e5e5e5}

/* ==========================================================================
   SIDEBAR
   ========================================================================== */
.main-sidebar{
  position:fixed; top:0; right:0; bottom:0; width:230px;
  background:var(--sidebar); color:#b8c7ce; z-index:810;
  -webkit-transition:transform .3s ease-in-out,width .3s ease-in-out;
  transition:transform .3s ease-in-out,width .3s ease-in-out;
  overflow-y:auto; overflow-x:hidden;
}
.sidebar{ padding-bottom:10px; padding-top:10px; }
.logo{
  display:block; height:50px; line-height:50px; padding:0 15px;
  background:#fff; color:#000; font-weight:700; font-size:20px;
  -webkit-transition:width .3s ease-in-out; transition:width .3s ease-in-out;
  overflow:hidden; white-space:nowrap;
}
.logo-mini{font-size:22px; display:none}
.logo-lg{display:block}

.user-panel{
  position:relative; padding:15px; overflow:hidden;
  border-bottom:1px solid #374850;
}
.user-panel .image{float:right; margin-left:10px}
.avatar{
  display:inline-block; width:40px; height:40px; border-radius:50%;
  background:var(--blue); color:#fff; text-align:center; line-height:40px; font-size:18px; font-weight:700;
}
.user-panel .avatar-img{
  width:40px; height:40px; border-radius:50%; object-fit:contain; background:#fff; padding:2px;
}
.user-panel .info{float:right; display:block}
.user-panel .info p{margin:5px 0; color:#fff; font-weight:700}
.user-panel .info a{color:#b8c7ce; font-size:12px}

.sidebar-menu{list-style:none; margin:0; padding:0}
.sidebar-menu > li{position:relative}
.sidebar-menu > li.header{
  padding:10px 14px 8px; font-size:12px; color:#4b646f; background:#1a2226; text-transform:uppercase;
}
.sidebar-menu > li > a{
  display:block; padding:12px 12px; color:#b8c7ce; font-size:14px;
  border-left:3px solid transparent; -webkit-transition:all .3s; transition:all .3s;
}
.sidebar-menu > li > a > .fa{margin-left:8px; width:18px; text-align:center}
.sidebar-menu > li > a .pull-right{margin-top:1px}
.sidebar-menu > li:hover > a,.sidebar-menu > li.active > a{
  color:#fff; background:#1e282c; border-left-color:#108fc6;
}
.sidebar-menu > li > .treeview-menu{margin:0; padding:0; list-style:none; display:none}
.treeview-menu{ background:#2c3b41; }
.sidebar-menu li.treeview>a .fa-angle-left{float:left; margin-left:0; -webkit-transition:transform .3s; transition:transform .3s}
.sidebar-menu li.treeview.active>a .fa-angle-left{ -webkit-transform:rotate(-90deg); transform:rotate(-90deg)}
.treeview-menu>li>a{
  display:block; color:#8aa4af; padding:8px 5px 8px 5px; padding-right:40px; font-size:13.5px;
  -webkit-transition:all .3s; transition:all .3s;
}
.treeview-menu>li>a>.fa{width:16px}
.treeview-menu>li.active>a{color:#fff; background:#1e282c}
.treeview-menu>li>a:hover{color:#fff}

/* Full fixed sidebar (always expanded) */

/* ==========================================================================
   SIDEBAR-MINI collapse (icons-only micro sidebar, Becreative/AdminLTE style)
   ========================================================================== */
.sidebar-mini.sidebar-collapse .main-sidebar{ width:50px; overflow:visible; }
.sidebar-mini.sidebar-collapse .main-header .logo{ width:50px; }
.sidebar-mini.sidebar-collapse .main-header{ right:50px; }
.sidebar-mini.sidebar-collapse .content-wrapper,
.sidebar-mini.sidebar-collapse .main-footer{ margin-right:50px; }

.sidebar-mini.sidebar-collapse .logo-lg{ display:none; }
.sidebar-mini.sidebar-collapse .logo-mini{ display:block; text-align:center; padding:0; }

/* hide username box in mini mode */
.sidebar-mini.sidebar-collapse .user-panel{ display:none; }

/* top-level items: icons only, centered */
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a{ padding:12px 0; text-align:center; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fa{ margin-left:0; width:50px; font-size:18px; display:block; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span,
.sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .fa-angle-left{ display:none; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li.header span{ display:none; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li.header{ text-align:center; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li.header .fa-refresh{ margin:0; float:none; }
.sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu{ display:none; }
.sidebar-mini.sidebar-collapse #version-tag{ display:none; }

/* flyout submenu on hover (opens to the left of the rail) */
.sidebar-mini.sidebar-collapse .main-sidebar .treeview:hover{
  position:relative; z-index:20; width:230px;
}
.sidebar-mini.sidebar-collapse .sidebar-menu .treeview:hover > a > span,
.sidebar-mini.sidebar-collapse .sidebar-menu .treeview:hover > a > .fa{ display:inline-block; }
.sidebar-mini.sidebar-collapse .sidebar-menu .treeview:hover > a > .fa{ width:18px; margin-left:8px; display:inline-block; }
.sidebar-mini.sidebar-collapse .sidebar-menu .treeview:hover > a{ text-align:right; padding-left:12px; }
.sidebar-mini.sidebar-collapse .treeview.flyout-open > .treeview-menu,
.sidebar-mini.sidebar-collapse .sidebar-menu .treeview:hover > .treeview-menu{
  position:absolute; top:0; right:230px; left:auto; display:block;
  width:230px; background:#2c3b41; min-height:100%; box-shadow:3px 0 8px rgba(0,0,0,.35);
}
.sidebar-mini.sidebar-collapse .treeview-menu > li > a{ padding-right:18px; }


/* ==========================================================================
   CONTENT
   ========================================================================== */
.content-wrapper{
  min-height:100%; margin-right:230px; padding-top:50px;
  background:var(--bg); z-index:800; -webkit-transition:margin-right .3s ease-in-out; transition:margin-right .3s ease-in-out;
}
.content-header{position:relative; padding:14px 15px;}
.content-header h1{font-size:22px; margin:0; color:#3e3e3e; display:inline-block}
.content-header h1>.fa{margin-left:6px}
.breadcrumb{
  float:left; background:transparent; list-style:none; padding:0; margin:2px 0 0; font-size:11px;
}
.breadcrumb li{display:inline-block}
.breadcrumb li:before{content:'/'; padding:0 5px; color:#ccc}
.breadcrumb li.active{color:#777}
.content{padding:0 15px 15px;}
.main{padding:0}

/* ==========================================================================
   BOXES / CARDS  (AdminLTE .box)
   ========================================================================== */
.box{
  position:relative; border-radius:3px; background:#fff; border-top:3px solid #d2d6de;
  margin-bottom:20px; width:100%; box-shadow:0 1px 1px rgba(0,0,0,.1);
}
.box.box-primary{border-top-color:#108fc6}
.box.box-green{border-top-color:#00a65a}
.box.box-red{border-top-color:#dd4b39}
.box.box-yellow{border-top-color:#f39c12}
.box.box-aqua{border-top-color:#00c0ef}
.box.box-orange{border-top-color:#ff851b}
.box-header{ color:#444; display:block; padding:10px 10px 4px; position:relative;}
.box-header .box-title{display:inline-block; font-size:18px; margin:0; line-height:1.2}
.box-tools{position:absolute; top:5px; left:10px}
.box-body{padding:10px; border-top:1px solid #f4f4f4; border-bottom-left-radius:3px; border-bottom-right-radius:3px}
.box-body.no-padding{padding:0}

/* ==========================================================================
   SMALL-BOX (dashboard metric tiles, like Becreative home-modern)
   ========================================================================== */
.small-box{
  border-radius:2px; position:relative; display:block; margin-bottom:20px;
  box-shadow:0 1px 1px rgba(0,0,0,.1); color:#fff; overflow:hidden;
}
.small-box.bg-blue{background:#108fc6}
.small-box.bg-green{background:#00a65a}
.small-box.bg-red{background:#dd4b39}
.small-box.bg-yellow{background:#f39c12}
.small-box.bg-aqua{background:#00c0ef}
.small-box.bg-purple{background:#605ca8}
.small-box.bg-olive{background:#3d9970}
.small-box.bg-maroon{background:#d81b60}
.small-box .icon{
  -webkit-transition:all .3s linear; transition:all .3s linear;
  position:absolute; top:-10px; left:10px; z-index:0; font-size:90px; color:rgba(0,0,0,.15);
}
.small-box:hover .icon{font-size:95px}
.small-box .inner{padding:10px; position:relative; z-index:2}
.small-box .inner h3{font-size:36px; font-weight:700; margin:0; color:#fff}
.small-box .inner p{font-size:14px; margin:4px 0 0; color:rgba(255,255,255,.9)}
.small-box .inner p .f-r{float:left; font-size:26px; font-weight:700}
.small-box-footer{
  display:block; background:rgba(0,0,0,.1); color:#fff; text-align:center; padding:6px 0;
  position:relative; z-index:2; font-size:12px;
}
.small-box-footer:hover{color:#fff; background:rgba(0,0,0,.15)}

/* Row & col grid (Bootstrap3-style) */
.row{margin-right:-15px; margin-left:-15px}
.row:after{content:""; display:table; clear:both}
.col{position:relative; min-height:1px; padding-right:15px; padding-left:15px; float:right; width:100%}
@media(min-width:768px){ .col-sm-3{width:25%} .col-sm-4{width:33.333%} .col-sm-6{width:50%} .col-sm-12{width:100%} }
@media(min-width:992px){ .col-md-3{width:25%; float:right} .col-md-4{width:33.333%; float:right} .col-md-6{width:50%; float:right} .col-md-12{width:100%; float:right} }

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:20px}
@media(max-width:900px){.grid-2{grid-template-columns:1fr}}

/* ==========================================================================
   TABLES (Bootstrap3/AdminLTE)
   ========================================================================== */
.table-responsive{overflow-x:auto}
.table{width:100%; max-width:100%; margin-bottom:20px; background:#fff; border-collapse:collapse; font-size:13.5px}
.table>thead>tr>th,.table>tbody>tr>td,.table>tfoot>tr>td{
  padding:8px; line-height:1.4; border-top:1px solid #f4f4f4; text-align:right; vertical-align:top;
}
.table>thead>tr>th{border-bottom:2px solid #e7e7e7; color:#444; font-weight:700; font-size:13px; white-space:nowrap}
.table>tbody>tr>td{border-color:#f4f4f4}
.table-hover>tbody>tr:hover{background:#f5f5f5}
.table>tfoot>tr>td{background:#f9f9f9; font-weight:700}
.table .num{direction:ltr; text-align:left; font-variant-numeric:tabular-nums}
.table .empty{text-align:center; color:#999; padding:24px}
.table .row-actions a,.link-danger{font-size:13px; font-weight:600; cursor:pointer}
.lbl{font-weight:600}

/* ==========================================================================
   FORMS (Bootstrap3)
   ========================================================================== */
.form-group{margin-bottom:15px}
.form-group label{display:inline-block; max-width:100%; margin-bottom:5px; font-weight:700; color:#444}
.form-control{
  display:block; width:100%; height:34px; padding:6px 12px; font-size:14px; line-height:1.4;
  color:#555; background:#fff; border:1px solid #d2d6de; border-radius:4px;
  -webkit-transition:border-color .15s; transition:border-color .15s;
}
.form-control:focus{border-color:#108fc6; outline:0}
textarea.form-control{height:auto}
select.form-control{height:34px}
.checkbox,.radio{display:inline-block; margin-left:15px}
.checkbox input,.radio input{vertical-align:middle; margin-left:6px}
.input-group{position:relative; display:table; border-collapse:separate; width:100%}
.input-group .form-control{display:table-cell; border-radius:0}
.input-group .input-group-btn{display:table-cell; vertical-align:middle}

/* Buttons */
.btn{
  display:inline-block; padding:6px 12px; margin-bottom:0; font-size:14px; font-weight:400; line-height:1.4;
  text-align:center; white-space:nowrap; vertical-align:middle; cursor:pointer; border:1px solid transparent; border-radius:4px;
}
.btn-default{color:#444; background:#fff; border-color:#d2d6de}
.btn-default:hover{background:#e6e6e6}
.btn-primary{color:#fff; background:#108fc6; border-color:#0d70c6}
.btn-primary:hover{background:#0d70c6}
.btn-danger{color:#fff; background:#dd4b39; border-color:#d73925}
.btn-success{color:#fff; background:#00a65a; border-color:#008d4c}
.btn-warning{color:#fff; background:#f39c12; border-color:#e08e0b}
.btn-info{color:#fff; background:#00c0ef; border-color:#00acd6}
.btn-block{display:block; width:100%}
.btn-sm{padding:5px 10px; font-size:12px; border-radius:3px}
.btn-link{color:#108fc6; cursor:pointer; border:none; background:none; font-size:14px}

/* Becreative flat buttons */
.btn-flat{border-radius:0; border:none; box-shadow:none}
.btn-flat.bg-green{color:#fff; background:#00a65a}
.btn-flat.bg-green:hover{background:#008d4c}
.btn-flat.bg-red{color:#fff; background:#dd4b39}
.btn-flat.bg-red:hover{background:#d73925}
.btn-flat.bg-blue{color:#fff; background:#108fc6}
.btn-flat.bg-blue:hover{background:#0d70c6}
.btn-flat.bg-aqua{color:#fff; background:#00c0ef}
.btn-flat.bg-gray{color:#333; background:#d2d6de}
.btn-flat.bg-yellow{color:#fff; background:#f39c12}
.btn-flat.bg-yellow:hover{background:#e08e0b}
.btn-flat.bg-purple{color:#fff; background:#605ca8}
.btn-flat.bg-purple:hover{background:#554e9e}
.btn-flat.bg-teal{color:#fff; background:#00d2b3}
.btn-flat.bg-teal:hover{background:#00b59b}
.btn-flat.bg-orange{color:#fff; background:#f39c12}
.btn-flat.bg-orange:hover{background:#e08e0b}

/* Becreative toolbar strip above box-body */
.box-toolbar{
  padding:8px 15px; background:#f7f7f7; border-top:2px solid #108fc6;
  border-bottom:1px solid #e7e7e7;
}
.box-toolbar .btn{margin-left:6px}

/* Becreative inline search/action button */
.btn-invert{
  display:inline-block; padding:6px 10px; vertical-align:middle;
  background:#108fc6; color:#fff; border-radius:3px; font-size:16px; line-height:1;
  cursor:pointer; border:none; text-decoration:none;
}
.btn-invert:hover{background:#0d70c6; color:#fff; text-decoration:none}
.controls .btn-invert{margin:0}

/* grands total / balance display inputs */
.gg-total{font-weight:700; color:#dd4b39; background:#fffbe6 !important}
.gg-balance{font-weight:700; color:#008d4c; background:#eaf7ef !important}

/* page title weight */
.semi-bold{font-weight:600}

/* form controls wrapper (Becreative) */
.form-group label{color:#444; font-size:15px; font-weight:600}
.form-group .req{color:#dd4b39}
.controls{position:relative}
.controls label.error{color:#dd4b39; display:block; font-weight:400; font-size:13px}

/* controls that contain an inline action button (search/add): flow them side by side */
.controls:not(:has(.btn-invert)){display:block}
.controls .btn-invert{
  display:inline-block; vertical-align:top; height:40px; border-radius:0 5px 5px 0;
  background:#108fc6; color:#fff; line-height:24px; padding:8px 12px; box-sizing:border-box;
  font-size:16px;
}
.controls .btn-invert:hover{background:#0d70c6; color:#fff}
.controls .btn-invert + .form-control{display:inline-block; width:calc(100% - 46px); border-radius:5px 0 0 5px; vertical-align:top}

/* bigger form controls */
.form-control{height:40px; padding:8px 12px; font-size:15px; border-radius:4px}
select.form-control{height:40px; font-size:15px}
textarea.form-control{height:auto; min-height:60px; font-size:15px}

/* read-only display value (invoice view) */
.info-value{
  padding:8px 14px; background:#f5f5f5; border:1px solid #e7e7e7; border-radius:4px;
  min-height:40px; font-size:15px; color:#555;
}

/* invoice totals */
.table.g-total,tr.g-total td{background:#fffbe6 !important; font-weight:700}
tr.g-bal td{background:#eaf7ef !important}

/* Widget container (Becreative grouped fields in col-md-6) */
.widget{
  background:#fff; border:1px solid #e0e0e0; border-radius:6px;
  padding:18px 22px; margin-bottom:14px; font-size:15px;
}
.widget .form-group:last-child{ margin-bottom:0; }

/* Box sections (Becreative grouped fields) */
.box-section{ margin-bottom:20px; }
.box-section + .box-section{ padding-top:16px; border-top:1px dashed #e0e0e0; }
.section-title{
  color:#108fc6; font-size:14px; font-weight:700; margin-bottom:14px; padding-bottom:6px;
  border-bottom:2px solid #108fc6;
}
.section-title .fa{margin-left:6px; width:18px; text-align:center}
.box-footer-actions{ margin-top:6px; padding-top:16px; border-top:2px solid #e7e7e7; }
.box-footer-actions .btn{margin-left:6px; min-width:110px}

/* input feedback icon */
.has-feedback{position:relative}
.has-feedback .form-control{padding-left:34px}
.has-feedback .form-control-feedback{
  position:absolute; top:1px; left:0; width:34px; text-align:center; line-height:34px; color:#999; pointer-events:none;
}
.table-bordered{border:1px solid #f4f4f4}
.table-bordered>thead>tr>th,.table-bordered>tbody>tr>td{border:1px solid #f4f4f4}

/* Alerts (flash) */
.alert{padding:10px 15px; margin-bottom:16px; border:1px solid transparent; border-radius:4px}
.alert-success{color:#3c763d; background:#dff0d8; border-color:#d6e9c6}
.alert-danger{color:#a94442; background:#f2dede; border-color:#ebccd1}
.alert-info{color:#31708f; background:#d9edf7; border-color:#bce8f1}
.alert-warning{color:#8a6d3b; background:#fcf8e3; border-color:#faebcc}

/* Toolbar */
.toolbar{margin-bottom:16px}
.toolbar:after{content:""; display:table; clear:both}
.toolbar .tb-right{float:right}
.toolbar .tb-left{float:left}

/* ==========================================================================
   PAGINATION
   ========================================================================== */
.pagination{display:inline-block; padding-left:0; margin:12px 0; border-radius:4px}
.pagination:after{content:""; display:table; clear:both}
.pagination a{
  position:relative; float:right; padding:6px 12px; margin-left:-1px; line-height:1.4;
  color:#337ab7; background:#fff; border:1px solid #ddd;
}
.pagination a.on{background:#108fc6; border-color:#0d70c6; color:#fff}
.pagination a:hover:not(.on){background:#eee}

/* ==========================================================================
   AUTH / LOGIN
   ========================================================================== */
.auth-wrap{
  display:flex; align-items:center; justify-content:center; min-height:100vh;
  background:#222d32; padding:20px;
}
.login-box{width:360px; max-width:100%; margin:auto}
.login-logo{text-align:center; margin-bottom:14px}
.login-logo a{color:#fff; font-size:28px; font-weight:700}
.login-box-body{
  background:#fff; padding:20px; border-top:0; color:#666;
  box-shadow:0 1px 3px rgba(0,0,0,.2); border-radius:4px;
}
.login-box-body h4{color:#444; margin-bottom:14px; text-align:center}
.login-box-msg{margin:6px 0 14px; text-align:center; color:#777}

/* ==========================================================================
   MISCELLANEOUS
   ========================================================================== */
.pull-right{float:right!important}
.pull-left{float:left!important}
.clearfix:after{content:""; display:table; clear:both}
.muted{color:#999}
.mt{ margin-top:10px}
.mb{margin-bottom:10px}
.main-footer{
  background:#fff; border-top:1px solid #d2d6de; padding:12px 15px; margin-right:230px;
  color:#5a6577; font-size:13px; text-align:center; line-height:1.6;
}
.main-footer .pull-left{border-left:1px solid #e3e8ee; padding-left:12px; color:#8a94a6; letter-spacing:.3px}
.text-center{text-align:center}
.h3{font-size:24px; font-weight:700}
.gap{height:14px}

/* ================= POS (نقطة بيع) ================= */
.btn-primary.pos-blue{background:#108fc6;border-color:#108fc6}
.btn-primary.pos-blue2{background:#0d70c6;border-color:#0d70c6}
.btn-primary.pos-green{background:#00a65a;border-color:#00a65a}
.btn-primary.pos-red{background:#dd4b39;border-color:#dd4b39}
.btn-primary.pos-red2{background:#c51f1f;border-color:#c51f1f}
.btn-primary.pos-yellow{background:#f39c12;border-color:#f39c12}
.btn-primary.pos-purple{background:#605ca8;border-color:#605ca8}
.btn-lg.pos-pay{font-weight:700;min-height:46px;border:1px solid #dbe3ea}
.pos-screen{padding:8px}

/* ===== products panel ===== */
.pos-searchform{margin:0 0 12px;display:flex;gap:8px;align-items:center}
.pos-search-wrap{position:relative;flex:1}
.pos-search-ic{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#9aa4af;pointer-events:none}
.pos-search-input{padding-right:30px}
.pos-items-grid{display:flex;flex-wrap:wrap;gap:8px;height:560px;overflow:auto;align-content:flex-start}
.pos-item{
  flex:0 0 calc(25% - 8px);min-width:110px;text-align:center;border:1px solid #e2e2e2;border-radius:6px;
  background:#fff;padding:10px 6px;cursor:pointer;transition:all .15s;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
}
.pos-item:hover{border-color:#108fc6;background:#eef6fb;transform:translateY(-2px);box-shadow:0 3px 8px rgba(16,143,198,.15)}
.pos-item-name{display:block;font-size:13px;font-weight:600;color:#1f2d3d;margin-bottom:5px;line-height:1.3}
.pos-item-price{
  display:inline-block;font-size:12px;font-weight:700;color:#0d70c6;background:#e8f1fb;
  padding:2px 8px;border-radius:10px;
}
.pos-empty{color:#9aa4af;text-align:center;padding:20px}

/* ===== product variants (colors / sizes) in POS ===== */
.pos-var{color:#8a5a12;font-size:12px;font-weight:700;direction:rtl;display:inline-block;margin-right:4px}
.pos-var-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:320px;overflow:auto}
.pos-var-btn{display:flex;justify-content:space-between;align-items:center;background:#f2f6fa;border:1px solid #dfe5ec;
  color:#1f2d3d;border-radius:6px;padding:10px 12px;text-align:right;cursor:pointer;transition:all .12s}
.pos-var-btn:hover{background:#e3f0fb;border-color:#108fc6;transform:translateY(-1px)}
.pos-var-btn .pos-var-price{color:#0d70c6;font-weight:700;font-size:13px}
body.dark-mode .pos-var{color:#f0c674}
body.dark-mode .pos-var-btn{background:#202a35;border-color:#2f3b4a;color:#e7edf3}
body.dark-mode .pos-var-btn:hover{background:#263243;border-color:#4a82b8}
body.dark-mode .pos-var-btn .pos-var-price{color:#7fc2ef}


/* ===== cashier panel ===== */
.pos-cash-header{border-top:3px solid #108fc6}
.pos-cash-header .box-title{color:#1f2d3d}
.pos-clock{margin:0;font-weight:700;color:#108fc6;font-size:16px;direction:ltr}
.pos-options{background:#f7f9fb;border:1px solid #e6e9ef;border-radius:6px;padding:12px 12px 2px;margin-bottom:14px}
.pos-lbl{font-size:13px;font-weight:700;color:#47525e}
.pos-lbl .fa{margin-left:4px}
.pos-cart-section,.pos-summary-section{margin-bottom:14px}
.pos-cart-scroll{max-height:220px;overflow:auto}
.pos-cart-table thead th{background:#f0f4f8;color:#47525e;font-weight:700;font-size:13px;border-color:#dfe5ec}
.pos-cart-table tbody td{color:#1f2d3d;vertical-align:middle}
.pos-cart-table .num{text-align:center}
.pos-cart-table .row-actions{text-align:center;width:40px}
.pos-qty,.pos-price{min-width:62px;text-align:center}
.pos-line-total{color:#108fc6;font-weight:700}
.pos-grand{background:#fffbe6}
.pos-grand b{color:#47525e}
.pos-summary{background:#fbfcfe;border:1px solid #e6e9ef;border-radius:6px;padding:12px 14px}
.pos-sum-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:14px;border-bottom:1px dashed #eceff3}
.pos-sum-row:last-child{border-bottom:none}
.pos-sum-row label{margin:0;font-weight:600;color:#47525e}
.pos-sum-row.grand .pos-sum-total{color:#108fc6}
.pos-in-disc{width:110px;display:inline-block}
.pos-sum-row.net{
  font-size:18px;font-weight:700;background:#eaf7ef;border-radius:6px;padding:10px 12px;border:none;margin-top:4px;
}
.pos-sum-row.net label{font-weight:700;color:#1f7a43}
.pos-sum-net{color:#1f7a43;font-size:20px}
.pos-pay-buttons{display:flex;gap:8px;margin-top:12px}
.pos-pay-buttons .pos-pay{flex:1;font-size:15px}
.pos-pay-buttons .pos-pay i{margin-inline-end:6px;font-size:16px}
.pos-pay-buttons .pos-pay.pos-blue2{background:#e3eefd;color:#0d70c6;border-color:#b7d3f1}
.pos-pay-buttons .pos-pay.pos-blue2 i{color:#0d70c6}
.pos-pay-buttons .pos-pay.pos-blue2:hover{background:#cfe3fa}
.pos-pay-buttons .pos-pay.pos-blue{background:#dff1fb;color:#0073b7;border-color:#b0deef}
.pos-pay-buttons .pos-pay.pos-blue i{color:#0073b7}
.pos-pay-buttons .pos-pay.pos-blue:hover{background:#c9e7f6}
.pos-pay-buttons .pos-pay.pos-red{background:#fdeceb;color:#c9302c;border-color:#f3c1be}
.pos-pay-buttons .pos-pay.pos-red i{color:#c9302c}
.pos-pay-buttons .pos-pay.pos-red:hover{background:#fadfdd}
.pos-cash-actions{display:flex;gap:8px;margin-top:8px}
.pos-cash-actions a{flex:1}
.pos-calc{border:none;border-radius:8px;overflow:hidden;background:#f3f6f9}
.pos-calc-head{display:flex;justify-content:space-between;align-items:center;background:#108fc6;color:#fff;padding:10px 14px}
.pos-calc-title{font-weight:600;font-size:15px}
.pos-calc-close{color:#fff;font-size:18px;opacity:.85}
.pos-calc-close:hover{opacity:1;color:#fff}
.pos-calc-screen{background:#1d2a3a;color:#fff;padding:14px;text-align:left;direction:ltr;border-bottom:1px solid #2b3a4d}
.pos-calc-expression{font-size:12px;color:#7f93a8;min-height:16px}
.pos-calc-display{width:100%;background:transparent;border:none;color:#fff;font-size:26px;font-weight:600;text-align:right;direction:ltr}
.pos-calc-display:focus{outline:none}
.pos-calc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:12px;background:#f3f6f9}
.pos-calc-grid .cal{padding:13px 0;border:1px solid #dbe1e6;border-radius:6px;background:#fff;cursor:pointer;font-size:15px;font-weight:600;color:#333;transition:all .1s}
.pos-calc-grid .cal:hover{border-color:#108fc6}
.pos-calc-grid .cal:active{transform:scale(.95)}
.pos-calc-grid .cal.fn{background:#e9edf1;color:#4a5560;font-size:12px;font-weight:600}
.pos-calc-grid .cal.op{background:#108fc6;color:#fff;border-color:#108fc6;font-size:18px}
.pos-calc-grid .cal.op:hover{background:#0d70c6;border-color:#0d70c6}
.pos-calc-grid .cal.equals{background:#00a65a;border-color:#00a65a;color:#fff;font-size:22px}
.pos-calc-grid .cal.equals:hover{background:#008d4c;border-color:#008d4c}
.pos-calc-grid .cal.zero{grid-column:span 2}
.pos-calc-foot{background:#e9edf1;padding:6px 14px;font-size:12px;color:#4a5560;min-height:26px}
.pos-calc-memory{color:#008d4c;font-weight:600}
.pos-search-flash{box-shadow:0 0 0 3px rgba(243,156,18,.6);transition:box-shadow .2s}
.pos-btn-blink{animation:posBlink .9s ease}
@keyframes posBlink{0%,100%{box-shadow:0 0 0 0 rgba(243,156,18,0)}50%{box-shadow:0 0 0 4px rgba(243,156,18,.7)}}
.pos-hit{outline:2px solid #108fc6;outline-offset:-2px}
.pos-full .content-wrapper,.pos-full .main-footer{transition:margin-right .3s ease-in-out}
.pos-full .main-sidebar{transition:transform .3s ease-in-out}

/* modal base (hidden by default; opened via JS showModal) */
.modal{position:fixed;top:0;left:0;display:none;width:100%;height:100%;overflow:auto;z-index:1050;outline:0}
.modal.in{display:block}
.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.45);z-index:1040}
.modal-open{overflow:hidden}
.modal-dialog{position:relative;width:auto;max-width:520px;margin:60px auto;z-index:1055}
.modal-sm{max-width:340px}
.modal-content{position:relative;background:#fff;border:1px solid rgba(0,0,0,.2);border-radius:6px;box-shadow:0 5px 15px rgba(0,0,0,.3);margin:0 12px}
.modal-header{padding:12px 16px;border-bottom:1px solid #e5e5e5;font-size:15px}
.modal-body{padding:14px 16px}
.modal-footer{padding:10px 16px;border-top:1px solid #e5e5e5;text-align:left}

/* POS fullscreen mode */
.pos-full .main-sidebar{transform:translateX(230px)}
.pos-full .content-wrapper,.pos-full .main-footer{margin-right:0}
.pos-full .main-header .logo{width:0;padding:0;overflow:hidden}
.pos-full .main-header .navbar{margin-right:0}
.pos-full .content-wrapper{height:100vh;padding-top:0}
.pos-full.pos-screen .box{height:calc(100vh - 24px)}

/* ===== Becreative stat-cards (report summary metrics) ===== */
.report-stats{display:flex;gap:18px;margin-top:18px}
.report-stats .stat-col{flex:1;min-width:0}
.report-stats .stat-title{font-weight:600;font-size:15px;color:#2b333f;margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid #eef0f3}
.stat-card{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid #eef0f3;border-radius:12px;padding:14px 18px;height:88px;margin:0 0 12px;box-shadow:rgba(60,72,88,.08) 0 2px 8px 0}
.stat-card .stat-card__icon{flex:0 0 54px;width:54px;height:54px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff}
.stat-card .stat-card__icon i{font-size:24px}
.stat-card .stat-card__body{flex:1;min-width:0}
.stat-card .stat-card__label{display:block;font-size:13px;font-weight:600;color:#8a94a6;text-align:right;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-card .stat-card__value{display:block;font-size:22px;font-weight:700;color:#2b333f;direction:ltr;text-align:left;white-space:nowrap;margin-top:2px}
.stat-card--blue{border-right:4px solid #108fc6}.stat-card--blue .stat-card__icon{background:#108fc6}
.stat-card--green{border-right:4px solid #00a65a}.stat-card--green .stat-card__icon{background:#00a65a}
.stat-card--red{border-right:4px solid #dd4b39}.stat-card--red .stat-card__icon{background:#dd4b39}
.stat-card--teal{border-right:4px solid #00d2b3}.stat-card--teal .stat-card__icon{background:#00d2b3}
.stat-card--purple{border-right:4px solid #8e44ad}.stat-card--purple .stat-card__icon{background:#8e44ad}
.stat-card--orange{border-right:4px solid #f39c12}.stat-card--orange .stat-card__icon{background:#f39c12}
.stat-card--yellow{border-right:4px solid #f0ad4e}.stat-card--yellow .stat-card__icon{background:#f0ad4e}
.stat-card--gray{border-right:4px solid #8a94a6}.stat-card--gray .stat-card__icon{background:#8a94a6}
.report-checkbox{display:inline-flex;align-items:center;gap:8px;padding-top:34px}
.report-checkbox input{width:18px;height:18px;accent-color:#108fc6;cursor:pointer}

/* ===== Font sizes across the whole app ===== */
*{font-size:inherit}
body{font-weight:500}
p{font-weight:500}
a{font-weight:500}
.table{font-size:14.5px;font-weight:500}
.table>thead>tr>th{font-size:13.5px;font-weight:700}
.table>tbody>tr>td{font-size:14px;font-weight:500}
.content-header h1{font-size:23px;font-weight:800}
.content-header .breadcrumb{font-size:13px}
.box-header .box-title{font-size:18px;font-weight:800}
.form-group label{font-size:15px;font-weight:700}
.form-control{height:40px;padding:8px 12px;font-size:15px;font-weight:500}
select.form-control{height:40px;font-size:15px;font-weight:500}
textarea.form-control{font-size:15px}
.btn{font-size:14px;padding:8px 14px;font-weight:700}
.btn-sm{font-size:12.5px;padding:6px 11px}
.sidebar-menu>li>a{font-size:15px;font-weight:700}
.sidebar-menu>li .treeview-menu>li>a{font-size:14px;font-weight:600}
.small-box .inner h3{font-size:36px;font-weight:800}
.small-box .inner p{font-size:15px;font-weight:700}
.main-header .navbar .nav>li>a{font-size:15px}
.user-panel .info a{font-size:13px}
.dropdown-menu{font-size:14px;font-weight:500}
.modal-title{font-size:18px;font-weight:800}
.modal-header,.modal-body{font-size:15px}
.alert,.callout{font-size:14.5px}
.pagination>li>a,.pagination>li>span{font-size:14px}
.system-field,.detail-field{font-size:14.5px}
.form-group label.error{font-size:13px}
.stat-card .stat-card__label{font-size:13px;font-weight:700}
.stat-card .stat-card__value{font-size:20px;font-weight:800}
.stat-card .stat-card__icon{flex:0 0 48px;width:48px;height:48px}
.stat-card .stat-card__icon i{font-size:22px}
.stat-card{height:80px;gap:14px}
.report-stats .stat-title{font-size:16px;font-weight:800}
.pos-item-name{font-size:14px;font-weight:700}
.pos-lbl{font-size:14px;font-weight:700}
.pos-sum-row{font-size:15px}
.pos-cart-table thead th{font-size:14px;font-weight:800}
.pos-cart-table tbody td{font-size:14px}
.pos-item-price{font-size:13px;font-weight:800}
.pos-clock{font-size:15px}
.topbar-title{font-size:15px}
.section-title{font-size:14px;font-weight:800}
.info-value{font-size:15px}
.logo{font-size:19px}
.sidebar-menu > li.header{font-size:12px}
.user-panel .info p{font-size:14px}
tr.g-total td,tr.g-bal td{font-size:15px}
.lbl{font-size:14px}
.widget{font-size:14px}

/* ==========================================================================
   Becreative unified design (filter bar + striped tables + section colors)
   ========================================================================== */
.form-inline{display:block}
.filter-bar{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:flex-end}
.filter-bar .form-group{margin-bottom:0}
.filter-bar .form-group label{
  display:block;color:#2b333f;font-size:15px;font-weight:700;
  margin-bottom:6px;padding-right:2px;white-space:nowrap;
}
.filter-bar .form-group .controls{display:block}
.filter-bar .form-group .controls input.form-control{width:190px}
.filter-bar .form-group .controls select.form-control{min-width:175px;width:auto}
.filter-bar .form-group .controls select.form-control,
.filter-bar .form-group .controls .form-control{height:42px}
.filter-bar .btn-block{min-width:130px;height:42px}
@media(max-width:900px){
  .filter-bar{flex-direction:column;align-items:stretch}
  .filter-bar .form-group .controls input.form-control{width:100%}
  .filter-bar .form-group .controls select.form-control{width:100%}
}

/* striped + bordered + condense tables (Becreative report tables) */
.table-striped>tbody>tr:nth-of-type(odd){background:#f8f9fb}
.table-condensed>thead>tr>th,.table-condensed>tbody>tr>td{padding:7px 6px}
.table-bordered{border:1px solid #dfe5ec}
.table-bordered>thead>tr>th,.table-bordered>tbody>tr>td{border:1px solid #dfe5ec;vertical-align:middle}

/* report filter toolbar (Becreative): a light strip above the table */
.filter-bar{
  background:#f7f9fb;border:1px solid #e3e8ef;border-radius:8px;
  padding:16px 18px;margin-bottom:16px;box-shadow:0 1px 2px rgba(0,0,0,.03);
  width:100%;
}

/* section accent helpers: color-coded section icon chips */
.section-chip{display:inline-flex;align-items:center;gap:8px;color:#2b333f}
.section-chip i{
  width:30px;height:30px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  color:#fff;font-size:16px;
}
.section-chip--orange i{background:#f39c12}
.section-chip--red i{background:#dd4b39}
.section-chip--blue i{background:#108fc6}
.section-chip--purple i{background:#8e44ad}
.section-chip--green i{background:#00a65a}
.section-chip--teal i{background:#00d2b3}

/* box colored left/top accent like Becreative section boxes */
.box.box-section-accent{border-top:3px solid #108fc6}
.box.box-section-accent.box-acc-red{border-top-color:#dd4b39}
.box.box-section-accent.box-acc-orange{border-top-color:#f39c12}
.box.box-section-accent.box-acc-purple{border-top-color:#8e44ad}
.box.box-section-accent.box-acc-teal{border-top-color:#00d2b3}
.box.box-section-accent.box-acc-green{border-top-color:#00a65a}

/* table header accent per box color */
.box-acc-red .table>thead>tr>th{background:#fdecea;color:#a94442}
.box-acc-orange .table>thead>tr>th{background:#fdf3e3;color:#8a6d3b}
.box-acc-purple .table>thead>tr>th{background:#f3ecfb;color:#6f42c1}
.box-acc-teal .table>thead>tr>th{background:#e6f7f5;color:#0b7263}
.box-acc-green .table>thead>tr>th{background:#e9f7ef;color:#1e7e34}
.box-acc-blue .table>thead>tr>th{background:#e8f2fb;color:#0d70c6}

/* status badges */
.badge-low{background:#fdecea;color:#a94442;border:1px solid #f3c1be;border-radius:12px;padding:2px 10px;font-size:13px;font-weight:700;display:inline-block}
.badge-ok{background:#e9f7ef;color:#1e7e34;border:1px solid #b7e0c3;border-radius:12px;padding:2px 10px;font-size:13px;font-weight:700;display:inline-block}
.badge-warn{background:#fdf3e3;color:#8a6d3b;border:1px solid #f3dcb2;border-radius:12px;padding:2px 10px;font-size:13px;font-weight:700;display:inline-block}
.badge-out{background:#fdecea;color:#c9302c;border:1px solid #f3c1be;border-radius:12px;padding:2px 10px;font-size:13px;font-weight:700;display:inline-block}
.badge-in{background:#e9f7ef;color:#1e7e34;border:1px solid #b7e0c3;border-radius:12px;padding:2px 10px;font-size:13px;font-weight:700;display:inline-block}

/* ==========================================================================
   Becreative قيمة المخازن — two-panel filter (right/left) + sort bar
   ========================================================================== */
.filter-bar--two{display:grid;grid-template-columns:minmax(250px,300px) 1fr;gap:0 30px;align-items:start}
.filter-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px 20px;align-content:start}
.filter-panel + .filter-panel{border-right:1px dashed #dfe5ec;padding-right:26px}
.filter-panel .form-group .controls input.form-control{width:100%}
.filter-panel .form-group .controls select.form-control{width:100%;min-width:0}
.filter-panel__title{grid-column:1 / -1;display:flex;align-items:center;gap:8px;color:#2b333f;font-size:17px;font-weight:800;padding-bottom:8px;border-bottom:2px solid #f39c12;margin-bottom:2px}
.filter-panel__title i{font-size:18px}
.form-group--action{align-self:end}
.controls--icon{display:flex;gap:6px}
.controls--icon input{flex:1}
.controls--icon .btn{height:42px;width:46px;flex:0 0 46px;border-radius:8px}
@media(max-width:1080px){.filter-bar--two{grid-template-columns:1fr}.filter-panel + .filter-panel{border-right:0;padding-right:0;border-top:1px dashed #dfe5ec;padding-top:16px}}

/* sort bar (ترتيب) */
.sort-bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;background:#fbfcfd;border:1px solid #eef0f3;border-radius:8px;padding:10px 14px;margin:14px 0 8px}
.sort-form{display:flex;align-items:flex-end;flex-wrap:wrap;gap:10px}
.sort-label{font-size:14px;font-weight:800;color:#5a6472;white-space:nowrap;line-height:42px}
.sort-form select.form-control{height:38px;width:auto;min-width:150px}
.sort-form .btn{height:38px}

/* 4-up stat cards for قيمة المخازن */
.report-stats--4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0 6px}
.report-stats--4 .stat-card{margin:0}
@media(max-width:1080px){.report-stats--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.report-stats--4{grid-template-columns:1fr}}
.report-stats--3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0 6px}
.report-stats--3 .stat-card{margin:0}
@media(max-width:1080px){.report-stats--3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.report-stats--3{grid-template-columns:1fr}}

/* إجمالى مبيعات الاصناف — إجماليان شمال ويمين */
.stock-divider--green{background:linear-gradient(90deg,#0f9d58,#8ed6a8,transparent)}
.stock-divider--orange{background:linear-gradient(90deg,#f39c12,#ffd580,transparent)}
.stock-divider--red{background:linear-gradient(90deg,#dd4b39,#f0a08f,transparent)}
.count-total{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:820px;margin:0 0 18px}
.count-total .stat-card{margin:0}
.count-hint{margin-top:8px;color:#7a8699;font-size:12px}
@media(max-width:640px){.count-total{grid-template-columns:1fr}}
.report-stats--side{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:820px;margin:18px 0 8px}
.report-stats--side .stat-card{margin:0}
@media(max-width:640px){.report-stats--side{grid-template-columns:1fr}}

/* ==========================================================================
   رصيد المخزن (stock/index) — divider + two totals with icons
   ========================================================================== */
.stock-divider{height:2px;background:linear-gradient(90deg,#f39c12,#ffd580,transparent);border:none;margin:6px 0 18px;width:100%}
.stock-totals{display:flex;justify-content:space-between;align-items:stretch;gap:16px;margin:0 0 18px}
.stock-totals .stat-card{flex:1;max-width:360px;margin:0;height:88px}
.stock-totals .stat-card__value{font-size:26px}
.box-header.small-header{padding:8px 0 6px;border-bottom:1px solid #eef0f3;margin:4px 0 8px}
.box-header.small-header .box-title{font-size:16px}
@media(max-width:640px){.stock-totals{flex-direction:column}.stock-totals .stat-card{max-width:none}}

/* حركة الاصناف (stock/moves) — totals grouped into كميات/نقدية */
.stock-divider--teal{background:linear-gradient(90deg,#00d2b3,#88e6d8,transparent)}
.moves-totals{display:flex;gap:18px;margin:0 0 18px}
.moves-totals__group{flex:1;min-width:0}
.moves-totals__title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:800;color:#2b333f;margin-bottom:10px;padding-bottom:8px;border-bottom:2px solid #eef0f3}
.moves-totals__title i{color:#00a65a}
.moves-totals__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.moves-totals__cards .stat-card{margin:0;height:84px;padding:12px 14px}
.moves-totals__cards .stat-card__icon{flex:0 0 44px;width:44px;height:44px}
.moves-totals__cards .stat-card__icon i{font-size:20px}
.moves-totals__cards .stat-card__value{font-size:22px}
@media(max-width:1080px){.moves-totals{flex-direction:column}.moves-totals__cards{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.moves-totals__cards{grid-template-columns:1fr}}

/* ارباح الاصناف خلال فترة — totals + note */
.profit-totals{grid-template-columns:repeat(4,1fr);margin:0 0 12px}
.profit-note{display:flex;align-items:center;gap:8px;background:#eef4fb;border:1px solid #d4e3f3;color:#2b333f;border-radius:8px;padding:10px 14px;font-size:15px;margin:0 0 16px}
.profit-note i{color:#108fc6}
.profit-note strong{color:#0d70c6;font-size:17px;direction:ltr}
@media(max-width:1080px){.profit-totals{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.profit-totals{grid-template-columns:1fr}}

/* إجمالى مبيعات الاصناف خلال فترة — 3x3 totals grid */
.stock-divider--blue{background:linear-gradient(90deg,#108fc6,#7fc4e8,transparent)}
.period-totals{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0 0 18px}
.period-totals .stat-card{margin:0;height:78px;padding:10px 12px}
.period-totals .stat-card__icon{flex:0 0 40px;width:40px;height:40px}
.period-totals .stat-card__icon i{font-size:18px}
.period-totals .stat-card__value{font-size:20px}
@media(max-width:1080px){.period-totals{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.period-totals{grid-template-columns:1fr}}

/* ==========================================================================
   Becreative form-elegant (bank account forms)
   ========================================================================== */
.box.form-elegant{
  border:1px solid #e7eaef;
  border-radius:12px;
  box-shadow:0 2px 14px rgba(60,72,88,.08);
  overflow:hidden;
  border-top:none;
}
.box.form-elegant>.box-header.with-border{
  background:#f8fafc;
  border-bottom:1px solid #eef0f3;
  padding:14px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:none;
  border-top-left-radius:12px;
  border-top-right-radius:12px;
}
.box.form-elegant>.box-header.with-border .box-title{
  font-size:16px;
  font-weight:700;
  color:#34425a;
  display:flex;
  align-items:center;
  gap:8px;
}
.box.form-elegant>.box-header.with-border .box-title i{
  color:#3c8dbc;
  font-size:18px;
}
.box.form-elegant>.box-header.with-border .form-actions{
  display:flex;
  gap:8px;
  align-items:center;
}
.box.form-elegant>.box-header .form-actions .btn-flat{
  border-radius:8px;
  font-weight:600;
  box-shadow:0 1px 3px rgba(0,0,0,.08);
  padding:8px 18px;
  font-size:13px;
}
.box.form-elegant>.box-body{
  padding:20px 18px 6px;
  border:none;
}

/* ---------- header action buttons (جديد/تعديل/حذف/طباعة) ---------- */
.box-header .form-actions .btn-flat{
  display:inline-flex;align-items:center;gap:7px;
  border-radius:9px;font-weight:700;font-size:13.5px;
  padding:9px 18px;margin-left:6px;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
  transition:transform .12s ease, box-shadow .12s ease, background .18s ease, opacity .15s ease;
}
.box-header .form-actions .btn-flat:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.18)}
.box-header .form-actions .btn-flat:active{transform:translateY(0);box-shadow:0 1px 3px rgba(0,0,0,.15)}
.box-header .form-actions .btn-flat i{font-size:13px}
.box-header .form-actions .btn-flat.bg-yellow-gradient{background:linear-gradient(135deg,#f39c12,#f5a623);color:#fff}
.box-header .form-actions .btn-flat.bg-yellow-gradient:hover{background:linear-gradient(135deg,#e08e0b,#f39c12)}
.box-header .form-actions .btn-flat.bg-blue{background:#108fc6}
.box-header .form-actions .btn-flat.bg-blue:hover{background:#0d70c6}
.box-header .form-actions .btn-flat.bg-red{background:#dd4b39}
.box-header .form-actions .btn-flat.bg-red:hover{background:#c9302c}
.box-header .form-actions .btn-flat.bg-gray{background:#7a8494;color:#fff}
.box-header .form-actions .btn-flat.bg-gray:hover{background:#636d7d}

/* floating label form fields (pmd-textfield) */
.form-group.pmd-textfield{margin-bottom:16px;position:relative}
.form-group.pmd-textfield label{
  display:block;
  font-size:11px;
  font-weight:400;
  color:#000;
  margin-bottom:4px;
}
.form-group.pmd-textfield .controls{
  position:relative;
}
.form-group.pmd-textfield .controls .form-control{
  border-radius:8px;
  border:1px solid #dfe3e8;
  box-shadow:none;
  height:38px;
  background:#fff;
  color:#333;
  transition:border-color .15s,box-shadow .15s;
}
.form-group.pmd-textfield .controls .form-control:focus{
  border-color:#3c8dbc;
  box-shadow:0 0 0 3px rgba(60,141,188,.15);
  outline:0;
}
.form-group.pmd-textfield .pmd-textfield-focused{
  position:absolute;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:0;
  height:2px;
  background:#3c8dbc;
  transition:width .2s;
}
.form-group.pmd-textfield .controls .form-control:focus ~ .pmd-textfield-focused{
  width:100%;
}
textarea.form-control.pmd-textfield-input{
  height:76px;
  border-radius:8px;
  resize:vertical;
}

/* checkbox switch (toggle for is_active) */
.switch-wrap{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.switch-wrap input[type="checkbox"]{
  -webkit-appearance:none;
  appearance:none;
  width:46px;height:26px;
  background:#d0d4db;
  border-radius:26px;
  position:relative;
  cursor:pointer;
  transition:background .2s;
  outline:none;
}
.switch-wrap input[type="checkbox"]::after{
  content:'';
  position:absolute;
  top:3px;left:3px;
  width:20px;height:20px;
  background:#fff;
  border-radius:50%;
  transition:transform .2s;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
}
.switch-wrap input[type="checkbox"]:checked{
  background:#108fc6;
}
.switch-wrap input[type="checkbox"]:checked::after{
  transform:translateX(20px);
}
.switch-label{font-size:13px;font-weight:600;color:#555}

/* ==========================================================================
   Becreative table-elegant (bank accounts listing)
   ========================================================================== */
.table.table-elegant{
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
  border:1px solid #e7eaef;
  box-shadow:0 2px 10px rgba(60,72,88,.07);
  overflow:hidden;
  width:100%;
}
.table.table-elegant>thead>tr>th{
  background:#34425a;
  color:#fff;
  font-weight:600;
  font-size:12.5px;
  padding:10px 7px;
  border:none;
  text-align:center;
  white-space:nowrap;
}
.table.table-elegant>thead>tr>th:first-child{
  border-top-right-radius:10px;
}
.table.table-elegant>thead>tr>th:last-child{
  border-top-left-radius:10px;
}
.table.table-elegant>tbody>tr>td{
  padding:8px 7px;
  color:#2b333f;
  font-size:12.5px;
  border-bottom:1px solid #eef0f3;
  white-space:normal;
  word-break:break-word;
  vertical-align:middle;
}
.table.table-elegant>tbody>tr:nth-child(even){
  background:#f6f8fb;
}
.table.table-elegant>tbody>tr:hover{
  background:#e9f1fb;
}
.table.table-elegant td a{
  color:#2c6e93;
  font-weight:600;
}
.table.table-elegant td a:hover{
  color:#1b4f6b;
  text-decoration:underline;
}
.table.table-elegant tfoot tr td{
  background:#f8fafc;
  font-weight:700;
  border-top:2px solid #e7eaef;
}

/* elegant table pagination */
.table_pager{display:flex;gap:6px;justify-content:center;padding:14px 0}
.table_pager a,.table_pager span{
  display:inline-block;padding:6px 12px;
  border:1px solid #e0e4ea;border-radius:6px;
  font-size:13px;font-weight:600;color:#555;
  background:#fff;text-decoration:none;
  transition:all .15s;
}
.table_pager a:hover{background:#e9f1fb;border-color:#3c8dbc;color:#3c8dbc}
.table_pager .on{background:#34425a;border-color:#34425a;color:#fff}

/* ==========================================================================
   Becreative bank register page — inline action buttons
   ========================================================================== */
.bank-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px}
.bank-actions .btn{min-width:90px}
.bank-actions .btn i{margin-left:4px}

/* edit-mode highlight on form */
.form-elegant.editing{
  border-color:#f39c12;
  box-shadow:0 2px 14px rgba(243,156,18,.12);
}
.form-elegant.editing>.box-header.with-border{
  background:#fdf8ee;
  border-bottom-color:#fae8c0;
}
.form-elegant.editing>.box-header.with-border .box-title{color:#8a6d3b}
.form-elegant.editing>.box-header.with-border .box-title i{color:#f39c12}

/* ==========================================================================
   Category icon picker (foods fontello) — صورة نوع الصنف
   ========================================================================== */
.cat-icon-picker .controls{border:1px solid #e7eaef;border-radius:10px;padding:14px;background:#fbfcfe}

.cat-picker-toolbar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:12px}

.cat-picker-preview{display:flex;align-items:center;gap:12px}
.cat-preview-box{
  width:58px;height:58px;border-radius:10px;background:#fff;
  border:1px dashed #c4ccd9;display:flex;align-items:center;justify-content:center;
  color:#108fc6;font-size:34px;box-shadow:0 2px 8px rgba(60,72,88,.08);
}
.cat-picker-current{display:flex;flex-direction:column;gap:6px}
.cat-picker-current strong{font-size:13px;color:#34425a}

.cat-picker-search{position:relative;flex:1;min-width:220px}
.cat-picker-search .input-icon{
  position:absolute;top:50%;transform:translateY(-50%);right:11px;color:#a4aebe;pointer-events:none;
}
.cat-picker-search input{padding-right:34px;height:36px;border-radius:8px}

.cat-icon-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:10px;
  max-height:280px;overflow:auto;padding:4px;
}
.cat-icon-tile{
  display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;
  padding:10px 6px;border:1px solid #e7eaef;border-radius:10px;background:#fff;
  transition:all .13s ease;text-align:center;
}
.cat-icon-tile:hover{border-color:#a8c7e0;background:#eef6fc;transform:translateY(-1px)}
.cat-icon-glyph{color:#34425a;font-size:30px;line-height:1;min-height:30px;display:flex;align-items:center}
.cat-icon-label{font-size:9.5px;color:#8a94a6;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-icon-tile.selected{border-color:#108fc6;background:#e7f4fb;box-shadow:0 0 0 2px rgba(16,143,198,.18)}
.cat-icon-tile.selected .cat-icon-glyph{color:#108fc6}
.cat-icon-tile.selected .cat-icon-label{color:#108fc6;font-weight:600}
.cat-icon-tile .cat-icon-glyph i{pointer-events:none}
.cat-icon-tile input{display:none}

/* ==========================================================================
   Dashboard redesign — لوحة التحكم (hero, KPIs, charts, tables)
   ========================================================================== */

/* ---------- Hero ---------- */
.dash-hero{ margin-bottom:20px; }
.dash-hero__inner{
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px;
  background:linear-gradient(120deg,#0c7fb0 0%,#108fc6 45%,#2a9fd6 100%);
  border-radius:16px; padding:26px 28px;
  box-shadow:0 10px 30px rgba(16,143,198,.22);
}
.dash-hero__inner::before{
  content:""; position:absolute; top:-70px; left:-40px; width:260px; height:260px; border-radius:50%;
  background:rgba(255,255,255,.07);
}
.dash-hero__inner::after{
  content:""; position:absolute; bottom:-90px; right:25%; width:220px; height:220px; border-radius:50%;
  background:rgba(255,255,255,.06);
}
.dash-hero__col{ position:relative; z-index:1; }
.dash-hero__greet{ flex:1 1 320px; color:#fff; }
.dash-hero__badge{
  display:inline-flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.25);
  color:#fff; font-size:12px; padding:4px 12px; border-radius:20px; margin-bottom:10px;
}
.dash-hero__title{ font-size:24px; font-weight:800; margin:0 0 6px; color:#fff; }
.dash-hero__title span{ color:#ffe9a3; }
.dash-hero__sub{ margin:0; color:rgba(255,255,255,.88); font-size:13.5px; max-width:560px; }
.dash-hero__actions{ display:flex; gap:10px; flex-wrap:wrap; }
.dash-btn{
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.35);
  color:#fff; font-weight:600; font-size:13px; padding:9px 15px; border-radius:10px;
  transition:all .15s ease; text-decoration:none;
}
.dash-btn:hover{ transform:translateY(-2px); color:#fff; }
.dash-btn i{ font-size:15px; }
.dash-btn--green:hover{ background:#00a65a; border-color:#00a65a; }
.dash-btn--blue:hover{ background:#3f83c5; border-color:#3f83c5; }
.dash-btn--amber:hover{ background:#f39c12; border-color:#f39c12; }
.dash-btn--purple:hover{ background:#605ca8; border-color:#605ca8; }

/* ---------- KPI cards ---------- */
.dash-kpis{ margin-bottom:4px; }
.dash-kpi{
  position:relative; display:flex; align-items:flex-start; gap:14px;
  background:#fff; border:1px solid #e9edf3; border-radius:14px;
  padding:18px; margin-bottom:16px; overflow:hidden;
  box-shadow:0 2px 10px rgba(60,72,88,.05); transition:all .16s ease;
}
.dash-kpi:hover{ transform:translateY(-3px); box-shadow:0 8px 22px rgba(60,72,88,.12); }
.dash-kpi__icon{
  width:50px; height:50px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:24px; flex:none;
}
.dash-kpi--blue .dash-kpi__icon{ background:linear-gradient(135deg,#108fc6,#2fb1e2); }
.dash-kpi--teal .dash-kpi__icon{ background:linear-gradient(135deg,#22bfbf,#17a2a2); }
.dash-kpi--green .dash-kpi__icon{ background:linear-gradient(135deg,#00a65a,#26c880); }
.dash-kpi--purple .dash-kpi__icon{ background:linear-gradient(135deg,#605ca8,#8667c9); }
.dash-kpi__body{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.dash-kpi__label{ font-size:12px; color:#8a94a6; font-weight:600; }
.dash-kpi__value{ font-size:22px; font-weight:800; color:#2b333f; line-height:1.1; }
.dash-kpi__value small{ font-size:12px; color:#8a94a6; font-weight:600; margin-right:2px; }
.dash-kpi__meta{ font-size:11.5px; color:#7a8494; }
.dash-kpi__meta i{ color:#a4aebe; margin-left:3px; }
.dash-kpi__ring{
  position:absolute; left:12px; top:12px; width:34px; height:34px; border-radius:50%;
  background:conic-gradient(#e9edf3 0% 100%);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));
          mask:radial-gradient(farthest-side,transparent calc(100% - 5px),#000 calc(100% - 4px));
}
.dash-kpi--blue .dash-kpi__ring{ background:conic-gradient(#108fc6 0% var(--p), #e9edf3 var(--p) 100%); }
.dash-kpi--teal .dash-kpi__ring{ background:conic-gradient(#22bfbf 0% var(--p), #e9edf3 var(--p) 100%); }

/* ---------- Boxes ---------- */
.dash-box{
  background:#fff; border:1px solid #e9edf3; border-radius:14px;
  box-shadow:0 2px 10px rgba(60,72,88,.05); margin-bottom:20px; overflow:hidden;
}
.dash-box__head{
  display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;
  padding:14px 18px; border-bottom:1px solid #eef1f6;
}
.dash-box__title{ font-weight:700; color:#2b333f; font-size:14px; display:inline-flex; align-items:center; gap:8px; }
.dash-box__title i{ color:#108fc6; font-size:16px; }
.dash-box__body{ padding:18px; }
.dash-box__body--flush{ padding:0; }
.dash-more{ font-size:12px; color:#108fc6; text-decoration:none; font-weight:600; }
.dash-more:hover{ color:#0b6891; text-decoration:underline; }

.dash-empty{ text-align:center; color:#a4aebe; padding:18px 0; font-size:13px; }
.dash-empty i{ font-size:34px; display:block; margin-bottom:8px; color:#ccd3de; }

/* ---------- Bar chart ---------- */
.dash-legend{ display:flex; gap:16px; font-size:12px; color:#7a8494; }
.dash-legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-left:5px; }
.dash-legend b{ color:#2b333f; }
.dash-bars{ display:flex; align-items:flex-end; gap:10px; height:190px; padding-top:20px; }
.dash-bar{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; position:relative;
  height:100%; min-width:0;
}
.dash-bar__tip{
  position:absolute; top:-22px; left:50%; transform:translateX(-50%);
  background:#2b333f; color:#fff; font-size:10.5px; padding:2px 7px; border-radius:6px;
  opacity:0; transition:opacity .15s; white-space:nowrap; pointer-events:none; z-index:2;
}
.dash-bar:hover .dash-bar__tip{ opacity:1; }
.dash-bar__fill{
  width:100%; max-width:52px; border-radius:7px 7px 3px 3px;
  background:linear-gradient(180deg,#f6b84c,#f39c12);
  transition:height .3s ease;
}
.dash-bar.is-best .dash-bar__fill{
  background:linear-gradient(180deg,#2fb1e2,#108fc6);
  box-shadow:0 6px 14px rgba(16,143,198,.3);
}
.dash-bar__label{ margin-top:7px; font-size:10.5px; color:#8a94a6; white-space:nowrap; }

/* ---------- Table ---------- */
.dash-table{ margin:0; }
.dash-table thead th{
  background:#f7f9fc; color:#7a8494; font-size:11.5px; font-weight:700;
  border-bottom:1px solid #eef1f6; padding:10px 12px; text-transform:none;
}
.dash-table tbody td{ padding:11px 12px; border-top:1px solid #f2f4f8; font-size:13px; vertical-align:middle; }
.dash-table tbody tr:hover{ background:#f7fbfe; }
.dash-inv-no{ font-weight:700; color:#34425a; }
.dash-badge{
  display:inline-block; font-size:11px; font-weight:700; padding:3px 10px; border-radius:20px;
}
.dash-badge--green{ background:#e6f7ee; color:#00a65a; }
.dash-badge--red{ background:#fdece9; color:#dd4b39; }
.dash-badge--blue{ background:#e8f3fb; color:#108fc6; }
.dash-badge--amber{ background:#fdf4e3; color:#e08e0b; }
.dash-badge--gray{ background:#eef1f6; color:#7a8494; }
.strong{ font-weight:700; color:#2b333f; }
.muted{ color:#8a94a6; }

/* ---------- Donut ---------- */
.dash-donut-wrap{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.dash-donut{
  position:relative; width:150px; height:150px; border-radius:50%; flex:none;
  box-shadow:0 4px 14px rgba(60,72,88,.1);
}
.dash-donut__hole{
  position:absolute; inset:0; margin:auto; width:92px; height:92px; border-radius:50%;
  background:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
}
.dash-donut__hole b{ font-size:22px; color:#2b333f; line-height:1; }
.dash-donut__hole span{ font-size:11px; color:#8a94a6; margin-top:3px; }
.dash-donut__legend{ list-style:none; margin:0; padding:0; flex:1; min-width:150px; }
.dash-donut__legend li{ display:flex; align-items:center; gap:9px; padding:6px 0; font-size:13px; }
.dash-donut__legend i{ width:11px; height:11px; border-radius:3px; flex:none; }
.dash-donut__lname{ flex:1; color:#5a6577; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dash-donut__legend b{ color:#2b333f; }

/* ---------- Low stock / warnings ---------- */
.dash-box--alert.has-warn{ border-color:#f6d7c1; }
.dash-box--alert.has-warn .dash-box__title i{ color:#f39c12; }
.dash-ok{
  display:flex; align-items:center; gap:8px; color:#00a65a; background:#f0faf4;
  border:1px dashed #bfe8d3; padding:12px 14px; border-radius:10px; font-size:13px;
}
.dash-ok i{ font-size:18px; }
.dash-warn-list{ list-style:none; margin:0; padding:0; }
.dash-warn-list li{ display:flex; align-items:center; gap:11px; padding:9px 0; border-bottom:1px solid #f2f4f8; }
.dash-warn-list li:last-child{ border-bottom:none; }
.dash-warn-list__dot{ width:9px; height:9px; border-radius:50%; background:#f39c12; flex:none; }
.dash-warn-list__dot.is-out{ background:#dd4b39; box-shadow:0 0 0 4px rgba(221,75,57,.12); }
.dash-warn-list__txt{ flex:1; min-width:0; }
.dash-warn-list__txt b{ display:block; font-size:13px; color:#2b333f; }
.dash-warn-list__txt .muted{ font-size:11px; }
.dash-warn-list__qty{ font-weight:800; font-size:15px; min-width:34px; text-align:center; }

/* ---------- Quick grid ---------- */
.dash-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.dash-tile{
  display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center;
  padding:14px 6px; border:1px solid #e9edf3; border-radius:12px; background:#fff;
  text-decoration:none; transition:all .15s ease;
}
.dash-tile:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(60,72,88,.1); border-color:#d8e3ee; }
.dash-tile__icon{
  width:42px; height:42px; border-radius:11px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:22px;
}
.dash-tile__icon--blue{ background:linear-gradient(135deg,#108fc6,#2fb1e2); }
.dash-tile__icon--green{ background:linear-gradient(135deg,#00a65a,#26c880); }
.dash-tile__icon--amber{ background:linear-gradient(135deg,#f39c12,#f6b84c); }
.dash-tile__icon--teal{ background:linear-gradient(135deg,#22bfbf,#30d5c8); }
.dash-tile__icon--purple{ background:linear-gradient(135deg,#605ca8,#8667c9); }
.dash-tile__icon--rose{ background:linear-gradient(135deg,#e0558c,#ef6f9e); }
.dash-tile__icon--navy{ background:linear-gradient(135deg,#34495e,#4a6785); }
.dash-tile__icon--orange{ background:linear-gradient(135deg,#e67e22,#f39c12); }
.dash-tile__label{ font-size:11px; color:#8a94a6; font-weight:700; }
.dash-tile__name{ font-size:13px; color:#34425a; font-weight:700; }

/* ---------- responsive ---------- */
@media (max-width:767px){
  .dash-hero__inner{ padding:20px; }
  .dash-hero__title{ font-size:20px; }
  .dash-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:480px){
  .dash-grid{ grid-template-columns:repeat(2,1fr); }
  .dash-donut-wrap{ justify-content:center; }
}

/* RTL fix: text-align for table numbers is handled by .num globally */

/* ==========================================================================
   BeCreative-style dashboard (.bca) — matched to becreativesystem reference
   ========================================================================== */
.bca{}

/* ---------- text helpers ---------- */
.text-amber{color:#e08e0b!important}
.text-orange{color:#e67e22!important}

/* ---------- AdminLTE box color variants (for dashboard widgets) ---------- */
.bca .box{background:#fff;border-radius:6px;border-top:3px solid #d2d6de;box-shadow:0 1px 1px rgba(0,0,0,.1);margin-bottom:20px}
.bca .box.box-primary{border-top-color:#108fc6}
.bca .box.box-success{border-top-color:#00a65a}
.bca .box.box-danger{border-top-color:#dd4b39}
.bca .box>.box-header.with-border{border-bottom:1px solid #f4f4f4;padding:10px 15px;display:block}
.bca .box>.box-header.with-border .box-title{font-size:15px;font-weight:700;line-height:1.3;color:#333}
.bca .box>.box-header.with-border .box-title i{margin-left:6px;color:#666}
.bca .box>.box-header.with-border .box-tools{top:8px}
.bca .box>.box-body{padding:15px}
.bca .box .pull-left{position:absolute;left:10px;top:8px}
.bca .box .pull-left .btn{margin-left:4px}

/* ---------- small-box widget cards (like Becreative) ---------- */
.bca .small-box.box{
  border-radius:14px; padding:14px; color:#fff; position:relative; overflow:hidden; cursor:pointer;
  margin-bottom:16px; box-shadow:0 1px 2px rgba(0,0,0,.12); border-top:0;
}
.bca .small-box.box.color-green{background:rgb(10,166,153)}
.bca .small-box.box.color-blue{background:rgb(0,144,217)}
.bca .small-box.box.color-purple{background:rgb(115,95,135)}
.bca .small-box.box.color-red{background:rgb(243,89,88)}
.bca .small-box.box .icon{position:absolute; left:12px; bottom:8px; color:rgba(255,255,255,.22); font-size:42px; line-height:42px; z-index:1; pointer-events:none}
.bca .small-box.box .box-header{padding:0 0 3px; display:block}
.bca .small-box.box .box-title{color:#fff; font-size:13.5px; font-weight:700; margin:0 0 6px; display:block}
.bca .small-box.box .widget-stats{padding:1px 0}
.bca .small-box.box .widget-stats .wrap{padding:2px 0}
.bca .small-box.box .widget-stats .wrap.last{border-bottom:1px solid rgba(255,255,255,.18); margin-bottom:4px; padding-bottom:4px}
.bca .small-box.box .item-title{color:#fff; font-size:12px; text-decoration:none; opacity:.95}
.bca .small-box.box .item-title span{font-weight:700}
.bca .small-box.box .item-title:hover{text-decoration:underline; opacity:1}
.bca .small-box.box .progress.dd{background:rgba(255,255,255,.25); height:5px; margin:6px 0 0; border-radius:4px; overflow:hidden}
.bca .small-box.box .progress.dd .progress-bar{background:#fff; box-shadow:none; border-radius:4px}

/* ---------- info-box KPIs (like Becreative) ---------- */
.bca .info-box{
  min-height:90px; background:#fff; border-radius:14px; padding:10px; margin-bottom:20px;
  box-shadow:0 1px 2px rgba(0,0,0,.12); display:flex; align-items:center; position:relative;
}
.bca .info-box .info-box-icon{
  display:flex; align-items:center; justify-content:center; width:62px; height:62px; border-radius:12px;
  color:#fff; font-size:30px; margin:0 0 0 12px; flex:none;
}
.bca .info-box.bg-yellow .info-box-icon{background:rgb(238,216,112)}
.bca .info-box.bg-green .info-box-icon{background:rgb(110,198,122)}
.bca .info-box.bg-red .info-box-icon{background:rgb(249,95,95)}
.bca .info-box.bg-purple .info-box-icon{background:rgb(96,92,168)}
.bca .info-box .info-box-content{flex:1; min-width:0}
.bca .info-box .info-box-text{font-size:13px; color:#555; display:block; font-weight:600}
.bca .info-box .info-box-number{font-size:22px; font-weight:800; color:#222; display:block; line-height:1.1}
.bca .info-box .info-box-number small{font-size:12px; color:#777; font-weight:600}
.bca .info-box .progress{background:rgba(0,0,0,.12); height:5px; margin:6px 0 5px; border-radius:4px; overflow:hidden}
.bca .info-box .progress .progress-bar{border-radius:4px}
.bca .info-box.bg-yellow .progress .progress-bar{background:rgb(238,216,112)}
.bca .info-box.bg-green .progress .progress-bar{background:rgb(110,198,122)}
.bca .info-box.bg-red .progress .progress-bar{background:rgb(249,95,95)}
.bca .info-box.bg-purple .progress .progress-bar{background:rgb(96,92,168)}
.bca .info-box .progress-description{font-size:11.5px; color:#666; display:block}
.bca .info-box .progress-description b{color:#333; font-weight:700}

/* ---------- bar chart (dashboard) ---------- */
.bca-bars{display:flex; align-items:flex-end; gap:10px; height:190px; padding-top:22px}
.bca-bar{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; position:relative; height:100%; min-width:0}
.bca-bar__tip{position:absolute; top:-22px; left:50%; transform:translateX(-50%); background:#2b333f; color:#fff; font-size:10.5px; padding:2px 7px; border-radius:6px; opacity:0; transition:opacity .15s; white-space:nowrap; pointer-events:none; z-index:2}
.bca-bar:hover .bca-bar__tip{opacity:1}
.bca-bar__fill{width:100%; max-width:50px; border-radius:6px 6px 3px 3px; background:linear-gradient(180deg,#f6b84c,#f39c12); transition:height .3s ease}
.bca-bar.is-best .bca-bar__fill{background:linear-gradient(180deg,#2fb1e2,#108fc6); box-shadow:0 6px 14px rgba(16,143,198,.3)}
.bca-bar__label{margin-top:7px; font-size:10.5px; color:#8a94a6; white-space:nowrap}

/* ---------- stats list (المخزون) ---------- */
.bca-stats{list-style:none; margin:0; padding:0}
.bca-stats li{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid #f2f4f8}
.bca-stats li:last-child{border-bottom:none}
.bca-stats__lbl{font-size:13px; color:#5a6577}
.bca-stats__lbl i{color:#108fc6; margin-left:6px}
.bca-stats b{font-size:15px; color:#2b333f; font-weight:800}

/* ---------- top items ---------- */
.bca-top{list-style:none; margin:0; padding:0}
.bca-top li{display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid #f2f4f8}
.bca-top li:last-child{border-bottom:none}
.bca-top__rank{width:22px; height:22px; border-radius:6px; background:#108fc6; color:#fff; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; flex:none}
.bca-top__name{flex:1; min-width:0; font-size:13px; color:#34425a; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.bca-top__val{text-align:left; flex:none}
.bca-top__val b{display:block; font-size:14px; color:#2b333f; font-weight:800}
.bca-top__val small{font-size:10.5px; color:#8a94a6}

/* ---------- low stock ---------- */
.bca-ok{display:flex; align-items:center; gap:8px; color:#00a65a; background:#f0faf4; border:1px dashed #bfe8d3; padding:10px 12px; border-radius:10px; font-size:13px}
.bca-ok i{font-size:17px}
.bca-warn{list-style:none; margin:0; padding:0}
.bca-warn li{display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid #f2f4f8}
.bca-warn li:last-child{border-bottom:none}
.bca-warn__dot{width:9px; height:9px; border-radius:50%; background:#f39c12; flex:none}
.bca-warn__dot.is-out{background:#dd4b39; box-shadow:0 0 0 4px rgba(221,75,57,.12)}
.bca-warn__name{flex:1; min-width:0; font-size:13px; color:#2b333f; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.bca-warn__qty{font-weight:800; font-size:15px}
.bca-warn__qty small{font-size:11px; color:#8a94a6}
.bca-box .bca-foot{padding-top:10px}
.bca-foot .btn-block{width:100%}

/* ---------- compact trio (قيمة المخزون / أعلى الأصناف / تنبيهات المخزون) ---------- */
.bca-row{display:flex; flex-wrap:nowrap; gap:18px; margin:0 0 10px}
.bca-row .bca-col{flex:1 1 0; min-width:0; display:flex}
.bca-row .bca-col .box{width:100%; box-shadow:0 1px 4px rgba(0,0,0,.05)}
.bca-mini{line-height:1.25}
.bca-mini .box>.box-header.with-border{padding:8px 13px}
.bca-mini .box>.box-header.with-border .box-title{font-size:13px;font-weight:700;line-height:1.3}
.bca-mini .box>.box-header.with-border .box-title i{font-size:13px;margin-left:5px}
.bca-mini .box>.box-body{padding:8px 13px 12px}
.bca-mini .bca-stats li{padding:5px 0; gap:8px}
.bca-mini .bca-stats__lbl{font-size:12px}
.bca-mini .bca-stats b{font-size:13px; line-height:1.25}
.bca-mini .bca-top li{padding:5px 0; gap:8px}
.bca-mini .bca-top__rank{width:19px;height:19px;font-size:10px;border-radius:5px}
.bca-mini .bca-top__name{font-size:12px}
.bca-mini .bca-top__val b{font-size:12.5px; line-height:1.25}
.bca-mini .bca-top__val small{font-size:9.5px; line-height:1.25}
.bca-mini .bca-top__val{display:inline-flex; align-items:baseline; gap:5px}
.bca-mini .bca-top__val b{display:inline-block}
.bca-mini .bca-top__val small{display:inline-block; text-align:left}
.bca-mini .bca-warn li{padding:5px 0; gap:8px}
.bca-mini .bca-warn__name{font-size:12px}
.bca-mini .bca-warn__qty{font-size:13px; line-height:1.25}
.bca-mini .bca-warn__qty small{font-size:10px; line-height:1.25}
.bca-mini .bca-ok{padding:8px 10px; font-size:12px; border-radius:8px}
.bca-mini .bca-foot{padding-top:8px}
.bca-mini .bca-foot .btn{font-size:12px; padding:5px 10px; min-height:0}
@media (max-width:639px){
  .bca-row{flex-direction:column}
  .bca-row .bca-col{min-width:0}
}

@media (max-width:767px){
  .bca .info-box{min-height:80px}
  .bca .info-box .info-box-icon{width:50px; height:50px; font-size:24px}
}

/* ==========================================================================
   UNIFIED INTERNAL SECTION COLORS
   كل الأقسام الداخلية (index/form/report ...) بلون موحد واحد = الأزرق الأساسي
   ========================================================================== */
:root{ --uni:#108fc6; --uni-dark:#0d70c6; --uni-soft:#e8f2fb; }

/* box accent top border -> blue */
.box.box-section-accent{ border-top-color:var(--uni); }
.box.box-section-accent.box-acc-red,
.box.box-section-accent.box-acc-orange,
.box.box-section-accent.box-acc-purple,
.box.box-section-accent.box-acc-teal,
.box.box-section-accent.box-acc-green,
.box.box-section-accent.box-acc-blue{ border-top-color:var(--uni); }

/* plain colored boxes -> blue */
.box.box-green{ border-top-color:var(--uni); }
.box.box-red{ border-top-color:var(--uni); }
.box.box-orange{ border-top-color:var(--uni); }
.box.box-yellow{ border-top-color:var(--uni); }
.box.box-aqua{ border-top-color:var(--uni); }
.box.box-primary{ border-top-color:var(--uni); }

/* box-color table header accents -> unified soft blue */
.box-acc-red .table>thead>tr>th,
.box-acc-orange .table>thead>tr>th,
.box-acc-purple .table>thead>tr>th,
.box-acc-teal .table>thead>tr>th,
.box-acc-green .table>thead>tr>th,
.box-acc-blue .table>thead>tr>th{ background:var(--uni-soft); color:var(--uni-dark); }

/* section chips -> unified blue */
.section-chip--orange i,
.section-chip--red i,
.section-chip--blue i,
.section-chip--purple i,
.section-chip--green i,
.section-chip--teal i{ background:var(--uni); }

/* stock/report dividers -> unified blue gradient */
.stock-divider--green,
.stock-divider--orange,
.stock-divider--red,
.stock-divider--teal,
.stock-divider--blue{ background:linear-gradient(90deg,var(--uni),#7fc4e8,transparent); }

/* stat cards (report metrics) -> unified blue */
.stat-card--blue,
.stat-card--green,
.stat-card--red,
.stat-card--teal,
.stat-card--purple,
.stat-card--orange,
.stat-card--yellow,
.stat-card--gray{ border-right-color:var(--uni); }
.stat-card--blue .stat-card__icon,
.stat-card--green .stat-card__icon,
.stat-card--red .stat-card__icon,
.stat-card--teal .stat-card__icon,
.stat-card--purple .stat-card__icon,
.stat-card--orange .stat-card__icon,
.stat-card--yellow .stat-card__icon,
.stat-card--gray .stat-card__icon{ background:var(--uni); }

/* filter panel title accent -> blue */
.filter-panel__title{ border-bottom-color:var(--uni); }

/* ==========================================================================
   BeCreative INVOICE DESIGN (Sell/Buy/Return + Quotation + Compact)
   ========================================================================== */

/* ---------- five-column row (invoice data fields) ---------- */
.row.five{}
.row.five > .col{padding-left:10px;padding-right:10px}

/* ---------- floating-label invoice fields (pmd-textfield) ---------- */
.inv-form .form-group.pmd-textfield{margin-bottom:14px}
.inv-form .form-group.pmd-textfield label{
  display:block;font-size:11px;font-weight:600;color:#7a8494;
  margin-bottom:4px;letter-spacing:.2px;padding-right:2px;
}
.inv-form .form-group.pmd-textfield .controls{}
.inv-form .form-group.pmd-textfield .control-row{display:flex;gap:0}
.inv-form .form-group.pmd-textfield .controls .form-control{
  flex:1;min-width:0;border-radius:8px;border:1px solid #dfe3e8;height:38px;font-size:14px;
}
.inv-form .form-group.pmd-textfield .controls .btn-invert{
  flex:0 0 42px;border-radius:8px 0 0 8px;height:38px;display:inline-flex;align-items:center;justify-content:center;
}
.inv-form .form-group.pmd-textfield textarea.form-control{min-height:70px}

/* invoice header action toolbar (حفظ/جديد/حذف/بحث/طباعة) */
.inv-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end;margin-bottom:0}
.inv-toolbar .btn{margin-left:0;min-width:0;padding:8px 16px;font-size:13px;border-radius:7px;font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.inv-toolbar .btn-flat.bg-yellow{background:#f39c12}
.inv-toolbar .btn-flat.bg-yellow:hover{background:#e08e0b}
.inv-toolbar .btn-flat.bg-yellow-gradient{background:linear-gradient(135deg,#f39c12,#f5a623);color:#fff}
.inv-toolbar .btn-flat.bg-blue{background:#108fc6}
.inv-toolbar .btn-flat.bg-blue:hover{background:#0d70c6}
.inv-toolbar .btn-flat.bg-purple{background:#605ca8}
.inv-toolbar .btn-flat.bg-purple:hover{background:#554e9e}
.inv-toolbar .btn-flat.gradient.add-arrow{background:linear-gradient(135deg,#00a65a,#2ab86b);color:#fff}
.inv-toolbar .btn-group{position:relative;display:inline-block}
.inv-toolbar .btn-group .dropdown-menu.inv-print-menu{
  display:none;position:absolute;left:0;top:100%;min-width:210px;z-index:1200;
  background:#fff;border:1px solid #e3e8ef;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.14);
  padding:6px;list-style:none;
}
.inv-toolbar .btn-group.open .dropdown-menu.inv-print-menu{display:block}
.inv-toolbar .btn-group .dropdown-menu.inv-print-menu>li>a{
  display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:7px;color:#2b333f;
  font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;
}
.inv-toolbar .btn-group .dropdown-menu.inv-print-menu>li>a:hover{background:#eef6fb;color:#108fc6}
.inv-toolbar .btn-group .dropdown-menu.inv-print-menu i{width:18px;text-align:center;color:#108fc6}

/* invoice entry table (elegant) */
.inv-table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;background:#fff;border:1px solid #e7eaef;border-radius:10px;overflow:hidden}
.inv-table thead th{
  background:#34425a;color:#fff;font-weight:700;font-size:12.5px;padding:11px 8px;border:none;text-align:center;white-space:nowrap;
}
.inv-table thead th:first-child{border-right:none}
.inv-table tbody td{padding:7px 6px;border-bottom:1px solid #eef0f3;vertical-align:middle;color:#2b333f;font-size:13.5px}
.inv-table tbody tr:nth-child(even){background:#f6f8fb}
.inv-table tbody tr:hover{background:#eef6fb}
.inv-table tbody tr:last-child td{border-bottom:none}
.inv-table .num{direction:ltr;text-align:center;font-variant-numeric:tabular-nums}
.inv-table input.form-control{height:34px;font-size:13.5px;border-radius:6px;text-align:center}
.inv-table .delRow{width:30px;height:30px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center}

/* ---------- summary total boxes (اجمالى/صافى/بعد المرتجع) ---------- */
.inv-sums{display:flex;gap:14px;flex-wrap:wrap;margin-top:4px}
.inv-sums .inv-sum{
  flex:1 1 200px;min-width:190px;border-radius:12px;padding:14px 18px;color:#fff;
  position:relative;overflow:hidden;box-shadow:0 3px 12px rgba(0,0,0,.08);
}
.inv-sums .inv-sum__icon{position:absolute;left:12px;bottom:6px;font-size:44px;opacity:.22}
.inv-sums .inv-sum__label{font-size:12.5px;font-weight:600;opacity:.92;margin-bottom:4px;display:flex;align-items:center;gap:7px}
.inv-sums .inv-sum__value{font-size:24px;font-weight:800;direction:ltr;text-align:left;font-variant-numeric:tabular-nums}
.inv-sums .inv-sum--warning{background:linear-gradient(135deg,#f39c12,#f5b041)}
.inv-sums .inv-sum--primary{background:linear-gradient(135deg,#00a65a,#26c880)}
.inv-sums .inv-sum--danger{background:linear-gradient(135deg,#dd4b39,#ef6b5b)}
.inv-sums .inv-sum--blue{background:linear-gradient(135deg,#108fc6,#2fb1e2)}
.inv-sums .inv-sum--purple{background:linear-gradient(135deg,#605ca8,#8667c9)}
.inv-sums .inv-sum--teal{background:linear-gradient(135deg,#00d2b3,#30d5c8)}
.inv-sums .inv-sum-input{
  width:100%;background:transparent;border:none;color:#fff;font-size:24px;font-weight:800;
  direction:ltr;text-align:left;font-variant-numeric:tabular-nums;box-shadow:none;outline:none;padding:0;
}

/* ---------- floating labels hint ---------- */
.inv-section-title{
  display:flex;align-items:center;gap:9px;color:#34425a;font-size:16px;font-weight:800;
  margin:18px 0 14px;padding-bottom:9px;border-bottom:2px solid #108fc6;
}
.inv-section-title i{color:#108fc6;font-size:17px}

/* unify POS section titles with the invoice panel style */
.pos-screen .section-title{
  display:flex;align-items:center;gap:9px;color:#34425a;font-size:15px;font-weight:800;
  padding-bottom:8px;margin-bottom:12px;border-bottom:2px solid #108fc6;
}
.pos-screen .section-title i{color:#108fc6;font-size:15px}

/* ---------- invoice box (form-elegant combo) ---------- */
.inv-wrap .box{border-radius:12px;border:1px solid #e7eaef;box-shadow:0 2px 14px rgba(60,72,88,.08)}
.inv-wrap .box>.box-header.with-border{
  background:#f8fafc;border-bottom:1px solid #eef0f3;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;border-radius:12px 12px 0 0;
}
.inv-wrap .box>.box-header.with-border .box-title{font-size:16px;font-weight:800;color:#34425a;display:flex;align-items:center;gap:8px}
.inv-wrap .box>.box-header.with-border .box-title i{color:#108fc6;font-size:18px}
.inv-wrap .box>.box-body{padding:18px 18px 8px;border:none}

/* invoice list page stat tiles (BeCreative small boxes) */
.inv-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.inv-stats .inv-stat{
  border-radius:12px;padding:16px 18px;color:#fff;position:relative;overflow:hidden;
  box-shadow:0 3px 12px rgba(0,0,0,.08);display:flex;flex-direction:column;gap:2px;
}
.inv-stats .inv-stat__icon{position:absolute;left:auto;right:14px;bottom:8px;font-size:40px;opacity:.22}
.inv-stats .inv-stat__val{font-size:24px;font-weight:800;direction:ltr;text-align:left}
.inv-stats .inv-stat__lbl{font-size:13px;font-weight:600;opacity:.92;display:flex;align-items:center;gap:7px}
.inv-stats .inv-stat__ftr{font-size:11px;opacity:.8}
@media(max-width:900px){.inv-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.inv-stats{grid-template-columns:1fr}}

/* ---------- sales invoices header actions + row selection ---------- */
.inv-title-hint{display:inline-block;margin-right:12px;font-size:11.5px;font-weight:600;color:#8a94a6;vertical-align:middle}
.inv-table tbody tr.inv-row{cursor:pointer}
.inv-table tbody tr.inv-row.selected td{background:#d8ecfb !important}
.inv-table tbody tr.inv-row.selected td:first-child{border-right:3px solid #108fc6}

/* search filter bar (BeCreative) */
.inv-filter{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px;background:#f7f9fb;border:1px solid #e3e8ef;border-radius:10px;padding:14px 16px}
.inv-filter .form-control{height:40px;border-radius:8px;flex:1;min-width:200px}
.inv-filter .btn{height:40px;border-radius:8px}
.inv-filter .inv-filter-check{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 12px;background:#fff;border:1px solid #e3e8ef;border-radius:8px;color:#2b333f;font-weight:600;font-size:13.5px;cursor:pointer;white-space:nowrap}
.inv-filter .inv-filter-check input{width:16px;height:16px;accent-color:#108fc6;cursor:pointer}
.inv-filter .inv-filter-label{display:inline-flex;align-items:center;gap:7px;color:#2b333f;font-weight:700;font-size:13.5px;white-space:nowrap}
.inv-filter--sort{background:#eef2f8;border-color:#d5dde8;margin-bottom:6px;padding:10px 16px}

/* quotation / compact invoice printable area */
.qto-print{background:#fff;border:1px dashed #dfe3e8;border-radius:10px;padding:16px}
.qto-print__head{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-bottom:12px;border-bottom:2px solid #108fc6;margin-bottom:14px;flex-wrap:wrap}
.qto-print__logo img{max-height:70px;object-fit:contain}
.qto-print__title{font-size:22px;font-weight:800;color:#34425a}
.qto-print__sub{font-size:12.5px;color:#7a8494}
.qto-print__meta{font-size:13px;color:#2b333f;line-height:1.8}
.qto-print__meta b{color:#34425a}
.qto-print__totals{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-top:14px}
.qto-print__total{background:#f7f9fb;border:1px solid #e3e8ef;border-radius:9px;padding:10px 14px;text-align:center}
.qto-print__total b{display:block;font-size:18px;color:#34425a}
.qto-print__total span{font-size:12px;color:#7a8494}
@media print{
  .qto-print__head{display:flex!important}
  .no-print,.inv-toolbar,.inv-filter,.box-header .box-tools, .sidebar, .main-header, .main-sidebar{display:none!important}
  body{background:#fff!important}
  .content-wrapper{margin:0!important;padding:0!important}
  .box{box-shadow:none!important}
  .qto-print{border:none;box-shadow:none}
  .table-elegant th{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .stat-card__icon{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---------- Top low-stock alert (dashboard) ---------- */
.bca .lowstock-alert{
  display:flex; align-items:center; gap:14px; margin:0 0 16px; padding:12px 16px;
  border:1px solid rgba(243,89,88,.35); border-radius:12px; background:#fff5f5; position:relative;
}
.bca .lowstock-alert__icon{flex:none; width:40px; height:40px; border-radius:10px; background:rgb(243,89,88);
  color:#fff; font-size:20px; display:flex; align-items:center; justify-content:center}
.bca .lowstock-alert__body{flex:1; min-width:0}
.bca .lowstock-alert__title{font-weight:700; font-size:14px; color:#a33}
.bca .lowstock-alert__items{margin-top:4px; font-size:12px; color:#666; line-height:1.8}
.bca .lowstock-alert__item{display:inline-block; background:#ffe3e3; border-radius:6px; padding:1px 8px; margin:2px 2px 0 0}
.bca .lowstock-alert__item b{color:#c33}
.bca .lowstock-alert__action{flex:none}
.bca .lowstock-alert .btn{padding:5px 14px; font-size:12px}

/* ==========================================================================
   GLOBAL SEARCH (topbar)
   ========================================================================== */
.topbar-search{padding:0 4px; line-height:50px}
.global-search{
  position:relative; display:inline-flex; align-items:center; vertical-align:middle;
  width:260px; height:34px; background:#f4f6f8; border:1px solid #dfe3e9; border-radius:20px;
  padding:0 12px; transition:border-color .2s, background .2s;
}
.global-search .fa-search{color:#98a1ad; font-size:13px; margin-left:7px}
.global-search-input{
  border:none; outline:none; background:transparent; width:100%; font-size:13px; color:#2b333f;
}
.global-search:focus-within{border-color:#108fc6; background:#fff}
.global-search-results{
  position:absolute; top:100%; right:0; margin-top:6px; width:340px; max-height:380px; overflow-y:auto;
  background:#fff; border:1px solid #e3e7ed; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,.12);
  z-index:2000; text-align:right; display:none; padding:6px 0;
}
.global-search-results.open{display:block}
.global-search-results .gs-group{
  font-size:11px; font-weight:800; color:#8a94a6; text-transform:uppercase;
  padding:6px 14px 3px;
}
.global-search-results .gs-item{
  display:flex; flex-direction:column; gap:1px; padding:8px 14px; text-decoration:none;
  color:#2b333f; border-right:3px solid transparent;
}
.global-search-results .gs-item:hover{background:#f2f6fa; border-right-color:#108fc6}
.global-search-results .gs-title{font-size:13.5px; font-weight:700; color:#1f2733}
.global-search-results .gs-sub{font-size:11.5px; color:#7a8494; direction:ltr; text-align:left}
.global-search-results .gs-empty{padding:14px; text-align:center; color:#98a1ad; font-size:13px}

/* dark-mode toggle button */
.topbar-darkmode{line-height:50px}
.dark-toggle,
  .bell-toggle{
  display:inline-flex; align-items:center; justify-content:center; width:36px; height:34px;
  margin:8px 4px; border-radius:50%; color:#333; font-size:16px; cursor:pointer;
  background:#f4f6f8; border:1px solid #dfe3e9; transition:background .2s, color .2s;
}
.dark-toggle:hover{background:#e9edf2; color:#108fc6}

/* ==========================================================================
   NOTIFICATION BELL (topbar)
   ========================================================================== */
.topbar-bell{line-height:50px}
.bell-toggle{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:34px; margin:8px 4px; border-radius:50%; color:#333; font-size:16px;
  cursor:pointer; background:#f4f6f8; border:1px solid #dfe3e9; transition:background .2s,color .2s;
}
.bell-toggle:hover{background:#e9edf2; color:#108fc6}
.bell-badge{
  position:absolute; top:-6px; left:-4px; min-width:18px; height:18px; padding:0 4px;
  border-radius:10px; background:#e23a3a; color:#fff; font-size:11px; font-weight:700;
  line-height:18px; text-align:center; box-shadow:0 0 0 2px #fff;
}
.bell-panel{
  position:absolute; top:100%; right:auto; left:0; margin-top:2px; width:360px; max-width:92vw;
  background:#fff; border:1px solid #e3e7ed; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,.12);
  z-index:2100; text-align:right; display:none; overflow:hidden;
}
.bell-panel.open{display:block}
.bell-header{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:11px 14px; border-bottom:1px solid #eef1f5; background:#fafbfc;
}
.bell-title{font-size:14px; font-weight:800; color:#1f2733}
.bell-mark-all{font-size:12px; font-weight:700; color:#108fc6; background:none; border:none; cursor:pointer; padding:2px}
.bell-mark-all:hover{color:#0b6f9c; text-decoration:underline}
.bell-body{max-height:380px; overflow-y:auto}
.bell-item{
  display:flex; align-items:flex-start; gap:10px; padding:11px 14px; text-decoration:none;
  border-bottom:1px solid #f0f2f6; transition:background .15s;
}
.bell-item:hover{background:#f2f6fa}
.bell-item.is-read{opacity:.55}
.bell-item__icon{
  flex:0 0 auto; width:30px; height:30px; border-radius:50%; display:inline-flex;
  align-items:center; justify-content:center; font-size:15px; color:#fff;
}
.bell-item__icon.t-danger{background:#e23a3a}
.bell-item__icon.t-warning{background:#e8a023}
.bell-item__icon.t-info{background:#108fc6}
.bell-item__txt{min-width:0; flex:1}
.bell-item__title{font-size:13px; font-weight:700; color:#1f2733; line-height:1.4}
.bell-item__body{font-size:12px; color:#6f7a8c; margin-top:2px; line-height:1.45}
.bell-empty{padding:26px 14px; text-align:center; color:#98a1ad; font-size:13px}

/* on small screens pin the dropdown inside the viewport */
@media (max-width:767px){
  .bell-panel{ position:fixed; top:52px; left:10px; right:10px; width:auto; }
}

/* ==========================================================================
   DARK MODE (body.dark-mode)
   Palette:  bg #12171f | surface #1a222c | raised #202a35 | border #2b3644
             input #232e3a | text #c7d0da | strong #e7edf3 | muted #7f8ca1
   ========================================================================== */
body.dark-mode{
  --text:#c7d0da; --text-muted:#7f8ca1; --line:#2b3644; --bg:#12171f; --white:#1a222c;
  background:var(--bg); color:var(--text);
}
body.dark-mode a{color:#4fc3f7}
body.dark-mode h1,body.dark-mode h2,body.dark-mode h3,body.dark-mode h4,
body.dark-mode .box-title,body.dark-mode .small-box .inner p{color:#e7edf3}
body.dark-mode .muted{color:#7f8ca1}
body.dark-mode ::selection{background:#108fc6;color:#fff}

/* ---------- top navbar ---------- */
body.dark-mode .main-header{background:#1a222c; border-bottom-color:#2b3644}
body.dark-mode .main-header .logo{background:#1a222c}
body.dark-mode .sidebar-toggle{color:#c7d0da}
body.dark-mode .sidebar-toggle:hover{background:#232e3a}
body.dark-mode .topbar-title{color:#e7edf3}
body.dark-mode .user-dropdown{color:#c7d0da}
body.dark-mode .user-dropdown:hover{background:#232e3a}
body.dark-mode .dropdown-menu{background:#1c2530; border-color:#2b3644; box-shadow:0 6px 16px rgba(0,0,0,.5)}
body.dark-mode .dropdown-menu>li>a{color:#d3dbe4}
body.dark-mode .dropdown-menu>li>a:hover{background:#273344; color:#fff}
body.dark-mode .dropdown-header{color:#7f8ca1; border-bottom-color:#2b3644}
body.dark-mode .divider{background-color:#2b3644}

/* ---------- global search ---------- */
body.dark-mode .global-search{background:#232e3a; border-color:#2f3b4a}
body.dark-mode .global-search:focus-within{background:#1a222c; border-color:#108fc6}
body.dark-mode .global-search-input{color:#e7edf3}
body.dark-mode .global-search-results{background:#1c2530; border-color:#2f3b4a}
body.dark-mode .global-search-results .gs-item{color:#d3dbe4}
body.dark-mode .global-search-results .gs-item:hover{background:#273344}
body.dark-mode .global-search-results .gs-title{color:#e7edf3}
body.dark-mode .global-search-results .gs-sub{color:#8b97a8}
body.dark-mode .global-search-results .gs-group{color:#6e7b8d}
body.dark-mode .dark-toggle{background:#232e3a; border-color:#2f3b4a; color:#f1c40f}
body.dark-mode .dark-toggle:hover{background:#2f3b4a}
body.dark-mode .bell-toggle{background:#232e3a; border-color:#2f3b4a; color:#f1c40f}
body.dark-mode .bell-toggle:hover{background:#2f3b4a; color:#f1c40f}
body.dark-mode .bell-badge{box-shadow:0 0 0 2px #1a222c}
body.dark-mode .bell-panel{background:#1c2530; border-color:#2f3b4a; box-shadow:0 8px 24px rgba(0,0,0,.5)}
body.dark-mode .bell-header{background:#202a35; border-bottom-color:#2f3b4a}
body.dark-mode .bell-title{color:#e7edf3}
body.dark-mode .bell-mark-all{color:#4fc3f7}
body.dark-mode .bell-mark-all:hover{color:#81d4fa}
body.dark-mode .bell-item{border-bottom-color:#2b3644}
body.dark-mode .bell-item:hover{background:#273344}
body.dark-mode .bell-item__title{color:#e7edf3}
body.dark-mode .bell-item__body{color:#8b97a8}
body.dark-mode .bell-empty{color:#6e7b8d}

/* ---------- sidebar + section treeview "tabs" ---------- */
body.dark-mode .main-sidebar{background:#151b23}
body.dark-mode .treeview-menu{background:#1b242e}
body.dark-mode .sidebar-menu > li > a{color:#9fb2c0}
body.dark-mode .sidebar-menu > li:hover > a,
body.dark-mode .sidebar-menu > li.active > a{color:#fff; background:#232f3a}
body.dark-mode .treeview-menu>li>a{color:#8aa4af}
body.dark-mode .treeview-menu>li.active>a{color:#fff; background:#2c3b48}
body.dark-mode .treeview-menu>li>a:hover{color:#fff}
body.dark-mode .sidebar-menu > li.header{color:#5d7485; background:#12181f}
body.dark-mode .user-panel{border-bottom-color:#293543}

/* ---------- content / boxes ---------- */
body.dark-mode .content-header h1{color:#e7edf3}
body.dark-mode .breadcrumb{background:transparent}
body.dark-mode .breadcrumb a{color:#4fc3f7}
body.dark-mode .box{background:#1a222c; border-top-color:#2f3b4a}
body.dark-mode .box.box-primary{border-top-color:#108fc6}
body.dark-mode .box-header{color:#d3dbe4}
body.dark-mode .box-body{border-top-color:#2b3644}
body.dark-mode .box-toolbar{background:#1a222c}
body.dark-mode .box-header.small-header{border-bottom-color:#2b3644}
body.dark-mode .box.form-elegant>.box-header.with-border{background:#202a35; border-bottom-color:#2b3644}
body.dark-mode .form-elegant .box-title,body.dark-mode .form-elegant .box-header .box-title{color:#e7edf3}

body.dark-mode .small-box .inner h3,body.dark-mode .small-box .inner p{color:#fff}
body.dark-mode .small-box-footer{color:rgba(255,255,255,.9)}
body.dark-mode .small-box-footer:hover{background:rgba(0,0,0,.2)}

/* ---------- tables ---------- */
body.dark-mode .table{background:#1a222c; color:#c7d0da}
body.dark-mode .table>thead>tr>th{color:#e7edf3; border-bottom-color:#2f3b4a}
body.dark-mode .table>tbody>tr>td{border-color:#2b3644}
body.dark-mode .table>tfoot>tr>td{background:#202a35; color:#d3dbe4; border-color:#2f3b4a}
body.dark-mode .table-hover>tbody>tr:hover{background:#232e3a}
body.dark-mode .table .empty{color:#7f8ca1}
body.dark-mode .table-striped>tbody>tr:nth-of-type(odd){background:#1f2833}
body.dark-mode .table-bordered{border-color:#2b3644}
body.dark-mode .table-bordered>thead>tr>th,body.dark-mode .table-bordered>tbody>tr>td{border-color:#2b3644}
body.dark-mode .table .num{color:#e7edf3}
body.dark-mode tr.g-total td{background:#2c2a1c !important; color:#ffd76f}
body.dark-mode tr.g-bal td{background:#1f2833 !important}
body.dark-mode .table-responsive::-webkit-scrollbar{height:10px}
body.dark-mode .table-responsive::-webkit-scrollbar-thumb{background:#2f3b4a;border-radius:6px}
body.dark-mode .table-responsive::-webkit-scrollbar-track{background:#12171f}

/* column color accents on table headers */
body.dark-mode .box-acc-red .table>thead>tr>th{background:#3a2323;color:#f39c9c}
body.dark-mode .box-acc-orange .table>thead>tr>th{background:#382e1e;color:#f0c070}
body.dark-mode .box-acc-purple .table>thead>tr>th{background:#2d2438;color:#c9a6ef}
body.dark-mode .box-acc-teal .table>thead>tr>th{background:#1c2f30;color:#7fd8cd}
body.dark-mode .box-acc-green .table>thead>tr>th{background:#1d2f24;color:#86d9a6}
body.dark-mode .box-acc-blue .table>thead>tr>th{background:#1d2b38;color:#7fc2ef}

/* ---------- badges / chips ---------- */
body.dark-mode .badge-low{background:#3a2323;color:#f39c9c;border-color:#6b3434}
body.dark-mode .badge-ok{background:#1d2f24;color:#86d9a6;border-color:#2e5c40}
body.dark-mode .badge-warn{background:#382e1e;color:#f0c070;border-color:#6b532e}
body.dark-mode .badge-out{background:#3a2323;color:#f39c9c;border-color:#6b3434}
body.dark-mode .badge-in{background:#1d2f24;color:#86d9a6;border-color:#2e5c40}

/* status badges generic (.label / badge) */
body.dark-mode .label{color:#fff}
body.dark-mode .label-default{background:#3a4856;color:#d3dbe4}
body.dark-mode .system-field,body.dark-mode .detail-field{color:#c7d0da}

/* ---------- stat cards ---------- */
body.dark-mode .stat-card{background:#1a222c;border-color:#2b3644;box-shadow:none}
body.dark-mode .stat-card .stat-card__label{color:#8b97a8}
body.dark-mode .stat-card .stat-card__value{color:#e7edf3}
body.dark-mode .report-stats .stat-title{color:#e7edf3;border-bottom-color:#2b3644}
body.dark-mode .count-hint{color:#8b97a8}

/* ---------- filter / toolbar bars ---------- */
body.dark-mode .filter-bar{background:#202a35;border-color:#2b3644}
body.dark-mode .filter-bar .form-group label{color:#e7edf3}
body.dark-mode .filter-panel + .filter-panel{border-right-color:#2b3644}
body.dark-mode .filter-panel__title{color:#e7edf3;border-bottom-color:#f39c12}
body.dark-mode .sort-bar{background:#202a35;border-color:#2b3644}
body.dark-mode .sort-label{color:#a9b4c2}
body.dark-mode .section-chip{color:#e7edf3}
body.dark-mode .inv-filter{background:#202a35;border-color:#2b3644}
body.dark-mode .inv-filter .inv-filter-check{background:#2a3644;border-color:#3a4856;color:#e7edf3}
body.dark-mode .inv-filter .inv-filter-label{color:#e7edf3}
body.dark-mode .inv-filter--sort{background:#1c2530;border-color:#2f3b4a}
body.dark-mode .filter-panel .form-group label{color:#e7edf3}

/* ---------- forms ---------- */
body.dark-mode .form-group label{color:#d3dbe4}
body.dark-mode .form-control{background:#232e3a;border-color:#2f3b4a;color:#e7edf3}
body.dark-mode .form-control:focus{background:#1a222c;border-color:#108fc6;color:#fff;box-shadow:0 0 0 .2rem rgba(16,143,198,.25)}
body.dark-mode .form-control::placeholder{color:#6e7b8d}
body.dark-mode select.form-control option{background:#1a222c;color:#e7edf3}
body.dark-mode .input-group-addon{background:#2a3644;border-color:#2f3b4a;color:#c7d0da}
body.dark-mode .controls label.error{color:#ff8a8a}

/* ---------- buttons ---------- */
body.dark-mode .btn-default{background:#2a3644;border-color:#3a4856;color:#e7edf3}
body.dark-mode .btn-default:hover{background:#344350;color:#fff;border-color:#45556a}
body.dark-mode .btn-link{color:#4fc3f7}
body.dark-mode .btn-flat.bg-gray{background:#2a3644;color:#e7edf3}
body.dark-mode .btn-flat.bg-gray:hover{background:#344350}
body.dark-mode .btn-invert{color:#4fc3f7}
body.dark-mode .btn-invert:hover{background:#0d70c6;color:#fff}
body.dark-mode .box-header .form-actions .btn-flat{color:#fff}

/* ---------- pagination ---------- */
body.dark-mode .pagination a{color:#b8c7d6; background:#1a222c; border-color:#2f3b4a}
body.dark-mode .pagination a:hover:not(.on){background:#2a3644;color:#fff}
body.dark-mode .pagination a.on{background:#108fc6;border-color:#0d70c6;color:#fff}

/* ---------- modal ---------- */
body.dark-mode .modal-content{background:#1a222c;border-color:#2f3b4a;color:#c7d0da}
body.dark-mode .modal-header,body.dark-mode .modal-footer{border-color:#2b3644}
body.dark-mode .modal-title{color:#e7edf3}
body.dark-mode .modal-backdrop{background:rgba(0,0,0,.6)}

/* ---------- alerts / callouts ---------- */
body.dark-mode .alert{background:#202a35;color:#c7d0da;border-color:#2f3b4a}
body.dark-mode .alert-danger{background:#3a2323;color:#f3b0b0;border-color:#6b3434}
body.dark-mode .alert-success{background:#1d2f24;color:#a6e3bd;border-color:#2e5c40}
body.dark-mode .alert-warning{background:#382e1e;color:#f2ce9a;border-color:#6b532e}
body.dark-mode .alert-info{background:#1c2c3a;color:#a6d6f2;border-color:#31536e}
body.dark-mode .callout{background:#202a35;color:#c7d0da;border-color:#2f3b4a}

/* ---------- footer ---------- */
body.dark-mode .main-footer{background:#1a222c;border-top-color:#2b3644;color:#c7d0da}

/* ---------- invoice page ---------- */
body.dark-mode .inv-wrap .box{border-color:#2b3644;box-shadow:none}
body.dark-mode .inv-wrap .box>.box-header.with-border{background:#202a35;border-bottom-color:#2b3644}
body.dark-mode .inv-wrap .box>.box-header.with-border .box-title{color:#e7edf3}
body.dark-mode .inv-table tbody tr.inv-row.selected td{background:#23313f !important}
body.dark-mode .inv-stats .inv-stat{box-shadow:none}
body.dark-mode .inv-title-hint{color:#8b97a8}
body.dark-mode .inv-table{background:#1a222c;border-color:#2b3644}
body.dark-mode .inv-table thead th{background:#202a35;color:#e7edf3;border-color:#2b3644}
body.dark-mode .inv-table tbody td{color:#cdd7e0;border-bottom-color:#2b3644}
body.dark-mode .inv-table tbody tr:nth-child(even){background:#1f2833}
body.dark-mode .inv-table tbody tr:hover{background:#24313f}
body.dark-mode .inv-table input.form-control{background:#232e3a;border-color:#2f3b4a;color:#e7edf3}

/* ---------- quotation / print ---------- */
body.dark-mode .qto-print{background:#1a222c;border-color:#2f3b4a}
body.dark-mode .qto-print__head{border-bottom-color:#108fc6}
body.dark-mode .qto-print__title{color:#e7edf3}
body.dark-mode .qto-print__meta{color:#c7d0da}
body.dark-mode .qto-print__meta b{color:#e7edf3}
body.dark-mode .qto-print__sub{color:#8b97a8}
body.dark-mode .qto-print__total{background:#202a35;border-color:#2f3b4a}
body.dark-mode .qto-print__total b{color:#e7edf3}
body.dark-mode .qto-print__total span{color:#8b97a8}

/* ---------- section titles ---------- */
body.dark-mode .section-title, body.dark-mode .pos-screen .section-title,
body.dark-mode .inv-section-title{color:#e7edf3}

/* ---------- POS screen ---------- */
body.dark-mode .pos-item{background:#1a222c;border-color:#2f3b4a;box-shadow:none}
body.dark-mode .pos-item:hover{background:#24303e;border-color:#108fc6;box-shadow:0 3px 8px rgba(16,143,198,.2)}
body.dark-mode .pos-item-name{color:#e7edf3}
body.dark-mode .pos-item-price{background:#1f3350;color:#7fc2ef}
body.dark-mode .pos-empty{color:#8b97a8}
body.dark-mode .pos-options{background:#202a35;border-color:#2b3644}
body.dark-mode .pos-lbl{color:#d3dbe4}
body.dark-mode .pos-cash-header .box-title{color:#e7edf3}
body.dark-mode .pos-cart-table thead th{background:#202a35;color:#d3dbe4;border-color:#2b3644}
body.dark-mode .pos-cart-table tbody td{color:#e7edf3;border-color:#2b3644}
body.dark-mode .pos-line-total{color:#7fc2ef}
body.dark-mode .pos-grand{background:#2c2a1c}
body.dark-mode .pos-grand b{color:#ffd76f}
body.dark-mode .pos-summary{background:#1c2530;border-color:#2b3644}
body.dark-mode .pos-sum-row{border-bottom-color:#29343f}
body.dark-mode .pos-sum-row label{color:#d3dbe4}
body.dark-mode .pos-sum-row.grand .pos-sum-total{color:#7fc2ef}
body.dark-mode .pos-sum-row.net{background:#1d2f24;color:#86d9a6}
body.dark-mode .pos-sum-row.net label{color:#86d9a6}
body.dark-mode .pos-sum-net{color:#86d9a6}
body.dark-mode .pos-pay-buttons .pos-pay.pos-blue2{background:#1c2f42;color:#8ec6f5;border-color:#2f4d6e}
body.dark-mode .pos-pay-buttons .pos-pay.pos-blue2 i{color:#8ec6f5}
body.dark-mode .pos-pay-buttons .pos-pay.pos-blue2:hover{background:#24405a}
body.dark-mode .pos-pay-buttons .pos-pay.pos-blue{background:#1c2f42;color:#8ec6f5;border-color:#2f4d6e}
body.dark-mode .pos-pay-buttons .pos-pay.pos-blue i{color:#8ec6f5}
body.dark-mode .pos-pay-buttons .pos-pay.pos-blue:hover{background:#24405a}
body.dark-mode .pos-pay-buttons .pos-pay.pos-red{background:#3a2323;color:#f39c9c;border-color:#6b3434}
body.dark-mode .pos-pay-buttons .pos-pay.pos-red i{color:#f39c9c}
body.dark-mode .pos-pay-buttons .pos-pay.pos-red:hover{background:#4a2a2a}
body.dark-mode .pos-calc{background:#1c2530}
body.dark-mode .pos-calc-grid{background:#1c2530}
body.dark-mode .pos-calc-grid .cal{background:#232e3a;border-color:#2f3b4a;color:#e7edf3}
body.dark-mode .pos-calc-grid .cal:hover{border-color:#108fc6}
body.dark-mode .pos-calc-grid .cal.fn{background:#2a3644;color:#c7d0da}
body.dark-mode .pos-calc-foot{background:#2a3644;color:#a9b4c2}
body.dark-mode .pos-search-input{background:#232e3a;border-color:#2f3b4a;color:#e7edf3}

/* ---------- low stock alert ---------- */
body.dark-mode .lowstock-alert{background:#2a1c1c;border-color:rgba(243,89,88,.4)}
body.dark-mode .lowstock-alert__title{color:#ff9a9a}
body.dark-mode .lowstock-alert__items{color:#c7b7b7}
body.dark-mode .lowstock-alert__item{background:#3a2424;color:#f0d0d0}
body.dark-mode .lowstock-alert__item b{color:#ff8a8a}

/* ---------- login (standalone) ---------- */
body.dark-mode .login-box-body{background:#1a222c;color:#c7d0da;box-shadow:0 1px 3px rgba(0,0,0,.5)}
body.dark-mode .login-box-body h4{color:#e7edf3}
body.dark-mode .login-box-msg{color:#8b97a8}

/* ---------- misc text ---------- */
body.dark-mode .gg-total{background:#2c2a1c;color:#ffd76f}
body.dark-mode .pos-line-total,body.dark-mode .inv-line-total{color:#7fc2ef}
body.dark-mode .info-value,body.dark-mode .info-label{color:#e7edf3}
body.dark-mode .stock-divider,body.dark-mode .stock-divider--green,
body.dark-mode .stock-divider--orange,body.dark-mode .stock-divider--red,
body.dark-mode .stock-divider--teal{opacity:.55}

/* ---------- scrollbars global ---------- */
body.dark-mode ::-webkit-scrollbar{width:10px;height:10px}
body.dark-mode ::-webkit-scrollbar-thumb{background:#2f3b4a;border-radius:6px}
body.dark-mode ::-webkit-scrollbar-track{background:#12171f}

/* ---------- dashboard widgets (bca) ---------- */
body.dark-mode .bca .info-box{background:#1a222c;box-shadow:0 1px 2px rgba(0,0,0,.4)}
body.dark-mode .bca .info-box .info-box-text{color:#a9b4c2}
body.dark-mode .bca .info-box .info-box-number{color:#e7edf3}
body.dark-mode .bca .info-box .info-box-number small{color:#8b97a8}
body.dark-mode .bca .info-box .progress-description{color:#8b97a8}
body.dark-mode .bca .info-box .progress-description b{color:#d3dbe4}
body.dark-mode .bca-stats li,.bca-top li,.bca-warn li{border-bottom-color:#2b3644}
body.dark-mode .bca-stats__lbl{color:#a9b4c2}
body.dark-mode .bca-stats b{color:#e7edf3}
body.dark-mode .bca-top__name{color:#cdd7e0}
body.dark-mode .bca-top__val b{color:#e7edf3}
body.dark-mode .bca-top__val small{color:#8b97a8}
body.dark-mode .bca-bar__label{color:#8b97a8}
body.dark-mode .bca-warn__name{color:#cdd7e0}
body.dark-mode .bca-ok{background:#16301f;color:#7fd49b;border-color:#2e5c40}

/* ---------- table-elegant ---------- */
body.dark-mode .table.table-elegant{background:#1a222c;border-color:#2b3644;box-shadow:none}
body.dark-mode .table.table-elegant>tbody>tr>td{color:#cdd7e0;border-bottom-color:#2b3644}
body.dark-mode .table.table-elegant>tbody>tr:nth-child(even){background:#1f2833}
body.dark-mode .table.table-elegant>tbody>tr:hover{background:#24313f}
body.dark-mode .table.table-elegant>thead>tr>th{background:#2b3a4d;color:#e7edf3}
body.dark-mode .table.table-elegant td a{color:#6cb8e8}
body.dark-mode .table.table-elegant td a:hover{color:#8ccdf2}
body.dark-mode .table.table-elegant tfoot tr td{background:#202a35;border-top-color:#2b3644;color:#e7edf3}

/* ---------- floating-label (pmd-textfield) fields (> base specificity) ---------- */
body.dark-mode .form-group.pmd-textfield label{color:#a9b4c2}
body.dark-mode .form-group.pmd-textfield .controls .form-control{
  background:#232e3a;border:1px solid #2f3b4a;color:#e7edf3;
}
body.dark-mode .form-group.pmd-textfield .controls .form-control:focus{
  border-color:#108fc6;box-shadow:0 0 0 3px rgba(16,143,198,.25);
}
body.dark-mode .form-group.pmd-textfield .controls .form-control::placeholder{color:#6e7b8d}
body.dark-mode .inv-form .form-group.pmd-textfield label{color:#8b97a8}

/* ---------- settings tabs & feature grid (page-specific <style>) ---------- */
body.dark-mode .settings-tabs{border-bottom-color:#2b3644}
body.dark-mode .settings-tabs a{background:#202a35;color:#8b97a8;border-color:transparent}
body.dark-mode .settings-tabs a:hover{color:#d3dbe4;background:#2a3644}
body.dark-mode .settings-tabs a.active{color:#6cb8e8;background:#1a222c;border-color:#2b3644;border-bottom:2px solid #1a222c}
body.dark-mode .settings-group-title{color:#e7edf3;border-bottom-color:#108fc6}
body.dark-mode .feature-item{background:#202a35;border-color:#2b3644}
body.dark-mode .feature-item:hover{background:#2a3644;border-color:#3c8dbc}
body.dark-mode .feature-item label{color:#cdd7e0}
body.dark-mode .feature-item label small{color:#8b97a8}
body.dark-mode .image-preview-box{background:#202a35;border-color:#2b3644}
body.dark-mode .image-preview-box img{border-color:#2f3b4a!important}

/* ---------- table_pager (list pagination) ---------- */
body.dark-mode .table_pager a,.table_pager span{background:#1a222c;border-color:#2f3b4a;color:#b8c7d6}
body.dark-mode .table_pager a:hover{background:#2a3644;border-color:#3c8dbc;color:#8ccdf2}
body.dark-mode .table_pager .on{background:#108fc6;border-color:#0d70c6;color:#fff}

/* dark-mode logo */
body.dark-mode .logo{background:#1a222c;color:#e7edf3}