/* =========================================================
   KashfHesab Dashboard V2
   Staging UI layer — 2026-09-22
   ========================================================= */

:root{
  --kh-navy:#0F2744;
  --kh-navy-2:#173A63;
  --kh-blue:#2563EB;
  --kh-blue-soft:#EEF4FF;
  --kh-green:#16A36A;
  --kh-green-soft:#EAF8F1;
  --kh-red:#DC4C4C;
  --kh-bg:#F5F7FB;
  --kh-card:#FFFFFF;
  --kh-border:#E4E9F0;
  --kh-text:#182230;
  --kh-muted:#778397;
  --kh-shadow:0 8px 28px rgba(15,39,68,.07);
  --kh-radius:16px;
}

:root[data-theme="dark"]{
  --kh-navy:#0B1726;
  --kh-navy-2:#142C49;
  --kh-blue:#5B8CFF;
  --kh-blue-soft:#152440;
  --kh-green:#42C58A;
  --kh-green-soft:#142C24;
  --kh-red:#F06A6A;
  --kh-bg:#0F141B;
  --kh-card:#171E27;
  --kh-border:#283342;
  --kh-text:#EEF3F8;
  --kh-muted:#94A1B2;
  --kh-shadow:0 8px 28px rgba(0,0,0,.22);
}

/* ===== الصفحة العامة ===== */

body{
  background:var(--kh-bg);
  color:var(--kh-text);
}

.wrap{
  max-width:1440px;
  padding:28px 30px 90px;
}

/* إلغاء القيد القديم 760px على سطح المكتب */
@media(min-width:860px){
  .wrap{
    max-width:1440px;
    padding-top:28px;
  }

  .topbar-in{
    max-width:1440px;
  }
}

/* ===== الشريط العلوي ===== */

.topbar{
  background:var(--kh-card);
  border-bottom:1px solid var(--kh-border);
  box-shadow:0 2px 12px rgba(15,39,68,.04);
}

.topbar-brand{
  max-width:1440px;
  min-height:72px;
  padding:12px 30px;
  border-bottom:1px solid var(--kh-border);
}

.topbar-in{
  max-width:1440px;
  padding:9px 30px;
  background:var(--kh-card);
}

.topbar-logo,
.mark{
  width:44px;
  height:44px;
  border-radius:12px;
}

.mark{
  background:linear-gradient(145deg,var(--kh-navy),var(--kh-navy-2));
  color:#fff;
}

.brand h1{
  font-size:17px;
  font-weight:700;
  color:var(--kh-text);
}

.brand span{
  margin-top:2px;
  font-size:12px;
  color:var(--kh-muted);
}

.live-clock{
  border:1px solid var(--kh-border);
  background:var(--kh-bg);
  color:var(--kh-muted);
  border-radius:9px;
  padding:6px 11px;
}

/* ===== الأزرار ===== */

.btn{
  border-color:var(--kh-border);
  border-radius:9px;
  font-weight:600;
}

.btn.primary{
  background:var(--kh-blue);
  border-color:var(--kh-blue);
  color:#fff;
  box-shadow:0 4px 12px rgba(37,99,235,.18);
}

.btn.primary:hover{
  filter:none;
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(37,99,235,.24);
}

.btn.ghost{
  color:var(--kh-muted);
}

.btn.ghost:hover{
  background:var(--kh-blue-soft);
  color:var(--kh-blue);
}

.nav-row .btn.ghost{
  border-color:var(--kh-border);
  background:var(--kh-card);
  border-radius:9px;
  box-shadow:none;
}

.nav-row .btn.ghost:hover{
  border-color:var(--kh-blue);
  color:var(--kh-blue);
  background:var(--kh-blue-soft);
  box-shadow:none;
}

/* ===== بطاقة إجمالي الذمم ===== */

.readout{
  margin:0 0 22px;
  border:1px solid var(--kh-border);
  border-radius:var(--kh-radius);
  background:linear-gradient(135deg,var(--kh-navy),var(--kh-navy-2));
  box-shadow:var(--kh-shadow);
  color:#fff;
}

.readout-body{
  padding:25px 28px 20px;
}

.readout .lbl{
  color:rgba(255,255,255,.72);
  font-size:13px;
  font-weight:500;
}

.readout .amt{
  margin-top:4px;
  font-size:clamp(36px,5vw,54px);
  color:#fff;
  font-weight:700;
}

.readout .amt small{
  color:rgba(255,255,255,.68);
}

.readout .state{
  color:rgba(255,255,255,.75);
}

.readout.owed .amt,
.readout.owed .state,
.readout.credit .amt,
.readout.credit .state,
.readout.settled .amt,
.readout.settled .state{
  color:#fff;
}

.readout .stripe{
  display:none;
}

.readout-meta{
  border-top:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.045);
}

.readout-meta div{
  padding:14px 28px;
  border-inline-start:1px solid rgba(255,255,255,.12);
}

.readout-meta b{
  color:#fff;
  font-size:18px;
  font-weight:700;
}

.readout-meta em{
  color:rgba(255,255,255,.65);
  font-size:12px;
}

/* ===== لوحة الزبائن ===== */

.panel{
  background:var(--kh-card);
  border:1px solid var(--kh-border);
  border-radius:var(--kh-radius);
  box-shadow:var(--kh-shadow);
  overflow:hidden;
}

@media(min-width:900px){
  .panel{
    border-radius:var(--kh-radius);
    box-shadow:var(--kh-shadow);
  }
}

.panel-head{
  min-height:66px;
  padding:14px 20px;
  border-bottom:1px solid var(--kh-border);
}

.panel-head h2{
  font-size:18px;
  font-weight:700;
  color:var(--kh-text);
}

/* ===== البحث والفلاتر ===== */

.searchbar{
  gap:9px;
  padding:16px 20px;
  border-bottom:1px solid var(--kh-border);
  background:var(--kh-bg);
}

.searchbar input[type=search],
.searchbar input.range-num-input,
.searchbar select,
.sort-bar select{
  min-height:42px;
  border:1px solid var(--kh-border);
  border-radius:10px;
  background:var(--kh-card);
}

.searchbar input[type=search]:focus,
.searchbar input.range-num-input:focus,
.searchbar select:focus{
  border-color:var(--kh-blue);
  outline:3px solid rgba(37,99,235,.10);
}

.sort-bar{
  border-color:var(--kh-border);
  border-radius:10px;
  background:var(--kh-card);
  padding:8px 12px;
}

/* ===== قائمة الزبائن ===== */

.crow{
  min-height:76px;
  padding:14px 20px;
  border-bottom:1px solid var(--kh-border);
  transition:background .15s ease,transform .15s ease;
}

.crow:hover{
  background:var(--kh-blue-soft);
}

.crow b{
  color:var(--kh-text);
  font-size:15px;
  font-weight:700;
}

.crow em{
  color:var(--kh-muted);
}

.crow .bal{
  font-weight:700;
}

.crow .bal.pos{
  color:var(--kh-red);
}

.crow .bal.neg{
  color:var(--kh-green);
}

.crow .bal.zero{
  color:var(--kh-muted);
}

.empty{
  padding:54px 24px;
}

/* ===== النوافذ ===== */

.sheet{
  border-radius:18px;
  border:1px solid var(--kh-border);
}

input[type=text],
input[type=number],
input[type=date],
input[type=tel],
input[type=password],
input[type=search],
select,
textarea{
  border-color:var(--kh-border);
  border-radius:10px;
}

/* ===== Tablet ===== */

@media(max-width:1100px){
  .wrap{
    padding:22px 20px 85px;
  }

  .topbar-brand,
  .topbar-in{
    padding-inline:20px;
  }
}

/* ===== Mobile ===== */

@media(max-width:640px){
  .wrap{
    padding:14px 12px 82px;
  }

  .topbar-brand{
    min-height:60px;
    padding:9px 12px;
  }

  .topbar-in{
    padding:7px 12px;
  }

  .topbar-logo,
  .mark{
    width:38px;
    height:38px;
    border-radius:10px;
  }

  .brand h1{
    font-size:14px;
  }

  .brand span{
    font-size:11px;
  }

  .readout{
    border-radius:14px;
    margin-bottom:14px;
  }

  .readout-body{
    padding:20px 18px 16px;
  }

  .readout .amt{
    font-size:36px;
  }

  .readout-meta div{
    padding:11px 14px;
    min-width:33.333%;
  }

  .readout-meta b{
    font-size:15px;
  }

  .panel{
    border-radius:14px;
  }

  .panel-head{
    min-height:58px;
    padding:11px 13px;
  }

  .panel-head h2{
    font-size:16px;
  }

  .searchbar{
    padding:12px;
    gap:7px;
  }

  .searchbar input[type=search]{
    flex:1 1 100%;
  }

  .crow{
    min-height:70px;
    padding:12px 14px;
  }
}

/* ===== Print: التصميم الجديد لا يغيّر الطباعة ===== */

@media print{
  body{
    background:#fff;
  }
}

/* ===== Dashboard V2.1 — Desktop polish ===== */
@media (min-width:900px){

  /* بطاقة إجمالي الذمم */
  .wrap > .readout{
    margin-bottom:18px;
  }

  .wrap > .readout .readout-body{
    padding:28px 30px 22px;
  }

  .wrap > .readout .amt{
    letter-spacing:-1px;
  }

  /* لوحة الزبائن الرئيسية */
  .wrap > .panel{
    overflow:hidden;
  }

  .wrap > .panel > .panel-head{
    padding:14px 18px;
    min-height:64px;
  }

  .wrap > .panel > .panel-head h2{
    font-size:18px;
    font-weight:700;
  }

  /* منطقة البحث والفلاتر */
  #customer-search-form{
    padding:14px 18px;
    gap:9px;
    align-items:center;
  }

  #customer-search-form #main-search-input{
    min-width:260px;
    flex:1 1 320px;
  }

  #customer-search-form select,
  #customer-search-form input[type="number"]{
    min-height:40px;
  }

  /* صفوف الزبائن */
  #customer-rows .crow{
    padding:14px 18px;
    min-height:74px;
    transition:background .16s ease, transform .16s ease;
  }

  #customer-rows .crow:hover{
    transform:translateX(-2px);
  }

  #customer-rows .crow > span:first-child > b{
    font-size:15px;
  }

  #customer-rows .bal{
    font-weight:700;
  }
}

/* ===== Dashboard V2.2 — Customer filters desktop layout ===== */
@media (min-width:900px){

  #customer-search-form{
    display:grid;
    grid-template-columns:
      minmax(280px,2fr)
      minmax(180px,1fr)
      auto
      minmax(120px,.7fr)
      auto
      minmax(120px,.7fr);
    gap:10px;
    padding:14px 18px;
    align-items:center;
  }

  #customer-search-form .searchbar-break{
    display:none;
  }

  #customer-search-form #main-search-input{
    width:100%;
    min-width:0;
    grid-column:auto;
  }

  #customer-search-form .rep-filter-select{
    width:100%;
    min-width:0;
  }

  #customer-search-form .range-num-input{
    width:100%;
    min-width:0;
  }

  #customer-search-form .mini{
    white-space:nowrap;
    font-size:12px;
  }

  #customer-search-form #acct-search-dd{
    grid-column:1 / span 2;
    justify-self:start;
  }

  #customer-search-form .sort-bar{
    grid-column:3 / -1;
    justify-self:stretch;
    display:flex;
    align-items:center;
    gap:8px;
  }

  #customer-search-form .sort-bar select{
    flex:1;
    min-width:190px;
  }
}

/* ===== Dashboard V2.3 — Filters second row polish ===== */
@media (min-width:900px){

  #customer-search-form #acct-search-dd{
    grid-column:1 / span 3;
    grid-row:2;
    justify-self:stretch;
    width:100%;
  }

  #customer-search-form #acct-search-dd > summary{
    width:100%;
    min-height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  #customer-search-form .sort-bar{
    grid-column:4 / -1;
    grid-row:2;
    justify-self:stretch;
    width:auto;
    min-height:42px;
    margin-top:0;
    box-sizing:border-box;
  }

  #customer-search-form .sort-bar select{
    flex:1 1 auto;
    min-width:0;
  }
}

/* ===== Dashboard V2.4 — Balanced filters row ===== */
@media (min-width:900px){

  #customer-search-form #acct-search-dd{
    grid-column:1 / span 4;
  }

  #customer-search-form .sort-bar{
    grid-column:5 / -1;
  }

}

/* ===== Dashboard V2.5 — Tablet 641px to 899px ===== */
@media (min-width:641px) and (max-width:899px){

  .wrap{
    padding:18px 16px 85px;
  }

  .readout{
    margin-bottom:16px;
    border-radius:16px;
  }

  .readout-body{
    padding:22px 20px 18px;
  }

  .readout .amt{
    font-size:40px;
  }

  .panel{
    border-radius:16px;
  }

  .panel-head{
    padding:12px 15px;
    min-height:60px;
  }

  #customer-search-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    padding:12px;
    align-items:center;
  }

  #customer-search-form .searchbar-break{
    display:none;
  }

  #customer-search-form #main-search-input{
    grid-column:1 / -1;
    width:100%;
    min-width:0;
  }

  #customer-search-form .rep-filter-select{
    grid-column:1 / -1;
    width:100%;
    min-width:0;
  }

  #customer-search-form .mini{
    white-space:nowrap;
    font-size:11px;
  }

  #customer-search-form .range-num-input{
    width:100%;
    min-width:0;
  }

  #customer-search-form #acct-search-dd{
    grid-column:1 / -1;
    width:100%;
  }

  #customer-search-form #acct-search-dd > summary{
    width:100%;
    min-height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  #customer-search-form .sort-bar{
    grid-column:1 / -1;
    width:auto;
    margin-top:0;
    min-height:40px;
  }

  #customer-search-form .sort-bar select{
    min-width:0;
  }

  #customer-rows .crow{
    padding:13px 15px;
    min-height:72px;
  }
}

/* ===== Dashboard V2.6 — Mobile polish ===== */
@media (max-width:640px){

  .wrap{
    padding:12px 10px 78px;
  }

  .readout{
    margin-bottom:12px;
    border-radius:14px;
  }

  .readout-body{
    padding:18px 16px 15px;
  }

  .readout .amt{
    font-size:34px;
    line-height:1.15;
  }

  .readout-meta{
    display:grid;
    grid-template-columns:repeat(3,1fr);
  }

  .readout-meta div{
    min-width:0;
    padding:10px 6px;
  }

  .readout-meta b{
    font-size:14px;
  }

  .readout-meta em{
    font-size:10px;
  }

  .panel-head{
    min-height:56px;
    padding:10px 11px;
    gap:6px;
    flex-wrap:wrap;
  }

  .panel-head h2{
    font-size:16px;
  }

  .panel-head .btn{
    min-height:36px;
    padding:7px 9px;
    font-size:11px;
  }

  #customer-search-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
    padding:10px;
  }

  #customer-search-form .searchbar-break{
    display:none;
  }

  #customer-search-form #main-search-input,
  #customer-search-form .rep-filter-select{
    grid-column:1 / -1;
    width:100%;
    min-width:0;
  }

  #customer-search-form .range-num-input{
    width:100%;
    min-width:0;
  }

  #customer-search-form .mini{
    font-size:10px;
    white-space:nowrap;
  }

  #customer-search-form #acct-search-dd{
    grid-column:1 / -1;
    width:100%;
  }

  #customer-search-form #acct-search-dd > summary{
    width:100%;
    min-height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
  }

  #customer-search-form .sort-bar{
    grid-column:1 / -1;
    width:auto;
    margin-top:0;
    min-height:40px;
  }

  #customer-search-form .sort-bar select{
    min-width:0;
  }

  #customer-rows .crow{
    min-height:68px;
    padding:11px 12px;
    gap:8px;
  }

  #customer-rows .crow > span:first-child{
    min-width:0;
  }

  #customer-rows .crow > span:first-child > b{
    font-size:13px;
  }

  #customer-rows .bal{
    font-size:13px;
    white-space:nowrap;
  }
}

/* ===== Customer V2.1 — Base page polish ===== */
.wrap > .readout .cust-name{
  font-size:18px;
  font-weight:700;
  color:var(--kh-text);
  margin-bottom:8px;
}

.entry-type-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:14px 18px;
  background:var(--kh-bg);
  border-bottom:1px solid var(--kh-border);
}

.entry-type-row .btn{
  min-height:40px;
  padding:8px 16px;
  border-radius:10px;
  font-weight:700;
}

/* Customer V2.1 — Ledger header and primary actions */
.wrap > .panel > .panel-head{
  padding:14px 18px;
  min-height:62px;
  gap:10px;
}

.wrap > .panel > .panel-head h2{
  font-size:18px;
  font-weight:700;
  color:var(--kh-text);
}

.entry-type-row .receipt-cta{
  background:#15803d;
  border-color:#15803d;
  color:#fff;
}

.entry-type-row .invoice-cta{
  background:var(--kh-primary);
  border-color:var(--kh-primary);
  color:#fff;
}

.entry-type-row .receipt-cta:hover,
.entry-type-row .invoice-cta:hover{
  filter:brightness(.95);
  transform:translateY(-1px);
}

/* Customer V2.1 — Ledger filters desktop */
@media (min-width:900px){
  .wrap > .panel > .searchbar{
    display:grid;
    grid-template-columns:auto minmax(130px,1fr) auto minmax(130px,1fr) minmax(250px,1.6fr) auto auto;
    gap:9px;
    padding:14px 18px;
    align-items:center;
    background:var(--kh-bg);
  }

  .wrap > .panel > .searchbar .date-dmy-wrap{
    width:100%;
    min-width:0;
  }

  .wrap > .panel > .searchbar input.date-dmy,
  .wrap > .panel > .searchbar select{
    width:100%;
    min-width:0;
    min-height:42px;
    border-radius:10px;
  }

  .wrap > .panel > .searchbar .btn{
    min-height:42px;
    padding:8px 14px;
    white-space:nowrap;
  }
}

/* Customer V2.1 — Ledger transaction rows */
.print-detail-rows .row-wrap{
  border-bottom:1px solid var(--kh-border);
  background:var(--kh-card);
}

.print-detail-rows .row-wrap.alt{
  background:var(--kh-bg);
}

.print-detail-rows .row{
  min-height:76px;
  padding:12px 18px;
  gap:14px;
  transition:background .16s ease, transform .16s ease;
}

.print-detail-rows .row:hover{
  background:rgba(37,99,235,.04);
  transform:translateX(-2px);
}

.print-detail-rows .row .date{
  font-weight:600;
  white-space:nowrap;
}

.print-detail-rows .row .mid b{
  font-size:14px;
  font-weight:700;
}

.print-detail-rows .row .mid em{
  font-size:11px;
  opacity:.72;
}

/* Customer V2.1 — Debit credit and running balance */
.print-detail-rows .ledger{
  display:flex;
  align-items:center;
  gap:8px;
}

.print-detail-rows .credit-col,
.print-detail-rows .debit-col{
  min-width:82px;
  padding:6px 9px;
  border-radius:8px;
  text-align:center;
  font-weight:700;
}

.print-detail-rows .credit-col{
  background:rgba(22,163,74,.08);
  color:#15803d;
}

.print-detail-rows .debit-col{
  background:rgba(220,38,38,.07);
  color:#b91c1c;
}

.print-detail-rows .run{
  display:block;
  margin-top:6px;
  font-size:11px;
  font-weight:600;
  color:var(--kh-muted);
  text-align:center;
}

/* Customer V2.2 — Tablet */
@media (min-width:641px) and (max-width:899px){
  .entry-type-row{
    padding:12px 14px;
    gap:7px;
  }
  .entry-type-row .btn{
    flex:1 1 auto;
    min-height:40px;
  }
  .wrap > .panel > .searchbar{
    display:grid;
    grid-template-columns:auto 1fr auto 1fr;
    gap:8px;
    padding:12px 14px;
    align-items:center;
  }
  .wrap > .panel > .searchbar select{
    grid-column:1 / -1;
    width:100%;
    min-height:40px;
  }
  .wrap > .panel > .searchbar .btn{
    min-height:40px;
  }
  .print-detail-rows .row{
    min-height:72px;
    padding:11px 14px;
    gap:10px;
  }
  .print-detail-rows .credit-col,
  .print-detail-rows .debit-col{
    min-width:72px;
    padding:5px 7px;
  }
}

/* Customer V2.3 — Mobile controls */
@media (max-width:640px){
  .entry-type-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    padding:10px;
    gap:7px;
  }
  .entry-type-row .btn{
    width:100%;
    min-height:40px;
    padding:7px 8px;
    font-size:11px;
  }
  .wrap > .panel > .searchbar{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:7px;
    padding:10px;
    align-items:center;
  }
  .wrap > .panel > .searchbar .date-dmy-wrap{
    width:100%;
    min-width:0;
  }
  .wrap > .panel > .searchbar select{
    grid-column:1 / -1;
    width:100%;
    min-height:40px;
  }
  .wrap > .panel > .searchbar .btn{
    min-height:38px;
  }
}

/* Customer V2.3 — Mobile transaction rows */
@media (max-width:640px){
  .print-detail-rows .row{
    min-height:76px;
    padding:10px 11px;
    gap:7px;
  }
  .print-detail-rows .row .date{
    font-size:10px;
  }
  .print-detail-rows .row .mid{
    min-width:0;
  }
  .print-detail-rows .row .mid b{
    font-size:12px;
  }
  .print-detail-rows .row .mid em{
    font-size:10px;
  }
  .print-detail-rows .row .right{
    min-width:0;
  }
  .print-detail-rows .ledger{
    gap:4px;
  }
  .print-detail-rows .credit-col,
  .print-detail-rows .debit-col{
    min-width:0;
    padding:5px 6px;
    font-size:11px;
  }
  .print-detail-rows .run{
    margin-top:4px;
    font-size:10px;
    white-space:nowrap;
  }
}

/* ===== Products V2.1 — Base panels ===== */
.products-v2 > .panel,
.products-v2 > details.panel{
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--kh-border);
  background:var(--kh-card);
  box-shadow:0 4px 18px rgba(15,23,42,.05);
}

/* Products V2.1 — Panel headers */
.products-v2 > details.panel{
  margin-bottom:14px !important;
}

.products-v2 .panel-head{
  min-height:60px;
  padding:13px 18px;
  gap:10px;
  background:var(--kh-card);
  border-bottom:1px solid var(--kh-border);
}

.products-v2 .panel-head h2{
  margin:0;
  font-size:17px;
  font-weight:700;
  color:var(--kh-text);
}

.products-v2 details.panel > summary.panel-head{
  transition:background .16s ease;
}

.products-v2 details.panel > summary.panel-head:hover{
  background:var(--kh-bg);
}

/* Products V2.1 — Product search */
.products-v2 #product-search{
  width:100% !important;
  min-height:44px;
  padding:10px 14px !important;
  border:1px solid var(--kh-border) !important;
  border-radius:10px !important;
  background:var(--kh-bg);
  font-size:14px !important;
  transition:border-color .16s ease, box-shadow .16s ease;
}

.products-v2 #product-search:focus{
  outline:none;
  border-color:var(--kh-primary) !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.10);
  background:var(--kh-card);
}

/* Products V2.1 — Product rows */
.products-v2 [data-product-row]{
  min-height:78px;
  padding:13px 16px;
  gap:12px;
  border-bottom:1px solid var(--kh-border);
  transition:background .16s ease, transform .16s ease;
}

.products-v2 [data-product-row]:hover{
  background:rgba(37,99,235,.04);
  transform:translateX(-2px);
}

.products-v2 [data-product-row] .mid{
  min-width:0;
}

.products-v2 [data-product-row] .mid > b{
  font-size:15px;
  font-weight:700;
  color:var(--kh-text);
}

.products-v2 [data-product-row] > .date{
  min-width:105px;
  font-weight:700;
  color:var(--kh-primary);
  white-space:nowrap;
}

/* Products V2.1 — Stock and row actions */
.products-v2 [data-product-row] .pill{
  display:inline-flex;
  align-items:center;
  margin-top:6px;
  padding:5px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
}

.products-v2 [data-product-row] .right{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  flex-wrap:wrap;
}

.products-v2 [data-product-row] .right .btn{
  min-height:36px;
  padding:7px 11px;
  border-radius:9px;
  white-space:nowrap;
}

/* Products V2.2 — Mobile */
@media (max-width:640px){
  .products-v2 .panel-head{
    min-height:54px;
    padding:10px 12px;
  }
  .products-v2 .panel-head h2{
    font-size:15px;
  }
  .products-v2 [data-product-row]{
    min-height:88px;
    padding:11px 10px;
    gap:7px;
    flex-wrap:wrap;
  }
  .products-v2 [data-product-row] > .date{
    min-width:auto;
    font-size:12px;
  }
  .products-v2 [data-product-row] .mid > b{
    font-size:13px;
  }
  .products-v2 [data-product-row] .mid em{
    font-size:10px;
  }
  .products-v2 [data-product-row] .right{
    width:100%;
    justify-content:flex-end;
  }
  .products-v2 [data-product-row] .right .btn{
    min-height:34px;
    padding:6px 9px;
    font-size:11px;
  }
}

/* Products Redesign V3 — Hero and statistics */
.products-v2 .products-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
  padding:24px 26px;
  border-radius:20px;
  background:linear-gradient(135deg,#0f2747 0%,#173b68 58%,#1d5f8f 100%);
  color:#fff;
  box-shadow:0 8px 28px rgba(15,39,71,.16);
}

.products-v2 .products-hero-main{
  display:flex;
  align-items:center;
  gap:15px;
  min-width:0;
}

.products-v2 .products-hero-icon{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:rgba(255,255,255,.14);
  font-size:27px;
}

.products-v2 .products-hero h1{
  margin:0 0 6px;
  font-size:25px;
  font-weight:800;
}

.products-v2 .products-hero p{
  margin:0;
  color:rgba(255,255,255,.78);
  font-size:13px;
}

.products-v2 .products-hero-add{
  flex:0 0 auto;
  min-height:44px;
  padding:10px 17px;
  border-radius:11px;
  background:#16a34a;
  border-color:#16a34a;
  color:#fff;
  font-weight:800;
  box-shadow:0 5px 14px rgba(22,163,74,.25);
}

.products-v2 .products-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:13px;
  margin-bottom:18px;
}

.products-v2 .product-stat-card{
  display:flex;
  align-items:center;
  gap:13px;
  min-height:88px;
  padding:16px;
  border:1px solid var(--kh-border);
  border-radius:16px;
  background:var(--kh-card);
  box-shadow:0 4px 18px rgba(15,23,42,.045);
}

.products-v2 .product-stat-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:13px;
  background:rgba(37,99,235,.09);
  font-size:21px;
}

.products-v2 .product-stat-card small{
  display:block;
  margin-bottom:5px;
  color:var(--kh-muted);
  font-size:11px;
  font-weight:600;
}

.products-v2 .product-stat-card strong{
  display:block;
  color:var(--kh-text);
  font-size:23px;
  line-height:1;
  font-weight:800;
}

/* =========================================================
   KashfHesab Admin Shell V1 — Desktop Sidebar
   ========================================================= */

.kh-sidebar{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  z-index:1200;
  width:252px;
  display:flex;
  flex-direction:column;
  direction:rtl;
  color:#e8eef8;
  background:
    linear-gradient(180deg,#0b1930 0%,#0d1d36 48%,#091629 100%);
  border-left:1px solid rgba(255,255,255,.06);
  box-shadow:-8px 0 30px rgba(15,23,42,.08);
  overflow:hidden;
}

.kh-sidebar-head{
  min-height:82px;
  padding:15px 17px;
  display:flex;
  align-items:center;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.kh-sidebar-brand{
  min-width:0;
  flex:1;
  display:flex;
  align-items:center;
  gap:11px;
  color:#fff;
  text-decoration:none;
}

.kh-sidebar-brand img,
.kh-sidebar-mark{
  width:43px;
  height:43px;
  flex:0 0 43px;
  border-radius:13px;
}

.kh-sidebar-brand img{
  object-fit:cover;
  background:#fff;
}

.kh-sidebar-mark{
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,#2563eb,#38bdf8);
  color:#fff;
  font-size:15px;
  font-weight:800;
  box-shadow:0 6px 18px rgba(37,99,235,.25);
}

.kh-sidebar-brand-text{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.kh-sidebar-brand-text strong{
  max-width:155px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#fff;
  font-size:14px;
  font-weight:800;
}

.kh-sidebar-brand-text small{
  color:#8293ad;
  font-size:10px;
  letter-spacing:.5px;
}

.kh-sidebar-close{
  display:none;
}

.kh-sidebar-nav{
  flex:1;
  padding:12px 11px 18px;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.15) transparent;
}

.kh-sidebar-section{
  margin:15px 12px 7px;
  color:#61738f;
  font-size:10px;
  font-weight:700;
}

.kh-side-item{
  position:relative;
  min-height:43px;
  margin:3px 0;
  padding:8px 11px;
  display:flex;
  align-items:center;
  gap:11px;
  border:1px solid transparent;
  border-radius:10px;
  color:#aebbd0;
  text-decoration:none;
  font-size:12px;
  font-weight:650;
  transition:
    background .18s ease,
    color .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

.kh-side-item:hover{
  color:#fff;
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.045);
  transform:translateX(-2px);
}

.kh-side-item.active{
  color:#fff;
  background:linear-gradient(90deg,rgba(37,99,235,.24),rgba(37,99,235,.10));
  border-color:rgba(96,165,250,.16);
  box-shadow:inset -3px 0 0 #3b82f6;
}

.kh-side-icon{
  width:27px;
  height:27px;
  flex:0 0 27px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  font-size:15px;
  line-height:1;
  background:rgba(255,255,255,.045);
}

.kh-side-item.active .kh-side-icon{
  background:rgba(59,130,246,.18);
}

.kh-side-label{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.kh-sidebar-user{
  min-height:72px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  gap:10px;
  border-top:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.10);
}

.kh-sidebar-user-avatar{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:linear-gradient(135deg,#2563eb,#22c55e);
  color:#fff;
  font-size:14px;
  font-weight:800;
}

.kh-sidebar-user-info{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.kh-sidebar-user-info strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#f8fafc;
  font-size:11px;
  font-weight:700;
}

.kh-sidebar-user-info small{
  color:#73849e;
  font-size:9px;
}

.kh-sidebar-logout{
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  color:#94a3b8;
  text-decoration:none;
  font-size:17px;
}

.kh-sidebar-logout:hover{
  color:#fff;
  background:rgba(239,68,68,.16);
}

.kh-sidebar-toggle,
.kh-sidebar-scrim{
  display:none;
}

/* مساحة لوحة الإدارة مع القائمة الجانبية */
body:has(.kh-sidebar){
  padding-right:252px;
  background:#f5f7fb;
}

body:has(.kh-sidebar) .topbar{
  right:252px;
}


/* =========================================================
   KashfHesab Admin Shell V1 — Modern Desktop Header
   ========================================================= */

body:has(.kh-sidebar) .topbar{
  position:relative;
  width:auto;
  margin:0;
  background:#fff;
  border-bottom:1px solid #e8edf4;
  box-shadow:0 2px 10px rgba(15,23,42,.035);
}

body:has(.kh-sidebar) .topbar-brand{
  max-width:none;
  min-height:66px;
  padding:10px 28px;
  display:flex;
  align-items:center;
  border-bottom:0;
  background:#fff;
}

body:has(.kh-sidebar) .topbar-brand .brand{
  flex:1;
  min-width:0;
}

body:has(.kh-sidebar) .topbar-brand .brand h1{
  margin:0 0 2px;
  color:#172033;
  font-size:16px;
  font-weight:800;
}

body:has(.kh-sidebar) .topbar-brand .brand span{
  color:#8491a5;
  font-size:10px;
  font-weight:500;
}

body:has(.kh-sidebar) .topbar-brand .topbar-logo,
body:has(.kh-sidebar) .topbar-brand > .mark{
  display:none;
}

body:has(.kh-sidebar) .topbar-brand .live-clock{
  margin-inline-start:auto;
  color:#94a3b8;
  font-size:11px;
}

body:has(.kh-sidebar) .topbar-in{
  max-width:none;
  min-height:52px;
  padding:7px 28px;
  display:flex;
  align-items:center;
  background:#fff;
  border-top:1px solid #f0f3f7;
}

body:has(.kh-sidebar) .top-actions{
  width:100%;
  display:flex;
  align-items:center;
}

body:has(.kh-sidebar) .kh-header-actions{
  width:100%;
  display:flex;
  align-items:center;
  gap:7px;
}

body:has(.kh-sidebar) .kh-header-actions .live{
  margin-inline-end:auto;
  min-height:34px;
  padding:7px 11px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid #e7ecf3;
  border-radius:9px;
  background:#f8fafc;
  color:#475569;
  font-size:11px;
  font-weight:700;
}

body:has(.kh-sidebar) .kh-header-actions .live .dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 0 3px rgba(34,197,94,.11);
}

body:has(.kh-sidebar) .kh-header-actions .btn{
  min-height:34px;
  padding:7px 10px;
  border-radius:9px;
  font-size:10px;
  font-weight:700;
}

body:has(.kh-sidebar) .kh-header-actions .btn-logout{
  border-color:#fee2e2;
  background:#fff7f7;
  color:#dc2626;
}

body:has(.kh-sidebar) .topbar-backrow{
  max-width:none;
  padding-left:28px;
  padding-right:28px;
  background:#fff;
  border-top:1px solid #f1f4f8;
}


/* Admin Shell V1.1 — Compact single-row desktop header */
@media (min-width:900px){

  body:has(.kh-sidebar) .topbar{
    min-height:72px;
    display:flex;
    align-items:center;
    padding:0 28px;
  }

  body:has(.kh-sidebar) .topbar-brand{
    flex:1;
    min-width:0;
    min-height:72px;
    padding:10px 0;
  }

  body:has(.kh-sidebar) .topbar-in{
    width:auto;
    min-height:72px;
    padding:10px 0 10px 18px;
    border-top:0;
    flex:0 0 auto;
  }

  body:has(.kh-sidebar) .top-actions{
    width:auto;
  }

  body:has(.kh-sidebar) .kh-header-actions{
    width:auto;
    gap:8px;
  }

  body:has(.kh-sidebar) .kh-header-actions .live{
    margin-inline-end:0;
  }

  body:has(.kh-sidebar) .topbar-backrow{
    position:absolute;
    top:72px;
    left:0;
    right:0;
  }
}


/* =========================================================
   KashfHesab Admin Shell V1 — Mobile / Tablet Sidebar
   ========================================================= */
@media (max-width:899px){

  body:has(.kh-sidebar){
    padding-right:0;
  }

  body:has(.kh-sidebar) .kh-sidebar{
    width:min(82vw,300px);
    right:0;
    transform:translateX(105%);
    transition:transform .24s ease;
    box-shadow:-16px 0 40px rgba(15,23,42,.22);
  }

  body.kh-sidebar-open .kh-sidebar{
    transform:translateX(0);
  }

  body:has(.kh-sidebar) .kh-sidebar-close{
    width:34px;
    height:34px;
    flex:0 0 34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.09);
    border-radius:9px;
    background:rgba(255,255,255,.05);
    color:#cbd5e1;
    font-size:22px;
    line-height:1;
    cursor:pointer;
  }

  body:has(.kh-sidebar) .kh-sidebar-toggle{
    position:fixed;
    top:14px;
    right:14px;
    z-index:1100;
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid #e3e8f0;
    border-radius:11px;
    background:#fff;
    color:#172033;
    box-shadow:0 5px 18px rgba(15,23,42,.10);
    font-size:20px;
    line-height:1;
    cursor:pointer;
  }

  body.kh-sidebar-open .kh-sidebar-toggle{
    opacity:0;
    pointer-events:none;
  }

  body:has(.kh-sidebar) .kh-sidebar-scrim{
    position:fixed;
    inset:0;
    z-index:1150;
    display:block;
    visibility:hidden;
    opacity:0;
    background:rgba(15,23,42,.48);
    backdrop-filter:blur(2px);
    transition:opacity .22s ease,visibility .22s ease;
  }

  body.kh-sidebar-open .kh-sidebar-scrim{
    visibility:visible;
    opacity:1;
  }

  body.kh-sidebar-open{
    overflow:hidden;
  }

  body:has(.kh-sidebar) .topbar{
    right:auto;
    width:100%;
  }

  body:has(.kh-sidebar) .topbar-brand{
    min-height:68px;
    padding-right:68px;
    padding-left:16px;
  }

  body:has(.kh-sidebar) .topbar-brand .brand h1{
    font-size:14px;
  }

  body:has(.kh-sidebar) .topbar-brand .brand span{
    font-size:9px;
  }

  body:has(.kh-sidebar) .topbar-in{
    padding:7px 14px;
  }

  body:has(.kh-sidebar) .wrap{
    width:100%;
    max-width:none;
    padding-left:14px;
    padding-right:14px;
  }
}


/* =========================================================
   KashfHesab Admin Shell — Professional Desktop Brand Header
   ========================================================= */
@media (min-width:900px){

  body:has(.kh-sidebar) .topbar-brand{
    position:relative;
    justify-content:flex-start;
  }

  body:has(.kh-sidebar) .topbar-brand .brand{
    flex:0 1 auto;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:5px;
    text-align:right;
  }

  body:has(.kh-sidebar) .topbar-brand .brand h1{
    margin:0;
    max-width:520px;
    color:#0f172a;
    font-size:18px;
    line-height:1.35;
    font-weight:800;
    letter-spacing:-.15px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  body:has(.kh-sidebar) .topbar-brand .brand span{
    width:max-content;
    display:inline-flex;
    align-items:center;
    min-height:22px;
    margin:0;
    padding:3px 9px;
    border:1px solid #e2e8f0;
    border-radius:7px;
    background:#f8fafc;
    color:#64748b;
    font-size:10px;
    line-height:1;
    font-weight:700;
  }

  body:has(.kh-sidebar) .topbar-brand .brand span::before{
    content:"";
    width:6px;
    height:6px;
    margin-left:6px;
    border-radius:50%;
    background:#2563eb;
    box-shadow:0 0 0 3px rgba(37,99,235,.09);
  }

  body:has(.kh-sidebar) .topbar-brand .live-clock{
    margin-inline-start:18px;
    padding-inline-start:18px;
    border-inline-start:1px solid #edf1f5;
    color:#94a3b8;
    font-size:11px;
    white-space:nowrap;
  }
}


/* =========================================================
   KashfHesab — Approved Premium Blue Desktop Header
   ========================================================= */
@media (min-width:900px){

  body:has(.kh-sidebar) .topbar{
    width:calc(100% - 56px);
    min-height:94px;
    margin:20px 28px 18px;
    padding:0 26px;
    display:flex;
    align-items:center;
    overflow:hidden;
    position:relative;
    border:1px solid rgba(255,255,255,.10);
    border-radius:18px;
    background:
      radial-gradient(circle at 82% -30%,rgba(59,130,246,.35),transparent 38%),
      linear-gradient(115deg,#102d50 0%,#0d4079 52%,#1262bd 100%);
    box-shadow:
      0 12px 28px rgba(15,45,82,.14),
      inset 0 1px 0 rgba(255,255,255,.08);
  }

  body:has(.kh-sidebar) .topbar::before{
    content:"";
    position:absolute;
    width:430px;
    height:130px;
    left:-90px;
    bottom:-92px;
    border-radius:50%;
    border:24px solid rgba(59,130,246,.13);
    transform:rotate(-7deg);
    pointer-events:none;
  }

  body:has(.kh-sidebar) .topbar::after{
    content:"";
    position:absolute;
    width:320px;
    height:110px;
    right:32%;
    top:-82px;
    border-radius:50%;
    border:20px solid rgba(255,255,255,.045);
    pointer-events:none;
  }

  body:has(.kh-sidebar) .topbar-brand{
    order:1;
    flex:1 1 auto;
    min-width:0;
    min-height:92px;
    padding:15px 4px 15px 24px;
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    background:transparent;
  }

  body:has(.kh-sidebar) .topbar-brand .brand{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:7px;
    text-align:right;
  }

  body:has(.kh-sidebar) .topbar-brand .brand h1{
    max-width:620px;
    margin:0;
    overflow:hidden;
    color:#fff;
    font-size:19px;
    line-height:1.4;
    font-weight:800;
    letter-spacing:0;
    white-space:nowrap;
    text-overflow:ellipsis;
    text-shadow:0 1px 2px rgba(0,0,0,.10);
  }

  body:has(.kh-sidebar) .topbar-brand .brand span{
    width:max-content;
    min-height:24px;
    margin:0;
    padding:4px 10px;
    display:inline-flex;
    align-items:center;
    border:1px solid rgba(255,255,255,.14);
    border-radius:8px;
    background:rgba(255,255,255,.09);
    color:#dbeafe;
    font-size:10px;
    font-weight:700;
    backdrop-filter:blur(5px);
  }

  body:has(.kh-sidebar) .topbar-brand .brand span::before{
    width:6px;
    height:6px;
    margin-left:7px;
    background:#60a5fa;
    box-shadow:0 0 0 3px rgba(96,165,250,.15);
  }

  body:has(.kh-sidebar) .topbar-brand .live-clock{
    margin-inline-start:18px;
    padding:7px 10px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:8px;
    background:rgba(255,255,255,.08);
    color:#dbeafe;
    font-size:10px;
    white-space:nowrap;
  }

  body:has(.kh-sidebar) .topbar-in{
    order:2;
    flex:0 0 auto;
    width:auto;
    min-height:92px;
    padding:15px 0 15px 22px;
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    border:0;
    background:transparent;
  }

  body:has(.kh-sidebar) .top-actions,
  body:has(.kh-sidebar) .kh-header-actions{
    width:auto;
  }

  body:has(.kh-sidebar) .kh-header-actions{
    gap:8px;
  }

  body:has(.kh-sidebar) .kh-header-actions .live{
    min-height:36px;
    margin:0;
    padding:8px 11px;
    border-color:rgba(255,255,255,.15);
    background:rgba(255,255,255,.10);
    color:#fff;
    backdrop-filter:blur(6px);
  }

  body:has(.kh-sidebar) .kh-header-actions .btn{
    min-height:36px;
    border-color:rgba(255,255,255,.14);
    background:rgba(255,255,255,.10);
    color:#fff;
    backdrop-filter:blur(6px);
  }

  body:has(.kh-sidebar) .kh-header-actions .btn:hover,
  body:has(.kh-sidebar) .kh-header-actions .live:hover{
    background:rgba(255,255,255,.17);
    border-color:rgba(255,255,255,.24);
  }

  body:has(.kh-sidebar) .kh-header-actions .btn-logout{
    border-color:rgba(254,202,202,.22);
    background:rgba(127,29,29,.18);
    color:#fee2e2;
  }

  body:has(.kh-sidebar) .topbar-backrow{
    top:94px;
  }
}


/* Admin Shell — Exact desktop header alignment with main content */
@media (min-width:900px){
  body:has(.kh-sidebar) .topbar{
    box-sizing:border-box;
    width:auto;
    max-width:none;
    align-self:stretch;
    margin:20px 30px 18px;
    left:auto;
    right:auto;
  }
}

/* Final Admin Header — tighter spacing with dashboard card */
@media (min-width:900px){
  body:has(.kh-sidebar) .topbar{
    margin-bottom:8px;
  }
}

/* Final Admin Header — clock directly to the right of admin */
@media (min-width:900px){
  body:has(.kh-sidebar) .top-actions{
    display:flex;
    align-items:center;
    gap:8px;
    direction:rtl;
  }

  body:has(.kh-sidebar) .top-actions > .live-clock{
    order:2;
    flex:0 0 auto;
    margin:0;
    padding:7px 10px;
    min-height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.14);
    border-radius:9px;
    background:rgba(255,255,255,.10);
    color:#dbeafe;
    font-size:10px;
    font-weight:700;
    white-space:nowrap;
    backdrop-filter:blur(6px);
  }

  body:has(.kh-sidebar) .top-actions > .kh-header-actions{
    order:1;
  }
}

/* Final fix — clock immediately on the RIGHT side of admin */
@media (min-width:900px){
  body:has(.kh-sidebar) .top-actions{
    direction:ltr;
  }

  body:has(.kh-sidebar) .top-actions > .kh-header-actions{
    order:1;
    direction:rtl;
  }

  body:has(.kh-sidebar) .top-actions > .live-clock{
    order:2;
    margin-left:0;
    margin-right:8px;
  }
}

/* =========================================================
   Products V4 — Groups Management
   ========================================================= */
.products-v2 .products-groups-panel{
  margin-bottom:16px !important;
  border:1px solid #dfe7f1;
  border-radius:18px;
  background:#fff;
  box-shadow:0 5px 20px rgba(15,23,42,.045);
  overflow:hidden;
}

.products-v2 .products-groups-panel > .products-section-head{
  min-height:64px;
  padding:15px 18px;
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
  border-bottom:0;
}

.products-v2 .products-groups-panel[open] > .products-section-head{
  border-bottom:1px solid #e7edf5;
}

.products-v2 .products-groups-panel > .products-section-head h2{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:16px;
  font-weight:800;
  color:#172b4d;
}

.products-v2 .products-groups-body{
  padding:18px !important;
}

.products-v2 .products-groups-body > .hint{
  margin:0 0 15px !important;
  padding:11px 13px;
  border-radius:10px;
  background:#f6f9fd;
  color:#64748b;
  line-height:1.7;
}

.products-v2 .products-group-add{
  display:flex !important;
  align-items:center;
  gap:9px !important;
  margin-bottom:16px !important;
  padding:10px;
  border:1px solid #e3eaf3;
  border-radius:13px;
  background:#fbfcfe;
}

.products-v2 .products-group-add input[type="text"]{
  min-height:42px;
  margin:0;
  border-radius:9px;
  background:#fff;
}

.products-v2 .products-group-add .btn{
  min-height:42px;
  padding:8px 17px;
  border-radius:9px;
  white-space:nowrap;
}

.products-v2 .products-group-row{
  min-height:58px;
  margin-top:8px;
  padding:10px 13px;
  border:1px solid #e7edf4;
  border-radius:11px;
  background:#fff;
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}

.products-v2 .products-group-row:hover{
  border-color:#cbd9eb;
  box-shadow:0 4px 14px rgba(15,23,42,.05);
  transform:translateY(-1px);
}

.products-v2 .products-group-row .mid b{
  color:#1e293b;
  font-size:14px;
  font-weight:750;
}

.products-v2 .products-group-row .date{
  min-width:auto;
  padding:5px 9px;
  border-radius:999px;
  background:#eef5ff;
  color:#2563eb;
  font-size:11px;
  font-weight:700;
}

.products-v2 .products-group-row .right .btn{
  border-radius:8px;
}

@media (max-width:640px){
  .products-v2 .products-groups-body{
    padding:12px !important;
  }

  .products-v2 .products-group-add{
    flex-direction:column;
    align-items:stretch;
  }

  .products-v2 .products-group-add .btn{
    width:100%;
    justify-content:center;
  }

  .products-v2 .products-group-row{
    flex-wrap:wrap;
    gap:7px;
  }
}

/* =========================================================
   Products V4 — Add Product Form
   ========================================================= */
.products-v2 .products-add-panel{
  margin-bottom:16px !important;
  border:1px solid #dfe7f1;
  border-radius:18px;
  background:#fff;
  box-shadow:0 5px 20px rgba(15,23,42,.045);
  overflow:hidden;
}

.products-v2 .products-add-panel > .products-section-head{
  min-height:64px;
  padding:15px 18px;
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
  border-bottom:0;
}

.products-v2 .products-add-panel[open] > .products-section-head{
  border-bottom:1px solid #e7edf5;
}

.products-v2 .products-add-panel > .products-section-head h2{
  margin:0;
  color:#172b4d;
  font-size:16px;
  font-weight:800;
}

.products-v2 .products-add-form{
  padding:20px !important;
}

.products-v2 .products-add-form .products-form-grid{
  gap:14px;
  margin-bottom:2px;
}

.products-v2 .products-add-form .field{
  margin-bottom:14px;
}

.products-v2 .products-add-form .field label{
  display:block;
  margin-bottom:7px;
  color:#334155;
  font-size:12px;
  font-weight:700;
}

.products-v2 .products-add-form input[type="text"],
.products-v2 .products-add-form input[type="number"],
.products-v2 .products-add-form select{
  min-height:44px;
  border:1px solid #dbe4ef;
  border-radius:10px;
  background:#fbfdff;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

.products-v2 .products-add-form input:focus,
.products-v2 .products-add-form select:focus{
  outline:none;
  border-color:#3b82f6;
  background:#fff;
  box-shadow:0 0 0 3px rgba(59,130,246,.10);
}

.products-v2 .products-add-form .hint{
  margin:7px 0 0;
  color:#718096;
  font-size:11px;
  line-height:1.6;
}

.products-v2 .products-stock-toggle{
  min-height:54px;
  padding:12px 14px;
  border:1px solid #dce9df;
  border-radius:11px;
  background:#f4fbf6;
  color:#28583a;
}

.products-v2 .products-stock-toggle input{
  flex:0 0 auto;
  width:18px;
  height:18px;
  accent-color:#16a34a;
}

.products-v2 .products-save-btn{
  min-width:150px;
  min-height:44px;
  padding:9px 22px;
  border-radius:10px;
  font-weight:800;
  box-shadow:0 5px 14px rgba(37,99,235,.16);
}

@media (max-width:640px){
  .products-v2 .products-add-form{
    padding:14px !important;
  }

  .products-v2 .products-add-form .products-form-grid{
    grid-template-columns:1fr;
    gap:0;
  }

  .products-v2 .products-stock-toggle{
    align-items:flex-start !important;
    line-height:1.6;
  }

  .products-v2 .products-save-btn{
    width:100%;
    justify-content:center;
  }
}

/* Products V4 — Product List */

.products-v2 .products-list-panel{
  margin-top:16px;
  border:1px solid #dfe7f1;
  border-radius:18px;
  background:#fff;
  box-shadow:0 5px 20px rgba(15,23,42,.045);
  overflow:hidden;
}

.products-v2 .products-list-head{
  min-height:64px;
  padding:15px 18px;
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
  border-bottom:1px solid #e7edf5;
}

.products-v2 .products-list-head h2{
  margin:0;
  color:#172b4d;
  font-size:16px;
  font-weight:800;
}

.products-v2 .products-search-wrap{
  position:relative;
  padding:16px 18px 10px !important;
  background:#fff;
}

.products-v2 #product-search{
  width:100% !important;
  min-height:46px;
  padding:10px 44px 10px 14px !important;
  border:1px solid #dbe4ef !important;
  border-radius:11px !important;
  background:#fbfdff;
  color:#1e293b;
  font-size:13px !important;
  transition:.16s ease;
}

.products-v2 #product-search:focus{
  outline:none;
  border-color:#3b82f6 !important;
  background:#fff;
  box-shadow:0 0 0 3px rgba(59,130,246,.10);
}

.products-v2 .products-search-wrap::before{
  content:"⌕";
  position:absolute;
  top:25px;
  right:31px;
  z-index:1;
  color:#64748b;
  font-size:21px;
  line-height:1;
  pointer-events:none;
}

.products-v2 #product-search-empty{
  margin:9px 2px 0;
  padding:9px 11px;
  border-radius:9px;
  background:#fff7ed;
  color:#9a5412;
}

.products-v2 #product-bulk-form{
  padding:0 18px 8px;
}

.products-v2 .products-select-all{
  min-height:38px;
  margin:0;
  padding:8px 11px;
  border:1px solid #e5ebf3;
  border-radius:9px;
  background:#f8fafc;
  color:#475569;
  font-size:12px;
  font-weight:700;
}

.products-v2 .products-select-all input{
  width:17px !important;
  height:17px;
  margin:0 0 0 7px;
  accent-color:#2563eb;
}

.products-v2 .products-bulk-bar{
  margin-top:8px;
  padding:10px;
  gap:8px;
  border:1px solid #d9e5f5;
  border-radius:10px;
  background:#f5f9ff;
}

.products-v2 .products-bulk-bar .btn{
  border-radius:8px;
}

.products-v2 .products-item{
  position:relative;
  min-height:82px;
  margin:9px 18px;
  padding:13px 14px;
  gap:12px;
  border:1px solid #e3eaf3;
  border-radius:13px;
  background:#fff;
  box-shadow:0 2px 8px rgba(15,23,42,.025);
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}

.products-v2 .products-item:hover{
  border-color:#cbd9eb;
  box-shadow:0 6px 18px rgba(15,23,42,.055);
  transform:translateY(-1px);
}

.products-v2 .products-item > .bar{
  width:4px;
  align-self:stretch;
  min-height:48px;
  border-radius:999px;
  background:linear-gradient(180deg,#2563eb,#60a5fa);
}

.products-v2 .products-item .row-chk{
  display:flex;
  align-items:center;
  justify-content:center;
}

.products-v2 .products-item .row-chk input{
  width:17px !important;
  height:17px;
  margin:0;
  accent-color:#2563eb;
}

.products-v2 .products-item-price{
  flex:0 0 auto;
  min-width:105px;
  padding:8px 11px;
  border:1px solid #dbeafe;
  border-radius:10px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:13px;
  font-weight:800;
  text-align:center;
}

.products-v2 .products-item-main{
  min-width:0;
  flex:1 1 auto;
}

.products-v2 .products-item-main > b{
  display:block;
  margin-bottom:5px;
  color:#172b4d;
  font-size:14px;
  font-weight:800;
  line-height:1.5;
}

.products-v2 .products-item-main > em{
  color:#64748b;
  font-size:11px;
  font-style:normal;
  line-height:1.8;
}

.products-v2 .products-item-main .pill{
  display:inline-flex;
  align-items:center;
  margin-top:5px;
  padding:5px 9px;
  border-radius:999px;
  font-size:10px;
  font-weight:750;
}

.products-v2 .products-item-actions{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  gap:6px;
}

.products-v2 .products-item-actions .btn{
  min-height:35px;
  padding:7px 10px;
  border-radius:8px;
  white-space:nowrap;
}

.products-v2 .products-item-actions a.btn{
  color:#24568f;
  background:#f5f9ff;
  border-color:#dce8f6;
}

.products-v2 .products-item-actions button.btn{
  color:#475569;
  background:#fff;
  border-color:#dfe6ee;
}

.products-v2 .products-list-panel > .empty{
  margin:18px;
  padding:30px 18px;
  border:1px dashed #cfd9e6;
  border-radius:13px;
  background:#f8fafc;
}

/* Products V4 — Product List Responsive */
@media (max-width:899px){
  .products-v2 .products-item{
    flex-wrap:wrap;
  }

  .products-v2 .products-item-main{
    flex:1 1 50%;
  }

  .products-v2 .products-item-actions{
    margin-inline-start:auto;
  }
}

@media (max-width:640px){
  .products-v2 .products-list-head{
    min-height:56px;
    padding:13px 14px;
  }

  .products-v2 .products-search-wrap{
    padding:12px 12px 8px !important;
  }

  .products-v2 .products-search-wrap::before{
    top:21px;
    right:25px;
  }

  .products-v2 #product-bulk-form{
    padding:0 12px 7px;
  }

  .products-v2 .products-bulk-bar{
    flex-direction:column;
    align-items:stretch;
  }

  .products-v2 .products-bulk-bar .btn{
    width:100%;
    justify-content:center;
  }

  .products-v2 .products-item{
    margin:8px 12px;
    padding:12px;
    gap:9px;
  }

  .products-v2 .products-item > .bar{
    width:3px;
  }

  .products-v2 .products-item-price{
    min-width:auto;
    padding:6px 9px;
    font-size:12px;
  }

  .products-v2 .products-item-main{
    flex:1 1 calc(100% - 80px);
  }

  .products-v2 .products-item-actions{
    width:100%;
    margin:4px 0 0;
    padding-top:9px;
    border-top:1px solid #edf1f5;
  }

  .products-v2 .products-item-actions .btn{
    flex:1 1 0;
    justify-content:center;
  }

  .products-v2 .products-list-panel > .empty{
    margin:12px;
  }
}

/* =========================================================
   Products V5 — Mobile Product Cards
   2026-09-24
   ========================================================= */
@media (max-width:640px){

  .products-v2 .products-item{
    display:grid !important;
    grid-template-columns:4px 24px minmax(0,1fr) auto;
    grid-template-areas:
      "bar check main price"
      "bar check main price"
      "bar actions actions actions";
    align-items:start !important;
    column-gap:9px !important;
    row-gap:10px !important;
    min-height:0 !important;
    margin:9px 10px !important;
    padding:13px 12px !important;
    border:1px solid #e2e8f0 !important;
    border-radius:14px !important;
    background:#fff !important;
    box-shadow:0 3px 12px rgba(15,23,42,.04) !important;
  }

  .products-v2 .products-item > .bar{
    grid-area:bar;
    width:4px !important;
    min-height:100% !important;
    height:100% !important;
    align-self:stretch !important;
    border-radius:999px !important;
  }

  .products-v2 .products-item .row-chk{
    grid-area:check;
    width:24px;
    min-width:24px;
    padding-top:3px;
    align-items:flex-start !important;
    justify-content:center !important;
  }

  .products-v2 .products-item .row-chk input{
    width:18px !important;
    height:18px !important;
    margin:0 !important;
  }

  .products-v2 .products-item-main{
    grid-area:main;
    width:auto !important;
    min-width:0 !important;
    flex:none !important;
    padding:0 !important;
  }

  .products-v2 .products-item-main > b{
    margin:0 0 4px !important;
    font-size:14px !important;
    line-height:1.55 !important;
    overflow-wrap:anywhere;
  }

  .products-v2 .products-item-main > em{
    display:block;
    font-size:11px !important;
    line-height:1.75 !important;
    overflow-wrap:anywhere;
  }

  .products-v2 .products-item-main .pill{
    max-width:100%;
    margin-top:6px !important;
    padding:5px 8px !important;
    font-size:10px !important;
    line-height:1.35;
    white-space:normal;
  }

  .products-v2 .products-item-price{
    grid-area:price;
    align-self:start;
    min-width:78px !important;
    max-width:105px;
    margin:0 !important;
    padding:7px 8px !important;
    border-radius:9px !important;
    font-size:11px !important;
    line-height:1.35;
    white-space:nowrap;
    text-align:center !important;
  }

  .products-v2 .products-item-actions{
    grid-area:actions;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100% !important;
    margin:1px 0 0 !important;
    padding:10px 0 0 !important;
    gap:7px !important;
    border-top:1px solid #edf1f5 !important;
  }

  .products-v2 .products-item-actions .btn{
    width:100% !important;
    min-width:0 !important;
    min-height:38px !important;
    margin:0 !important;
    padding:7px 6px !important;
    justify-content:center !important;
    text-align:center !important;
    font-size:11px !important;
    border-radius:9px !important;
  }

}

/* Extra-small phones */
@media (max-width:380px){

  .products-v2 .products-item{
    grid-template-columns:4px 22px minmax(0,1fr);
    grid-template-areas:
      "bar check main"
      "bar price price"
      "bar actions actions";
  }

  .products-v2 .products-item-price{
    justify-self:start;
    min-width:92px !important;
  }

}

/* =========================================================
   Products V5.1 — Mobile Stats Grid
   2026-09-24
   ========================================================= */
@media (max-width:640px){

  .products-v2 .products-stats{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
    margin-bottom:14px !important;
  }

  .products-v2 .product-stat-card{
    min-width:0 !important;
    min-height:82px !important;
    padding:11px !important;
    gap:9px !important;
    border-radius:13px !important;
    align-items:center !important;
  }

  .products-v2 .product-stat-icon{
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;
    border-radius:11px !important;
    font-size:18px !important;
  }

  .products-v2 .product-stat-card > div:last-child{
    min-width:0 !important;
    flex:1 1 auto !important;
  }

  .products-v2 .product-stat-card small{
    margin-bottom:4px !important;
    font-size:10px !important;
    line-height:1.4 !important;
    white-space:normal !important;
    overflow-wrap:anywhere;
  }

  .products-v2 .product-stat-card strong{
    font-size:20px !important;
    line-height:1.1 !important;
  }

}

@media (max-width:380px){

  .products-v2 .product-stat-card{
    padding:9px !important;
    gap:7px !important;
  }

  .products-v2 .product-stat-icon{
    width:36px !important;
    height:36px !important;
    flex-basis:36px !important;
    font-size:16px !important;
  }

  .products-v2 .product-stat-card small{
    font-size:9px !important;
  }

  .products-v2 .product-stat-card strong{
    font-size:18px !important;
  }

}

/* =========================================================
   Products V5.2 — Mobile Product Card Final Polish
   2026-09-24
   ========================================================= */
@media (max-width:640px){

  .products-v2 .products-item{
    grid-template-columns:3px 22px minmax(0,1fr) auto !important;
    grid-template-areas:
      "bar check main main"
      "bar price main main"
      "bar actions actions actions" !important;
    column-gap:8px !important;
    row-gap:8px !important;
    margin:9px 10px !important;
    padding:12px 11px !important;
    border-radius:13px !important;
  }

  .products-v2 .products-item > .bar{
    width:3px !important;
    opacity:.82;
  }

  .products-v2 .products-item .row-chk{
    width:22px !important;
    min-width:22px !important;
    padding-top:2px !important;
  }

  .products-v2 .products-item .row-chk input{
    width:17px !important;
    height:17px !important;
  }

  .products-v2 .products-item-main{
    padding-inline-start:2px !important;
  }

  .products-v2 .products-item-main > b{
    margin:0 0 5px !important;
    color:#142b4a !important;
    font-size:14px !important;
    font-weight:850 !important;
    line-height:1.45 !important;
  }

  .products-v2 .products-item-main > em{
    color:#64748b !important;
    font-size:10.5px !important;
    line-height:1.7 !important;
  }

  .products-v2 .products-item-main .pill{
    margin-top:5px !important;
    padding:4px 8px !important;
    font-size:9.5px !important;
    font-weight:750 !important;
  }

  .products-v2 .products-item-price{
    align-self:start !important;
    justify-self:center !important;
    min-width:64px !important;
    max-width:76px !important;
    padding:5px 6px !important;
    border-radius:8px !important;
    font-size:10px !important;
    font-weight:800 !important;
  }

  .products-v2 .products-item-actions{
    margin-top:2px !important;
    padding-top:9px !important;
    gap:7px !important;
  }

  .products-v2 .products-item-actions .btn{
    min-height:36px !important;
    padding:7px 5px !important;
    font-size:10.5px !important;
    font-weight:700 !important;
  }

}

/* Very narrow phones */
@media (max-width:380px){

  .products-v2 .products-item{
    grid-template-columns:3px 20px minmax(0,1fr) !important;
    grid-template-areas:
      "bar check main"
      "bar price main"
      "bar actions actions" !important;
    padding:11px 9px !important;
    column-gap:7px !important;
  }

  .products-v2 .products-item-price{
    min-width:58px !important;
    max-width:64px !important;
    padding:5px 4px !important;
    font-size:9px !important;
  }

  .products-v2 .products-item-main > b{
    font-size:13px !important;
  }

}

/* Products V5.3 — Restore V26 mobile card layout */
@media (max-width:640px){
  .products-v2 .products-item{
    grid-template-columns:4px 24px minmax(0,1fr) auto !important;
    grid-template-areas:
      "bar check main price"
      "bar check main price"
      "bar actions actions actions" !important;
    column-gap:9px !important;
    row-gap:10px !important;
    padding:13px 12px !important;
    border-radius:14px !important;
  }

  .products-v2 .products-item > .bar{
    width:4px !important;
    opacity:1 !important;
  }

  .products-v2 .products-item .row-chk{
    width:24px !important;
    min-width:24px !important;
    padding-top:3px !important;
  }

  .products-v2 .products-item .row-chk input{
    width:18px !important;
    height:18px !important;
  }

  .products-v2 .products-item-main{
    padding-inline-start:0 !important;
  }

  .products-v2 .products-item-main > b{
    margin:0 0 4px !important;
    font-size:14px !important;
    line-height:1.55 !important;
  }

  .products-v2 .products-item-main > em{
    font-size:11px !important;
    line-height:1.75 !important;
  }

  .products-v2 .products-item-main .pill{
    margin-top:6px !important;
    padding:5px 8px !important;
    font-size:10px !important;
  }

  .products-v2 .products-item-price{
    align-self:start !important;
    justify-self:auto !important;
    min-width:78px !important;
    max-width:105px !important;
    padding:7px 8px !important;
    font-size:11px !important;
  }

  .products-v2 .products-item-actions{
    margin:1px 0 0 !important;
    padding-top:10px !important;
  }

  .products-v2 .products-item-actions .btn{
    min-height:38px !important;
    padding:7px 6px !important;
    font-size:11px !important;
  }
}

@media (max-width:380px){
  .products-v2 .products-item{
    grid-template-columns:4px 22px minmax(0,1fr) !important;
    grid-template-areas:
      "bar check main"
      "bar price price"
      "bar actions actions" !important;
  }

  .products-v2 .products-item-price{
    justify-self:start !important;
    min-width:92px !important;
    max-width:105px !important;
    padding:7px 8px !important;
    font-size:11px !important;
  }

  .products-v2 .products-item-main > b{
    font-size:14px !important;
  }
}

/* =========================================================
   Products V6 — Compact Inventory Lines
   Quantity-first layout
   2026-09-24
   ========================================================= */

.products-v2 .product-line-v6{
  position:relative;
  display:grid !important;
  grid-template-columns:4px 24px minmax(220px,1fr) 115px auto;
  grid-template-areas:"accent check info stock actions";
  align-items:center !important;
  gap:12px;
  min-height:72px;
  margin:8px 18px;
  padding:11px 13px;
  border:1px solid #e3eaf3;
  border-radius:13px;
  background:#fff;
  box-shadow:0 2px 8px rgba(15,23,42,.025);
  transition:.16s ease;
}

.products-v2 .product-line-v6:hover{
  border-color:#cbd9eb;
  box-shadow:0 6px 18px rgba(15,23,42,.055);
  transform:translateY(-1px);
}

.products-v2 .product-line-accent{
  grid-area:accent;
  width:4px;
  height:100%;
  min-height:45px;
  border-radius:999px;
  background:linear-gradient(180deg,#2563eb,#60a5fa);
}

.products-v2 .product-line-check{
  grid-area:check;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0;
}

.products-v2 .product-line-check input{
  width:17px !important;
  height:17px !important;
  margin:0 !important;
  accent-color:#2563eb;
}

.products-v2 .product-line-info{
  grid-area:info;
  min-width:0;
}

.products-v2 .product-line-name{
  margin-bottom:6px;
  color:#172b4d;
  font-size:14px;
  font-weight:850;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.products-v2 .product-line-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px 12px;
  min-width:0;
  color:#64748b;
  font-size:10.5px;
  line-height:1.45;
}

.products-v2 .product-line-meta > span{
  white-space:nowrap;
}

.products-v2 .product-line-price{
  color:#64748b;
}

.products-v2 .product-line-stock{
  grid-area:stock;
  min-width:100px;
  padding:7px 11px;
  border:1px solid #dbeafe;
  border-radius:11px;
  background:#f5f9ff;
  text-align:center;
}

.products-v2 .product-line-stock strong{
  display:block;
  color:#1d4ed8;
  font-size:20px;
  font-weight:900;
  line-height:1.05;
  font-variant-numeric:tabular-nums;
}

.products-v2 .product-line-stock small{
  display:block;
  margin-top:3px;
  color:#64748b;
  font-size:9px;
  font-weight:700;
}

.products-v2 .product-line-stock.is-positive{
  border-color:#bbf7d0;
  background:#f0fdf4;
}

.products-v2 .product-line-stock.is-positive strong{
  color:#15803d;
}

.products-v2 .product-line-stock.is-zero{
  border-color:#e2e8f0;
  background:#f8fafc;
}

.products-v2 .product-line-stock.is-zero strong{
  color:#64748b;
}

.products-v2 .product-line-stock.is-negative{
  border-color:#fecaca;
  background:#fef2f2;
}

.products-v2 .product-line-stock.is-negative strong{
  color:#b91c1c;
}

.products-v2 .product-line-stock.is-off{
  border-color:#e2e8f0;
  background:#f8fafc;
}

.products-v2 .product-line-stock.is-off strong{
  color:#94a3b8;
}

.products-v2 .product-line-actions{
  grid-area:actions;
  display:flex;
  align-items:center;
  gap:6px;
}

.products-v2 .product-line-actions .btn{
  min-height:34px;
  padding:6px 9px;
  border-radius:8px;
  font-size:11px;
  white-space:nowrap;
}


/* Tablet */
@media (max-width:899px){

  .products-v2 .product-line-v6{
    grid-template-columns:4px 24px minmax(0,1fr) 100px;
    grid-template-areas:
      "accent check info stock"
      "accent check info actions";
    gap:8px 10px;
  }

  .products-v2 .product-line-actions{
    justify-content:flex-end;
  }

}


/* Mobile */
@media (max-width:640px){

  .products-v2 .product-line-v6{
    grid-template-columns:3px 22px minmax(0,1fr) 82px !important;
    grid-template-areas:
      "accent check info stock"
      "accent actions actions actions" !important;
    align-items:center !important;
    gap:8px !important;
    min-height:0 !important;
    margin:7px 10px !important;
    padding:10px 10px !important;
    border-radius:12px !important;
  }

  .products-v2 .product-line-accent{
    width:3px;
    min-height:52px;
  }

  .products-v2 .product-line-name{
    margin-bottom:5px;
    font-size:13px;
    line-height:1.35;
  }

  .products-v2 .product-line-meta{
    gap:3px 7px;
    font-size:9px;
    line-height:1.35;
  }

  .products-v2 .product-line-stock{
    min-width:0;
    width:82px;
    padding:7px 5px;
    border-radius:10px;
  }

  .products-v2 .product-line-stock strong{
    font-size:18px;
  }

  .products-v2 .product-line-stock small{
    margin-top:2px;
    font-size:8px;
  }

  .products-v2 .product-line-actions{
    width:100%;
    justify-content:flex-end;
    gap:5px;
    padding-top:6px;
    border-top:1px solid #edf1f5;
  }

  .products-v2 .product-line-actions .btn{
    min-height:30px;
    padding:5px 8px;
    font-size:9.5px;
    border-radius:7px;
  }

}


/* Very narrow phones */
@media (max-width:380px){

  .products-v2 .product-line-v6{
    grid-template-columns:3px 20px minmax(0,1fr) 70px !important;
    padding:9px 8px !important;
    gap:6px !important;
  }

  .products-v2 .product-line-stock{
    width:70px;
  }

  .products-v2 .product-line-stock strong{
    font-size:16px;
  }

  .products-v2 .product-line-name{
    font-size:12px;
  }

}

/* Products V6.1 — True compact 2-line mobile rows */
@media (max-width:640px){

  .products-v2 .product-line-v6{
    grid-template-columns:3px 20px minmax(0,1fr) 74px !important;
    grid-template-areas:
      "accent check info stock"
      "accent check actions stock" !important;
    column-gap:7px !important;
    row-gap:3px !important;
    min-height:62px !important;
    padding:8px 9px !important;
    margin:6px 10px !important;
  }

  .products-v2 .product-line-accent{
    min-height:46px !important;
  }

  .products-v2 .product-line-name{
    margin-bottom:3px !important;
    font-size:12.5px !important;
    line-height:1.3 !important;
  }

  .products-v2 .product-line-meta{
    gap:2px 6px !important;
    font-size:8.5px !important;
    line-height:1.25 !important;
  }

  .products-v2 .product-line-stock{
    align-self:center !important;
    width:74px !important;
    padding:6px 4px !important;
  }

  .products-v2 .product-line-stock strong{
    font-size:18px !important;
  }

  .products-v2 .product-line-stock small{
    font-size:7.5px !important;
  }

  .products-v2 .product-line-actions{
    justify-content:flex-start !important;
    width:auto !important;
    gap:8px !important;
    padding:0 !important;
    border-top:0 !important;
  }

  .products-v2 .product-line-actions .btn{
    min-height:0 !important;
    padding:1px 2px !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:8.5px !important;
  }

  .products-v2 .product-line-actions .btn:hover{
    background:transparent !important;
  }
}

/* =========================================================
   Users V1 — Team & Permissions
   KashfHesab UI
   2026-09-24
   ========================================================= */

.users-v1{
  max-width:1180px;
  margin-inline:auto;
}

.users-v1 .users-page-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
  padding:4px 2px;
}

.users-v1 .users-page-head > div{
  min-width:0;
}

.users-v1 .users-eyebrow{
  display:inline-block;
  margin-bottom:5px;
  color:#2563eb;
  font-size:11px;
  font-weight:800;
}

.users-v1 .users-page-head h2{
  margin:0;
  color:#172b4d;
  font-size:25px;
  font-weight:900;
  line-height:1.25;
}

.users-v1 .users-page-head p{
  margin:7px 0 0;
  color:#64748b;
  font-size:12px;
  line-height:1.6;
}

.users-v1 .users-add-btn{
  flex:0 0 auto;
  min-height:42px;
  padding:9px 16px;
  border-radius:11px;
  font-size:12px;
  font-weight:800;
}

.users-v1 .users-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:14px;
}

.users-v1 .users-stat-card{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  min-height:86px;
  padding:14px;
  border:1px solid #e3eaf3;
  border-radius:15px;
  background:#fff;
  box-shadow:0 3px 12px rgba(15,23,42,.035);
}

.users-v1 .users-stat-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  flex:0 0 44px;
  border-radius:12px;
  background:#eff6ff;
  color:#2563eb;
  font-size:19px;
  font-weight:900;
}

.users-v1 .users-stat-card > div{
  min-width:0;
}

.users-v1 .users-stat-card small{
  display:block;
  margin-bottom:5px;
  color:#64748b;
  font-size:10px;
  font-weight:700;
  line-height:1.3;
}

.users-v1 .users-stat-card strong{
  display:block;
  color:#172b4d;
  font-size:22px;
  font-weight:900;
  line-height:1;
  font-variant-numeric:tabular-nums;
}

.users-v1 .users-stat-card.is-active .users-stat-icon{
  background:#ecfdf3;
  color:#15803d;
}

.users-v1 .users-stat-card.is-disabled .users-stat-icon{
  background:#f8fafc;
  color:#64748b;
}

.users-v1 .users-stat-card.is-admin .users-stat-icon{
  background:#f5f3ff;
  color:#6d28d9;
}

.users-v1 .users-role-note{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:16px;
  padding:10px 12px;
  border:1px solid #e4eaf2;
  border-radius:12px;
  background:#f8fafc;
  color:#64748b;
  font-size:10px;
}

.users-v1 .users-role-note strong{
  margin-inline-end:3px;
  color:#334155;
  font-size:10.5px;
}

.users-v1 .users-role-note span{
  padding:4px 8px;
  border:1px solid #e2e8f0;
  border-radius:999px;
  background:#fff;
  white-space:nowrap;
}

.users-v1 .users-list-gate{
  max-width:none !important;
}

.users-v1 .users-list-panel{
  padding:14px !important;
  border-radius:16px;
}

@media (max-width:899px){
  .users-v1 .users-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:640px){

  .users-v1 .users-page-head{
    align-items:flex-start;
    gap:10px;
    margin-bottom:14px;
  }

  .users-v1 .users-page-head h2{
    font-size:20px;
  }

  .users-v1 .users-page-head p{
    margin-top:5px;
    font-size:10px;
  }

  .users-v1 .users-eyebrow{
    font-size:9px;
  }

  .users-v1 .users-add-btn{
    min-height:36px;
    padding:7px 10px;
    border-radius:9px;
    font-size:10px;
    white-space:nowrap;
  }

  .users-v1 .users-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin-bottom:10px;
  }

  .users-v1 .users-stat-card{
    min-height:72px;
    padding:10px;
    gap:8px;
    border-radius:12px;
  }

  .users-v1 .users-stat-icon{
    width:36px;
    height:36px;
    flex-basis:36px;
    border-radius:10px;
    font-size:16px;
  }

  .users-v1 .users-stat-card small{
    margin-bottom:4px;
    font-size:8.5px;
  }

  .users-v1 .users-stat-card strong{
    font-size:18px;
  }

  .users-v1 .users-role-note{
    gap:5px;
    margin-bottom:12px;
    padding:8px;
    font-size:8.5px;
  }

  .users-v1 .users-role-note strong{
    width:100%;
    font-size:9px;
  }

  .users-v1 .users-role-note span{
    padding:3px 6px;
  }

  .users-v1 .users-list-panel{
    padding:8px !important;
    border-radius:13px;
  }
}

@media (max-width:380px){
  .users-v1 .users-page-head h2{
    font-size:18px;
  }

  .users-v1 .users-page-head p{
    display:none;
  }

  .users-v1 .users-stat-card{
    padding:8px;
  }

  .users-v1 .users-stat-icon{
    width:32px;
    height:32px;
    flex-basis:32px;
    font-size:14px;
  }

  .users-v1 .users-stat-card strong{
    font-size:17px;
  }
}


/* =========================================================
   Users V1.1 — Employee Cards
   2026-09-24
   ========================================================= */

.users-v1 .user-card-v1{
  position:relative;
  display:grid;
  grid-template-columns:4px 46px minmax(0,1fr) auto;
  grid-template-areas:"accent avatar info actions";
  align-items:center;
  gap:12px;
  min-height:76px;
  margin:8px 0;
  padding:11px 13px;
  overflow:hidden;
  border:1px solid #e3eaf3;
  border-radius:13px;
  background:#fff;
  box-shadow:0 2px 8px rgba(15,23,42,.025);
  transition:.16s ease;
}

.users-v1 .user-card-v1:hover{
  border-color:#cbd9eb;
  box-shadow:0 6px 18px rgba(15,23,42,.055);
  transform:translateY(-1px);
}

.users-v1 .user-card-accent{
  grid-area:accent;
  width:4px;
  height:100%;
  min-height:48px;
  border-radius:999px;
  background:linear-gradient(180deg,#2563eb,#60a5fa);
}

.users-v1 .user-card-v1.is-disabled .user-card-accent{
  background:#cbd5e1;
}

.users-v1 .user-card-v1.is-owner .user-card-accent{
  background:linear-gradient(180deg,#d97706,#fbbf24);
}

.users-v1 .user-avatar-v1{
  grid-area:avatar;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border:1px solid #dbeafe;
  border-radius:12px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:17px;
  font-weight:900;
  text-transform:uppercase;
}

.users-v1 .user-card-v1.is-owner .user-avatar-v1{
  border-color:#fde68a;
  background:#fffbeb;
  color:#b45309;
}

.users-v1 .user-card-v1.is-disabled .user-avatar-v1{
  border-color:#e2e8f0;
  background:#f8fafc;
  color:#94a3b8;
}

.users-v1 .user-card-info{
  grid-area:info;
  min-width:0;
}

.users-v1 .user-card-title{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
  margin-bottom:6px;
}

.users-v1 .user-card-title > strong{
  max-width:100%;
  overflow:hidden;
  color:#172b4d;
  font-size:14px;
  font-weight:900;
  line-height:1.3;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.users-v1 .user-owner-badge{
  display:inline-flex;
  align-items:center;
  padding:3px 7px;
  border:1px solid #fde68a;
  border-radius:999px;
  background:#fffbeb;
  color:#92400e;
  font-size:8.5px;
  font-weight:800;
  white-space:nowrap;
}

.users-v1 .user-status-badge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px 7px;
  border-radius:999px;
  font-size:8.5px;
  font-weight:800;
  white-space:nowrap;
}

.users-v1 .user-status-badge i{
  display:block;
  width:5px;
  height:5px;
  border-radius:50%;
}

.users-v1 .user-status-badge.is-active{
  background:#ecfdf3;
  color:#15803d;
}

.users-v1 .user-status-badge.is-active i{
  background:#22c55e;
}

.users-v1 .user-status-badge.is-disabled{
  background:#f1f5f9;
  color:#64748b;
}

.users-v1 .user-status-badge.is-disabled i{
  background:#94a3b8;
}

.users-v1 .user-card-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px 10px;
  min-width:0;
  color:#64748b;
  font-size:10px;
  line-height:1.4;
}

.users-v1 .user-card-meta > span{
  white-space:nowrap;
}

.users-v1 .user-role-badge{
  padding:3px 7px;
  border:1px solid #e2e8f0;
  border-radius:7px;
  background:#f8fafc;
  color:#475569;
  font-weight:700;
}

.users-v1 .user-card-actions{
  grid-area:actions;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
}

.users-v1 .user-card-actions form{
  margin:0;
}

.users-v1 .user-card-actions .btn{
  min-height:32px;
  padding:5px 8px;
  border-radius:8px;
  font-size:10px;
  white-space:nowrap;
}

.users-v1 .user-toggle-btn.danger{
  color:#b91c1c;
}

.users-v1 .user-toggle-btn.success{
  color:#15803d;
}

.users-v1 .user-locked-note{
  display:inline-flex;
  align-items:center;
  padding:6px 9px;
  border:1px solid #fde68a;
  border-radius:8px;
  background:#fffbeb;
  color:#92400e;
  font-size:9px;
  font-weight:700;
  white-space:nowrap;
}

/* Tablet */
@media (max-width:899px){

  .users-v1 .user-card-v1{
    grid-template-columns:4px 42px minmax(0,1fr);
    grid-template-areas:
      "accent avatar info"
      "accent avatar actions";
    row-gap:6px;
  }

  .users-v1 .user-card-actions{
    justify-content:flex-start;
  }
}

/* Mobile */
@media (max-width:640px){

  .users-v1 .user-card-v1{
    grid-template-columns:3px 38px minmax(0,1fr);
    grid-template-areas:
      "accent avatar info"
      "accent avatar actions";
    column-gap:8px;
    row-gap:4px;
    min-height:68px;
    margin:6px 0;
    padding:8px 9px;
    border-radius:11px;
  }

  .users-v1 .user-card-accent{
    width:3px;
    min-height:46px;
  }

  .users-v1 .user-avatar-v1{
    width:36px;
    height:36px;
    border-radius:10px;
    font-size:14px;
  }

  .users-v1 .user-card-title{
    gap:4px;
    margin-bottom:3px;
  }

  .users-v1 .user-card-title > strong{
    font-size:12px;
  }

  .users-v1 .user-owner-badge,
  .users-v1 .user-status-badge{
    padding:2px 5px;
    font-size:7.5px;
  }

  .users-v1 .user-card-meta{
    gap:3px 6px;
    font-size:8.5px;
    line-height:1.3;
  }

  .users-v1 .user-role-badge{
    padding:2px 5px;
  }

  .users-v1 .user-card-actions{
    gap:7px;
    justify-content:flex-start;
  }

  .users-v1 .user-card-actions .btn{
    min-height:0;
    padding:2px 3px;
    border:0;
    background:transparent;
    box-shadow:none;
    font-size:8.5px;
  }

  .users-v1 .user-card-actions .btn:hover{
    background:transparent;
  }

  .users-v1 .user-locked-note{
    padding:3px 5px;
    font-size:8px;
  }
}

@media (max-width:380px){

  .users-v1 .user-card-v1{
    grid-template-columns:3px 34px minmax(0,1fr);
    column-gap:6px;
    padding:7px;
  }

  .users-v1 .user-avatar-v1{
    width:32px;
    height:32px;
    font-size:12px;
  }

  .users-v1 .user-card-title > strong{
    font-size:11.5px;
  }

  .users-v1 .user-card-meta{
    font-size:8px;
  }
}


/* =========================================================
   Users V1.2 — Mobile layout fix
   2026-09-24
   ========================================================= */

@media (max-width:640px){

  .users-v1{
    width:100%;
  }

  .users-v1 .users-list-panel{
    padding:6px !important;
  }

  .users-v1 .user-card-v1{
    display:grid;
    grid-template-columns:3px 38px minmax(0,1fr);
    grid-template-areas:
      "accent avatar info"
      "accent . actions";
    align-items:start;
    column-gap:8px;
    row-gap:7px;
    min-height:auto;
    margin:7px 0;
    padding:10px 9px 9px;
  }

  .users-v1 .user-card-accent{
    grid-area:accent;
    align-self:stretch;
    height:auto;
    min-height:58px;
  }

  .users-v1 .user-avatar-v1{
    grid-area:avatar;
    width:36px;
    height:36px;
    margin-top:1px;
  }

  .users-v1 .user-card-info{
    grid-area:info;
    width:100%;
    min-width:0;
  }

  .users-v1 .user-card-title{
    display:flex;
    align-items:center;
    gap:5px;
    margin:0 0 5px;
  }

  .users-v1 .user-card-title > strong{
    font-size:12px;
    line-height:1.3;
  }

  .users-v1 .user-owner-badge,
  .users-v1 .user-status-badge{
    flex:0 0 auto;
    padding:2px 5px;
    font-size:7.5px;
  }

  .users-v1 .user-card-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:4px 7px;
    width:100%;
    font-size:8.5px;
  }

  .users-v1 .user-role-badge{
    padding:2px 6px;
  }

  .users-v1 .user-card-actions{
    grid-area:actions;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:11px;
    width:100%;
    min-width:0;
    padding-top:5px;
    border-top:1px solid #eef2f7;
  }

  .users-v1 .user-card-actions form{
    display:inline-flex;
    margin:0;
  }

  .users-v1 .user-card-actions .btn{
    display:inline-flex;
    align-items:center;
    width:auto;
    min-width:0;
    min-height:20px;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
    font-size:8.5px;
    line-height:20px;
    white-space:nowrap;
  }

  .users-v1 .user-locked-note{
    padding:2px 0;
    border:0;
    background:transparent;
    font-size:8.5px;
  }


  /* Header on mobile */
  .users-v1 .users-page-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:8px;
  }

  .users-v1 .users-page-head h2{
    font-size:18px;
  }

  .users-v1 .users-page-head p{
    max-width:220px;
    font-size:9px;
  }

  .users-v1 .users-add-btn{
    min-height:34px;
    padding:6px 9px;
    font-size:9px;
  }


  /* Statistics */
  .users-v1 .users-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
  }

  .users-v1 .users-stat-card{
    min-height:62px;
    padding:8px;
    gap:7px;
  }

  .users-v1 .users-stat-icon{
    width:32px;
    height:32px;
    flex-basis:32px;
    font-size:14px;
  }

  .users-v1 .users-stat-card small{
    font-size:8px;
  }

  .users-v1 .users-stat-card strong{
    font-size:17px;
  }


  /* Access levels */
  .users-v1 .users-role-note{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px;
  }

  .users-v1 .users-role-note strong{
    grid-column:1 / -1;
    width:auto;
  }

  .users-v1 .users-role-note span{
    overflow:hidden;
    padding:4px 5px;
    font-size:8px;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
}

@media (max-width:380px){

  .users-v1 .user-card-v1{
    grid-template-columns:3px 34px minmax(0,1fr);
    column-gap:7px;
    padding:9px 7px 8px;
  }

  .users-v1 .user-avatar-v1{
    width:32px;
    height:32px;
  }

  .users-v1 .user-card-actions{
    gap:8px;
  }

  .users-v1 .user-card-actions .btn{
    font-size:8px;
  }
}


/* =========================================================
   Users V1.3 — Mobile one-row employee cards
   2026-09-24
   ========================================================= */

@media (max-width:640px){

  .users-v1 .users-list-panel{
    padding:6px !important;
  }

  .users-v1 .user-card-v1{
    display:grid;
    grid-template-columns:3px 34px minmax(0,1fr) auto;
    grid-template-areas:"accent avatar info actions";
    align-items:center;
    column-gap:7px;
    row-gap:0;

    width:100%;
    min-height:58px;
    margin:6px 0;
    padding:7px 8px;

    border:1px solid #dfe7f1;
    border-radius:11px;
    background:#fff;
    box-sizing:border-box;
  }

  .users-v1 .user-card-accent{
    grid-area:accent;
    align-self:stretch;
    width:3px;
    height:auto;
    min-height:42px;
  }

  .users-v1 .user-avatar-v1{
    grid-area:avatar;
    width:32px;
    height:32px;
    margin:0;
    border-radius:9px;
    font-size:12px;
  }

  .users-v1 .user-card-info{
    grid-area:info;
    min-width:0;
    width:auto;
  }

  .users-v1 .user-card-title{
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
    gap:4px;
    min-width:0;
    margin:0 0 3px;
  }

  .users-v1 .user-card-title > strong{
    min-width:0;
    overflow:hidden;
    font-size:11px;
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .users-v1 .user-owner-badge{
    flex:0 0 auto;
    padding:1px 4px;
    font-size:6.8px;
  }

  .users-v1 .user-status-badge{
    flex:0 0 auto;
    gap:3px;
    padding:1px 4px;
    font-size:6.8px;
  }

  .users-v1 .user-status-badge i{
    width:4px;
    height:4px;
  }

  .users-v1 .user-card-meta{
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
    gap:5px;
    min-width:0;
    overflow:hidden;
    font-size:7.5px;
    line-height:1.2;
    white-space:nowrap;
  }

  .users-v1 .user-card-meta > span{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .users-v1 .user-role-badge{
    flex:0 0 auto;
    padding:1px 4px;
    border-radius:5px;
  }

  .users-v1 .user-card-actions{
    grid-area:actions;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:nowrap;
    gap:5px;

    width:auto;
    min-width:0;
    padding:0;
    border:0;
  }

  .users-v1 .user-card-actions form{
    display:flex;
    margin:0;
    padding:0;
  }

  .users-v1 .user-card-actions .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:auto;
    min-width:0;
    min-height:24px;
    margin:0;
    padding:2px 4px;

    border:0;
    border-radius:5px;
    background:#f8fafc;
    box-shadow:none;

    font-size:7.5px;
    line-height:1;
    white-space:nowrap;
  }

  .users-v1 .user-card-actions .btn:hover{
    background:#f1f5f9;
  }

  .users-v1 .user-locked-note{
    padding:2px 4px;
    border:0;
    background:#fffbeb;
    font-size:7px;
    white-space:nowrap;
  }
}


/* Very small phones */
@media (max-width:380px){

  .users-v1 .user-card-v1{
    grid-template-columns:3px 30px minmax(0,1fr) auto;
    column-gap:5px;
    padding:6px;
  }

  .users-v1 .user-avatar-v1{
    width:29px;
    height:29px;
    font-size:11px;
  }

  .users-v1 .user-card-actions{
    gap:3px;
  }

  .users-v1 .user-card-actions .btn{
    padding:2px 3px;
    font-size:7px;
  }

  .users-v1 .user-card-meta{
    font-size:7px;
  }
}


/* =========================================================
   Sales Reps V1 — KashfHesab
   2026-09-24
   ========================================================= */

.sales-reps-v1{
  max-width:1180px;
  margin-inline:auto;
}

.sales-reps-v1 .reps-page-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
  padding:4px 2px;
}

.sales-reps-v1 .reps-page-head > div{
  min-width:0;
}

.sales-reps-v1 .reps-eyebrow{
  display:inline-block;
  margin-bottom:5px;
  color:#2563eb;
  font-size:11px;
  font-weight:800;
}

.sales-reps-v1 .reps-page-head h2{
  margin:0;
  color:#172b4d;
  font-size:25px;
  font-weight:900;
  line-height:1.25;
}

.sales-reps-v1 .reps-page-head p{
  margin:7px 0 0;
  color:#64748b;
  font-size:12px;
  line-height:1.6;
}

.sales-reps-v1 .reps-add-btn{
  flex:0 0 auto;
  min-height:42px;
  padding:9px 16px;
  border-radius:11px;
  font-size:12px;
  font-weight:800;
}

/* Statistics */

.sales-reps-v1 .reps-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-bottom:16px;
}

.sales-reps-v1 .reps-stat-card{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  min-height:86px;
  padding:14px;
  border:1px solid #e3eaf3;
  border-radius:15px;
  background:#fff;
  box-shadow:0 3px 12px rgba(15,23,42,.035);
}

.sales-reps-v1 .reps-stat-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  flex:0 0 44px;
  border-radius:12px;
  background:#eff6ff;
  color:#2563eb;
  font-size:19px;
  font-weight:900;
}

.sales-reps-v1 .reps-stat-card.is-customers .reps-stat-icon{
  background:#f5f3ff;
  color:#6d28d9;
}

.sales-reps-v1 .reps-stat-card.is-active .reps-stat-icon{
  background:#ecfdf3;
  color:#15803d;
}

.sales-reps-v1 .reps-stat-card small{
  display:block;
  margin-bottom:5px;
  color:#64748b;
  font-size:10px;
  font-weight:700;
}

.sales-reps-v1 .reps-stat-card strong{
  display:block;
  color:#172b4d;
  font-size:22px;
  font-weight:900;
  line-height:1;
  font-variant-numeric:tabular-nums;
}

/* List */

.sales-reps-v1 .reps-list-panel{
  padding:14px !important;
  border-radius:16px;
}

.sales-reps-v1 .reps-list-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:2px 2px 10px;
  margin-bottom:2px;
  border-bottom:1px solid #eef2f7;
}

.sales-reps-v1 .reps-list-head > div{
  display:flex;
  align-items:center;
  gap:8px;
}

.sales-reps-v1 .reps-list-head strong{
  color:#172b4d;
  font-size:13px;
  font-weight:900;
}

.sales-reps-v1 .reps-list-head span{
  padding:3px 7px;
  border-radius:999px;
  background:#f1f5f9;
  color:#64748b;
  font-size:9px;
  font-weight:700;
}

/* Representative card */

.sales-reps-v1 .rep-card-v1{
  position:relative;
  display:grid;
  grid-template-columns:4px 46px minmax(0,1fr) auto;
  grid-template-areas:"accent avatar info actions";
  align-items:center;
  gap:12px;
  min-height:76px;
  margin:8px 0;
  padding:11px 13px;
  overflow:hidden;
  border:1px solid #e3eaf3;
  border-radius:13px;
  background:#fff;
  box-shadow:0 2px 8px rgba(15,23,42,.025);
  transition:.16s ease;
}

.sales-reps-v1 .rep-card-v1:hover{
  border-color:#cbd9eb;
  box-shadow:0 6px 18px rgba(15,23,42,.055);
  transform:translateY(-1px);
}

.sales-reps-v1 .rep-card-accent{
  grid-area:accent;
  align-self:stretch;
  width:4px;
  min-height:48px;
  border-radius:999px;
  background:linear-gradient(180deg,#2563eb,#60a5fa);
}

.sales-reps-v1 .rep-avatar-v1{
  grid-area:avatar;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border:1px solid #dbeafe;
  border-radius:12px;
  background:#eff6ff;
  font-size:17px;
}

.sales-reps-v1 .rep-card-info{
  grid-area:info;
  min-width:0;
}

.sales-reps-v1 .rep-card-title{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
  margin-bottom:6px;
}

.sales-reps-v1 .rep-card-title > strong{
  max-width:100%;
  overflow:hidden;
  color:#172b4d;
  font-size:14px;
  font-weight:900;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.sales-reps-v1 .rep-status-badge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:3px 7px;
  border-radius:999px;
  font-size:8.5px;
  font-weight:800;
  white-space:nowrap;
}

.sales-reps-v1 .rep-status-badge i{
  width:5px;
  height:5px;
  border-radius:50%;
}

.sales-reps-v1 .rep-status-badge.has-customers{
  background:#ecfdf3;
  color:#15803d;
}

.sales-reps-v1 .rep-status-badge.has-customers i{
  background:#22c55e;
}

.sales-reps-v1 .rep-status-badge.no-customers{
  background:#f8fafc;
  color:#64748b;
}

.sales-reps-v1 .rep-status-badge.no-customers i{
  background:#94a3b8;
}

.sales-reps-v1 .rep-card-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px 10px;
  color:#64748b;
  font-size:10px;
}

.sales-reps-v1 .rep-customer-count,
.sales-reps-v1 .rep-code{
  padding:3px 7px;
  border:1px solid #e2e8f0;
  border-radius:7px;
  background:#f8fafc;
  white-space:nowrap;
}

.sales-reps-v1 .rep-card-actions{
  grid-area:actions;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
}

.sales-reps-v1 .rep-card-actions .btn{
  min-height:32px;
  padding:5px 8px;
  border-radius:8px;
  font-size:10px;
  white-space:nowrap;
}

/* Tablet */

@media (max-width:899px){

  .sales-reps-v1 .reps-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .sales-reps-v1 .rep-card-v1{
    grid-template-columns:4px 42px minmax(0,1fr);
    grid-template-areas:
      "accent avatar info"
      "accent avatar actions";
    row-gap:6px;
  }

  .sales-reps-v1 .rep-card-actions{
    justify-content:flex-start;
  }
}

/* Mobile — one representative per compact card */

@media (max-width:640px){

  .sales-reps-v1 .reps-page-head{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:8px;
    margin-bottom:14px;
  }

  .sales-reps-v1 .reps-eyebrow{
    font-size:9px;
  }

  .sales-reps-v1 .reps-page-head h2{
    font-size:18px;
  }

  .sales-reps-v1 .reps-page-head p{
    max-width:210px;
    margin-top:5px;
    font-size:9px;
  }

  .sales-reps-v1 .reps-add-btn{
    min-height:34px;
    padding:6px 9px;
    border-radius:9px;
    font-size:9px;
    white-space:nowrap;
  }

  .sales-reps-v1 .reps-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
    margin-bottom:10px;
  }

  .sales-reps-v1 .reps-stat-card{
    display:block;
    min-height:70px;
    padding:8px 5px;
    text-align:center;
    border-radius:11px;
  }

  .sales-reps-v1 .reps-stat-icon{
    width:28px;
    height:28px;
    margin:0 auto 5px;
    font-size:12px;
    border-radius:8px;
  }

  .sales-reps-v1 .reps-stat-card small{
    overflow:hidden;
    margin-bottom:3px;
    font-size:7px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .sales-reps-v1 .reps-stat-card strong{
    font-size:16px;
  }

  .sales-reps-v1 .reps-list-panel{
    padding:6px !important;
    border-radius:12px;
  }

  .sales-reps-v1 .reps-list-head{
    padding:4px 3px 7px;
  }

  .sales-reps-v1 .reps-list-head strong{
    font-size:10px;
  }

  .sales-reps-v1 .reps-list-head span{
    font-size:7px;
  }

  .sales-reps-v1 .rep-card-v1{
    display:grid;
    grid-template-columns:3px 32px minmax(0,1fr) auto;
    grid-template-areas:"accent avatar info actions";
    align-items:center;
    column-gap:6px;
    row-gap:0;
    width:100%;
    min-height:58px;
    margin:6px 0;
    padding:7px;
    box-sizing:border-box;
    border-radius:11px;
  }

  .sales-reps-v1 .rep-card-accent{
    width:3px;
    min-height:42px;
  }

  .sales-reps-v1 .rep-avatar-v1{
    width:30px;
    height:30px;
    border-radius:9px;
    font-size:12px;
  }

  .sales-reps-v1 .rep-card-title{
    flex-wrap:nowrap;
    gap:4px;
    margin-bottom:3px;
  }

  .sales-reps-v1 .rep-card-title > strong{
    min-width:0;
    font-size:10.5px;
  }

  .sales-reps-v1 .rep-status-badge{
    flex:0 0 auto;
    padding:1px 4px;
    font-size:6.5px;
  }

  .sales-reps-v1 .rep-status-badge i{
    width:4px;
    height:4px;
  }

  .sales-reps-v1 .rep-card-meta{
    flex-wrap:nowrap;
    gap:4px;
    min-width:0;
    overflow:hidden;
    font-size:7px;
  }

  .sales-reps-v1 .rep-customer-count,
  .sales-reps-v1 .rep-code{
    padding:1px 4px;
    border-radius:5px;
  }

  .sales-reps-v1 .rep-card-actions{
    display:flex;
    flex-wrap:nowrap;
    gap:3px;
    width:auto;
    padding:0;
    border:0;
  }

  .sales-reps-v1 .rep-card-actions .btn{
    width:auto;
    min-width:0;
    min-height:24px;
    margin:0;
    padding:2px 3px;
    border:0;
    background:#f8fafc;
    box-shadow:none;
    font-size:7px;
    line-height:1;
    white-space:nowrap;
  }
}

@media (max-width:380px){

  .sales-reps-v1 .rep-card-v1{
    grid-template-columns:3px 29px minmax(0,1fr) auto;
    column-gap:4px;
    padding:6px 5px;
  }

  .sales-reps-v1 .rep-avatar-v1{
    width:27px;
    height:27px;
    font-size:11px;
  }

  .sales-reps-v1 .rep-card-actions{
    gap:2px;
  }

  .sales-reps-v1 .rep-card-actions .btn{
    padding:2px;
    font-size:6.5px;
  }
}


/* =========================================================
   Sales Rep Print View — Topbar spacing fix
   2026-09-24
   ========================================================= */

.topbar:has(.print-rep-back),
.top-bar:has(.print-rep-back),
header:has(.print-rep-back){
  min-height:94px;
}

.topbar:has(.print-rep-back) .nav,
.topbar:has(.print-rep-back) .top-actions,
.top-bar:has(.print-rep-back) .nav,
.top-bar:has(.print-rep-back) .top-actions{
  max-width:48%;
}

.print-rep-back{
  flex:0 0 auto;
  white-space:nowrap;
}

@media (max-width:1100px){
  .topbar:has(.print-rep-back),
  .top-bar:has(.print-rep-back),
  header:has(.print-rep-back){
    min-height:104px;
  }

  .print-rep-back{
    font-size:10px;
  }
}

@media (max-width:640px){
  .topbar:has(.print-rep-back),
  .top-bar:has(.print-rep-back),
  header:has(.print-rep-back){
    height:auto !important;
    min-height:0;
  }

  .topbar:has(.print-rep-back) .nav,
  .topbar:has(.print-rep-back) .top-actions,
  .top-bar:has(.print-rep-back) .nav,
  .top-bar:has(.print-rep-back) .top-actions{
    max-width:100%;
  }

  .print-rep-back{
    min-height:30px;
    padding:5px 8px;
    font-size:8.5px;
  }
}


/* =========================================================
   Sales Rep Print V2 — Actions on separate row
   2026-09-24
   ========================================================= */

/*
   كشف المندوب فقط:
   السطر الأول = اسم الشركة والشعار
   السطر الثاني = جميع أدوات الكشف جهة اليسار
*/
.topbar:has(.print-rep-back){
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  height:auto !important;
  min-height:0 !important;
  padding-bottom:0 !important;
}

/* اسم الشركة يبقى في السطر الأول كاملاً */
.topbar:has(.print-rep-back) .topbar-brand{
  flex:0 0 100% !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}

/* شريط الأدوات ينزل إلى سطر مستقل */
.topbar:has(.print-rep-back) > .topbar-in{
  order:2 !important;
  flex:0 0 100% !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;

  padding:7px 14px 8px !important;
  box-sizing:border-box !important;
}

/* الأدوات نفسها تكون جهة اليسار */
.topbar:has(.print-rep-back) > .topbar-in > .top-actions{
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:wrap !important;
  gap:6px !important;

  margin-inline-start:0 !important;
  margin-inline-end:auto !important;
}

/* صف رجوع / الشاشة الرئيسية يبقى أسفل الشريط */
.topbar:has(.print-rep-back) > .topbar-backrow{
  order:3 !important;
  flex:0 0 100% !important;
  width:100% !important;
  box-sizing:border-box !important;
}

/* منع أي عنصر داخل الأدوات من أخذ عرض غير ضروري */
.topbar:has(.print-rep-back) .print-rep-back{
  flex:0 0 auto !important;
  white-space:nowrap !important;
}


/* الهاتف */
@media (max-width:640px){

  .topbar:has(.print-rep-back) > .topbar-in{
    padding:6px 8px 7px !important;
  }

  .topbar:has(.print-rep-back) > .topbar-in > .top-actions{
    width:100% !important;
    gap:4px !important;
  }

  .topbar:has(.print-rep-back) .print-rep-back{
    font-size:8px !important;
  }
}


/* =========================================================
   Sales Rep Print V3 — Unified blue header
   2026-09-24
   ========================================================= */

.topbar:has(.print-rep-back){
  display:flex !important;
  flex-direction:column !important;
  flex-wrap:nowrap !important;
  align-items:stretch !important;

  height:auto !important;
  min-height:0 !important;
  padding:0 !important;

  overflow:hidden !important;
  background:linear-gradient(110deg,#12355f 0%,#164a83 52%,#246fd2 100%) !important;
}

/* اسم الشركة: السطر الأول */
.topbar:has(.print-rep-back) .topbar-brand{
  order:1 !important;

  width:100% !important;
  max-width:none !important;
  min-height:72px !important;

  margin:0 !important;
  padding:13px 18px !important;
  box-sizing:border-box !important;

  background:transparent !important;
}

/* شريط الأزرار: سطر أزرق مستقل أسفل اسم الشركة */
.topbar:has(.print-rep-back) > .topbar-in{
  order:2 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;

  width:100% !important;
  max-width:none !important;
  min-height:52px !important;

  margin:0 !important;
  padding:8px 16px 10px !important;
  box-sizing:border-box !important;

  border-top:1px solid rgba(255,255,255,.10) !important;
  background:rgba(7,35,70,.24) !important;
}

/* مجموعة الأزرار جهة اليسار */
.topbar:has(.print-rep-back) > .topbar-in > .top-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex-wrap:wrap !important;

  width:auto !important;
  max-width:none !important;
  min-width:0 !important;

  margin:0 auto 0 0 !important;
  gap:7px !important;
}

/* إلغاء السطر الأبيض: لدينا زر العودة للمندوبين */
.topbar:has(.print-rep-back) > .topbar-backrow{
  display:none !important;
}

/* الأزرار تبقى بنفس نمط لوحة التحكم */
.topbar:has(.print-rep-back) > .topbar-in .btn,
.topbar:has(.print-rep-back) > .topbar-in .dd > summary{
  margin:0 !important;
  white-space:nowrap !important;
}

.topbar:has(.print-rep-back) .print-rep-back{
  flex:0 0 auto !important;
}


/* الهاتف */
@media (max-width:640px){

  .topbar:has(.print-rep-back) .topbar-brand{
    min-height:60px !important;
    padding:10px 12px !important;
  }

  .topbar:has(.print-rep-back) > .topbar-in{
    min-height:46px !important;
    padding:6px 8px 8px !important;
  }

  .topbar:has(.print-rep-back) > .topbar-in > .top-actions{
    width:100% !important;
    gap:4px !important;
  }

  .topbar:has(.print-rep-back) .print-rep-back{
    font-size:8px !important;
  }
}


/* =========================================================
   Sales Rep Print V4 — Clean mobile header
   2026-09-24
   ========================================================= */

@media (max-width:640px){

  /* الهيدر الكامل */
  .topbar:has(.print-rep-back){
    display:flex !important;
    flex-direction:column !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    border-radius:0 0 14px 14px !important;
  }

  /* اسم الشركة والشعار */
  .topbar:has(.print-rep-back) .topbar-brand{
    order:1 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    width:100% !important;
    min-height:58px !important;
    margin:0 !important;
    padding:9px 12px !important;
    box-sizing:border-box !important;
  }

  .topbar:has(.print-rep-back) .brand{
    min-width:0 !important;
    flex:1 1 auto !important;
  }

  .topbar:has(.print-rep-back) .brand h1{
    margin:0 !important;
    font-size:12px !important;
    line-height:1.35 !important;
    white-space:normal !important;
  }

  .topbar:has(.print-rep-back) .brand span{
    margin-top:2px !important;
    font-size:7px !important;
  }

  .topbar:has(.print-rep-back) .topbar-logo,
  .topbar:has(.print-rep-back) .mark{
    flex:0 0 auto !important;
    max-width:38px !important;
    max-height:38px !important;
  }


  /* سطر الأدوات */
  .topbar:has(.print-rep-back) > .topbar-in{
    order:2 !important;
    display:block !important;

    width:100% !important;
    min-height:42px !important;
    margin:0 !important;
    padding:5px 7px !important;
    box-sizing:border-box !important;

    overflow:hidden !important;

    border-top:1px solid rgba(255,255,255,.12) !important;
    background:rgba(5,31,64,.30) !important;
  }

  /* جميع الأزرار بسطر أفقي واحد */
  .topbar:has(.print-rep-back) > .topbar-in > .top-actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-start !important;

    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;

    margin:0 !important;
    padding:0 0 2px !important;
    gap:4px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }

  .topbar:has(.print-rep-back) > .topbar-in > .top-actions::-webkit-scrollbar{
    display:none;
  }

  /* كل عنصر يبقى بحجمه ولا ينزل لسطر جديد */
  .topbar:has(.print-rep-back) > .topbar-in > .top-actions > *{
    flex:0 0 auto !important;
    margin:0 !important;
  }

  .topbar:has(.print-rep-back) > .topbar-in .btn,
  .topbar:has(.print-rep-back) > .topbar-in .dd > summary,
  .topbar:has(.print-rep-back) .print-rep-back{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:auto !important;
    min-width:max-content !important;
    min-height:29px !important;

    margin:0 !important;
    padding:4px 7px !important;

    border-radius:7px !important;
    font-size:7.5px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  /* الساعة أصغر */
  .topbar:has(.print-rep-back) .live-clock{
    flex:0 0 auto !important;
    min-width:max-content !important;
    font-size:7px !important;
  }

  /* لا نحتاج صف الرجوع القديم */
  .topbar:has(.print-rep-back) > .topbar-backrow{
    display:none !important;
  }

}


/* الهواتف الضيقة جداً */
@media (max-width:380px){

  .topbar:has(.print-rep-back) .topbar-brand{
    min-height:54px !important;
    padding:8px 9px !important;
  }

  .topbar:has(.print-rep-back) .brand h1{
    font-size:11px !important;
  }

  .topbar:has(.print-rep-back) > .topbar-in{
    padding:5px !important;
  }

  .topbar:has(.print-rep-back) > .topbar-in .btn,
  .topbar:has(.print-rep-back) > .topbar-in .dd > summary,
  .topbar:has(.print-rep-back) .print-rep-back{
    min-height:27px !important;
    padding:3px 6px !important;
    font-size:7px !important;
  }
}


/* =========================================================
   Daily Reports V1
   2026-09-24
   ========================================================= */

.daily-reports-v1{
  display:flex;
  flex-direction:column;
  gap:14px;
}

/* Header */
.daily-page-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:20px 22px;
  background:linear-gradient(135deg,#fff,#f7faff);
  border:1px solid #e4eaf2;
  border-radius:18px;
  box-shadow:0 6px 22px rgba(15,42,70,.05);
}

.daily-page-head > div:first-child{
  min-width:0;
}

.daily-eyebrow{
  display:inline-block;
  margin-bottom:5px;
  color:#2477e8;
  font-size:11px;
  font-weight:800;
}

.daily-page-head h2{
  margin:0;
  color:#12263f;
  font-size:24px;
  line-height:1.25;
}

.daily-page-head p{
  margin:6px 0 0;
  color:#728197;
  font-size:12px;
}

.daily-period-badge{
  flex:0 0 auto;
  min-width:205px;
  padding:10px 14px;
  background:#eef5ff;
  border:1px solid #d9e8ff;
  border-radius:12px;
}

.daily-period-badge span{
  display:block;
  margin-bottom:3px;
  color:#6e7e93;
  font-size:10px;
  font-weight:700;
}

.daily-period-badge strong{
  display:block;
  color:#173b67;
  font-size:12px;
  direction:rtl;
}


/* Filter */
.daily-filter-card{
  padding:14px 16px;
  background:#fff;
  border:1px solid #e5eaf0;
  border-radius:16px;
  box-shadow:0 4px 18px rgba(15,42,70,.04);
}

.daily-filter-form{
  display:flex;
  align-items:flex-end;
  gap:10px;
}

.daily-date-field{
  flex:0 1 190px;
}

.daily-date-field label{
  display:block;
  margin:0 0 5px;
  color:#52657b;
  font-size:10px;
  font-weight:800;
}

.daily-date-field input{
  width:100%;
  height:38px;
  margin:0;
  padding:6px 10px;
  box-sizing:border-box;
  border:1px solid #dbe3ed;
  border-radius:9px;
  background:#fbfcfe;
  font-size:11px;
}

.daily-filter-actions{
  display:flex;
  align-items:center;
  gap:7px;
}

.daily-filter-actions .btn{
  min-height:38px;
  margin:0;
}


/* Summary cards */
.daily-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

.daily-stat{
  position:relative;
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
  padding:15px;
  overflow:hidden;
  background:#fff;
  border:1px solid #e5eaf0;
  border-radius:16px;
  box-shadow:0 4px 16px rgba(15,42,70,.04);
}

.daily-stat:before{
  content:"";
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:3px;
  background:#2477e8;
}

.daily-stat-receipts:before{background:#16a36a}
.daily-stat-cash:before{background:#0f8f78}
.daily-stat-days:before{background:#7b61d1}

.daily-stat-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 38px;
  width:38px;
  height:38px;
  background:#f1f6fd;
  border-radius:11px;
  font-size:18px;
}

.daily-stat-body{
  min-width:0;
}

.daily-stat-body span{
  display:block;
  margin-bottom:3px;
  color:#75849a;
  font-size:10px;
  font-weight:700;
}

.daily-stat-body strong{
  display:block;
  overflow:hidden;
  color:#172d47;
  font-size:17px;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.daily-stat-body strong small{
  font-size:9px;
  font-weight:700;
  color:#8290a2;
}

.daily-stat-body em{
  display:block;
  margin-top:3px;
  color:#8a98a9;
  font-size:9px;
  font-style:normal;
}


/* Other receipts */
.daily-other-receipts{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 14px;
  background:#f7faff;
  border:1px solid #dfe9f7;
  border-radius:12px;
}

.daily-other-receipts div{
  display:flex;
  align-items:center;
  gap:12px;
}

.daily-other-receipts span{
  color:#64768b;
  font-size:10px;
  font-weight:700;
}

.daily-other-receipts strong{
  color:#183e6d;
  font-size:12px;
}

.daily-other-receipts > b{
  padding:4px 8px;
  background:#e8f1ff;
  border-radius:7px;
  color:#2865aa;
  font-size:9px;
}


/* Daily list */
.daily-list-panel{
  overflow:hidden;
  background:#fff;
  border:1px solid #e4e9ef;
  border-radius:17px;
  box-shadow:0 5px 20px rgba(15,42,70,.04);
}

.daily-list-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:15px 18px;
  border-bottom:1px solid #edf0f4;
}

.daily-list-head span{
  display:block;
  margin-bottom:2px;
  color:#77879a;
  font-size:9px;
  font-weight:700;
}

.daily-list-head h3{
  margin:0;
  color:#172d47;
  font-size:16px;
}

.daily-list-count{
  padding:5px 9px;
  background:#eef5ff;
  border-radius:8px;
  color:#2867ad;
  font-size:10px;
  font-weight:800;
}

.daily-day-list{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:10px;
}

.daily-day-card{
  display:grid;
  grid-template-columns:minmax(125px,1.1fr) minmax(150px,1fr) minmax(150px,1fr) auto;
  align-items:center;
  gap:12px;
  padding:11px 13px;
  background:#fbfcfe;
  border:1px solid #e9edf2;
  border-radius:12px;
  transition:.15s ease;
}

.daily-day-card:hover{
  background:#fff;
  border-color:#d9e4f1;
  box-shadow:0 4px 14px rgba(15,42,70,.05);
}

.daily-day-date span,
.daily-day-metric span{
  display:block;
  margin-bottom:2px;
  color:#8794a5;
  font-size:9px;
  font-weight:700;
}

.daily-day-date strong{
  color:#1a334f;
  font-size:12px;
}

.daily-day-metric strong{
  display:block;
  color:#1b3551;
  font-size:13px;
}

.daily-day-sales strong{
  color:#b4573e;
}

.daily-day-receipts strong{
  color:#16815c;
}

.daily-day-metric strong small{
  font-size:8px;
  color:#8997a7;
}

.daily-day-metric em{
  display:block;
  margin-top:2px;
  color:#8a98a8;
  font-size:8.5px;
  font-style:normal;
}

.daily-day-action{
  display:flex;
  justify-content:flex-end;
}

.daily-day-action .btn{
  margin:0;
  white-space:nowrap;
}

.daily-empty{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:180px;
  padding:25px;
  text-align:center;
}

.daily-empty div{
  margin-bottom:7px;
  font-size:28px;
}

.daily-empty strong{
  color:#344b64;
  font-size:13px;
}

.daily-empty span{
  margin-top:4px;
  color:#8795a5;
  font-size:10px;
}


/* =========================================================
   Daily Reports — Mobile
   ========================================================= */

@media (max-width:700px){

  .daily-reports-v1{
    gap:9px;
  }

  .daily-page-head{
    display:block;
    padding:13px 14px;
    border-radius:13px;
  }

  .daily-eyebrow{
    margin-bottom:3px;
    font-size:8px;
  }

  .daily-page-head h2{
    font-size:18px;
  }

  .daily-page-head p{
    margin-top:4px;
    font-size:9px;
    line-height:1.5;
  }

  .daily-period-badge{
    min-width:0;
    margin-top:9px;
    padding:7px 9px;
    border-radius:9px;
  }

  .daily-period-badge span{
    font-size:8px;
  }

  .daily-period-badge strong{
    font-size:9px;
  }


  /* فلتر التاريخ */
  .daily-filter-card{
    padding:9px;
    border-radius:12px;
  }

  .daily-filter-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
  }

  .daily-date-field{
    min-width:0;
  }

  .daily-date-field label{
    margin-bottom:3px;
    font-size:8px;
  }

  .daily-date-field input{
    height:33px;
    padding:4px 6px;
    font-size:9px;
    border-radius:7px;
  }

  .daily-filter-actions{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px;
  }

  .daily-filter-actions .btn{
    width:100%;
    min-height:32px;
    padding:5px 7px;
    font-size:9px;
  }


  /* الإحصائيات 2 × 2 */
  .daily-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
  }

  .daily-stat{
    gap:7px;
    min-height:58px;
    padding:9px;
    border-radius:11px;
  }

  .daily-stat-icon{
    flex-basis:30px;
    width:30px;
    height:30px;
    border-radius:8px;
    font-size:14px;
  }

  .daily-stat-body span{
    margin-bottom:2px;
    font-size:7.5px;
  }

  .daily-stat-body strong{
    font-size:12px;
  }

  .daily-stat-body strong small{
    font-size:7px;
  }

  .daily-stat-body em{
    margin-top:2px;
    font-size:7px;
  }


  .daily-other-receipts{
    padding:8px 9px;
    border-radius:9px;
  }

  .daily-other-receipts div{
    min-width:0;
    gap:6px;
  }

  .daily-other-receipts span{
    font-size:7.5px;
  }

  .daily-other-receipts strong{
    font-size:9px;
  }

  .daily-other-receipts > b{
    flex:0 0 auto;
    padding:3px 6px;
    font-size:7px;
  }


  /* قائمة الأيام */
  .daily-list-panel{
    border-radius:12px;
  }

  .daily-list-head{
    padding:10px 11px;
  }

  .daily-list-head span{
    font-size:7px;
  }

  .daily-list-head h3{
    font-size:12px;
  }

  .daily-list-count{
    padding:4px 7px;
    font-size:8px;
  }

  .daily-day-list{
    gap:6px;
    padding:7px;
  }

  .daily-day-card{
    grid-template-columns:minmax(76px,.9fr) minmax(0,1fr) minmax(0,1fr) auto;
    gap:6px;
    padding:8px;
    border-radius:9px;
  }

  .daily-day-date span,
  .daily-day-metric span{
    margin-bottom:1px;
    font-size:6.5px;
  }

  .daily-day-date strong{
    font-size:8.5px;
    white-space:nowrap;
  }

  .daily-day-metric strong{
    overflow:hidden;
    font-size:9px;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .daily-day-metric strong small{
    font-size:6px;
  }

  .daily-day-metric em{
    margin-top:1px;
    font-size:6.5px;
  }

  .daily-day-action .btn{
    min-height:27px;
    padding:4px 6px;
    font-size:7px;
  }

}


/* Very small phones */
@media (max-width:390px){

  .daily-day-card{
    grid-template-columns:72px minmax(0,1fr) minmax(0,1fr) auto;
    gap:4px;
    padding:7px 6px;
  }

  .daily-day-action .btn{
    padding:3px 5px;
    font-size:6.5px;
  }

}

/* =========================================================
   Daily Reports V2 — Mobile readability
   2026-09-24
   ========================================================= */

@media (max-width:700px){

  .daily-reports-v1{
    gap:12px;
  }

  /* رأس الصفحة */
  .daily-page-head{
    padding:16px;
    border-radius:15px;
  }

  .daily-eyebrow{
    margin-bottom:5px;
    font-size:11px;
    line-height:1.4;
  }

  .daily-page-head h2{
    font-size:22px;
    line-height:1.35;
    font-weight:800;
  }

  .daily-page-head p{
    margin-top:6px;
    font-size:13px;
    line-height:1.65;
  }

  .daily-period-badge{
    margin-top:18px;
    padding:10px 12px;
    border-radius:10px;
  }

  .daily-period-badge span{
    margin-bottom:4px;
    font-size:11px;
  }

  .daily-period-badge strong{
    font-size:13px;
    line-height:1.5;
  }


  /* فلتر التاريخ */
  .daily-filter-card{
    padding:12px;
    border-radius:14px;
  }

  .daily-filter-form{
    gap:9px;
  }

  .daily-date-field label{
    margin-bottom:5px;
    font-size:12px;
  }

  .daily-date-field input{
    height:42px;
    padding:7px 8px;
    font-size:13px;
    border-radius:9px;
  }

  .daily-filter-actions{
    gap:8px;
    margin-top:3px;
  }

  .daily-filter-actions .btn{
    min-height:41px;
    padding:8px 10px;
    font-size:12px;
    font-weight:800;
  }


  /* بطاقات الإحصائيات */
  .daily-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .daily-stat{
    min-height:82px;
    gap:9px;
    padding:12px 10px;
    border-radius:13px;
  }

  .daily-stat-icon{
    flex:0 0 38px;
    width:38px;
    height:38px;
    border-radius:10px;
    font-size:18px;
  }

  .daily-stat-body span{
    margin-bottom:4px;
    font-size:11px;
    line-height:1.3;
  }

  .daily-stat-body strong{
    font-size:16px;
    line-height:1.35;
    font-weight:800;
  }

  .daily-stat-body strong small{
    font-size:10px;
  }

  .daily-stat-body em{
    margin-top:3px;
    font-size:10px;
    line-height:1.35;
  }


  /* المقبوضات الأخرى */
  .daily-other-receipts{
    padding:11px 12px;
    border-radius:11px;
  }

  .daily-other-receipts span{
    font-size:11px;
  }

  .daily-other-receipts strong{
    font-size:13px;
  }

  .daily-other-receipts > b{
    padding:5px 8px;
    font-size:10px;
  }


  /* رأس قائمة الأيام */
  .daily-list-head{
    padding:13px 14px;
  }

  .daily-list-head span{
    margin-bottom:3px;
    font-size:10px;
  }

  .daily-list-head h3{
    font-size:16px;
  }

  .daily-list-count{
    padding:5px 8px;
    font-size:11px;
  }


  /* كل يوم بطاقة مستقلة */
  .daily-day-list{
    gap:10px;
    padding:9px;
  }

  .daily-day-card{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px 12px;
    padding:13px;
    border-radius:12px;
  }

  .daily-day-date{
    grid-column:1 / -1;
    padding-bottom:9px;
    border-bottom:1px solid #edf1f5;
  }

  .daily-day-date span,
  .daily-day-metric span{
    margin-bottom:3px;
    font-size:10px;
  }

  .daily-day-date strong{
    font-size:14px;
    line-height:1.4;
  }

  .daily-day-metric strong{
    overflow:visible;
    font-size:15px;
    line-height:1.4;
    text-overflow:clip;
    white-space:normal;
  }

  .daily-day-metric strong small{
    font-size:10px;
  }

  .daily-day-metric em{
    margin-top:3px;
    font-size:10px;
  }

  .daily-day-action{
    grid-column:1 / -1;
  }

  .daily-day-action .btn{
    width:100%;
    min-height:40px;
    padding:8px 10px;
    border-radius:9px;
    font-size:12px;
    font-weight:800;
  }

}


/* ===== نافذة تفاصيل اليوم على الهاتف ===== */

@media (max-width:640px){

  .daily-detail-scrim{
    padding:7px !important;
  }

  .daily-detail-sheet{
    width:100% !important;
    max-width:none !important;
    max-height:90vh !important;
    border-radius:15px !important;
  }

  .daily-detail-head{
    padding:13px 12px;
  }

  .daily-detail-head span{
    margin-bottom:3px;
    font-size:11px;
  }

  .daily-detail-head h3{
    font-size:16px;
    line-height:1.4;
  }

  .daily-detail-head .btn{
    min-height:35px;
    padding:6px 11px;
    font-size:11px;
    font-weight:800;
  }

  .daily-detail-body{
    max-height:calc(90vh - 64px);
    padding:9px;
  }

  .daily-detail-table{
    min-width:520px;
  }

  .daily-detail-table thead th{
    padding:10px 8px;
    font-size:11px;
  }

  .daily-detail-table tbody td{
    padding:11px 8px;
    font-size:12px;
    line-height:1.5;
  }

  .daily-detail-table td:first-child{
    min-width:190px;
  }

  .daily-detail-table td:first-child a{
    font-size:12px;
    font-weight:800;
  }

  .daily-detail-table td:first-child span{
    font-size:10.5px !important;
  }

  .daily-detail-body > .hint{
    padding:10px;
    margin-top:9px !important;
    font-size:11px;
    line-height:1.7;
  }

}


/* الهواتف الضيقة جداً */
@media (max-width:390px){

  .daily-page-head h2{
    font-size:21px;
  }

  .daily-stats{
    grid-template-columns:1fr;
  }

  .daily-stat{
    min-height:72px;
  }

}

/* =========================================================
   Daily Reports V2.1 — Detail button beside date on mobile
   ========================================================= */

@media (max-width:700px){

  .daily-day-card{
    grid-template-columns:1fr 1fr auto !important;
    align-items:center !important;
    gap:9px 12px !important;
  }

  /* التاريخ أعلى اليمين */
  .daily-day-date{
    grid-column:1 / 3 !important;
    grid-row:1 !important;
    padding:0 !important;
    border-bottom:0 !important;
  }

  /* زر التفصيل أعلى اليسار */
  .daily-day-action{
    grid-column:3 !important;
    grid-row:1 !important;
    align-self:center !important;
    justify-self:end !important;
  }

  .daily-day-action .btn{
    width:auto !important;
    min-width:max-content !important;
    min-height:34px !important;
    padding:6px 9px !important;
    margin:0 !important;
    font-size:11px !important;
    border-radius:8px !important;
  }

  /* خط فاصل تحت التاريخ والزر */
  .daily-day-date:after{
    content:"";
    display:block;
    position:absolute;
  }

  /* المبيعات والمقبوضات في السطر الثاني */
  .daily-day-sales{
    grid-column:1 !important;
    grid-row:2 !important;
    padding-top:9px !important;
    border-top:1px solid #edf1f5 !important;
  }

  .daily-day-receipts{
    grid-column:2 / 4 !important;
    grid-row:2 !important;
    padding-top:9px !important;
    border-top:1px solid #edf1f5 !important;
  }

}

@media (max-width:390px){

  .daily-day-card{
    grid-template-columns:1fr 1fr auto !important;
  }

  .daily-day-action .btn{
    min-height:32px !important;
    padding:5px 7px !important;
    font-size:10px !important;
  }

}

/* =========================================================
   Daily Reports V2.2 — Sales / Receipts / Daily Cash Net
   ========================================================= */

.daily-day-net strong{
  color:#15803d;
}

.daily-day-net.is-negative strong{
  color:#dc2626;
}

.daily-day-net.is-zero strong{
  color:#64748b;
}

.daily-day-net em{
  color:#64748b;
}

/* Mobile: three financial values in one organized row */
@media (max-width:700px){

  .daily-day-card{
    grid-template-columns:repeat(3, minmax(0,1fr)) auto !important;
    gap:9px 8px !important;
  }

  /* التاريخ أعلى البطاقة */
  .daily-day-date{
    grid-column:1 / 4 !important;
    grid-row:1 !important;
  }

  /* زر التفصيل أعلى اليسار */
  .daily-day-action{
    grid-column:4 !important;
    grid-row:1 !important;
  }

  /* الصف المالي */
  .daily-day-sales{
    grid-column:1 !important;
    grid-row:2 !important;
  }

  .daily-day-receipts{
    grid-column:2 !important;
    grid-row:2 !important;
  }

  .daily-day-net{
    grid-column:3 / 5 !important;
    grid-row:2 !important;
  }

  .daily-day-sales,
  .daily-day-receipts,
  .daily-day-net{
    min-width:0 !important;
    padding-top:10px !important;
    border-top:1px solid #edf1f5 !important;
  }

  .daily-day-net{
    padding-inline-start:8px !important;
    border-inline-start:1px solid #edf1f5 !important;
  }

  .daily-day-net > span{
    font-size:11px !important;
    font-weight:700 !important;
  }

  .daily-day-net strong{
    display:block !important;
    margin-top:3px !important;
    font-size:15px !important;
    font-weight:800 !important;
    white-space:nowrap !important;
  }

  .daily-day-net strong small{
    font-size:10px !important;
  }

  .daily-day-net em{
    display:block !important;
    margin-top:3px !important;
    font-size:9.5px !important;
    font-style:normal !important;
    white-space:nowrap !important;
  }
}

/* الهواتف الضيقة جداً */
@media (max-width:390px){

  .daily-day-card{
    gap:8px 6px !important;
  }

  .daily-day-sales strong,
  .daily-day-receipts strong,
  .daily-day-net strong{
    font-size:14px !important;
  }

  .daily-day-sales > span,
  .daily-day-receipts > span,
  .daily-day-net > span{
    font-size:10.5px !important;
  }

  .daily-day-net em{
    font-size:9px !important;
  }
}


/* =========================================================
   Daily Reports V2.4 — Four centered daily financial metrics
   ========================================================= */

@media (max-width:700px){

  .daily-day-card{
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
    gap:0 !important;
  }

  /* التاريخ أعلى اليمين وزر التفصيل أعلى اليسار */
  .daily-day-date{
    grid-column:1 / 4 !important;
    grid-row:1 !important;
    padding-bottom:10px !important;
  }

  .daily-day-action{
    grid-column:4 !important;
    grid-row:1 !important;
    justify-self:end !important;
    align-self:start !important;
    padding-bottom:10px !important;
  }

  /* الأربع خانات المالية */
  .daily-day-sales{
    grid-column:1 !important;
    grid-row:2 !important;
  }

  .daily-day-receipts{
    grid-column:2 !important;
    grid-row:2 !important;
  }

  .daily-day-expenses{
    grid-column:3 !important;
    grid-row:2 !important;
  }

  .daily-day-net{
    grid-column:4 !important;
    grid-row:2 !important;
  }

  .daily-day-sales,
  .daily-day-receipts,
  .daily-day-expenses,
  .daily-day-net{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    text-align:center !important;
    min-width:0 !important;
    padding:11px 3px 4px !important;
    border-top:1px solid #e8edf3 !important;
  }

  /* فواصل عمودية خفيفة */
  .daily-day-receipts,
  .daily-day-expenses,
  .daily-day-net{
    border-inline-start:1px solid #e8edf3 !important;
  }

  .daily-day-sales > span,
  .daily-day-receipts > span,
  .daily-day-expenses > span,
  .daily-day-net > span{
    width:100% !important;
    text-align:center !important;
    font-size:10.5px !important;
    font-weight:750 !important;
    line-height:1.45 !important;
    white-space:nowrap !important;
  }

  .daily-day-sales strong,
  .daily-day-receipts strong,
  .daily-day-expenses strong,
  .daily-day-net strong{
    display:block !important;
    width:100% !important;
    margin-top:5px !important;
    text-align:center !important;
    font-size:14px !important;
    font-weight:800 !important;
    line-height:1.35 !important;
    white-space:nowrap !important;
  }

  .daily-day-sales strong small,
  .daily-day-receipts strong small,
  .daily-day-expenses strong small,
  .daily-day-net strong small{
    font-size:9px !important;
    font-weight:700 !important;
  }

  .daily-day-sales em,
  .daily-day-receipts em,
  .daily-day-expenses em,
  .daily-day-net em{
    display:block !important;
    width:100% !important;
    margin-top:4px !important;
    text-align:center !important;
    font-size:9px !important;
    font-style:normal !important;
    line-height:1.35 !important;
    white-space:nowrap !important;
  }

  /* ألوان توضيحية */
  .daily-day-expenses strong{
    color:#dc2626 !important;
  }

  .daily-day-net.is-positive strong{
    color:#15803d !important;
  }

  .daily-day-net.is-negative strong{
    color:#dc2626 !important;
  }

  .daily-day-net.is-zero strong{
    color:#64748b !important;
  }
}

/* الشاشات الضيقة جداً */
@media (max-width:390px){

  .daily-day-sales,
  .daily-day-receipts,
  .daily-day-expenses,
  .daily-day-net{
    padding-inline:2px !important;
  }

  .daily-day-sales > span,
  .daily-day-receipts > span,
  .daily-day-expenses > span,
  .daily-day-net > span{
    font-size:9.5px !important;
  }

  .daily-day-sales strong,
  .daily-day-receipts strong,
  .daily-day-expenses strong,
  .daily-day-net strong{
    font-size:12.5px !important;
  }

  .daily-day-sales em,
  .daily-day-receipts em,
  .daily-day-expenses em,
  .daily-day-net em{
    font-size:8.5px !important;
  }
}


/* =========================================================
   Users Mobile V2 — Professional individual employee cards
   ========================================================= */

@media (max-width:700px){

  .users-list-panel{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }

  .user-card-v1{
    position:relative !important;
    display:grid !important;
    grid-template-columns:52px minmax(0,1fr) !important;
    gap:10px 12px !important;

    width:100% !important;
    padding:14px 14px 12px !important;
    margin:0 !important;

    background:#fff !important;
    border:1px solid #e4eaf1 !important;
    border-radius:16px !important;
    box-shadow:0 4px 14px rgba(15,23,42,.055) !important;
    overflow:hidden !important;
  }

  /* شريط حالة رفيع */
  .user-card-v1 .user-card-accent{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:4px !important;
    border-radius:0 !important;
    background:#16a34a !important;
  }

  .user-card-v1.is-disabled .user-card-accent{
    background:#94a3b8 !important;
  }

  /* الأفاتار */
  .user-avatar-v1{
    grid-column:1 !important;
    grid-row:1 !important;

    width:50px !important;
    height:50px !important;
    margin:0 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:14px !important;
    font-size:20px !important;
    font-weight:800 !important;
  }

  /* معلومات الموظف */
  .user-card-info{
    grid-column:2 !important;
    grid-row:1 !important;
    min-width:0 !important;
    align-self:center !important;
  }

  .user-card-title{
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:6px !important;
    margin:0 0 7px !important;
  }

  .user-card-title > strong{
    font-size:16px !important;
    line-height:1.35 !important;
    font-weight:800 !important;
    color:#172033 !important;
  }

  .user-status-badge,
  .user-owner-badge{
    min-height:23px !important;
    padding:3px 7px !important;
    border-radius:999px !important;
    font-size:10.5px !important;
    line-height:1.2 !important;
  }

  .user-card-meta{
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:6px 8px !important;
    margin:0 !important;
  }

  .user-card-meta > span{
    font-size:11.5px !important;
    line-height:1.45 !important;
  }

  .user-role-badge{
    min-height:25px !important;
    padding:4px 8px !important;
    border-radius:8px !important;
    font-weight:700 !important;
  }

  /* الإجراءات كسطر مستقل أسفل البطاقة */
  .user-card-actions{
    grid-column:1 / -1 !important;
    grid-row:2 !important;

    display:flex !important;
    align-items:center !important;
    gap:7px !important;

    width:100% !important;
    padding-top:10px !important;
    margin-top:1px !important;
    border-top:1px solid #edf1f5 !important;
    overflow-x:auto !important;
    scrollbar-width:none !important;
  }

  .user-card-actions::-webkit-scrollbar{
    display:none !important;
  }

  .user-card-actions .btn,
  .user-card-actions form{
    flex:0 0 auto !important;
    margin:0 !important;
  }

  .user-card-actions form{
    display:flex !important;
  }

  .user-card-actions .btn{
    width:auto !important;
    min-height:34px !important;
    padding:6px 10px !important;
    border-radius:9px !important;
    font-size:11px !important;
    font-weight:700 !important;
    white-space:nowrap !important;
  }

  .user-locked-note{
    display:flex !important;
    align-items:center !important;
    min-height:34px !important;
    padding:6px 10px !important;
    font-size:11px !important;
    font-weight:700 !important;
  }
}

@media (max-width:390px){

  .user-card-v1{
    grid-template-columns:46px minmax(0,1fr) !important;
    padding:12px 12px 10px !important;
    gap:9px 10px !important;
    border-radius:14px !important;
  }

  .user-avatar-v1{
    width:44px !important;
    height:44px !important;
    border-radius:12px !important;
    font-size:18px !important;
  }

  .user-card-title > strong{
    font-size:15px !important;
  }

  .user-card-meta > span{
    font-size:11px !important;
  }

  .user-card-actions .btn{
    min-height:33px !important;
    padding:6px 9px !important;
    font-size:10.5px !important;
  }
}


/* =========================================================
   Sales Reps Mobile V2 — Professional individual cards
   2026-09-24
   ========================================================= */

@media (max-width:640px){

  .sales-reps-v1 .reps-list-panel{
    padding:8px !important;
    background:#f8fafc;
  }

  .sales-reps-v1 .rep-card-v1{
    grid-template-columns:3px 38px minmax(0,1fr);
    grid-template-areas:
      "accent avatar info"
      "accent actions actions";
    align-items:center;
    column-gap:8px;
    row-gap:8px;
    min-height:92px;
    margin:8px 0;
    padding:10px;
    border:1px solid #dfe7f1;
    border-radius:13px;
    background:#fff;
    box-shadow:0 3px 10px rgba(15,23,42,.04);
  }

  .sales-reps-v1 .rep-card-accent{
    width:3px;
    min-height:68px;
  }

  .sales-reps-v1 .rep-avatar-v1{
    width:36px;
    height:36px;
    border-radius:10px;
    font-size:15px;
  }

  .sales-reps-v1 .rep-card-info{
    min-width:0;
  }

  .sales-reps-v1 .rep-card-title{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:5px;
    margin-bottom:5px;
  }

  .sales-reps-v1 .rep-card-title > strong{
    min-width:0;
    max-width:100%;
    font-size:12px;
    line-height:1.35;
  }

  .sales-reps-v1 .rep-status-badge{
    padding:2px 6px;
    font-size:7.5px;
    line-height:1.4;
  }

  .sales-reps-v1 .rep-status-badge i{
    width:5px;
    height:5px;
  }

  .sales-reps-v1 .rep-card-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:4px;
    overflow:visible;
    font-size:8px;
  }

  .sales-reps-v1 .rep-customer-count,
  .sales-reps-v1 .rep-code{
    padding:2px 5px;
    border-radius:6px;
  }

  .sales-reps-v1 .rep-card-actions{
    grid-area:actions;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:5px;
    width:100%;
    padding-top:7px;
    border-top:1px solid #eef2f7;
  }

  .sales-reps-v1 .rep-card-actions .btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-width:0;
    min-height:30px;
    margin:0;
    padding:5px 3px;
    border:1px solid #e2e8f0;
    border-radius:7px;
    background:#f8fafc;
    box-shadow:none;
    font-size:8px;
    font-weight:800;
    line-height:1.2;
    white-space:nowrap;
  }

  .sales-reps-v1 .rep-card-actions .btn:active{
    background:#eff6ff;
  }
}

@media (max-width:380px){

  .sales-reps-v1 .rep-card-v1{
    grid-template-columns:3px 34px minmax(0,1fr);
    grid-template-areas:
      "accent avatar info"
      "accent actions actions";
    column-gap:6px;
    padding:9px 8px;
  }

  .sales-reps-v1 .rep-avatar-v1{
    width:32px;
    height:32px;
    font-size:13px;
  }

  .sales-reps-v1 .rep-card-title > strong{
    font-size:11px;
  }

  .sales-reps-v1 .rep-card-actions{
    gap:4px;
  }

  .sales-reps-v1 .rep-card-actions .btn{
    min-height:29px;
    padding:4px 2px;
    font-size:7.5px;
  }
}


/* ============================================================
   KashfHesab Dashboard V49
   Modern responsive dashboard foundation
   2026-09-25
   ============================================================ */

.kh49-dashboard{
  --kh49-navy:#071b3a;
  --kh49-blue:#1267e8;
  --kh49-soft:#f4f7fb;
  --kh49-green:#14a66f;
  --kh49-purple:#7157e8;
  --kh49-orange:#ef8d32;
  --kh49-text:#132238;
  --kh49-muted:#748198;
  --kh49-border:#e7ecf3;
  direction:rtl;
}

.kh49-dashboard .kh49-hero{
  position:relative;
  overflow:hidden;
  border-radius:24px;
  padding:26px;
  margin-bottom:18px;
  color:#fff;
  background:
    radial-gradient(circle at 10% 20%,rgba(31,115,255,.40),transparent 34%),
    linear-gradient(135deg,#06172f,#0a2c5c 60%,#0b3f86);
  box-shadow:0 16px 38px rgba(7,27,58,.16);
}

.kh49-dashboard .kh49-hero-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.kh49-dashboard .kh49-welcome{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.kh49-dashboard .kh49-welcome small{
  opacity:.72;
  font-size:13px;
}

.kh49-dashboard .kh49-welcome strong{
  font-size:22px;
  font-weight:800;
}

.kh49-dashboard .kh49-balance{
  margin-top:24px;
}

.kh49-dashboard .kh49-balance-label{
  display:block;
  font-size:13px;
  opacity:.76;
  margin-bottom:5px;
}

.kh49-dashboard .kh49-balance-value{
  display:flex;
  align-items:baseline;
  gap:7px;
  font-size:34px;
  font-weight:900;
  letter-spacing:-1px;
}

.kh49-dashboard .kh49-balance-value small{
  font-size:14px;
  font-weight:700;
  opacity:.78;
}

.kh49-dashboard .kh49-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:18px;
}

.kh49-dashboard .kh49-stat{
  background:#fff;
  border:1px solid var(--kh49-border);
  border-radius:19px;
  padding:17px;
  box-shadow:0 7px 22px rgba(25,45,75,.055);
}

.kh49-dashboard .kh49-stat span{
  display:block;
  color:var(--kh49-muted);
  font-size:12px;
  margin-bottom:7px;
}

.kh49-dashboard .kh49-stat strong{
  color:var(--kh49-text);
  font-size:20px;
  font-weight:850;
}

.kh49-dashboard .kh49-quick-section{
  background:#fff;
  border:1px solid var(--kh49-border);
  border-radius:22px;
  padding:18px;
  margin-bottom:18px;
  box-shadow:0 7px 22px rgba(25,45,75,.05);
}

.kh49-dashboard .kh49-section-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:15px;
}

.kh49-dashboard .kh49-section-title h2{
  margin:0;
  font-size:17px;
  color:var(--kh49-text);
}

.kh49-dashboard .kh49-quick-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.kh49-dashboard .kh49-quick{
  appearance:none;
  border:0;
  border-radius:17px;
  min-height:104px;
  padding:14px 8px;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:10px;
  font:inherit;
  font-weight:800;
  transition:transform .18s ease,box-shadow .18s ease;
}

.kh49-dashboard .kh49-quick:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 20px rgba(20,40,70,.10);
}

.kh49-dashboard .kh49-quick-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:rgba(255,255,255,.82);
  font-size:21px;
}

.kh49-dashboard .kh49-q-sales{
  background:#eaf2ff;
  color:#135fc7;
}

.kh49-dashboard .kh49-q-receipt{
  background:#e9f8f2;
  color:#11825a;
}

.kh49-dashboard .kh49-q-purchase{
  background:#f1edff;
  color:#6247ce;
}

.kh49-dashboard .kh49-q-payment{
  background:#fff1e5;
  color:#c46c1c;
}

.kh49-dashboard .kh49-content-grid{
  display:grid;
  grid-template-columns:minmax(0,1.7fr) minmax(280px,.8fr);
  gap:18px;
  align-items:start;
}

@media(max-width:760px){
  .kh49-dashboard{
    margin-left:-2px;
    margin-right:-2px;
  }

  .kh49-dashboard .kh49-hero{
    border-radius:0 0 28px 28px;
    margin:-1px -14px 16px;
    padding:23px 19px 25px;
  }

  .kh49-dashboard .kh49-welcome strong{
    font-size:19px;
  }

  .kh49-dashboard .kh49-balance{
    margin-top:21px;
  }

  .kh49-dashboard .kh49-balance-value{
    font-size:31px;
  }

  .kh49-dashboard .kh49-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .kh49-dashboard .kh49-stat{
    padding:14px;
    border-radius:17px;
  }

  .kh49-dashboard .kh49-quick-section{
    padding:15px;
    border-radius:20px;
  }

  .kh49-dashboard .kh49-quick-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
  }

  .kh49-dashboard .kh49-quick{
    min-height:88px;
    padding:10px 3px;
    border-radius:15px;
    font-size:11px;
  }

  .kh49-dashboard .kh49-quick-icon{
    width:39px;
    height:39px;
    border-radius:12px;
    font-size:18px;
  }

  .kh49-dashboard .kh49-content-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:390px){
  .kh49-dashboard .kh49-quick{
    font-size:10px;
  }
}



/* KashfHesab V50 HOME SHELL */

body.kh-dashboard-home{
  background:#f3f6fb;
}

body.kh-dashboard-home > .topbar{
  margin-bottom:0;
  border:0;
  box-shadow:none;
  background:linear-gradient(135deg,#061831 0%,#0a3268 100%);
  color:#fff;
}

body.kh-dashboard-home > .topbar .brand h1,
body.kh-dashboard-home > .topbar .brand span{
  color:#fff;
}

body.kh-dashboard-home > .topbar .brand span{
  opacity:.72;
}

body.kh-dashboard-home .kh50-home-wrap{
  max-width:1440px;
}

body.kh-dashboard-home .kh49-dashboard{
  margin-top:20px;
}

/* إخفاء بطاقة الذمم القديمة لأنها أصبحت مكررة */
body.kh-dashboard-home .kh50-home-wrap > .readout{
  display:none !important;
}

body.kh-dashboard-home .kh49-hero{
  min-height:205px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:
    radial-gradient(circle at 15% 0%,rgba(36,128,255,.45),transparent 35%),
    radial-gradient(circle at 90% 100%,rgba(14,93,190,.42),transparent 40%),
    linear-gradient(135deg,#061831 0%,#083069 58%,#0b438e 100%);
}

body.kh-dashboard-home .kh49-hero::after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  border-radius:50%;
  left:-80px;
  bottom:-170px;
  background:rgba(255,255,255,.055);
}

body.kh-dashboard-home .kh49-stat{
  min-height:105px;
  position:relative;
  overflow:hidden;
}

body.kh-dashboard-home .kh49-stat strong{
  font-size:25px;
}

body.kh-dashboard-home .kh49-quick{
  min-height:112px;
}

@media(max-width:760px){

  body.kh-dashboard-home{
    background:#f4f7fb;
  }

  body.kh-dashboard-home > .topbar{
    border-radius:0;
  }

  body.kh-dashboard-home .kh50-home-wrap{
    padding-top:0;
  }

  body.kh-dashboard-home .kh49-dashboard{
    margin-top:0;
  }

  body.kh-dashboard-home .kh49-hero{
    min-height:190px;
    margin-left:-14px;
    margin-right:-14px;
    border-radius:0 0 30px 30px;
    padding-top:25px;
  }

  body.kh-dashboard-home .kh49-stats{
    margin-top:14px;
  }

  body.kh-dashboard-home .kh49-stat{
    min-height:90px;
  }

  body.kh-dashboard-home .kh49-stat strong{
    font-size:21px;
  }

  body.kh-dashboard-home .kh49-quick-section{
    margin-top:4px;
  }

  body.kh-dashboard-home .kh49-quick{
    min-height:94px;
  }
}





cat >> assets/dashboard-v2.css <<'CSS'
cd /home/villvlit/staging.kashfhesab.com

echo "=== V50 CSS ==="
grep -n "KashfHesab V50" assets/dashboard-v2.css

echo "=== CSS VERSION ==="
grep -n "dashboard-v2.css" inc/lib.php | tail -1

echo "=== PHP ==="
php -l admin.php
php -l inc/lib.php


/* KashfHesab V50.1 PROFESSIONAL DASHBOARD */

body.kh-dashboard-home{
  background:#f3f6fa;
}

/* الرئيسية الجديدة لا تحتاج الهيدر القديم */
body.kh-dashboard-home > .topbar{
  display:none !important;
}

body.kh-dashboard-home .kh50-home-wrap{
  width:auto;
  max-width:1500px;
  margin:0 auto;
  padding:28px 30px 45px;
}

.kh50-dashboard{
  direction:rtl;
  display:grid;
  gap:18px;
}

.kh50-hero{
  position:relative;
  overflow:hidden;
  min-height:270px;
  padding:28px 32px;
  border-radius:28px;
  color:#fff;
  box-shadow:0 18px 45px rgba(5,34,76,.16);
  background:
    radial-gradient(circle at 8% 10%,rgba(44,139,255,.34),transparent 27%),
    radial-gradient(circle at 88% 120%,rgba(0,196,255,.18),transparent 34%),
    linear-gradient(135deg,#06162e 0%,#082b5a 52%,#0750a5 100%);
}

.kh50-hero:before{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:50%;
  left:-180px;
  top:-230px;
}

.kh50-hero:after{
  content:"";
  position:absolute;
  width:340px;
  height:340px;
  border-radius:50%;
  background:rgba(255,255,255,.035);
  right:-160px;
  bottom:-240px;
}

.kh50-hero-head,
.kh50-hero-main{
  position:relative;
  z-index:2;
}

.kh50-hero-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.kh50-company{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}

.kh50-company-mark{
  width:48px;
  height:48px;
  flex:0 0 48px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.15);
  font-weight:900;
  letter-spacing:-1px;
}

.kh50-company span{
  display:block;
  font-size:12px;
  color:#a9c7ee;
  margin-bottom:3px;
}

.kh50-company h1{
  margin:0;
  max-width:650px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:18px;
  color:#fff;
}

.kh50-hero-tools{
  display:flex;
  align-items:center;
  gap:10px;
}

.kh50-date{
  padding:9px 13px;
  border-radius:12px;
  background:rgba(255,255,255,.08);
  color:#c7dcf6;
  font-size:12px;
}

.kh50-notify{
  width:40px;
  height:40px;
  padding:0;
  border:1px solid rgba(255,255,255,.13);
  border-radius:12px;
  background:rgba(255,255,255,.09);
  color:#fff;
  cursor:pointer;
}

.kh50-hero-main{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,410px);
  gap:32px;
  align-items:end;
  margin-top:44px;
}

.kh50-eyebrow{
  display:block;
  margin-bottom:7px;
  color:#7fbcff;
  font-size:12px;
  font-weight:800;
}

.kh50-hero-main h2{
  margin:0;
  color:#fff;
  font-size:34px;
  line-height:1.25;
}

.kh50-hero-main p{
  margin:9px 0 0;
  color:#a9c4e5;
  font-size:14px;
}

.kh50-main-balance{
  padding:20px 22px;
  border-radius:21px;
  background:rgba(255,255,255,.105);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(12px);
}

.kh50-main-balance > span{
  display:block;
  color:#c5d8ef;
  font-size:13px;
}

.kh50-main-balance strong{
  display:block;
  margin-top:5px;
  color:#fff;
  font-size:35px;
  line-height:1.2;
  direction:ltr;
  text-align:right;
}

.kh50-main-balance strong small{
  font-size:13px;
  font-weight:700;
  color:#9dc9ff;
}

.kh50-main-balance em{
  display:block;
  margin-top:7px;
  color:#8fbae9;
  font-size:11px;
  font-style:normal;
}

.kh50-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.kh50-kpi{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:118px;
  padding:19px;
  border-radius:21px;
  background:#fff;
  border:1px solid #e8edf5;
  box-shadow:0 9px 28px rgba(15,42,75,.065);
}

.kh50-kpi-icon{
  width:48px;
  height:48px;
  flex:0 0 48px;
  display:grid;
  place-items:center;
  border-radius:15px;
  font-size:21px;
}

.kh50-kpi-customers .kh50-kpi-icon{
  background:#eaf3ff;
}

.kh50-kpi-sales .kh50-kpi-icon{
  background:#eaf9f2;
}

.kh50-kpi-receipts .kh50-kpi-icon{
  background:#fff5df;
}

.kh50-kpi-credit .kh50-kpi-icon{
  background:#f1edff;
}

.kh50-kpi span,
.kh50-kpi small{
  display:block;
  color:#78869a;
}

.kh50-kpi span{
  font-size:12px;
}

.kh50-kpi strong{
  display:block;
  margin:3px 0;
  color:#0c2547;
  font-size:25px;
}

.kh50-kpi small{
  font-size:10px;
}

.kh50-card{
  background:#fff;
  border:1px solid #e7edf5;
  border-radius:24px;
  box-shadow:0 10px 30px rgba(15,42,75,.055);
}

.kh50-actions{
  padding:21px;
}

.kh50-card-title{
  margin-bottom:17px;
}

.kh50-card-title span{
  display:block;
  margin-bottom:2px;
  color:#8a98aa;
  font-size:11px;
}

.kh50-card-title h2{
  margin:0;
  color:#102b4e;
  font-size:18px;
}

.kh50-action-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.kh50-action{
  min-height:115px;
  padding:16px;
  text-align:right;
  border:0;
  border-radius:19px;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease;
}

.kh50-action:hover{
  transform:translateY(-2px);
  box-shadow:0 9px 20px rgba(22,52,88,.09);
}

.kh50-action-icon{
  width:39px;
  height:39px;
  display:grid;
  place-items:center;
  margin-bottom:11px;
  border-radius:12px;
  background:rgba(255,255,255,.75);
  font-size:18px;
}

.kh50-action strong,
.kh50-action small{
  display:block;
}

.kh50-action strong{
  color:#102a48;
  font-size:13px;
}

.kh50-action small{
  margin-top:3px;
  color:#728096;
  font-size:10px;
}

.kh50-action-sales{
  background:#eaf3ff;
}

.kh50-action-receipt{
  background:#e7f8f1;
}

.kh50-action-purchase{
  background:#f2edff;
}

.kh50-action-payment{
  background:#fff0e5;
}


/* ===== Tablet ===== */

@media(max-width:1050px){

  body.kh-dashboard-home .kh50-home-wrap{
    padding:20px;
  }

  .kh50-hero-main{
    grid-template-columns:1fr 330px;
  }

  .kh50-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}


/* ===== Mobile ===== */

@media(max-width:760px){

  body.kh-dashboard-home{
    background:#f4f7fb;
  }

  body.kh-dashboard-home .kh50-home-wrap{
    padding:0 13px 90px;
  }

  .kh50-dashboard{
    gap:14px;
  }

  .kh50-hero{
    min-height:305px;
    margin:0 -13px;
    padding:20px 18px 27px;
    border-radius:0 0 30px 30px;
  }

  .kh50-company-mark{
    width:42px;
    height:42px;
    flex-basis:42px;
    border-radius:13px;
    font-size:12px;
  }

  .kh50-company h1{
    max-width:210px;
    font-size:14px;
  }

  .kh50-company span{
    font-size:10px;
  }

  .kh50-date{
    display:none;
  }

  .kh50-notify{
    width:38px;
    height:38px;
  }

  .kh50-hero-main{
    display:block;
    margin-top:33px;
  }

  .kh50-eyebrow{
    font-size:11px;
  }

  .kh50-hero-main h2{
    font-size:26px;
  }

  .kh50-hero-main p{
    font-size:11px;
  }

  .kh50-main-balance{
    margin-top:21px;
    padding:16px 17px;
  }

  .kh50-main-balance strong{
    font-size:29px;
  }

  .kh50-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }

  .kh50-kpi{
    min-height:101px;
    padding:13px;
    gap:9px;
    border-radius:18px;
  }

  .kh50-kpi-icon{
    width:39px;
    height:39px;
    flex-basis:39px;
    border-radius:12px;
    font-size:17px;
  }

  .kh50-kpi strong{
    font-size:20px;
  }

  .kh50-kpi span{
    font-size:10px;
  }

  .kh50-kpi small{
    font-size:9px;
  }

  .kh50-actions{
    padding:15px;
    border-radius:21px;
  }

  .kh50-card-title{
    margin-bottom:13px;
  }

  .kh50-card-title h2{
    font-size:16px;
  }

  .kh50-action-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
  }

  .kh50-action{
    min-height:92px;
    padding:10px 4px;
    text-align:center;
    border-radius:15px;
  }

  .kh50-action-icon{
    width:38px;
    height:38px;
    margin:0 auto 8px;
  }

  .kh50-action strong{
    font-size:10px;
  }

  .kh50-action small{
    display:none;
  }

}



/* KashfHesab V52 DASHBOARD INSIGHTS */

.kh52-insights{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);
  gap:16px;
}

.kh52-chart-card,
.kh52-recent-card{
  min-width:0;
  padding:21px;
}

.kh52-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin-bottom:18px;
}

.kh52-card-head > div:first-child > span{
  display:block;
  color:#8a98aa;
  font-size:11px;
  margin-bottom:2px;
}

.kh52-card-head h2{
  margin:0;
  color:#102b4e;
  font-size:18px;
}

.kh52-legend{
  display:flex;
  align-items:center;
  gap:13px;
  color:#6f7f94;
  font-size:10px;
}

.kh52-legend span{
  display:flex;
  align-items:center;
  gap:5px;
}

.kh52-legend i{
  width:8px;
  height:8px;
  border-radius:50%;
}

.kh52-legend i.sales{
  background:#2678ed;
}

.kh52-legend i.receipts{
  background:#1eb980;
}

.kh52-week-totals{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-bottom:18px;
}

.kh52-week-totals > div{
  padding:12px 14px;
  border-radius:15px;
  background:#f6f8fb;
}

.kh52-week-totals span{
  display:block;
  color:#7a899d;
  font-size:10px;
}

.kh52-week-totals strong{
  display:inline-block;
  margin-top:3px;
  color:#102b4e;
  font-size:17px;
}

.kh52-week-totals small{
  margin-inline-start:4px;
  color:#8492a5;
  font-size:9px;
}

.kh52-chart{
  height:205px;
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:8px;
  align-items:end;
  padding:14px 5px 0;
  border-top:1px solid #eef2f7;
  background:
    linear-gradient(to bottom,
      transparent 24%,
      #f0f3f7 25%,
      transparent 26%,
      transparent 49%,
      #f0f3f7 50%,
      transparent 51%,
      transparent 74%,
      #f0f3f7 75%,
      transparent 76%);
}

.kh52-day{
  height:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
}

.kh52-bars{
  width:100%;
  height:165px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:4px;
}

.kh52-bar{
  width:min(17px,34%);
  min-height:3px;
  display:block;
  border-radius:7px 7px 3px 3px;
  transition:opacity .2s ease;
}

.kh52-bar:hover{
  opacity:.75;
}

.kh52-bar-sales{
  background:linear-gradient(180deg,#3f91ff,#1765d8);
}

.kh52-bar-receipts{
  background:linear-gradient(180deg,#39d9a2,#16a873);
}

.kh52-day > small{
  margin-top:7px;
  color:#8a98aa;
  font-size:9px;
  direction:ltr;
}

.kh52-view-all{
  padding:7px 10px;
  border-radius:10px;
  color:#1768d7;
  background:#edf5ff;
  font-size:10px;
  font-weight:800;
  text-decoration:none;
}

.kh52-recent-list{
  display:grid;
}

.kh52-recent-row{
  min-width:0;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:11px 2px;
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid #edf1f6;
}

.kh52-recent-row:last-child{
  border-bottom:0;
}

.kh52-recent-row:hover{
  background:#f8faff;
}

.kh52-entry-icon{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:13px;
  font-size:17px;
}

.kh52-entry-icon.invoice{
  background:#eaf3ff;
}

.kh52-entry-icon.receipt{
  background:#e8f8f1;
}

.kh52-entry-icon.purchase{
  background:#f2edff;
}

.kh52-entry-icon.payment{
  background:#fff0e5;
}

.kh52-entry-icon.other{
  background:#f1f3f6;
}

.kh52-entry-main{
  min-width:0;
}

.kh52-entry-main strong{
  display:block;
  overflow:hidden;
  color:#152e4e;
  font-size:11px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.kh52-entry-main strong small{
  color:#8090a4;
  font-size:9px;
  font-weight:600;
}

.kh52-entry-main em{
  display:block;
  overflow:hidden;
  margin-top:3px;
  color:#8795a7;
  font-size:9px;
  font-style:normal;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.kh52-entry-amount{
  color:#15365d;
  font-size:11px;
  font-weight:900;
  direction:ltr;
  white-space:nowrap;
}

.kh52-entry-amount small{
  color:#8a98aa;
  font-size:8px;
  font-weight:600;
}

.kh52-empty{
  padding:35px 10px;
  color:#8a98aa;
  font-size:12px;
  text-align:center;
}


/* mobile navigation hidden on desktop */
.kh52-mobile-nav{
  display:none;
}


@media(max-width:1050px){

  .kh52-insights{
    grid-template-columns:1fr;
  }

}


@media(max-width:760px){

  html{
    scroll-behavior:smooth;
  }

  .kh52-insights{
    display:grid;
    grid-template-columns:1fr;
    gap:13px;
  }

  .kh52-chart-card,
  .kh52-recent-card{
    padding:15px;
    border-radius:21px;
  }

  .kh52-card-head{
    margin-bottom:13px;
  }

  .kh52-card-head h2{
    font-size:16px;
  }

  .kh52-week-totals{
    gap:7px;
  }

  .kh52-week-totals > div{
    padding:10px;
  }

  .kh52-week-totals strong{
    font-size:14px;
  }

  .kh52-chart{
    height:180px;
    gap:4px;
  }

  .kh52-bars{
    height:142px;
  }

  .kh52-bar{
    width:min(13px,38%);
  }

  .kh52-legend{
    gap:8px;
    font-size:9px;
  }

  .kh52-recent-row{
    grid-template-columns:39px minmax(0,1fr) auto;
    gap:8px;
  }

  .kh52-entry-icon{
    width:37px;
    height:37px;
    border-radius:12px;
    font-size:15px;
  }


  /* Bottom navigation */

  .kh52-mobile-nav{
    position:fixed;
    z-index:999;
    right:10px;
    left:10px;
    bottom:9px;
    height:65px;
    display:grid;
    grid-template-columns:1fr 1fr 68px 1fr 1fr;
    align-items:center;
    padding:5px 8px;
    border:1px solid rgba(220,228,239,.9);
    border-radius:21px;
    background:rgba(255,255,255,.96);
    box-shadow:0 15px 40px rgba(10,38,75,.20);
    backdrop-filter:blur(15px);
  }

  .kh52-mobile-nav a{
    height:50px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    color:#8290a3;
    text-decoration:none;
  }

  .kh52-mobile-nav a > span{
    font-size:19px;
    line-height:1;
  }

  .kh52-mobile-nav a small{
    font-size:8px;
    font-weight:700;
  }

  .kh52-mobile-nav a.active{
    color:#1268d8;
  }

  .kh52-nav-add{
    width:52px;
    height:52px;
    justify-self:center;
    display:grid;
    place-items:center;
    padding:0;
    transform:translateY(-13px);
    border:5px solid #f4f7fb;
    border-radius:50%;
    background:linear-gradient(135deg,#1775e8,#0752ad);
    box-shadow:0 8px 20px rgba(17,100,211,.32);
    color:#fff;
  }

  .kh52-nav-add span{
    font-size:28px;
    line-height:1;
  }

}


@media(max-width:390px){

  .kh52-chart-card{
    padding-left:11px;
    padding-right:11px;
  }

  .kh52-chart{
    gap:2px;
  }

  .kh52-day > small{
    font-size:8px;
  }

}



/* =========================================================
   KashfHesab V53.1 QUICK CUSTOMER CHOOSER
   ========================================================= */

.kh531-chooser{
  z-index:10050;
}

.kh531-chooser-sheet{
  width:min(560px,calc(100vw - 28px));
  max-height:min(720px,88vh);
  overflow:hidden;
  border-radius:22px;
}

.kh531-chooser-head{
  padding:18px 20px;
}

.kh531-chooser-head h3{
  margin:0 0 3px;
  font-size:19px;
  font-weight:900;
}

.kh531-chooser-head small{
  color:#64748b;
  font-size:12px;
}

.kh531-search{
  display:flex;
  align-items:center;
  gap:10px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:14px;
  padding:0 14px;
  margin-bottom:14px;
}

.kh531-search span{
  font-size:22px;
  color:#64748b;
}

.kh531-search input{
  width:100%;
  min-width:0;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:13px 0 !important;
  margin:0 !important;
}

.kh531-customer-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  max-height:52vh;
  overflow:auto;
  padding:2px;
}

.kh531-customer{
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  text-align:right;
  border:1px solid #e5e7eb;
  background:#fff;
  border-radius:15px;
  padding:11px 12px;
  cursor:pointer;
  transition:.18s ease;
}

.kh531-customer:hover{
  border-color:#93c5fd;
  transform:translateY(-1px);
  box-shadow:0 7px 20px rgba(15,23,42,.07);
}

.kh531-avatar{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#eaf2ff;
  color:#1d4ed8;
  font-size:18px;
  font-weight:900;
}

.kh531-customer-info{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.kh531-customer-info strong{
  color:#0f172a;
  font-size:14px;
}

.kh531-customer-info small{
  color:#64748b;
  direction:ltr;
  text-align:right;
}

.kh531-arrow{
  color:#94a3b8;
  font-size:25px;
  line-height:1;
}

.kh531-empty{
  padding:25px 12px;
  text-align:center;
  color:#64748b;
  background:#f8fafc;
  border-radius:14px;
}

@media (max-width:640px){

  .kh531-chooser{
    align-items:flex-end;
  }

  .kh531-chooser-sheet{
    width:100%;
    max-height:88vh;
    border-radius:22px 22px 0 0;
  }

  .kh531-customer-list{
    max-height:56vh;
  }

}

/* =========================================================
   KashfHesab V53.2 CUSTOMER PICKER
   ========================================================= */

html.kh532-picker-open,
body.kh532-picker-open{
  overflow:hidden !important;
}

.kh532-overlay{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483000 !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(8,20,42,.62);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  direction:rtl;
}

.kh532-panel{
  position:relative;
  width:min(560px,100%);
  max-height:min(720px,88dvh);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:#fff;
  border-radius:24px;
  box-shadow:0 25px 70px rgba(0,0,0,.28);
  font-family:inherit;
}

.kh532-head{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 20px 14px;
  border-bottom:1px solid #eef2f7;
}

.kh532-heading{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.kh532-heading strong{
  display:block;
  color:#0f172a;
  font-size:19px;
  font-weight:900;
  line-height:1.4;
}

.kh532-heading span{
  color:#64748b;
  font-size:12px;
}

.kh532-close{
  appearance:none;
  -webkit-appearance:none;
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  margin:0;
  padding:0;
  border:0;
  border-radius:12px;
  background:#f1f5f9;
  color:#334155;
  font:700 26px/1 Arial,sans-serif;
  cursor:pointer;
  touch-action:manipulation;
}

.kh532-search{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:9px;
  margin:15px 18px 10px;
  padding:0 13px;
  min-height:48px;
  border:1px solid #dbe3ee;
  border-radius:14px;
  background:#f8fafc;
}

.kh532-search:focus-within{
  border-color:#3b82f6;
  background:#fff;
  box-shadow:0 0 0 3px rgba(59,130,246,.10);
}

.kh532-search-icon{
  flex:0 0 auto;
  color:#64748b;
  font-size:21px;
}

.kh532-search input{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:100% !important;
  min-width:0 !important;
  height:46px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#0f172a !important;
  font-family:inherit !important;
  font-size:16px !important;
  text-align:right !important;
  direction:rtl !important;
}

.kh532-list{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:4px 18px 18px;
}

.kh532-customer{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-height:67px;
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 8px;
  padding:10px 12px;
  border:1px solid #e6ebf2;
  border-radius:15px;
  background:#fff;
  color:#0f172a;
  text-align:right;
  font-family:inherit;
  cursor:pointer;
  touch-action:manipulation;
}

.kh532-customer:hover{
  border-color:#93c5fd;
  background:#f8fbff;
}

.kh532-customer:active{
  transform:scale(.99);
}

.kh532-avatar{
  width:43px;
  height:43px;
  flex:0 0 43px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#eaf2ff;
  color:#1d4ed8;
  font-size:18px;
  font-weight:900;
}

.kh532-info{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
  overflow:hidden;
}

.kh532-info strong{
  display:block;
  overflow:hidden;
  color:#0f172a;
  font-size:14px;
  font-weight:800;
  line-height:1.4;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.kh532-info small{
  display:block;
  overflow:hidden;
  color:#64748b;
  font-size:12px;
  line-height:1.4;
  direction:ltr;
  text-align:right;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.kh532-go{
  flex:0 0 auto;
  color:#94a3b8;
  font-size:25px;
}

.kh532-empty{
  display:none;
  padding:30px 12px;
  color:#64748b;
  text-align:center;
  font-size:14px;
}

/* Prevent old V53.1 picker from ever appearing */
#kh531-customer-chooser{
  display:none !important;
}

/* Mobile */
@media (max-width:640px){

  .kh532-overlay{
    align-items:flex-end;
    padding:0;
  }

  .kh532-panel{
    width:100%;
    max-width:none;
    max-height:88dvh;
    border-radius:24px 24px 0 0;
    padding-bottom:env(safe-area-inset-bottom);
  }

  .kh532-head{
    padding:16px 16px 13px;
  }

  .kh532-search{
    margin:12px 14px 9px;
  }

  .kh532-list{
    padding:3px 14px 16px;
  }

  .kh532-customer{
    min-height:64px;
    padding:9px 10px;
  }

  .kh532-heading strong{
    font-size:17px;
  }
}


/* =========================================================
   KashfHesab V53.4 MOBILE PICKER — keyboard safe
   ========================================================= */

@media (max-width:640px){

  .kh532-overlay{
    align-items:flex-start !important;
    justify-content:center !important;
    padding:
      max(10px, env(safe-area-inset-top))
      0
      0 !important;
    overflow:hidden !important;
  }

  .kh532-panel{
    width:100% !important;
    max-width:none !important;

    /*
     * dvh follows the visible viewport when the mobile
     * keyboard opens, unlike the old fixed viewport.
     */
    height:calc(100dvh - max(10px, env(safe-area-inset-top))) !important;
    max-height:calc(100dvh - max(10px, env(safe-area-inset-top))) !important;

    margin:0 !important;
    border-radius:22px 22px 0 0 !important;

    display:flex !important;
    flex-direction:column !important;

    overflow:hidden !important;
  }

  .kh532-head{
    position:relative !important;
    flex:0 0 auto !important;
    z-index:3;
    background:#fff;
  }

  .kh532-search{
    position:relative !important;
    flex:0 0 auto !important;
    z-index:4;

    margin:10px 14px !important;
    background:#fff !important;
  }

  .kh532-list{
    flex:1 1 auto !important;
    min-height:0 !important;

    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;

    padding:3px 14px
      calc(18px + env(safe-area-inset-bottom)) !important;
  }

}

/* Extra keyboard protection on modern mobile browsers */
@supports (height: 100dvh){

  @media (max-width:640px){

    body.kh532-picker-open{
      position:fixed !important;
      width:100% !important;
      inset:0 !important;
    }

  }

}


/* =========================================================
   KashfHesab V54.1 MOBILE QUICK ACTION SHEET
   ========================================================= */

html.kh541-open,
body.kh541-open{
  overflow:hidden !important;
}

.kh541-overlay{
  position:fixed;
  inset:0;
  z-index:2147482500;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  background:rgba(8,20,42,.58);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  direction:rtl;
}

.kh541-sheet{
  width:min(560px,100%);
  padding:
    9px 16px
    calc(20px + env(safe-area-inset-bottom));
  background:#fff;
  border-radius:25px 25px 0 0;
  box-shadow:0 -18px 55px rgba(15,23,42,.22);
}

.kh541-grab{
  width:44px;
  height:5px;
  margin:0 auto 12px;
  border-radius:999px;
  background:#cbd5e1;
}

.kh541-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}

.kh541-head > div{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.kh541-head strong{
  color:#0f172a;
  font-size:19px;
  font-weight:900;
}

.kh541-head span{
  color:#64748b;
  font-size:12px;
}

.kh541-close{
  appearance:none;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:12px;
  background:#f1f5f9;
  color:#334155;
  font:700 26px/1 Arial,sans-serif;
  cursor:pointer;
  touch-action:manipulation;
}

.kh541-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.kh541-action{
  appearance:none;
  min-width:0;
  min-height:92px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0;
  padding:12px 8px;
  border:1px solid #e5e7eb;
  border-radius:17px;
  background:#fff;
  color:#0f172a;
  font-family:inherit;
  cursor:pointer;
  touch-action:manipulation;
}

.kh541-action:active{
  transform:scale(.98);
}

.kh541-action-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  font-size:20px;
}

.kh541-action strong{
  font-size:13px;
  font-weight:800;
}

.kh541-action.sales .kh541-action-icon{
  background:#eaf2ff;
}

.kh541-action.receipt .kh541-action-icon{
  background:#e9fbf1;
}

.kh541-action.purchase .kh541-action-icon{
  background:#fff4df;
}

.kh541-action.payment .kh541-action-icon{
  background:#f2edff;
}

.kh541-action.customer{
  grid-column:1 / -1;
  min-height:70px;
  flex-direction:row;
}

.kh541-action.customer .kh541-action-icon{
  background:#eef2f7;
}

@media (min-width:769px){
  .kh541-overlay{
    display:none !important;
  }
}


/* =========================================================
   KashfHesab V54.2 MOBILE NAVIGATION
   ========================================================= */

@media (max-width:768px){

  #main-search-input.kh542-focus{
    border-color:#2563eb !important;
    box-shadow:
      0 0 0 4px rgba(37,99,235,.12) !important;
    transition:
      border-color .2s ease,
      box-shadow .2s ease;
  }

  .kh52-mobile-nav a,
  .kh52-mobile-nav button{
    touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }

}


/* =========================================================
   KashfHesab V55 — MOBILE STICKY SAVE BAR
   ========================================================= */

@media (max-width:768px){

  .scrim.kh55-financial-sheet{
    align-items:flex-start !important;
    overflow:hidden !important;
  }

  .scrim.kh55-financial-sheet > .sheet{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;

    width:100% !important;
    max-width:none !important;

    height:var(--kh55-vh,100dvh) !important;
    max-height:var(--kh55-vh,100dvh) !important;

    margin:0 !important;

    border-radius:0 !important;
    overflow:hidden !important;

    padding-top:
      env(safe-area-inset-top) !important;
  }

  .scrim.kh55-financial-sheet .kh55-mobile-bar{
    position:relative !important;
    z-index:100 !important;

    flex:0 0 auto !important;

    min-height:62px;

    display:grid;
    grid-template-columns:
      minmax(70px,auto)
      minmax(0,1fr)
      minmax(82px,auto);

    align-items:center;
    gap:8px;

    padding:8px 12px;

    background:rgba(255,255,255,.98);

    border-bottom:
      1px solid #e5e7eb;

    box-shadow:
      0 4px 16px rgba(15,23,42,.07);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }

  .kh55-title{
    overflow:hidden;
    text-align:center;

    color:#0f172a;

    font-size:16px;
    font-weight:900;

    white-space:nowrap;
    text-overflow:ellipsis;
  }

  .kh55-cancel,
  .kh55-save{
    appearance:none;

    min-height:42px;

    padding:8px 11px;

    border:0;
    border-radius:12px;

    font-family:inherit;
    font-size:14px;
    font-weight:800;

    cursor:pointer;
    touch-action:manipulation;
  }

  .kh55-cancel{
    background:#f1f5f9;
    color:#475569;
  }

  .kh55-save{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;

    background:#1677ff;
    color:#fff;

    box-shadow:
      0 5px 14px rgba(22,119,255,.22);
  }

  .kh55-save span{
    font-size:18px;
    line-height:1;
  }

  .kh55-save:disabled{
    opacity:.65;
  }

  .kh55-save.is-saving{
    pointer-events:none;
  }

  /*
   * Hide old header so we don't have two close/header rows.
   */
  .scrim.kh55-financial-sheet
  > .sheet
  > .sheet-head{
    display:none !important;
  }

  /*
   * Form takes all remaining visible space.
   */
  .scrim.kh55-financial-sheet
  > .sheet
  > form{
    flex:1 1 auto !important;

    min-height:0 !important;

    display:flex !important;
    flex-direction:column !important;

    overflow:hidden !important;
  }

  /*
   * Only the form content scrolls.
   * The save bar never moves.
   */
  .scrim.kh55-financial-sheet
  .sheet-body{
    flex:1 1 auto !important;

    min-height:0 !important;

    overflow-y:auto !important;
    overscroll-behavior:contain;

    -webkit-overflow-scrolling:touch;

    padding-bottom:
      calc(
        24px +
        env(safe-area-inset-bottom)
      ) !important;
  }

  /*
   * Original bottom buttons remain part of the form
   * but are not needed on mobile because V55 controls
   * the original submit action from the top.
   */
  .scrim.kh55-financial-sheet
  .sheet-foot{
    display:none !important;
  }

}


/* =========================================================
   KashfHesab V55.1 — MOBILE HEADER MENU CLEARANCE
   ========================================================= */

@media (max-width:768px){

  /*
   * The application's hamburger/menu control occupies
   * the upper-right area.
   *
   * Keep Cancel on the opposite side so it can never
   * be covered by the side-menu button.
   */
  .scrim.kh55-financial-sheet .kh55-mobile-bar{
    direction:ltr !important;

    grid-template-columns:
      minmax(78px,auto)
      minmax(0,1fr)
      minmax(86px,auto) !important;

    padding-left:
      max(12px, env(safe-area-inset-left)) !important;

    padding-right:
      max(12px, env(safe-area-inset-right)) !important;
  }

  .scrim.kh55-financial-sheet .kh55-cancel{
    grid-column:1 !important;
    justify-self:start !important;

    direction:rtl !important;

    position:relative !important;
    z-index:5 !important;
  }

  .scrim.kh55-financial-sheet .kh55-title{
    grid-column:2 !important;

    direction:rtl !important;
    text-align:center !important;
  }

  .scrim.kh55-financial-sheet .kh55-save{
    grid-column:3 !important;
    justify-self:end !important;

    direction:rtl !important;

    position:relative !important;
    z-index:5 !important;
  }

}


/* =========================================================
   KashfHesab V55.2 — SAVE LEFT / CANCEL BESIDE MENU RIGHT
   ========================================================= */

@media (max-width:768px){

  /*
   * RTL grid:
   * right  = cancel
   * center = title
   * left   = save
   */
  .scrim.kh55-financial-sheet .kh55-mobile-bar{
    direction:rtl !important;

    grid-template-columns:
      minmax(86px,auto)
      minmax(0,1fr)
      minmax(86px,auto) !important;

    padding-left:
      max(12px, env(safe-area-inset-left)) !important;

    /*
     * Leave room for the hamburger button on the far right.
     * Cancel sits immediately beside it.
     */
    padding-right:
      max(58px, calc(env(safe-area-inset-right) + 58px)) !important;
  }

  /* CANCEL — RIGHT, beside hamburger */
  .scrim.kh55-financial-sheet .kh55-cancel{
    grid-column:1 !important;
    grid-row:1 !important;

    justify-self:start !important;

    direction:rtl !important;

    position:relative !important;
    z-index:5 !important;
  }

  /* TITLE — CENTER */
  .scrim.kh55-financial-sheet .kh55-title{
    grid-column:2 !important;
    grid-row:1 !important;

    direction:rtl !important;
    text-align:center !important;

    justify-self:stretch !important;
  }

  /* SAVE — LEFT, as in original V55 */
  .scrim.kh55-financial-sheet .kh55-save{
    grid-column:3 !important;
    grid-row:1 !important;

    justify-self:end !important;

    direction:rtl !important;

    position:relative !important;
    z-index:5 !important;
  }

}

/* =========================================================
   KashfHesab V57.2 — CENTERED RESPONSIVE SAVED ENTRY
   Phone / Tablet / Desktop
   ========================================================= */

/* ---------- Main saved-entry page ---------- */

body.kh-entry-view{
  overflow-x:hidden;
}

body.kh-entry-view > .wrap{
  width:100% !important;
  max-width:none !important;

  margin-left:auto !important;
  margin-right:auto !important;

  padding-left:clamp(10px,3vw,28px) !important;
  padding-right:clamp(10px,3vw,28px) !important;

  box-sizing:border-box !important;

  display:flex !important;
  justify-content:center !important;
  align-items:flex-start !important;
}

body.kh-entry-view > .wrap > .gate{
  width:min(100%,620px) !important;
  max-width:620px !important;
  min-width:0 !important;

  margin-left:auto !important;
  margin-right:auto !important;

  box-sizing:border-box !important;
}

body.kh-entry-view > .wrap > .gate > .panel{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;

  box-sizing:border-box !important;
}


/* =========================================================
   TOP RETURN / NAVIGATION BAR
   ========================================================= */

body.kh-entry-view .topbar-backrow{
  width:100% !important;
  max-width:none !important;

  margin:0 !important;

  box-sizing:border-box !important;
}

body.kh-entry-view .topbar-backrow > *{
  box-sizing:border-box;
}


/* =========================================================
   MOBILE + TABLET
   ========================================================= */

@media (max-width:899px){

  /*
   * Sidebar becomes overlay/drawer.
   * Saved invoice remains geometrically centered in viewport.
   */
  body.kh-entry-view{
    padding-right:0 !important;
  }

  body.kh-entry-view > .wrap{
    width:100% !important;

    padding-left:10px !important;
    padding-right:10px !important;

    margin-left:auto !important;
    margin-right:auto !important;

    justify-content:center !important;
  }

  body.kh-entry-view > .wrap > .gate{
    width:100% !important;
    max-width:620px !important;

    margin-left:auto !important;
    margin-right:auto !important;
  }


  /* ---------- Top header ---------- */

  body.kh-entry-view .topbar{
    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
  }

  /*
   * Keep enough room for hamburger on right.
   */
  body.kh-entry-view .topbar-brand{
    padding-right:66px !important;
  }


  /* ---------- Return/action row ---------- */

  body.kh-entry-view .topbar-backrow{
    position:relative !important;

    top:auto !important;
    left:auto !important;
    right:auto !important;

    width:100% !important;

    padding:8px 10px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:6px !important;

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scrollbar-width:none;

    background:#fff !important;

    border-top:1px solid #eef2f7 !important;
    border-bottom:1px solid #e5eaf1 !important;

    box-shadow:
      0 4px 12px rgba(15,23,42,.055) !important;

    z-index:20 !important;
  }

  body.kh-entry-view .topbar-backrow::-webkit-scrollbar{
    display:none;
  }


  /*
   * Make return/navigation buttons clearly visible.
   */
  body.kh-entry-view .topbar-backrow .btn{
    flex:0 0 auto !important;

    min-height:38px !important;

    padding:8px 11px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    border:1px solid #dbe3ed !important;
    border-radius:10px !important;

    background:#f8fafc !important;

    color:#1e293b !important;

    font-size:11px !important;
    font-weight:700 !important;

    line-height:1.15 !important;

    white-space:nowrap !important;

    box-shadow:
      0 2px 6px rgba(15,23,42,.045) !important;
  }


  /*
   * First return button gets stronger emphasis.
   */
  body.kh-entry-view .topbar-backrow .btn:first-child{
    border-color:#bfdbfe !important;

    background:#eff6ff !important;

    color:#1d4ed8 !important;
  }


  /* ---------- Invoice/card ---------- */

  body.kh-entry-view > .wrap > .gate > .panel{
    padding:clamp(11px,3.2vw,18px) !important;

    border-radius:14px !important;
  }

}


/* =========================================================
   SMALL PHONES
   ========================================================= */

@media (max-width:480px){

  body.kh-entry-view > .wrap{
    padding-left:7px !important;
    padding-right:7px !important;
  }

  body.kh-entry-view .topbar-backrow{
    padding:7px 6px !important;
    gap:5px !important;
  }

  body.kh-entry-view .topbar-backrow .btn{
    min-height:36px !important;

    padding:7px 8px !important;

    font-size:10px !important;
  }

  body.kh-entry-view > .wrap > .gate > .panel{
    padding:11px !important;

    border-radius:12px !important;
  }

}


/* =========================================================
   TABLETS
   ========================================================= */

@media (min-width:600px) and (max-width:899px){

  body.kh-entry-view > .wrap{
    padding-left:24px !important;
    padding-right:24px !important;
  }

  body.kh-entry-view > .wrap > .gate{
    width:min(100%,620px) !important;
  }

  body.kh-entry-view .topbar-backrow{
    padding:9px 20px !important;
  }

  body.kh-entry-view .topbar-backrow .btn{
    min-height:40px !important;

    padding:9px 13px !important;

    font-size:11px !important;
  }

}


/* =========================================================
   KashfHesab V57.3 — ENTRY PREVIEW TOP NAV EMPHASIS
   Existing buttons only — no navigation changes
   ========================================================= */

body.kh-entry-view .topbar-backrow{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:wrap !important;

  gap:9px !important;

  padding:10px 14px !important;
}

body.kh-entry-view .topbar-backrow .btn{
  min-height:44px !important;

  padding:10px 16px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:11px !important;

  font-size:13px !important;
  line-height:1.2 !important;
  font-weight:750 !important;

  white-space:nowrap !important;
}


/* Phone */
@media (max-width:599px){

  body.kh-entry-view .topbar-backrow{
    width:100% !important;

    padding:8px 7px !important;

    gap:6px !important;

    flex-wrap:nowrap !important;
  }

  body.kh-entry-view .topbar-backrow .btn{
    flex:1 1 0 !important;

    min-width:0 !important;
    min-height:42px !important;

    padding:8px 5px !important;

    font-size:11px !important;

    text-align:center !important;

    white-space:normal !important;
  }

}


/* Tablet */
@media (min-width:600px) and (max-width:899px){

  body.kh-entry-view .topbar-backrow{
    gap:10px !important;

    padding:10px 18px !important;
  }

  body.kh-entry-view .topbar-backrow .btn{
    min-height:46px !important;

    padding:10px 18px !important;

    font-size:13px !important;
  }

}


/* =========================================================
   KashfHesab V58 — RECENT TRANSACTIONS INDIVIDUAL CARDS
   ========================================================= */

/* space between individual transaction cards */
.kh52-recent-list{
  display:flex !important;
  flex-direction:column !important;
  gap:9px !important;
}


/* every financial transaction becomes its own card */
.kh52-recent-row{
  position:relative !important;

  width:100% !important;
  min-width:0 !important;

  display:grid !important;
  grid-template-columns:44px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:11px !important;

  padding:11px 12px !important;

  border:1px solid #e7edf5 !important;
  border-radius:14px !important;

  background:#fff !important;

  box-shadow:
    0 3px 10px rgba(15,42,76,.045) !important;

  text-decoration:none !important;

  overflow:hidden !important;

  transition:
    transform .16s ease,
    box-shadow .16s ease,
    border-color .16s ease !important;
}


/* remove old list separator */
.kh52-recent-row,
.kh52-recent-row:last-child{
  border-bottom:1px solid #e7edf5 !important;
}


/* interaction */
.kh52-recent-row:hover{
  background:#fff !important;

  border-color:#d5e3f4 !important;

  box-shadow:
    0 7px 18px rgba(15,55,100,.085) !important;

  transform:translateY(-1px);
}


/* transaction icon */
.kh52-recent-row .kh52-entry-icon{
  width:42px !important;
  height:42px !important;

  border-radius:12px !important;

  font-size:17px !important;

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.55);
}


/* main transaction information */
.kh52-recent-row .kh52-entry-main{
  min-width:0 !important;
}


/* transaction type */
.kh52-recent-row .kh52-entry-main strong{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;

  min-width:0 !important;

  color:#122d4d !important;

  font-size:12px !important;
  font-weight:800 !important;

  line-height:1.35 !important;
}


/* invoice / receipt number */
.kh52-recent-row .kh52-entry-main strong small{
  padding:2px 5px !important;

  border-radius:5px !important;

  background:#f2f6fb !important;

  color:#738399 !important;

  font-size:9px !important;
  font-weight:700 !important;
}


/* customer + date */
.kh52-recent-row .kh52-entry-main em{
  display:block !important;

  margin-top:5px !important;

  overflow:hidden !important;

  color:#7a899c !important;

  font-size:10px !important;
  line-height:1.35 !important;
  font-style:normal !important;

  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}


/* amount */
.kh52-recent-row .kh52-entry-amount{
  align-self:center !important;

  padding:5px 8px !important;

  border-radius:9px !important;

  background:#f7f9fc !important;

  color:#123a68 !important;

  font-size:12px !important;
  font-weight:900 !important;

  direction:ltr !important;
  white-space:nowrap !important;
}


/* currency */
.kh52-recent-row .kh52-entry-amount small{
  margin-left:2px !important;

  color:#8190a3 !important;

  font-size:8px !important;
  font-weight:700 !important;
}


/* =========================================================
   PHONE
   ========================================================= */

@media(max-width:760px){

  .kh52-recent-card{
    padding:14px !important;
  }

  .kh52-recent-list{
    gap:8px !important;
  }

  .kh52-recent-row{
    grid-template-columns:40px minmax(0,1fr) auto !important;

    gap:8px !important;

    padding:10px !important;

    border-radius:13px !important;

    box-shadow:
      0 3px 9px rgba(15,42,76,.045) !important;
  }

  .kh52-recent-row .kh52-entry-icon{
    width:40px !important;
    height:40px !important;

    border-radius:11px !important;

    font-size:16px !important;
  }

  .kh52-recent-row .kh52-entry-main strong{
    font-size:11px !important;
  }

  .kh52-recent-row .kh52-entry-main em{
    margin-top:4px !important;

    font-size:9px !important;
  }

  .kh52-recent-row .kh52-entry-amount{
    padding:5px 6px !important;

    font-size:11px !important;
  }

}


/* =========================================================
   VERY SMALL PHONES
   ========================================================= */

@media(max-width:390px){

  .kh52-recent-card{
    padding-left:10px !important;
    padding-right:10px !important;
  }

  .kh52-recent-row{
    grid-template-columns:37px minmax(0,1fr) auto !important;

    gap:7px !important;

    padding:9px 8px !important;
  }

  .kh52-recent-row .kh52-entry-icon{
    width:37px !important;
    height:37px !important;

    font-size:15px !important;
  }

  .kh52-recent-row .kh52-entry-amount{
    font-size:10px !important;
  }

}



/* =========================================================
   KashfHesab V58.1 FIX — RECENT CARD EXPANDED STATE
   ========================================================= */

.kh52-recent-row{
  transform-origin:center center !important;
}


/* First click / tap */
.kh52-recent-row.kh581-expanded{
  position:relative !important;
  z-index:30 !important;

  padding:16px 15px !important;

  border:1px solid #b8d5f5 !important;
  border-radius:17px !important;

  background:#fff !important;

  box-shadow:
    0 15px 35px rgba(12,55,105,.16),
    0 3px 8px rgba(12,55,105,.07) !important;

  transform:scale(1.025) !important;
}


/* icon */
.kh52-recent-row.kh581-expanded .kh52-entry-icon{
  width:50px !important;
  height:50px !important;

  border-radius:15px !important;

  font-size:21px !important;
}


/* transaction title */
.kh52-recent-row.kh581-expanded .kh52-entry-main strong{
  overflow:visible !important;

  color:#0c315c !important;

  font-size:14px !important;

  text-overflow:clip !important;
  white-space:normal !important;
}


/* number */
.kh52-recent-row.kh581-expanded
.kh52-entry-main strong small{
  padding:3px 7px !important;

  border-radius:6px !important;

  font-size:10px !important;
}


/* customer + date */
.kh52-recent-row.kh581-expanded .kh52-entry-main em{
  overflow:visible !important;

  margin-top:7px !important;

  color:#52677f !important;

  font-size:11px !important;
  font-weight:650 !important;

  text-overflow:clip !important;
  white-space:normal !important;
}


/* amount */
.kh52-recent-row.kh581-expanded .kh52-entry-amount{
  padding:8px 10px !important;

  border:1px solid #d8e8f8 !important;
  border-radius:11px !important;

  background:#f1f7fd !important;

  color:#07509c !important;

  font-size:14px !important;

  box-shadow:
    0 2px 7px rgba(19,77,137,.06) !important;
}


/* V68.6B.21C.31.1 — old second-tap instruction removed */


/* PHONE */
@media(max-width:760px){

  .kh52-recent-row.kh581-expanded{
    grid-template-columns:
      48px minmax(0,1fr) auto !important;

    gap:10px !important;

    padding:14px 12px !important;

    transform:scale(1.018) !important;
  }

  .kh52-recent-row.kh581-expanded
  .kh52-entry-icon{
    width:48px !important;
    height:48px !important;

    font-size:20px !important;
  }

  .kh52-recent-row.kh581-expanded
  .kh52-entry-main strong{
    font-size:13px !important;
  }

  .kh52-recent-row.kh581-expanded
  .kh52-entry-main em{
    font-size:10px !important;
  }

  .kh52-recent-row.kh581-expanded
  .kh52-entry-amount{
    font-size:13px !important;
  }

}


/* VERY SMALL PHONE */
@media(max-width:390px){

  .kh52-recent-row.kh581-expanded{
    grid-template-columns:
      44px minmax(0,1fr) auto !important;

    gap:7px !important;

    padding:13px 9px !important;

    transform:scale(1.012) !important;
  }

  .kh52-recent-row.kh581-expanded
  .kh52-entry-icon{
    width:44px !important;
    height:44px !important;

    font-size:18px !important;
  }

  .kh52-recent-row.kh581-expanded
  .kh52-entry-amount{
    padding:7px 6px !important;

    font-size:12px !important;
  }

}



/* =========================================================
   KashfHesab V59 — QUICK ACTION SETTINGS
   ========================================================= */

.kh59-settings-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:20px;
  padding:15px;
  border:1px solid #e2eaf3;
  border-radius:16px;
  background:#f8fbff;
}

.kh59-settings-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 44px;
  width:44px;
  height:44px;
  border-radius:14px;
  background:#e7f2ff;
  font-size:21px;
}

.kh59-settings-head h3{
  margin:1px 0 5px;
  color:#102f52;
  font-size:15px;
}

.kh59-settings-head p{
  margin:0;
  color:#66788c;
  font-size:12px;
  line-height:1.7;
}

.kh59-sort-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.kh59-sort-item{
  display:grid;
  grid-template-columns:38px minmax(120px,1fr) minmax(170px,1.15fr);
  align-items:center;
  gap:10px;

  padding:10px;

  border:1px solid #e1e8f0;
  border-radius:14px;

  background:#fff;
}

.kh59-sort-num{
  display:flex;
  align-items:center;
  justify-content:center;

  width:34px;
  height:34px;

  border-radius:11px;

  background:#102f52;
  color:#fff;

  font-size:13px;
  font-weight:800;
}

.kh59-sort-action{
  display:flex;
  align-items:center;
  gap:8px;

  min-width:0;
}

.kh59-sort-action span{
  font-size:20px;
}

.kh59-sort-action strong{
  overflow:hidden;

  color:#213a55;

  font-size:13px;

  text-overflow:ellipsis;
  white-space:nowrap;
}

.kh59-action-select{
  width:100%;
  min-height:42px;
  margin:0 !important;
}

.kh59-settings-hint{
  margin-top:12px !important;
}


@media(max-width:600px){

  .kh59-sort-item{
    grid-template-columns:36px minmax(0,1fr);
  }

  .kh59-action-select{
    grid-column:1 / -1;
  }

}


/* ==========================================================
   KashfHesab V59.5 — Professional Quick Action Cards
   Four independent cards / one row
   ========================================================== */

body.kh-dashboard-home .kh49-dashboard .kh49-quick-grid{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
    width:100% !important;
    overflow:visible !important;
}

body.kh-dashboard-home .kh49-dashboard .kh49-quick{
    position:relative !important;
    min-width:0 !important;
    width:100% !important;
    min-height:104px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    gap:9px !important;
    padding:13px 6px 11px !important;

    border:1px solid rgba(15,23,42,.075) !important;
    border-radius:18px !important;

    background:
      linear-gradient(180deg,#ffffff 0%,#fbfdff 100%) !important;

    box-shadow:
      0 8px 24px rgba(15,23,42,.055),
      0 2px 6px rgba(15,23,42,.035) !important;

    color:#172033 !important;
    text-align:center !important;
    text-decoration:none !important;

    font-size:12px !important;
    font-weight:800 !important;
    line-height:1.25 !important;

    overflow:hidden !important;
    isolation:isolate !important;

    transition:
      transform .18s ease,
      box-shadow .18s ease,
      border-color .18s ease !important;

    -webkit-tap-highlight-color:transparent;
}

body.kh-dashboard-home .kh49-dashboard .kh49-quick::before{
    content:"" !important;
    position:absolute !important;
    inset:0 0 auto 0 !important;
    height:3px !important;
    background:var(--kh-card-accent,#2563eb) !important;
    opacity:.92 !important;
}

body.kh-dashboard-home .kh49-dashboard .kh49-quick::after{
    content:"" !important;
    position:absolute !important;
    width:54px !important;
    height:54px !important;
    border-radius:50% !important;
    top:-28px !important;
    left:-20px !important;
    background:var(--kh-card-soft,rgba(37,99,235,.08)) !important;
    z-index:-1 !important;
}

body.kh-dashboard-home .kh49-dashboard .kh49-quick:hover{
    transform:translateY(-2px) !important;
    border-color:var(--kh-card-border,rgba(37,99,235,.18)) !important;
    box-shadow:
      0 12px 28px rgba(15,23,42,.09),
      0 3px 8px rgba(15,23,42,.045) !important;
}

body.kh-dashboard-home .kh49-dashboard .kh49-quick:active{
    transform:scale(.97) !important;
}

body.kh-dashboard-home .kh49-dashboard .kh49-quick-icon{
    width:46px !important;
    height:46px !important;
    flex:0 0 46px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:15px !important;

    background:var(--kh-card-soft,#eff6ff) !important;
    border:1px solid var(--kh-card-border,#dbeafe) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.9),
      0 5px 12px rgba(15,23,42,.055) !important;

    font-size:23px !important;
    line-height:1 !important;
}

body.kh-dashboard-home .kh49-dashboard .kh49-quick > span:last-child{
    display:block !important;
    width:100% !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}


/* Individual identities */

body.kh-dashboard-home .kh49-q-sales{
    --kh-card-accent:#2563eb;
    --kh-card-soft:#eff6ff;
    --kh-card-border:#dbeafe;
}

body.kh-dashboard-home .kh49-q-receipt{
    --kh-card-accent:#16a34a;
    --kh-card-soft:#f0fdf4;
    --kh-card-border:#dcfce7;
}

body.kh-dashboard-home .kh49-q-purchase{
    --kh-card-accent:#7c3aed;
    --kh-card-soft:#f5f3ff;
    --kh-card-border:#ede9fe;
}

body.kh-dashboard-home .kh49-q-payment{
    --kh-card-accent:#dc2626;
    --kh-card-soft:#fef2f2;
    --kh-card-border:#fee2e2;
}

body.kh-dashboard-home .kh49-q-customer{
    --kh-card-accent:#0891b2;
    --kh-card-soft:#ecfeff;
    --kh-card-border:#cffafe;
}

body.kh-dashboard-home .kh49-q-products{
    --kh-card-accent:#9333ea;
    --kh-card-soft:#faf5ff;
    --kh-card-border:#f3e8ff;
}

body.kh-dashboard-home .kh49-q-product-add{
    --kh-card-accent:#ea580c;
    --kh-card-soft:#fff7ed;
    --kh-card-border:#ffedd5;
}

body.kh-dashboard-home .kh49-q-users{
    --kh-card-accent:#4f46e5;
    --kh-card-soft:#eef2ff;
    --kh-card-border:#e0e7ff;
}

body.kh-dashboard-home .kh49-q-user-add{
    --kh-card-accent:#0284c7;
    --kh-card-soft:#f0f9ff;
    --kh-card-border:#e0f2fe;
}

body.kh-dashboard-home .kh49-q-reps{
    --kh-card-accent:#0f766e;
    --kh-card-soft:#f0fdfa;
    --kh-card-border:#ccfbf1;
}

body.kh-dashboard-home .kh49-q-rep-add{
    --kh-card-accent:#ca8a04;
    --kh-card-soft:#fefce8;
    --kh-card-border:#fef9c3;
}

body.kh-dashboard-home .kh49-q-search{
    --kh-card-accent:#475569;
    --kh-card-soft:#f8fafc;
    --kh-card-border:#e2e8f0;
}

body.kh-dashboard-home .kh49-q-log{
    --kh-card-accent:#b45309;
    --kh-card-soft:#fffbeb;
    --kh-card-border:#fef3c7;
}

body.kh-dashboard-home .kh49-q-settings{
    --kh-card-accent:#334155;
    --kh-card-soft:#f8fafc;
    --kh-card-border:#e2e8f0;
}


/* Mobile: ALWAYS one row / four cards */

@media(max-width:760px){

    body.kh-dashboard-home .kh49-dashboard .kh49-quick-grid{
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
        gap:7px !important;
    }

    body.kh-dashboard-home .kh49-dashboard .kh49-quick{
        min-height:92px !important;
        padding:10px 3px 9px !important;
        gap:7px !important;
        border-radius:15px !important;
        font-size:10.5px !important;
    }

    body.kh-dashboard-home .kh49-dashboard .kh49-quick-icon{
        width:39px !important;
        height:39px !important;
        flex-basis:39px !important;
        border-radius:12px !important;
        font-size:20px !important;
    }
}

@media(max-width:390px){

    body.kh-dashboard-home .kh49-dashboard .kh49-quick-grid{
        gap:5px !important;
    }

    body.kh-dashboard-home .kh49-dashboard .kh49-quick{
        min-height:86px !important;
        padding:9px 2px 8px !important;
        border-radius:13px !important;
        font-size:9.5px !important;
    }

    body.kh-dashboard-home .kh49-dashboard .kh49-quick-icon{
        width:36px !important;
        height:36px !important;
        flex-basis:36px !important;
        font-size:18px !important;
    }
}


/* ==========================================================
   KashfHesab V60 — Reference Hero
   Based on approved KashfHesab mobile dashboard reference
   ========================================================== */

body.kh-dashboard-home .kh60-top{
  position:relative;
  margin-bottom:18px;
}

body.kh-dashboard-home .kh60-header{
  position:relative;
  overflow:hidden;

  margin:0;
  padding:24px 26px 88px;

  border-radius:27px 27px 34px 34px;

  color:#fff;

  background:
    radial-gradient(circle at 22% 30%,
      rgba(20,113,224,.42),
      transparent 32%),
    radial-gradient(circle at 82% 85%,
      rgba(0,116,220,.20),
      transparent 34%),
    linear-gradient(120deg,
      #041d43 0%,
      #07316b 50%,
      #041c40 100%);

  box-shadow:
    0 16px 36px rgba(2,26,62,.18);

  isolation:isolate;
}

body.kh-dashboard-home .kh60-header::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:80px;

  background:
    linear-gradient(
      180deg,
      rgba(5,31,67,0),
      rgba(2,22,50,.35)
    );

  pointer-events:none;
  z-index:-1;
}

body.kh-dashboard-home .kh60-header-glow{
  position:absolute;
  border-radius:50%;
  filter:blur(4px);
  pointer-events:none;
  z-index:-1;
}

body.kh-dashboard-home .kh60-glow-one{
  width:210px;
  height:210px;
  top:-110px;
  right:20%;
  background:rgba(25,126,255,.12);
}

body.kh-dashboard-home .kh60-glow-two{
  width:190px;
  height:190px;
  left:-90px;
  bottom:-80px;
  background:rgba(0,117,255,.16);
}


body.kh-dashboard-home .kh60-head-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:22px;
}

body.kh-dashboard-home .kh60-company{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}

body.kh-dashboard-home .kh60-logo{
  width:66px;
  height:66px;
  flex:0 0 66px;

  display:grid;
  place-items:center;

  overflow:hidden;
  border-radius:18px;

  background:
    linear-gradient(145deg,
      rgba(255,255,255,.20),
      rgba(255,255,255,.08));

  border:1px solid rgba(255,255,255,.16);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    0 8px 22px rgba(0,0,0,.15);
}

body.kh-dashboard-home .kh60-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:5px;
}

body.kh-dashboard-home .kh60-logo-fallback{
  font-weight:900;
  font-size:19px;
  color:#fff;
}

body.kh-dashboard-home .kh60-company-copy{
  min-width:0;
}

body.kh-dashboard-home .kh60-company-copy h1{
  margin:0 0 5px;
  max-width:530px;

  font-size:25px;
  line-height:1.35;
  font-weight:900;
  color:#fff;
}

body.kh-dashboard-home .kh60-company-copy span{
  display:block;
  font-size:13px;
  color:rgba(255,255,255,.65);
}


body.kh-dashboard-home .kh60-head-actions{
  display:flex;
  align-items:center;
  gap:10px;
  direction:ltr;
}

body.kh-dashboard-home .kh60-round-btn{
  appearance:none;

  width:52px;
  height:52px;

  display:grid;
  place-items:center;

  padding:0;
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;

  color:#fff;
  background:rgba(255,255,255,.11);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 8px 20px rgba(0,0,0,.10);

  cursor:pointer;

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

body.kh-dashboard-home .kh60-menu-btn{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:5px;
}

body.kh-dashboard-home .kh60-menu-btn span{
  width:23px;
  height:3px;
  border-radius:5px;
  background:#fff;
}

body.kh-dashboard-home .kh60-bell-btn{
  position:relative;
}

body.kh-dashboard-home .kh60-bell{
  font-size:27px;
  line-height:1;
  transform:rotate(45deg);
}

body.kh-dashboard-home .kh60-notify-dot{
  position:absolute;
  top:-4px;
  right:-4px;

  width:18px;
  height:18px;

  border-radius:50%;
  border:3px solid #08316a;

  background:#ff4655;
}


body.kh-dashboard-home .kh60-meta-row{
  margin-top:22px;

  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
}

body.kh-dashboard-home .kh60-user{
  display:flex;
  align-items:center;
  gap:11px;
}

body.kh-dashboard-home .kh60-avatar{
  width:52px;
  height:52px;

  display:grid;
  place-items:center;

  border-radius:50%;

  color:#7587a3;
  background:
    linear-gradient(145deg,#fff,#dce6f2);

  border:3px solid rgba(255,255,255,.22);

  box-shadow:0 7px 18px rgba(0,0,0,.12);

  font-size:25px;
}

body.kh-dashboard-home .kh60-user-copy{
  display:grid;
  gap:1px;
}

body.kh-dashboard-home .kh60-user-copy small{
  color:rgba(255,255,255,.72);
  font-size:12px;
}

body.kh-dashboard-home .kh60-user-copy strong{
  color:#fff;
  font-size:17px;
  direction:ltr;
  text-align:right;
}

body.kh-dashboard-home .kh60-online{
  display:flex;
  align-items:center;
  gap:5px;

  margin-top:2px;

  color:rgba(255,255,255,.62);
  font-size:10px;
}

body.kh-dashboard-home .kh60-online i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#20d466;
  box-shadow:0 0 0 3px rgba(32,212,102,.12);
}


body.kh-dashboard-home .kh60-date{
  display:flex;
  align-items:center;
  gap:8px;

  color:rgba(255,255,255,.91);
  font-size:13px;
}

body.kh-dashboard-home .kh60-calendar{
  width:31px;
  height:31px;

  display:grid;
  place-items:center;

  border-radius:9px;

  background:rgba(255,255,255,.10);
}

body.kh-dashboard-home .kh60-date strong{
  font-weight:700;
}


/* BALANCE CARD */

body.kh-dashboard-home .kh60-balance-card{
  position:relative;
  z-index:5;

  margin:-61px 28px 0;
  min-height:184px;

  display:flex;
  align-items:center;
  gap:20px;

  padding:25px 27px;

  overflow:hidden;

  border-radius:26px;

  color:#fff;

  background:
    radial-gradient(circle at 8% 15%,
      rgba(56,169,255,.65),
      transparent 35%),
    linear-gradient(115deg,
      #0784ef 0%,
      #0868ca 38%,
      #07336e 100%);

  border:1px solid rgba(255,255,255,.18);

  box-shadow:
    0 20px 38px rgba(5,50,112,.20);
}

body.kh-dashboard-home .kh60-wallet{
  width:78px;
  height:78px;
  flex:0 0 78px;

  display:grid;
  place-items:center;

  border-radius:23px;

  background:
    linear-gradient(145deg,
      rgba(225,243,255,.95),
      rgba(153,210,255,.80));

  color:#073d86;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    0 10px 24px rgba(0,35,80,.15);

  font-size:34px;
}

body.kh-dashboard-home .kh60-balance-main{
  flex:1;
  min-width:0;
}

body.kh-dashboard-home .kh60-balance-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}

body.kh-dashboard-home .kh60-balance-title{
  display:block;

  margin-bottom:5px;

  color:rgba(255,255,255,.90);

  font-size:17px;
  font-weight:800;
}

body.kh-dashboard-home .kh60-balance-number{
  display:flex;
  align-items:baseline;
  gap:7px;

  direction:ltr;

  color:#fff;

  font-size:42px;
  line-height:1.1;
  font-weight:950;
  letter-spacing:-1.3px;

  text-shadow:0 3px 12px rgba(0,30,80,.18);
}

body.kh-dashboard-home .kh60-balance-number small{
  font-size:16px;
  font-weight:800;
  opacity:.85;
}

body.kh-dashboard-home .kh60-customer-pill{
  display:flex;
  align-items:center;
  gap:6px;

  padding:9px 13px;

  white-space:nowrap;

  border-radius:999px;

  color:rgba(255,255,255,.90);
  background:rgba(255,255,255,.11);

  border:1px solid rgba(255,255,255,.10);

  font-size:11px;
}

body.kh-dashboard-home .kh60-customer-pill strong{
  color:#fff;
  font-size:15px;
}

body.kh-dashboard-home .kh60-people{
  font-size:16px;
}


body.kh-dashboard-home .kh60-balance-bottom{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;

  margin-top:19px;
}

body.kh-dashboard-home .kh60-balance-note{
  display:flex;
  align-items:center;
  gap:6px;

  color:rgba(204,255,224,.77);

  font-size:11px;
  white-space:nowrap;
}

body.kh-dashboard-home .kh60-up{
  color:#30e878;
  font-size:24px;
  font-weight:900;
}

body.kh-dashboard-home .kh60-mini-chart{
  width:220px;
  max-width:40%;
  height:65px;
}

body.kh-dashboard-home .kh60-mini-chart svg{
  display:block;
  width:100%;
  height:100%;
}


/* MOBILE REFERENCE MATCH */

@media(max-width:760px){

  body.kh-dashboard-home .kh50-home-wrap{
    padding-top:0 !important;
  }

  body.kh-dashboard-home .kh60-top{
    margin-left:-14px;
    margin-right:-14px;
  }

  body.kh-dashboard-home .kh60-header{
    padding:
      max(18px,env(safe-area-inset-top))
      18px
      80px;

    border-radius:0 0 36px 36px;
  }

  body.kh-dashboard-home .kh60-head-row{
    gap:10px;
  }

  body.kh-dashboard-home .kh60-company{
    gap:9px;
  }

  body.kh-dashboard-home .kh60-logo{
    width:52px;
    height:52px;
    flex-basis:52px;
    border-radius:15px;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    max-width:210px;
    font-size:18px;
    line-height:1.35;
  }

  body.kh-dashboard-home .kh60-company-copy span{
    font-size:11px;
  }

  body.kh-dashboard-home .kh60-head-actions{
    gap:6px;
  }

  body.kh-dashboard-home .kh60-round-btn{
    width:43px;
    height:43px;
    border-radius:14px;
  }

  body.kh-dashboard-home .kh60-menu-btn span{
    width:20px;
  }

  body.kh-dashboard-home .kh60-meta-row{
    margin-top:19px;
    align-items:center;
  }

  body.kh-dashboard-home .kh60-avatar{
    width:45px;
    height:45px;
  }

  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:15px;
  }

  body.kh-dashboard-home .kh60-date{
    max-width:180px;
    font-size:11px;
    line-height:1.35;
  }

  body.kh-dashboard-home .kh60-calendar{
    width:28px;
    height:28px;
    flex:0 0 28px;
  }


  body.kh-dashboard-home .kh60-balance-card{
    margin:-52px 14px 0;

    min-height:176px;

    padding:21px 18px;

    border-radius:25px;

    gap:13px;
  }

  body.kh-dashboard-home .kh60-wallet{
    width:61px;
    height:61px;
    flex-basis:61px;

    border-radius:19px;

    font-size:28px;
  }

  body.kh-dashboard-home .kh60-balance-head{
    gap:8px;
  }

  body.kh-dashboard-home .kh60-balance-title{
    font-size:14px;
  }

  body.kh-dashboard-home .kh60-balance-number{
    font-size:31px;
    letter-spacing:-.8px;
  }

  body.kh-dashboard-home .kh60-balance-number small{
    font-size:12px;
  }

  body.kh-dashboard-home .kh60-customer-pill{
    padding:7px 8px;
    gap:4px;

    font-size:9px;
  }

  body.kh-dashboard-home .kh60-customer-pill strong{
    font-size:12px;
  }

  body.kh-dashboard-home .kh60-balance-bottom{
    margin-top:11px;
  }

  body.kh-dashboard-home .kh60-balance-note{
    font-size:9px;
  }

  body.kh-dashboard-home .kh60-mini-chart{
    width:120px;
    max-width:45%;
    height:48px;
  }
}


@media(max-width:390px){

  body.kh-dashboard-home .kh60-header{
    padding-left:13px;
    padding-right:13px;
  }

  body.kh-dashboard-home .kh60-logo{
    width:46px;
    height:46px;
    flex-basis:46px;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    max-width:155px;
    font-size:15px;
  }

  body.kh-dashboard-home .kh60-round-btn{
    width:39px;
    height:39px;
  }

  body.kh-dashboard-home .kh60-date{
    max-width:140px;
    font-size:9.5px;
  }

  body.kh-dashboard-home .kh60-balance-card{
    margin-left:10px;
    margin-right:10px;

    padding:18px 13px;

    gap:9px;
  }

  body.kh-dashboard-home .kh60-wallet{
    width:52px;
    height:52px;
    flex-basis:52px;
  }

  body.kh-dashboard-home .kh60-balance-title{
    font-size:12px;
  }

  body.kh-dashboard-home .kh60-balance-number{
    font-size:27px;
  }

  body.kh-dashboard-home .kh60-customer-pill span:last-child{
    display:none;
  }

  body.kh-dashboard-home .kh60-mini-chart{
    width:95px;
  }
}


/* ==========================================================
   KashfHesab V60.1 — Reference Alignment
   ========================================================== */

/* Reference uses visual LTR positioning:
   company RIGHT, controls LEFT */
body.kh-dashboard-home .kh60-head-row{
  direction:rtl;
}

body.kh-dashboard-home .kh60-company{
  direction:rtl;
  text-align:right;
}

body.kh-dashboard-home .kh60-head-actions{
  margin-inline-start:auto;
  direction:ltr;
}

/* Company logo */
body.kh-dashboard-home .kh60-logo{
  background:#fff;
  border-color:rgba(255,255,255,.28);
}

body.kh-dashboard-home .kh60-logo img{
  display:block;
  width:100%;
  height:100%;
  padding:3px;
  object-fit:contain;
  background:#fff;
}

/* User on LEFT / date on RIGHT */
body.kh-dashboard-home .kh60-meta-row{
  direction:ltr;
}

body.kh-dashboard-home .kh60-user{
  direction:ltr;
  text-align:left;
}

body.kh-dashboard-home .kh60-user-copy{
  text-align:left;
}

body.kh-dashboard-home .kh60-user-copy strong{
  text-align:left;
}

body.kh-dashboard-home .kh60-online{
  justify-content:flex-start;
}

body.kh-dashboard-home .kh60-date{
  direction:rtl;
  text-align:right;
}

/* SVG icon system */
body.kh-dashboard-home .kh60-bell{
  display:grid;
  place-items:center;
  transform:none;
}

body.kh-dashboard-home .kh60-bell svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body.kh-dashboard-home .kh60-avatar svg{
  width:27px;
  height:27px;
  fill:none;
  stroke:#6e86a8;
  stroke-width:1.7;
  stroke-linecap:round;
}

body.kh-dashboard-home .kh60-calendar svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
}

body.kh-dashboard-home .kh60-wallet svg{
  width:39px;
  height:39px;
  fill:none;
  stroke:#0752a5;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body.kh-dashboard-home .kh60-people{
  display:grid;
  place-items:center;
}

body.kh-dashboard-home .kh60-people svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
}

body.kh-dashboard-home .kh60-up{
  display:grid;
  place-items:center;
}

body.kh-dashboard-home .kh60-up svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Red notification indicator */
body.kh-dashboard-home .kh60-notify-dot{
  width:12px;
  height:12px;
  top:4px;
  right:4px;
  border-width:2px;
}


/* ----------------------------------------------------------
   BALANCE — match approved reference
   pill RIGHT / amount LEFT-middle / wallet LEFT
   ---------------------------------------------------------- */

body.kh-dashboard-home .kh60-balance-card{
  direction:ltr;
}

body.kh-dashboard-home .kh60-wallet{
  order:3;
}

body.kh-dashboard-home .kh60-balance-main{
  order:1;
  direction:rtl;
}

body.kh-dashboard-home .kh60-balance-head{
  direction:rtl;
  align-items:flex-start;
}

/* customer badge at visual right */
body.kh-dashboard-home .kh60-customer-pill{
  order:1;
  direction:rtl;
}

/* amount block fills center/left */
body.kh-dashboard-home .kh60-balance-head > div:first-child{
  order:2;
  flex:1;
  text-align:right;
}

body.kh-dashboard-home .kh60-balance-number{
  direction:ltr;
  justify-content:flex-end;
}

/* chart / note */
body.kh-dashboard-home .kh60-balance-bottom{
  direction:rtl;
}

body.kh-dashboard-home .kh60-balance-note{
  direction:rtl;
}

body.kh-dashboard-home .kh60-mini-chart{
  direction:ltr;
}


/* ----------------------------------------------------------
   Desktop polish
   ---------------------------------------------------------- */

@media(min-width:761px){

  body.kh-dashboard-home .kh60-header{
    min-height:266px;
    padding-top:27px;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    font-size:24px;
  }

  body.kh-dashboard-home .kh60-meta-row{
    margin-top:27px;
  }

  body.kh-dashboard-home .kh60-balance-card{
    margin-left:28px;
    margin-right:28px;
  }
}


/* ----------------------------------------------------------
   Mobile reference
   ---------------------------------------------------------- */

@media(max-width:760px){

  body.kh-dashboard-home .kh60-header{
    min-height:270px;
  }

  body.kh-dashboard-home .kh60-head-row{
    align-items:flex-start;
  }

  body.kh-dashboard-home .kh60-company{
    flex:1;
    min-width:0;
  }

  body.kh-dashboard-home .kh60-head-actions{
    flex:0 0 auto;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    white-space:normal;
  }

  body.kh-dashboard-home .kh60-meta-row{
    margin-top:23px;
  }

  body.kh-dashboard-home .kh60-user{
    flex:0 0 auto;
  }

  body.kh-dashboard-home .kh60-date{
    flex:0 1 auto;
  }

  body.kh-dashboard-home .kh60-balance-card{
    align-items:center;
  }

  body.kh-dashboard-home .kh60-wallet{
    width:57px;
    height:57px;
    flex-basis:57px;
    border-radius:18px;
  }

  body.kh-dashboard-home .kh60-wallet svg{
    width:31px;
    height:31px;
  }

  body.kh-dashboard-home .kh60-balance-main{
    min-width:0;
  }

  body.kh-dashboard-home .kh60-balance-head{
    width:100%;
  }

  body.kh-dashboard-home .kh60-balance-head > div:first-child{
    min-width:0;
  }

  body.kh-dashboard-home .kh60-balance-number{
    white-space:nowrap;
  }

  body.kh-dashboard-home .kh60-balance-bottom{
    width:100%;
  }
}


/* Very small phones */
@media(max-width:390px){

  body.kh-dashboard-home .kh60-head-actions{
    gap:5px;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    max-width:150px;
  }

  body.kh-dashboard-home .kh60-meta-row{
    gap:8px;
  }

  body.kh-dashboard-home .kh60-user-copy small{
    font-size:10px;
  }

  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:13px;
  }

  body.kh-dashboard-home .kh60-online{
    font-size:9px;
  }

  body.kh-dashboard-home .kh60-balance-card{
    gap:8px;
  }

  body.kh-dashboard-home .kh60-wallet{
    width:48px;
    height:48px;
    flex-basis:48px;
  }

  body.kh-dashboard-home .kh60-wallet svg{
    width:27px;
    height:27px;
  }
}


/* ==========================================================
   KashfHesab V60.2 — Final Top Polish
   Approved reference proportions
   ========================================================== */


/* ---------- HERO ---------- */

body.kh-dashboard-home .kh60-header{
  min-height:0 !important;
  padding:22px 26px 72px !important;
  border-radius:26px 26px 32px 32px;

  background:
    radial-gradient(
      circle at 22% 22%,
      rgba(24,126,255,.30),
      transparent 31%
    ),
    radial-gradient(
      circle at 73% 62%,
      rgba(12,91,190,.18),
      transparent 35%
    ),
    linear-gradient(
      118deg,
      #05224c 0%,
      #073b7d 46%,
      #061e43 100%
    ) !important;
}


/* ---------- FIRST ROW ---------- */

body.kh-dashboard-home .kh60-head-row{
  min-height:70px;
  align-items:flex-start;
}

body.kh-dashboard-home .kh60-company{
  align-items:center;
  gap:12px;
}

body.kh-dashboard-home .kh60-logo{
  width:62px;
  height:62px;
  flex-basis:62px;

  border-radius:17px;

  box-shadow:
    0 8px 20px rgba(0,0,0,.13),
    inset 0 0 0 1px rgba(255,255,255,.5);
}

body.kh-dashboard-home .kh60-company-copy h1{
  margin:0 0 4px;

  max-width:560px;

  font-size:23px;
  line-height:1.35;
  font-weight:900;
}

body.kh-dashboard-home .kh60-company-copy span{
  font-size:12px;
  opacity:.85;
}


/* ---------- TOP BUTTONS ---------- */

body.kh-dashboard-home .kh60-head-actions{
  padding-top:2px;
}

body.kh-dashboard-home .kh60-round-btn{
  width:50px;
  height:50px;

  border-radius:16px;

  background:rgba(255,255,255,.12);

  border:1px solid rgba(255,255,255,.14);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 7px 17px rgba(0,0,0,.10);
}

body.kh-dashboard-home .kh60-round-btn:hover{
  background:rgba(255,255,255,.18);
}


/* ---------- USER / DATE ---------- */

body.kh-dashboard-home .kh60-meta-row{
  margin-top:11px !important;
  align-items:center;
}

body.kh-dashboard-home .kh60-user{
  gap:10px;
}

body.kh-dashboard-home .kh60-avatar{
  width:48px;
  height:48px;

  border-width:2px;

  box-shadow:0 6px 15px rgba(0,0,0,.12);
}

body.kh-dashboard-home .kh60-avatar svg{
  width:25px;
  height:25px;
}

body.kh-dashboard-home .kh60-user-copy{
  gap:0;
}

body.kh-dashboard-home .kh60-user-copy small{
  font-size:11px;
}

body.kh-dashboard-home .kh60-user-copy strong{
  font-size:16px;
  line-height:1.3;
}

body.kh-dashboard-home .kh60-online{
  margin-top:2px;
}

body.kh-dashboard-home .kh60-date{
  font-size:12px;
}

body.kh-dashboard-home .kh60-calendar{
  width:30px;
  height:30px;
}


/* ==========================================================
   BALANCE
   ========================================================== */

body.kh-dashboard-home .kh60-balance-card{
  margin:-49px 28px 0 !important;

  min-height:174px !important;

  padding:22px 26px !important;

  gap:19px;

  border-radius:25px;

  background:
    radial-gradient(
      circle at 8% 10%,
      rgba(34,172,255,.62),
      transparent 37%
    ),
    linear-gradient(
      112deg,
      #118ee9 0%,
      #0871d4 37%,
      #07346e 100%
    ) !important;

  box-shadow:
    0 17px 34px rgba(4,51,111,.19);
}


/* wallet */

body.kh-dashboard-home .kh60-wallet{
  width:70px;
  height:70px;
  flex-basis:70px;

  border-radius:21px;

  background:
    linear-gradient(
      145deg,
      #d9efff,
      #9bd0f3
    );
}

body.kh-dashboard-home .kh60-wallet svg{
  width:35px;
  height:35px;
}


/* main amount */

body.kh-dashboard-home .kh60-balance-title{
  margin-bottom:5px;

  font-size:16px;
  font-weight:800;
}

body.kh-dashboard-home .kh60-balance-number{
  font-size:40px;
  line-height:1.05;

  font-weight:950;

  letter-spacing:-1px;
}

body.kh-dashboard-home .kh60-balance-number small{
  margin-left:2px;

  font-size:14px;
}


/* customer count */

body.kh-dashboard-home .kh60-customer-pill{
  margin-top:1px;

  padding:8px 12px;

  border-radius:999px;

  background:rgba(255,255,255,.10);

  border:1px solid rgba(255,255,255,.14);
}

body.kh-dashboard-home .kh60-customer-pill strong{
  font-size:14px;
}


/* lower line */

body.kh-dashboard-home .kh60-balance-bottom{
  margin-top:9px;
}

body.kh-dashboard-home .kh60-balance-note{
  font-size:10px;

  color:rgba(220,255,233,.83);
}


/* chart */

body.kh-dashboard-home .kh60-mini-chart{
  width:205px;
  height:55px;
}


/* ==========================================================
   DESKTOP — use available area better
   ========================================================== */

@media(min-width:1100px){

  body.kh-dashboard-home .kh60-header{
    padding-left:27px !important;
    padding-right:27px !important;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    font-size:24px;
  }

  body.kh-dashboard-home .kh60-balance-card{
    margin-left:28px !important;
    margin-right:28px !important;
  }
}


/* ==========================================================
   TABLET
   ========================================================== */

@media(min-width:761px) and (max-width:1099px){

  body.kh-dashboard-home .kh60-header{
    padding:
      20px
      23px
      69px !important;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    max-width:450px;
    font-size:21px;
  }

  body.kh-dashboard-home .kh60-balance-number{
    font-size:37px;
  }
}


/* ==========================================================
   MOBILE — closer to reference
   ========================================================== */

@media(max-width:760px){

  body.kh-dashboard-home .kh60-header{
    min-height:0 !important;

    padding:
      max(17px,env(safe-area-inset-top))
      15px
      68px !important;

    border-radius:0 0 31px 31px;
  }


  body.kh-dashboard-home .kh60-head-row{
    min-height:auto;
  }


  body.kh-dashboard-home .kh60-company{
    gap:8px;
  }


  body.kh-dashboard-home .kh60-logo{
    width:48px;
    height:48px;
    flex-basis:48px;

    border-radius:13px;
  }


  body.kh-dashboard-home .kh60-company-copy h1{
    max-width:205px;

    margin-bottom:2px;

    font-size:16px;
    line-height:1.4;
  }


  body.kh-dashboard-home .kh60-company-copy span{
    font-size:10px;
  }


  body.kh-dashboard-home .kh60-head-actions{
    gap:5px;
  }


  body.kh-dashboard-home .kh60-round-btn{
    width:41px;
    height:41px;

    border-radius:13px;
  }


  body.kh-dashboard-home .kh60-menu-btn span{
    width:19px;
    height:2px;
  }


  body.kh-dashboard-home .kh60-bell svg{
    width:21px;
    height:21px;
  }


  /* user + date */

  body.kh-dashboard-home .kh60-meta-row{
    margin-top:14px !important;
  }


  body.kh-dashboard-home .kh60-avatar{
    width:42px;
    height:42px;
  }


  body.kh-dashboard-home .kh60-avatar svg{
    width:22px;
    height:22px;
  }


  body.kh-dashboard-home .kh60-user-copy small{
    font-size:9px;
  }


  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:14px;
  }


  body.kh-dashboard-home .kh60-online{
    font-size:8.5px;
  }


  body.kh-dashboard-home .kh60-date{
    max-width:165px;

    font-size:10px;
    line-height:1.35;
  }


  body.kh-dashboard-home .kh60-calendar{
    width:27px;
    height:27px;

    flex-basis:27px;
  }


  /* balance */

  body.kh-dashboard-home .kh60-balance-card{
    margin:
      -43px
      12px
      0 !important;

    min-height:158px !important;

    padding:
      18px
      15px !important;

    gap:10px;

    border-radius:23px;
  }


  body.kh-dashboard-home .kh60-wallet{
    width:53px;
    height:53px;
    flex-basis:53px;

    border-radius:17px;
  }


  body.kh-dashboard-home .kh60-wallet svg{
    width:28px;
    height:28px;
  }


  body.kh-dashboard-home .kh60-balance-title{
    margin-bottom:4px;

    font-size:12.5px;
  }


  body.kh-dashboard-home .kh60-balance-number{
    font-size:29px;

    letter-spacing:-.6px;
  }


  body.kh-dashboard-home .kh60-balance-number small{
    font-size:10px;
  }


  body.kh-dashboard-home .kh60-customer-pill{
    padding:6px 8px;

    font-size:8px;
  }


  body.kh-dashboard-home .kh60-customer-pill strong{
    font-size:11px;
  }


  body.kh-dashboard-home .kh60-people svg{
    width:13px;
    height:13px;
  }


  body.kh-dashboard-home .kh60-balance-bottom{
    margin-top:7px;
  }


  body.kh-dashboard-home .kh60-balance-note{
    font-size:8px;
  }


  body.kh-dashboard-home .kh60-up svg{
    width:15px;
    height:15px;
  }


  body.kh-dashboard-home .kh60-mini-chart{
    width:112px;
    max-width:43%;
    height:43px;
  }
}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media(max-width:390px){

  body.kh-dashboard-home .kh60-header{
    padding-left:11px !important;
    padding-right:11px !important;
  }


  body.kh-dashboard-home .kh60-logo{
    width:43px;
    height:43px;
    flex-basis:43px;
  }


  body.kh-dashboard-home .kh60-company-copy h1{
    max-width:142px;
    font-size:13px;
  }


  body.kh-dashboard-home .kh60-company-copy span{
    font-size:9px;
  }


  body.kh-dashboard-home .kh60-round-btn{
    width:37px;
    height:37px;
  }


  body.kh-dashboard-home .kh60-meta-row{
    gap:6px;
  }


  body.kh-dashboard-home .kh60-date{
    max-width:132px;
    font-size:8.5px;
  }


  body.kh-dashboard-home .kh60-balance-card{
    margin-left:8px !important;
    margin-right:8px !important;

    padding:
      16px
      11px !important;
  }


  body.kh-dashboard-home .kh60-wallet{
    width:45px;
    height:45px;
    flex-basis:45px;
  }


  body.kh-dashboard-home .kh60-wallet svg{
    width:24px;
    height:24px;
  }


  body.kh-dashboard-home .kh60-balance-title{
    font-size:11px;
  }


  body.kh-dashboard-home .kh60-balance-number{
    font-size:25px;
  }


  body.kh-dashboard-home .kh60-customer-pill{
    padding:5px 6px;
  }


  body.kh-dashboard-home .kh60-mini-chart{
    width:87px;
  }
}


/* ==========================================================
   KashfHesab V60.3 — Desktop Two Equal Cards + Compact Hero
   DESKTOP ONLY
   ========================================================== */

@media(min-width:761px){

  /*
   * البطاقة الأولى: الهيدر
   * أقل ارتفاع ممكن مع الحفاظ على كل العناصر.
   */
  body.kh-dashboard-home .kh60-header{
    min-height:0 !important;

    padding:
      16px
      24px
      17px !important;

    margin:0 !important;

    border-radius:24px !important;
  }


  /*
   * السطر الأول يصبح أكثر ضغطاً
   */
  body.kh-dashboard-home .kh60-head-row{
    min-height:0 !important;

    align-items:center !important;

    gap:16px !important;
  }


  /* الشعار أصغر قليلاً */
  body.kh-dashboard-home .kh60-logo{
    width:52px !important;
    height:52px !important;
    flex-basis:52px !important;

    border-radius:14px !important;
  }


  /* اسم الشركة */
  body.kh-dashboard-home .kh60-company{
    gap:10px !important;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    margin:0 0 2px !important;

    font-size:21px !important;
    line-height:1.25 !important;
  }

  body.kh-dashboard-home .kh60-company-copy span{
    font-size:11px !important;
  }


  /*
   * أزرار القائمة والتنبيهات
   */
  body.kh-dashboard-home .kh60-head-actions{
    padding-top:0 !important;
  }

  body.kh-dashboard-home .kh60-round-btn{
    width:44px !important;
    height:44px !important;

    border-radius:14px !important;
  }


  /*
   * المستخدم والتاريخ
   * نقلل المسافات الرأسية
   */
  body.kh-dashboard-home .kh60-meta-row{
    margin-top:8px !important;

    min-height:0 !important;

    align-items:center !important;
  }

  body.kh-dashboard-home .kh60-avatar{
    width:39px !important;
    height:39px !important;
  }

  body.kh-dashboard-home .kh60-avatar svg{
    width:21px !important;
    height:21px !important;
  }

  body.kh-dashboard-home .kh60-user-copy small{
    font-size:9px !important;
  }

  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:14px !important;
  }

  body.kh-dashboard-home .kh60-online{
    margin-top:0 !important;
    font-size:8px !important;
  }

  body.kh-dashboard-home .kh60-date{
    font-size:11px !important;
  }

  body.kh-dashboard-home .kh60-calendar{
    width:27px !important;
    height:27px !important;
  }


  /*
   * البطاقة الثانية: إجمالي الذمم
   *
   * لا تداخل.
   * نفس عرض الهيدر بالضبط.
   */
  body.kh-dashboard-home .kh60-balance-card{
    width:100% !important;

    margin:
      14px
      0
      0 !important;

    box-sizing:border-box !important;

    min-height:128px !important;

    padding:
      17px
      24px !important;

    border-radius:24px !important;
  }


  /*
   * لأن البطاقة أصبحت أقل ارتفاعاً
   * نصغر العناصر قليلاً.
   */
  body.kh-dashboard-home .kh60-wallet{
    width:58px !important;
    height:58px !important;
    flex-basis:58px !important;

    border-radius:17px !important;
  }

  body.kh-dashboard-home .kh60-wallet svg{
    width:30px !important;
    height:30px !important;
  }

  body.kh-dashboard-home .kh60-balance-title{
    margin-bottom:3px !important;

    font-size:14px !important;
  }

  body.kh-dashboard-home .kh60-balance-number{
    font-size:35px !important;
    line-height:1 !important;
  }

  body.kh-dashboard-home .kh60-balance-number small{
    font-size:12px !important;
  }

  body.kh-dashboard-home .kh60-customer-pill{
    padding:7px 11px !important;
  }

  body.kh-dashboard-home .kh60-balance-bottom{
    margin-top:6px !important;
  }

  body.kh-dashboard-home .kh60-mini-chart{
    width:180px !important;
    height:43px !important;
  }


  /*
   * يمنع أي قواعد قديمة من إعادة التداخل
   */
  body.kh-dashboard-home .kh60-top{
    margin-bottom:18px !important;
  }
}


/* ==========================================================
   KashfHesab V60.3 — Desktop Two Equal Cards + Compact Hero
   DESKTOP ONLY
   ========================================================== */

@media(min-width:761px){

  /*
   * البطاقة الأولى: الهيدر
   * أقل ارتفاع ممكن مع الحفاظ على كل العناصر.
   */
  body.kh-dashboard-home .kh60-header{
    min-height:0 !important;

    padding:
      16px
      24px
      17px !important;

    margin:0 !important;

    border-radius:24px !important;
  }


  /*
   * السطر الأول يصبح أكثر ضغطاً
   */
  body.kh-dashboard-home .kh60-head-row{
    min-height:0 !important;

    align-items:center !important;

    gap:16px !important;
  }


  /* الشعار أصغر قليلاً */
  body.kh-dashboard-home .kh60-logo{
    width:52px !important;
    height:52px !important;
    flex-basis:52px !important;

    border-radius:14px !important;
  }


  /* اسم الشركة */
  body.kh-dashboard-home .kh60-company{
    gap:10px !important;
  }

  body.kh-dashboard-home .kh60-company-copy h1{
    margin:0 0 2px !important;

    font-size:21px !important;
    line-height:1.25 !important;
  }

  body.kh-dashboard-home .kh60-company-copy span{
    font-size:11px !important;
  }


  /*
   * أزرار القائمة والتنبيهات
   */
  body.kh-dashboard-home .kh60-head-actions{
    padding-top:0 !important;
  }

  body.kh-dashboard-home .kh60-round-btn{
    width:44px !important;
    height:44px !important;

    border-radius:14px !important;
  }


  /*
   * المستخدم والتاريخ
   * نقلل المسافات الرأسية
   */
  body.kh-dashboard-home .kh60-meta-row{
    margin-top:8px !important;

    min-height:0 !important;

    align-items:center !important;
  }

  body.kh-dashboard-home .kh60-avatar{
    width:39px !important;
    height:39px !important;
  }

  body.kh-dashboard-home .kh60-avatar svg{
    width:21px !important;
    height:21px !important;
  }

  body.kh-dashboard-home .kh60-user-copy small{
    font-size:9px !important;
  }

  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:14px !important;
  }

  body.kh-dashboard-home .kh60-online{
    margin-top:0 !important;
    font-size:8px !important;
  }

  body.kh-dashboard-home .kh60-date{
    font-size:11px !important;
  }

  body.kh-dashboard-home .kh60-calendar{
    width:27px !important;
    height:27px !important;
  }


  /*
   * البطاقة الثانية: إجمالي الذمم
   *
   * لا تداخل.
   * نفس عرض الهيدر بالضبط.
   */
  body.kh-dashboard-home .kh60-balance-card{
    width:100% !important;

    margin:
      14px
      0
      0 !important;

    box-sizing:border-box !important;

    min-height:128px !important;

    padding:
      17px
      24px !important;

    border-radius:24px !important;
  }


  /*
   * لأن البطاقة أصبحت أقل ارتفاعاً
   * نصغر العناصر قليلاً.
   */
  body.kh-dashboard-home .kh60-wallet{
    width:58px !important;
    height:58px !important;
    flex-basis:58px !important;

    border-radius:17px !important;
  }

  body.kh-dashboard-home .kh60-wallet svg{
    width:30px !important;
    height:30px !important;
  }

  body.kh-dashboard-home .kh60-balance-title{
    margin-bottom:3px !important;

    font-size:14px !important;
  }

  body.kh-dashboard-home .kh60-balance-number{
    font-size:35px !important;
    line-height:1 !important;
  }

  body.kh-dashboard-home .kh60-balance-number small{
    font-size:12px !important;
  }

  body.kh-dashboard-home .kh60-customer-pill{
    padding:7px 11px !important;
  }

  body.kh-dashboard-home .kh60-balance-bottom{
    margin-top:6px !important;
  }

  body.kh-dashboard-home .kh60-mini-chart{
    width:180px !important;
    height:43px !important;
  }


  /*
   * يمنع أي قواعد قديمة من إعادة التداخل
   */
  body.kh-dashboard-home .kh60-top{
    margin-bottom:18px !important;
  }
}


/* ==========================================================
   KashfHesab V60.5 — Forced Desktop Header
   ========================================================== */


/* DESKTOP */
@media(min-width:761px){

  body.kh-dashboard-home .kh60-header{
    padding:11px 18px 12px !important;
    min-height:0 !important;
  }


  body.kh-dashboard-home .kh605-head-row{
    display:flex !important;

    flex-direction:row !important;

    align-items:center !important;

    justify-content:space-between !important;

    width:100% !important;

    min-height:48px !important;

    direction:rtl !important;

    gap:15px !important;
  }


  /*
   * RIGHT:
   * menu + bell + company
   */
  body.kh-dashboard-home .kh605-right{
    display:flex !important;

    flex-direction:row !important;

    align-items:center !important;

    justify-content:flex-start !important;

    gap:7px !important;

    min-width:0 !important;

    direction:rtl !important;

    order:1 !important;
  }


  /*
   * menu is absolute first element at right
   */
  body.kh-dashboard-home .kh605-menu{
    order:1 !important;

    width:42px !important;
    height:42px !important;

    flex:0 0 42px !important;

    margin:0 !important;

    position:relative !important;

    z-index:100 !important;

    pointer-events:auto !important;

    cursor:pointer !important;
  }


  body.kh-dashboard-home .kh605-menu span{
    width:20px !important;
    height:2px !important;

    pointer-events:none !important;
  }


  body.kh-dashboard-home .kh605-bell{
    order:2 !important;

    width:42px !important;
    height:42px !important;

    flex:0 0 42px !important;

    margin:0 !important;
  }


  body.kh-dashboard-home .kh605-company-copy{
    order:3 !important;

    min-width:0 !important;

    margin-right:5px !important;

    direction:rtl !important;

    text-align:right !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    margin:0 !important;

    max-width:540px !important;

    overflow:hidden !important;

    text-overflow:ellipsis !important;

    white-space:nowrap !important;

    color:#fff !important;

    font-size:16px !important;

    line-height:1.2 !important;

    font-weight:850 !important;
  }


  body.kh-dashboard-home .kh605-company-copy span{
    display:block !important;

    margin-top:2px !important;

    color:rgba(255,255,255,.62) !important;

    font-size:9px !important;
  }


  /*
   * LOGO — FAR LEFT
   */
  body.kh-dashboard-home .kh605-logo{
    order:2 !important;

    width:46px !important;
    height:46px !important;

    flex:0 0 46px !important;

    display:grid !important;

    place-items:center !important;

    overflow:hidden !important;

    margin-left:0 !important;
    margin-right:auto !important;

    border-radius:12px !important;

    background:#fff !important;

    border:1px solid rgba(255,255,255,.25) !important;

    box-shadow:0 6px 16px rgba(0,0,0,.13) !important;
  }


  body.kh-dashboard-home .kh605-logo img{
    display:block !important;

    width:100% !important;
    height:100% !important;

    padding:2px !important;

    box-sizing:border-box !important;

    object-fit:contain !important;

    background:#fff !important;
  }


  body.kh-dashboard-home .kh605-logo strong{
    color:#0b4f91 !important;

    font-size:14px !important;
  }


  /*
   * SECOND ROW
   */
  body.kh-dashboard-home .kh60-meta-row{
    margin-top:4px !important;

    min-height:31px !important;
  }


  body.kh-dashboard-home .kh60-avatar{
    width:32px !important;
    height:32px !important;
  }


  body.kh-dashboard-home .kh60-avatar svg{
    width:17px !important;
    height:17px !important;
  }


  body.kh-dashboard-home .kh60-user-copy small{
    font-size:7.5px !important;
  }


  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:11px !important;
  }


  body.kh-dashboard-home .kh60-online{
    font-size:7px !important;
  }


  body.kh-dashboard-home .kh60-date{
    font-size:9px !important;
  }


  body.kh-dashboard-home .kh60-calendar{
    width:23px !important;
    height:23px !important;

    flex-basis:23px !important;
  }

}


/* ==========================================================
   MOBILE
   Reconstruct same familiar layout
   ========================================================== */

@media(max-width:760px){

  body.kh-dashboard-home .kh605-head-row{
    display:flex !important;

    align-items:flex-start !important;

    justify-content:space-between !important;

    gap:8px !important;

    direction:rtl !important;
  }


  body.kh-dashboard-home .kh605-right{
    display:flex !important;

    align-items:center !important;

    gap:5px !important;

    min-width:0 !important;

    direction:rtl !important;
  }


  body.kh-dashboard-home .kh605-company-copy{
    min-width:0 !important;

    direction:rtl !important;

    text-align:right !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    margin:0 !important;

    max-width:180px !important;

    color:#fff !important;

    font-size:14px !important;

    line-height:1.35 !important;

    font-weight:900 !important;
  }


  body.kh-dashboard-home .kh605-company-copy span{
    display:block !important;

    margin-top:2px !important;

    color:rgba(255,255,255,.65) !important;

    font-size:9px !important;
  }


  body.kh-dashboard-home .kh605-menu,
  body.kh-dashboard-home .kh605-bell{
    width:39px !important;
    height:39px !important;

    flex:0 0 39px !important;
  }


  body.kh-dashboard-home .kh605-logo{
    width:45px !important;
    height:45px !important;

    flex:0 0 45px !important;

    display:grid !important;

    place-items:center !important;

    overflow:hidden !important;

    border-radius:12px !important;

    background:#fff !important;
  }


  body.kh-dashboard-home .kh605-logo img{
    width:100% !important;
    height:100% !important;

    padding:2px !important;

    box-sizing:border-box !important;

    object-fit:contain !important;
  }

}


/* ==========================================================
   KashfHesab V60.6 — Sidebar Closed Default
   Home desktop sidebar opens only from hamburger
   ========================================================== */

@media(min-width:761px){

  body.kh-dashboard-home .kh605-menu{
    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    visibility:visible !important;

    opacity:1 !important;

    pointer-events:auto !important;

    cursor:pointer !important;

    z-index:1000 !important;
  }

}



/* ==========================================================
   KashfHesab V60.8 — Desktop Sidebar Real Toggle
   CLOSED by default
   OPEN only when body.kh-sidebar-open exists
   ========================================================== */

@media (min-width:900px){

  /* ------------------------------------------
     CLOSED — DEFAULT
     ------------------------------------------ */

  body:has(.kh-sidebar) .kh-sidebar{
    right:0 !important;
    transform:translateX(105%) !important;

    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;

    transition:
      transform .24s ease,
      opacity .20s ease,
      visibility .24s ease !important;
  }


  /* ------------------------------------------
     OPEN
     ------------------------------------------ */

  body.kh-sidebar-open .kh-sidebar{
    transform:translateX(0) !important;

    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }


  /* ------------------------------------------
     SCRIM — CLOSED
     ------------------------------------------ */

  body:has(.kh-sidebar) .kh-sidebar-scrim{
    position:fixed !important;
    inset:0 !important;

    z-index:1150 !important;

    display:block !important;

    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;

    background:rgba(15,23,42,.38) !important;
    backdrop-filter:blur(1px);

    transition:
      opacity .22s ease,
      visibility .22s ease !important;
  }


  /* ------------------------------------------
     SCRIM — OPEN
     ------------------------------------------ */

  body.kh-sidebar-open .kh-sidebar-scrim{
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }


  /* ------------------------------------------
     DO NOT RESERVE SIDEBAR SPACE WHEN CLOSED
     ------------------------------------------ */

  body:has(.kh-sidebar){
    padding-right:0 !important;
  }


  /* ------------------------------------------
     HOME PAGE USES FULL WIDTH
     ------------------------------------------ */

  body.kh-dashboard-home .kh50-home-wrap{
    width:auto !important;
    max-width:none !important;
  }


  /* ------------------------------------------
     OUR HEADER HAMBURGER
     ------------------------------------------ */

  body.kh-dashboard-home .kh605-menu{
    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    visibility:visible !important;
    opacity:1 !important;

    pointer-events:auto !important;
    cursor:pointer !important;

    position:relative !important;
    z-index:1301 !important;
  }


  /*
   * Hide the OLD floating sidebar toggle on desktop.
   * We use the hamburger inside V60.5 header instead.
   */
  body:has(.kh-sidebar) > .kh-sidebar-toggle,
  body:has(.kh-sidebar) .kh-sidebar-toggle:not(.kh605-menu){
    display:none !important;
  }


  /* ------------------------------------------
     CLOSE BUTTON INSIDE DESKTOP SIDEBAR
     ------------------------------------------ */

  body:has(.kh-sidebar) .kh-sidebar-close{
    width:34px !important;
    height:34px !important;

    flex:0 0 34px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    border:1px solid rgba(255,255,255,.09) !important;
    border-radius:9px !important;

    background:rgba(255,255,255,.05) !important;
    color:#cbd5e1 !important;

    font-size:22px !important;
    line-height:1 !important;

    cursor:pointer !important;
  }


  /* Do not lock the whole desktop page */
  body.kh-sidebar-open{
    overflow:auto !important;
  }

}



/* ==========================================================
   KashfHesab V60.9 — Mobile Header Final Alignment
   MOBILE ONLY
   ========================================================== */

@media (max-width:760px){

  /* =========================================
     HERO
     ========================================= */

  body.kh-dashboard-home .kh60-hero{
    position:relative !important;
    padding:
      12px
      16px
      24px !important;
  }


  /* =========================================
     REMOVE DUPLICATED OLD SYSTEM HAMBURGER
     Keep ONLY V60.5 hamburger
     ========================================= */

  body.kh-dashboard-home > .kh-sidebar-toggle,
  body.kh-dashboard-home .kh-sidebar-toggle:not(.kh605-menu){
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }


  /* =========================================
     HEADER STRUCTURE
     ========================================= */

  body.kh-dashboard-home .kh605-head-row{
    position:relative !important;

    display:flex !important;
    flex-direction:column !important;

    width:100% !important;
    min-height:116px !important;

    align-items:center !important;
    justify-content:flex-start !important;

    padding:46px 58px 0 !important;
    margin:0 !important;

    box-sizing:border-box !important;
  }


  /* =========================================
     COMPANY AREA — EXACT CENTER
     ========================================= */

  body.kh-dashboard-home .kh605-right{
    display:flex !important;

    width:100% !important;

    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;

    position:static !important;

    padding:0 !important;
    margin:0 !important;

    gap:0 !important;
  }


  body.kh-dashboard-home .kh605-company-copy{
    position:absolute !important;

    top:50px !important;
    left:50% !important;

    width:min(66vw,310px) !important;

    transform:translateX(-50%) !important;

    margin:0 !important;
    padding:0 !important;

    text-align:center !important;
    direction:rtl !important;

    z-index:3 !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    margin:0 !important;

    font-size:15px !important;
    line-height:1.45 !important;

    font-weight:800 !important;

    text-align:center !important;

    white-space:normal !important;

    max-width:100% !important;
  }


  body.kh-dashboard-home .kh605-company-copy span{
    display:block !important;

    margin-top:2px !important;

    font-size:10px !important;
    line-height:1.2 !important;

    text-align:center !important;

    opacity:.72 !important;
  }


  /* =========================================
     LOGO — CENTERED WITH COMPANY IDENTITY
     ========================================= */

  body.kh-dashboard-home .kh605-logo{
    position:absolute !important;

    top:46px !important;
    left:16px !important;

    width:50px !important;
    height:50px !important;

    margin:0 !important;

    border-radius:13px !important;

    z-index:4 !important;
  }


  body.kh-dashboard-home .kh605-logo img{
    width:100% !important;
    height:100% !important;

    object-fit:contain !important;

    border-radius:13px !important;
  }


  /* =========================================
     ONE HAMBURGER — TOP RIGHT
     ========================================= */

  body.kh-dashboard-home .kh605-menu{
    position:absolute !important;

    top:0 !important;
    right:0 !important;

    width:42px !important;
    height:42px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    margin:0 !important;

    border-radius:12px !important;

    visibility:visible !important;
    opacity:1 !important;

    pointer-events:auto !important;

    z-index:20 !important;
  }


  /* =========================================
     BELL BESIDE HAMBURGER
     ========================================= */

  body.kh-dashboard-home .kh605-bell{
    position:absolute !important;

    top:0 !important;
    right:48px !important;

    width:42px !important;
    height:42px !important;

    margin:0 !important;

    border-radius:12px !important;

    z-index:19 !important;
  }


  /* =========================================
     USER + DATE BAR
     MOVE ABOVE LOGO / COMPANY
     ========================================= */

  body.kh-dashboard-home .kh60-meta-row{
    position:absolute !important;

    top:12px !important;
    left:112px !important;
    right:112px !important;

    width:auto !important;

    display:flex !important;

    align-items:center !important;
    justify-content:space-between !important;

    gap:8px !important;

    margin:0 !important;
    padding:0 !important;

    z-index:10 !important;
  }


  /* USER */

  body.kh-dashboard-home .kh60-user{
    min-width:0 !important;

    display:flex !important;
    align-items:center !important;

    gap:5px !important;

    margin:0 !important;
    padding:0 !important;
  }


  body.kh-dashboard-home .kh60-user-avatar{
    width:26px !important;
    height:26px !important;

    flex:0 0 26px !important;
  }


  body.kh-dashboard-home .kh60-user-copy{
    min-width:0 !important;
  }


  body.kh-dashboard-home .kh60-user-copy > span,
  body.kh-dashboard-home .kh60-user-copy small{
    font-size:8px !important;
    line-height:1.05 !important;
  }


  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:11px !important;
    line-height:1.15 !important;
  }


  /* DATE */

  body.kh-dashboard-home .kh60-date{
    min-width:0 !important;

    display:flex !important;
    align-items:center !important;

    gap:4px !important;

    margin:0 !important;
    padding:0 !important;

    font-size:9px !important;
    line-height:1.15 !important;

    white-space:nowrap !important;
  }


  body.kh-dashboard-home .kh60-date-icon{
    width:25px !important;
    height:25px !important;

    flex:0 0 25px !important;
  }


  /* =========================================
     BALANCE CARD SPACING
     ========================================= */

  body.kh-dashboard-home .kh60-balance-card{
    margin-top:8px !important;
  }

}


/* ==========================================================
   Extra narrow phones
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh605-head-row{
    padding-left:52px !important;
    padding-right:52px !important;
  }

  body.kh-dashboard-home .kh605-company-copy{
    width:64vw !important;
  }

  body.kh-dashboard-home .kh605-company-copy h1{
    font-size:13px !important;
  }

  body.kh-dashboard-home .kh605-logo{
    width:46px !important;
    height:46px !important;
  }

  body.kh-dashboard-home .kh60-meta-row{
    left:102px !important;
    right:102px !important;
  }

  body.kh-dashboard-home .kh60-date{
    font-size:8px !important;
  }

  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:10px !important;
  }

}



/* ==========================================================
   KashfHesab V60.9.1 — Mobile Header Position Only
   Keep V60.9 styling — rearrange vertical positions only
   ========================================================== */

@media (max-width:760px){

  /*
   * More natural compact header.
   * Row 1 = date/time
   * Row 2 = company identity
   */

  body.kh-dashboard-home .kh605-head-row{
    min-height:128px !important;
    padding-top:48px !important;
  }


  /* -----------------------------------------
     DATE / TIME
     Top row, centered exactly
     ----------------------------------------- */

  body.kh-dashboard-home .kh60-meta-row{
    top:10px !important;

    left:50% !important;
    right:auto !important;

    width:auto !important;
    max-width:calc(100% - 210px) !important;

    transform:translateX(-50%) !important;

    justify-content:center !important;

    gap:10px !important;
  }


  /*
   * Put date first visually.
   * Keep user information beside it without changing styling.
   */

  body.kh-dashboard-home .kh60-date{
    order:1 !important;
  }

  body.kh-dashboard-home .kh60-user{
    order:2 !important;
  }


  /* -----------------------------------------
     COMPANY NAME
     Directly below top information row
     ----------------------------------------- */

  body.kh-dashboard-home .kh605-company-copy{
    top:54px !important;

    left:50% !important;

    width:min(68vw,330px) !important;

    transform:translateX(-50%) !important;

    text-align:center !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    font-size:14px !important;
    line-height:1.35 !important;

    text-align:center !important;

    margin:0 !important;
  }


  body.kh-dashboard-home .kh605-company-copy span{
    margin-top:3px !important;

    font-size:10px !important;

    text-align:center !important;
  }


  /* -----------------------------------------
     LOGO
     Same identity row as company
     ----------------------------------------- */

  body.kh-dashboard-home .kh605-logo{
    top:48px !important;
    left:16px !important;

    width:48px !important;
    height:48px !important;
  }


  /* -----------------------------------------
     KEEP MENU + BELL IN CURRENT POSITION
     ----------------------------------------- */

  body.kh-dashboard-home .kh605-menu{
    top:0 !important;
    right:0 !important;
  }

  body.kh-dashboard-home .kh605-bell{
    top:0 !important;
    right:48px !important;
  }

}


@media (max-width:420px){

  body.kh-dashboard-home .kh60-meta-row{
    top:9px !important;

    max-width:calc(100% - 198px) !important;

    gap:6px !important;
  }

  body.kh-dashboard-home .kh605-company-copy{
    top:52px !important;
    width:67vw !important;
  }

  body.kh-dashboard-home .kh605-company-copy h1{
    font-size:13px !important;
  }

  body.kh-dashboard-home .kh605-logo{
    top:48px !important;

    width:45px !important;
    height:45px !important;
  }

}



/* ==========================================================
   KashfHesab V60.10 — Professional Mobile Header
   Final structural mobile alignment
   Desktop untouched
   ========================================================== */

@media (max-width:760px){

  /* ========================================================
     HERO — remove excessive empty vertical space
     ======================================================== */

  body.kh-dashboard-home .kh60-hero{
    position:relative !important;

    min-height:0 !important;

    padding:
      12px
      14px
      22px !important;

    box-sizing:border-box !important;
  }


  /* ========================================================
     HEADER CONTAINER
     ======================================================== */

  body.kh-dashboard-home .kh605-head-row{
    position:relative !important;

    display:block !important;

    width:100% !important;
    min-height:132px !important;
    height:132px !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
  }


  /* ========================================================
     REMOVE ORIGINAL DUPLICATE FLOATING MENU
     ======================================================== */

  body.kh-dashboard-home > .kh-sidebar-toggle,
  body.kh-dashboard-home .kh-sidebar-toggle:not(.kh605-menu){
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }


  /* ========================================================
     ROW 1
     User | Date | Bell + Menu
     ======================================================== */

  body.kh-dashboard-home .kh60-meta-row{
    position:absolute !important;

    top:4px !important;
    left:4px !important;
    right:112px !important;

    width:auto !important;
    height:44px !important;

    display:flex !important;
    flex-direction:row !important;

    align-items:center !important;
    justify-content:space-between !important;

    gap:8px !important;

    margin:0 !important;
    padding:0 !important;

    transform:none !important;

    z-index:12 !important;
  }


  /* USER — LEFT */

  body.kh-dashboard-home .kh60-user{
    order:1 !important;

    display:flex !important;
    flex-direction:row !important;

    align-items:center !important;

    min-width:0 !important;
    max-width:105px !important;

    gap:5px !important;

    margin:0 !important;
    padding:0 !important;
  }


  body.kh-dashboard-home .kh60-user-avatar{
    width:32px !important;
    height:32px !important;

    flex:0 0 32px !important;

    margin:0 !important;
  }


  body.kh-dashboard-home .kh60-user-copy{
    min-width:0 !important;

    text-align:left !important;
  }


  body.kh-dashboard-home .kh60-user-copy > span,
  body.kh-dashboard-home .kh60-user-copy small{
    font-size:7.5px !important;
    line-height:1.05 !important;
  }


  body.kh-dashboard-home .kh60-user-copy strong{
    display:block !important;

    font-size:11px !important;
    line-height:1.05 !important;

    white-space:nowrap !important;
  }


  /* DATE — CENTER OF AVAILABLE TOP ROW */

  body.kh-dashboard-home .kh60-date{
    order:2 !important;

    display:flex !important;
    flex-direction:row !important;

    align-items:center !important;
    justify-content:center !important;

    min-width:0 !important;

    gap:4px !important;

    margin:0 auto !important;
    padding:0 !important;

    font-size:9px !important;
    line-height:1.15 !important;

    white-space:nowrap !important;

    text-align:center !important;
  }


  body.kh-dashboard-home .kh60-date-icon{
    width:28px !important;
    height:28px !important;

    flex:0 0 28px !important;

    margin:0 !important;
  }


  /* ========================================================
     RIGHT CONTROLS
     ======================================================== */

  body.kh-dashboard-home .kh605-right{
    position:static !important;

    display:block !important;

    width:auto !important;

    margin:0 !important;
    padding:0 !important;
  }


  body.kh-dashboard-home .kh605-menu{
    position:absolute !important;

    top:4px !important;
    right:4px !important;

    width:44px !important;
    height:44px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    margin:0 !important;

    border-radius:13px !important;

    visibility:visible !important;
    opacity:1 !important;

    pointer-events:auto !important;

    z-index:20 !important;
  }


  body.kh-dashboard-home .kh605-bell{
    position:absolute !important;

    top:4px !important;
    right:54px !important;

    width:44px !important;
    height:44px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    margin:0 !important;

    border-radius:13px !important;

    z-index:19 !important;
  }


  /* ========================================================
     ROW 2 — COMPANY IDENTITY
     Logo + company as ONE centered group
     ======================================================== */

  body.kh-dashboard-home .kh605-company-copy{
    position:absolute !important;

    top:64px !important;
    left:50% !important;

    width:auto !important;
    max-width:calc(100% - 104px) !important;

    transform:translateX(-42%) !important;

    margin:0 !important;
    padding:0 !important;

    direction:rtl !important;
    text-align:center !important;

    z-index:5 !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    display:block !important;

    margin:0 !important;
    padding:0 !important;

    max-width:300px !important;

    font-size:13px !important;
    line-height:1.4 !important;
    font-weight:800 !important;

    white-space:normal !important;

    text-align:center !important;
  }


  body.kh-dashboard-home .kh605-company-copy span{
    display:block !important;

    margin-top:3px !important;

    font-size:9px !important;
    line-height:1.1 !important;

    text-align:center !important;

    opacity:.70 !important;
  }


  /* LOGO — part of same centered identity group */

  body.kh-dashboard-home .kh605-logo{
    position:absolute !important;

    top:59px !important;
    left:calc(50% - 174px) !important;

    width:52px !important;
    height:52px !important;

    margin:0 !important;
    padding:0 !important;

    border-radius:13px !important;

    z-index:6 !important;
  }


  body.kh-dashboard-home .kh605-logo img{
    display:block !important;

    width:100% !important;
    height:100% !important;

    object-fit:contain !important;

    border-radius:13px !important;
  }


  /* ========================================================
     Remove previous spacing side-effects
     ======================================================== */

  body.kh-dashboard-home .kh60-balance-card{
    margin-top:10px !important;
  }

}


/* ==========================================================
   SMALL MOBILE — 420px and below
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh605-head-row{
    min-height:128px !important;
    height:128px !important;
  }


  body.kh-dashboard-home .kh60-meta-row{
    left:2px !important;
    right:104px !important;

    gap:4px !important;
  }


  body.kh-dashboard-home .kh60-user{
    max-width:88px !important;

    gap:3px !important;
  }


  body.kh-dashboard-home .kh60-user-avatar{
    width:28px !important;
    height:28px !important;

    flex-basis:28px !important;
  }


  body.kh-dashboard-home .kh60-user-copy strong{
    font-size:10px !important;
  }


  body.kh-dashboard-home .kh60-user-copy > span,
  body.kh-dashboard-home .kh60-user-copy small{
    font-size:7px !important;
  }


  body.kh-dashboard-home .kh60-date{
    font-size:8px !important;

    gap:3px !important;
  }


  body.kh-dashboard-home .kh60-date-icon{
    width:25px !important;
    height:25px !important;

    flex-basis:25px !important;
  }


  body.kh-dashboard-home .kh605-menu,
  body.kh-dashboard-home .kh605-bell{
    width:41px !important;
    height:41px !important;
  }


  body.kh-dashboard-home .kh605-bell{
    right:49px !important;
  }


  body.kh-dashboard-home .kh605-company-copy{
    top:61px !important;

    max-width:calc(100% - 92px) !important;

    transform:translateX(-39%) !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    max-width:250px !important;

    font-size:12px !important;
    line-height:1.35 !important;
  }


  body.kh-dashboard-home .kh605-logo{
    top:57px !important;
    left:10px !important;

    width:48px !important;
    height:48px !important;
  }

}



/* ==========================================================
   KashfHesab V60.11 — Mobile Header Precision Alignment

   TOP:
   USER LEFT | DATE CENTER | BELL + MENU RIGHT

   BELOW:
   LOGO LEFT | COMPANY CENTER

   Compact hero height
   MOBILE ONLY
   ========================================================== */

@media (max-width:760px){

  /* ========================================================
     BLUE HERO — COMPACT TOTAL HEIGHT
     ======================================================== */

  body.kh-dashboard-home .kh60-hero{
    position:relative !important;

    min-height:0 !important;
    height:auto !important;

    padding:12px 14px 16px !important;

    box-sizing:border-box !important;
  }


  body.kh-dashboard-home .kh605-head-row{
    position:relative !important;

    display:block !important;

    width:100% !important;

    height:116px !important;
    min-height:116px !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;
  }


  /* ========================================================
     TOP INFORMATION ROW
     ======================================================== */

  body.kh-dashboard-home .kh60-meta-row{
    position:absolute !important;

    top:2px !important;
    left:0 !important;
    right:0 !important;

    width:100% !important;
    height:46px !important;

    display:block !important;

    margin:0 !important;
    padding:0 !important;

    transform:none !important;

    z-index:12 !important;
  }


  /* ========================================================
     USER — EXACT LEFT
     ======================================================== */

  body.kh-dashboard-home .kh60-user{
    position:absolute !important;

    top:0 !important;
    left:0 !important;

    width:112px !important;
    max-width:112px !important;
    height:44px !important;

    display:flex !important;
    flex-direction:row !important;

    align-items:center !important;
    justify-content:flex-start !important;

    gap:5px !important;

    margin:0 !important;
    padding:0 !important;

    direction:ltr !important;
  }


  body.kh-dashboard-home .kh60-user-avatar{
    width:38px !important;
    height:38px !important;

    flex:0 0 38px !important;

    margin:0 !important;
  }


  body.kh-dashboard-home .kh60-user-copy{
    min-width:0 !important;

    direction:rtl !important;
    text-align:left !important;
  }


  body.kh-dashboard-home .kh60-user-copy > span{
    font-size:7px !important;
    line-height:1 !important;
  }


  body.kh-dashboard-home .kh60-user-copy strong{
    display:block !important;

    margin:1px 0 !important;

    font-size:11px !important;
    line-height:1.05 !important;

    white-space:nowrap !important;
  }


  body.kh-dashboard-home .kh60-user-copy small{
    font-size:7px !important;
    line-height:1 !important;

    white-space:nowrap !important;
  }


  /* ========================================================
     DATE / TIME — EXACT CENTER OF SCREEN
     ======================================================== */

  body.kh-dashboard-home .kh60-date{
    position:absolute !important;

    top:50% !important;
    left:50% !important;

    width:auto !important;
    max-width:190px !important;

    transform:translate(-50%,-50%) !important;

    display:flex !important;
    flex-direction:row !important;

    align-items:center !important;
    justify-content:center !important;

    gap:4px !important;

    margin:0 !important;
    padding:0 !important;

    font-size:9px !important;
    line-height:1.15 !important;
    font-weight:700 !important;

    text-align:center !important;
    white-space:nowrap !important;

    direction:rtl !important;
  }


  body.kh-dashboard-home .kh60-date-icon{
    width:27px !important;
    height:27px !important;

    flex:0 0 27px !important;

    margin:0 !important;
  }


  /* ========================================================
     MENU + BELL — EXACT RIGHT, SAME LINE
     ======================================================== */

  body.kh-dashboard-home .kh605-menu,
  body.kh-dashboard-home .kh605-bell{
    top:2px !important;

    width:44px !important;
    height:44px !important;

    margin:0 !important;

    border-radius:13px !important;

    align-items:center !important;
    justify-content:center !important;
  }


  body.kh-dashboard-home .kh605-menu{
    position:absolute !important;

    right:0 !important;

    display:flex !important;

    z-index:20 !important;
  }


  body.kh-dashboard-home .kh605-bell{
    position:absolute !important;

    right:50px !important;

    display:flex !important;

    z-index:19 !important;
  }


  /* ========================================================
     COMPANY IDENTITY ROW
     ======================================================== */

  body.kh-dashboard-home .kh605-company-copy{
    position:absolute !important;

    top:62px !important;
    left:50% !important;

    width:min(68vw,315px) !important;
    max-width:315px !important;

    transform:translateX(-50%) !important;

    margin:0 !important;
    padding:0 !important;

    direction:rtl !important;
    text-align:center !important;

    z-index:5 !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    margin:0 !important;
    padding:0 !important;

    font-size:13px !important;
    line-height:1.3 !important;
    font-weight:800 !important;

    text-align:center !important;

    white-space:normal !important;
  }


  body.kh-dashboard-home .kh605-company-copy span{
    display:block !important;

    margin-top:2px !important;

    font-size:9px !important;
    line-height:1 !important;

    text-align:center !important;

    opacity:.68 !important;
  }


  /* ========================================================
     LOGO — LEFT, DIRECTLY BELOW USER
     ======================================================== */

  body.kh-dashboard-home .kh605-logo{
    position:absolute !important;

    top:57px !important;
    left:0 !important;

    width:48px !important;
    height:48px !important;

    margin:0 !important;
    padding:0 !important;

    border-radius:12px !important;

    z-index:6 !important;
  }


  body.kh-dashboard-home .kh605-logo img{
    display:block !important;

    width:100% !important;
    height:100% !important;

    object-fit:contain !important;

    border-radius:12px !important;
  }


  /* ========================================================
     ENSURE ONLY ONE HAMBURGER
     ======================================================== */

  body.kh-dashboard-home > .kh-sidebar-toggle,
  body.kh-dashboard-home .kh-sidebar-toggle:not(.kh605-menu){
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }


  /* ========================================================
     COMPRESS BLUE BANNER TO INTERNAL CONTENT
     ======================================================== */

  body.kh-dashboard-home .kh60-meta-row + *,
  body.kh-dashboard-home .kh605-head-row + .kh60-meta-row{
    margin-top:0 !important;
  }


  body.kh-dashboard-home .kh60-balance-card{
    margin-top:8px !important;
  }

}


/* ==========================================================
   NARROW MOBILE
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh605-head-row{
    height:112px !important;
    min-height:112px !important;
  }


  body.kh-dashboard-home .kh60-user{
    width:96px !important;
    max-width:96px !important;

    gap:3px !important;
  }


  body.kh-dashboard-home .kh60-user-avatar{
    width:34px !important;
    height:34px !important;

    flex-basis:34px !important;
  }


  body.kh-dashboard-home .kh60-date{
    max-width:155px !important;

    font-size:8px !important;
  }


  body.kh-dashboard-home .kh60-date-icon{
    width:24px !important;
    height:24px !important;

    flex-basis:24px !important;
  }


  body.kh-dashboard-home .kh605-menu,
  body.kh-dashboard-home .kh605-bell{
    width:41px !important;
    height:41px !important;
  }


  body.kh-dashboard-home .kh605-bell{
    right:47px !important;
  }


  body.kh-dashboard-home .kh605-company-copy{
    top:59px !important;

    width:68vw !important;
  }


  body.kh-dashboard-home .kh605-company-copy h1{
    font-size:12px !important;
  }


  body.kh-dashboard-home .kh605-logo{
    top:55px !important;

    width:44px !important;
    height:44px !important;
  }

}



/* ==========================================================
   KashfHesab V60.12 — Unified Mobile Header Grid

   ROW 1:
   USER LEFT | DATE CENTER | BELL + MENU RIGHT

   ROW 2:
   LOGO LEFT | COMPANY CENTER

   No absolute-position collisions.
   ========================================================== */

@media (max-width:760px){

  /* --------------------------------------------------------
     HERO
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh60-hero{
    height:auto !important;
    min-height:0 !important;

    padding:12px 14px 14px !important;

    box-sizing:border-box !important;
  }


  /* --------------------------------------------------------
     REAL GRID
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh6012-header{
    position:relative !important;

    width:100% !important;
    height:auto !important;
    min-height:0 !important;

    display:grid !important;

    grid-template-columns:
      minmax(92px,1fr)
      minmax(130px,1.35fr)
      minmax(96px,1fr) !important;

    grid-template-rows:
      48px
      auto !important;

    grid-template-areas:
      "user date controls"
      "logo company company" !important;

    column-gap:8px !important;
    row-gap:8px !important;

    align-items:center !important;

    margin:0 !important;
    padding:0 !important;

    box-sizing:border-box !important;

    direction:ltr !important;
  }


  /* ========================================================
     USER — TOP LEFT
     ======================================================== */

  body.kh-dashboard-home .kh6012-user{
    grid-area:user !important;

    position:static !important;

    width:auto !important;
    max-width:none !important;
    height:auto !important;

    display:flex !important;

    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;

    gap:5px !important;

    margin:0 !important;
    padding:0 !important;

    transform:none !important;

    direction:ltr !important;

    justify-self:start !important;
    align-self:center !important;
  }


  body.kh-dashboard-home .kh6012-user .kh60-avatar{
    width:36px !important;
    height:36px !important;

    flex:0 0 36px !important;

    margin:0 !important;
  }


  body.kh-dashboard-home .kh6012-user .kh60-user-copy{
    min-width:0 !important;

    direction:rtl !important;
    text-align:left !important;
  }


  body.kh-dashboard-home .kh6012-user .kh60-user-copy small{
    display:block !important;

    font-size:7px !important;
    line-height:1 !important;
  }


  body.kh-dashboard-home .kh6012-user .kh60-user-copy strong{
    display:block !important;

    margin:2px 0 !important;

    font-size:11px !important;
    line-height:1 !important;

    white-space:nowrap !important;
  }


  body.kh-dashboard-home .kh6012-user .kh60-online{
    display:flex !important;

    align-items:center !important;

    gap:3px !important;

    font-size:7px !important;
    line-height:1 !important;

    white-space:nowrap !important;
  }


  /* ========================================================
     DATE — TRUE TOP CENTER
     ======================================================== */

  body.kh-dashboard-home .kh6012-date{
    grid-area:date !important;

    position:static !important;

    width:auto !important;
    max-width:none !important;
    height:auto !important;

    display:flex !important;

    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;

    gap:5px !important;

    margin:0 !important;
    padding:0 !important;

    transform:none !important;

    justify-self:center !important;
    align-self:center !important;

    direction:rtl !important;

    white-space:nowrap !important;
  }


  body.kh-dashboard-home .kh6012-date .kh60-calendar{
    width:28px !important;
    height:28px !important;

    flex:0 0 28px !important;
  }


  body.kh-dashboard-home .kh6012-date strong{
    font-size:9px !important;
    line-height:1.1 !important;
    font-weight:700 !important;

    white-space:nowrap !important;
  }


  /* ========================================================
     CONTROLS — TOP RIGHT
     ======================================================== */

  body.kh-dashboard-home .kh6012-controls{
    grid-area:controls !important;

    display:flex !important;

    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-end !important;

    gap:6px !important;

    width:auto !important;
    height:auto !important;

    margin:0 !important;
    padding:0 !important;

    justify-self:end !important;
    align-self:center !important;

    direction:ltr !important;
  }


  body.kh-dashboard-home .kh6012-controls .kh605-bell,
  body.kh-dashboard-home .kh6012-controls .kh605-menu{
    position:relative !important;

    top:auto !important;
    right:auto !important;
    left:auto !important;

    width:42px !important;
    height:42px !important;

    flex:0 0 42px !important;

    display:flex !important;

    align-items:center !important;
    justify-content:center !important;

    margin:0 !important;

    transform:none !important;

    border-radius:12px !important;

    visibility:visible !important;
    opacity:1 !important;

    pointer-events:auto !important;
  }


  /* ========================================================
     LOGO — SECOND ROW LEFT, DIRECTLY BELOW USER
     ======================================================== */

  body.kh-dashboard-home .kh6012-logo{
    grid-area:logo !important;

    position:static !important;

    width:52px !important;
    height:52px !important;

    margin:0 !important;
    padding:0 !important;

    transform:none !important;

    justify-self:start !important;
    align-self:center !important;

    border-radius:13px !important;
  }


  body.kh-dashboard-home .kh6012-logo img{
    display:block !important;

    width:100% !important;
    height:100% !important;

    object-fit:contain !important;

    border-radius:13px !important;
  }


  /* ========================================================
     COMPANY — SECOND ROW CENTER
     ======================================================== */

  body.kh-dashboard-home .kh6012-company{
    grid-area:company !important;

    position:static !important;

    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 8px 0 0 !important;

    transform:none !important;

    justify-self:stretch !important;
    align-self:center !important;

    direction:rtl !important;
    text-align:center !important;
  }


  body.kh-dashboard-home .kh6012-company h1{
    width:100% !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    font-size:13px !important;
    line-height:1.35 !important;
    font-weight:800 !important;

    text-align:center !important;

    white-space:normal !important;
  }


  body.kh-dashboard-home .kh6012-company span{
    display:block !important;

    margin-top:3px !important;

    font-size:9px !important;
    line-height:1 !important;

    text-align:center !important;

    opacity:.68 !important;
  }


  /* ========================================================
     OLD MOBILE ELEMENTS / COLLISION RESET
     ======================================================== */

  body.kh-dashboard-home .kh60-meta-row{
    position:static !important;

    width:auto !important;
    height:auto !important;

    transform:none !important;
  }


  body.kh-dashboard-home > .kh-sidebar-toggle,
  body.kh-dashboard-home .kh-sidebar-toggle:not(.kh605-menu){
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }


  /* ========================================================
     HERO ENDS CLOSE TO CONTENT
     ======================================================== */

  body.kh-dashboard-home .kh60-balance-card{
    margin-top:8px !important;
  }

}


/* ==========================================================
   NARROW PHONES
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh6012-header{

    grid-template-columns:
      minmax(78px,.9fr)
      minmax(115px,1.25fr)
      minmax(88px,.9fr) !important;

    grid-template-rows:
      44px
      auto !important;

    column-gap:5px !important;
    row-gap:7px !important;
  }


  body.kh-dashboard-home .kh6012-user .kh60-avatar{
    width:31px !important;
    height:31px !important;

    flex-basis:31px !important;
  }


  body.kh-dashboard-home .kh6012-user .kh60-user-copy strong{
    font-size:10px !important;
  }


  body.kh-dashboard-home .kh6012-date{
    gap:3px !important;
  }


  body.kh-dashboard-home .kh6012-date .kh60-calendar{
    width:23px !important;
    height:23px !important;

    flex-basis:23px !important;
  }


  body.kh-dashboard-home .kh6012-date strong{
    font-size:8px !important;
  }


  body.kh-dashboard-home .kh6012-controls{
    gap:4px !important;
  }


  body.kh-dashboard-home .kh6012-controls .kh605-bell,
  body.kh-dashboard-home .kh6012-controls .kh605-menu{
    width:39px !important;
    height:39px !important;

    flex-basis:39px !important;
  }


  body.kh-dashboard-home .kh6012-logo{
    width:46px !important;
    height:46px !important;
  }


  body.kh-dashboard-home .kh6012-company h1{
    font-size:11.5px !important;
    line-height:1.3 !important;
  }

}



/* ==========================================================
   KashfHesab V60.13 — Mobile Company Row Final Polish

   IMPORTANT:
   TOP ROW V60.12 = LOCKED / UNCHANGED

   SECOND ROW:
   COMPANY = LEFT
   LOGO    = RIGHT
   PROFESSIONAL DIVIDER
   REMOVE LOWER EMPTY SPACE
   ========================================================== */

@media (max-width:760px){

  /* --------------------------------------------------------
     Keep V60.12 top row exactly as-is.
     Only redefine SECOND ROW geometry.
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh6012-header{

    grid-template-columns:
      minmax(92px,1fr)
      minmax(130px,1.35fr)
      minmax(96px,1fr) !important;

    grid-template-rows:
      48px
      auto !important;

    /*
       RTL visual result:

       Row 1 remains untouched:
       USER | DATE | CONTROLS

       Row 2:
       COMPANY ---------------- LOGO
    */

    grid-template-areas:
      "user date controls"
      "company company logo" !important;

    row-gap:0 !important;

    padding-bottom:0 !important;
  }


  /* ========================================================
     PROFESSIONAL SEPARATOR
     ======================================================== */

  body.kh-dashboard-home .kh6012-company{
    position:relative !important;

    margin-top:14px !important;

    padding:
      14px
      14px
      2px
      0 !important;

    box-sizing:border-box !important;
  }


  body.kh-dashboard-home .kh6012-company::before{
    content:"" !important;

    position:absolute !important;

    top:0 !important;
    left:0 !important;
    right:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,.08) 10%,
        rgba(255,255,255,.30) 50%,
        rgba(255,255,255,.08) 90%,
        transparent 100%
      ) !important;
  }


  /* tiny luminous detail in divider */
  body.kh-dashboard-home .kh6012-company::after{
    content:"" !important;

    position:absolute !important;

    top:-1px !important;
    left:50% !important;

    width:34px !important;
    height:3px !important;

    transform:translateX(-50%) !important;

    border-radius:999px !important;

    background:rgba(96,165,250,.75) !important;

    box-shadow:
      0 0 9px rgba(59,130,246,.30) !important;
  }


  /* ========================================================
     COMPANY — LEFT SIDE
     ======================================================== */

  body.kh-dashboard-home .kh6012-company{

    grid-area:company !important;

    width:100% !important;

    justify-self:stretch !important;
    align-self:center !important;

    direction:rtl !important;

    text-align:left !important;
  }


  body.kh-dashboard-home .kh6012-company h1{

    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    font-size:13px !important;
    line-height:1.35 !important;
    font-weight:800 !important;

    text-align:left !important;

    white-space:normal !important;
  }


  body.kh-dashboard-home .kh6012-company span{

    display:block !important;

    margin:3px 0 0 !important;
    padding:0 !important;

    font-size:9px !important;
    line-height:1.1 !important;

    text-align:left !important;

    opacity:.68 !important;
  }


  /* ========================================================
     LOGO — RIGHT SIDE
     ======================================================== */

  body.kh-dashboard-home .kh6012-logo{

    grid-area:logo !important;

    position:relative !important;

    width:54px !important;
    height:54px !important;

    justify-self:end !important;
    align-self:center !important;

    margin:
      28px
      0
      0
      0 !important;

    padding:0 !important;

    transform:none !important;

    border-radius:14px !important;
  }


  body.kh-dashboard-home .kh6012-logo img{

    width:100% !important;
    height:100% !important;

    display:block !important;

    object-fit:contain !important;

    border-radius:14px !important;
  }


  /* ========================================================
     COMPRESS THE BLUE HERO AROUND ITS REAL CONTENT
     ======================================================== */

  body.kh-dashboard-home .kh60-hero{

    height:auto !important;
    min-height:0 !important;

    padding:
      12px
      14px
      10px !important;

    margin-bottom:0 !important;
  }


  body.kh-dashboard-home .kh6012-header{

    height:auto !important;
    min-height:0 !important;

    margin-bottom:0 !important;
  }


  /*
   * The balance card remains separate.
   * Small professional gap only.
   */

  body.kh-dashboard-home .kh60-balance-card{

    margin-top:8px !important;
  }

}


/* ==========================================================
   V60.13 — NARROW PHONES
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh6012-header{

    grid-template-columns:
      minmax(78px,.9fr)
      minmax(115px,1.25fr)
      minmax(88px,.9fr) !important;

    grid-template-rows:
      44px
      auto !important;

    grid-template-areas:
      "user date controls"
      "company company logo" !important;

    row-gap:0 !important;
  }


  body.kh-dashboard-home .kh6012-company{

    margin-top:12px !important;

    padding:
      13px
      8px
      1px
      0 !important;
  }


  body.kh-dashboard-home .kh6012-company h1{

    font-size:11.5px !important;
    line-height:1.3 !important;
  }


  body.kh-dashboard-home .kh6012-logo{

    width:48px !important;
    height:48px !important;

    margin-top:25px !important;
  }


  body.kh-dashboard-home .kh60-hero{

    padding-bottom:8px !important;
  }

}



/* ==========================================================
   KashfHesab V60.14 — Mobile Hero Maximum Compression

   DO NOT CHANGE:
   - USER
   - DATE
   - BELL
   - MENU
   - COMPANY / LOGO SIDES
   - DIVIDER DESIGN

   ONLY:
   - remove blue empty vertical space
   - keep a small professional gap around divider
   ========================================================== */

@media (max-width:760px){

  /* HERO follows content — no reserved height */
  body.kh-dashboard-home .kh60-hero{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    padding:
      10px
      14px
      8px !important;

    margin:0 !important;

    box-sizing:border-box !important;
  }


  /* Two compact rows only */
  body.kh-dashboard-home .kh6012-header{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    grid-template-rows:
      48px
      66px !important;

    row-gap:4px !important;

    margin:0 !important;
    padding:0 !important;

    align-content:start !important;
  }


  /* --------------------------------------------------------
     SECOND ROW
     Keep company LEFT and logo RIGHT
     Pull whole row directly under top row
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh6012-company{
    height:auto !important;
    min-height:0 !important;

    margin:4px 0 0 !important;

    padding:
      11px
      14px
      0
      0 !important;

    align-self:start !important;
  }


  /* Divider stays exactly at top of company row */
  body.kh-dashboard-home .kh6012-company::before{
    top:0 !important;
  }


  body.kh-dashboard-home .kh6012-company::after{
    top:-1px !important;
  }


  /* Company content immediately below divider */
  body.kh-dashboard-home .kh6012-company h1{
    margin:0 !important;
    padding:0 !important;

    line-height:1.25 !important;
  }


  body.kh-dashboard-home .kh6012-company span{
    margin-top:2px !important;
    margin-bottom:0 !important;
    padding:0 !important;

    line-height:1 !important;
  }


  /* Logo aligned with company row, without large top margin */
  body.kh-dashboard-home .kh6012-logo{
    width:54px !important;
    height:54px !important;

    margin:
      8px
      0
      0
      0 !important;

    align-self:start !important;
  }


  /* Remove any old inherited spacing */
  body.kh-dashboard-home .kh605-head-row,
  body.kh-dashboard-home .kh6012-header,
  body.kh-dashboard-home .kh6012-company,
  body.kh-dashboard-home .kh6012-logo{
    margin-bottom:0 !important;
  }


  /* Hero -> balance card: only small separation */
  body.kh-dashboard-home .kh60-balance-card{
    margin-top:8px !important;
  }

}


/* ==========================================================
   NARROW MOBILE
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh60-hero{
    padding:
      9px
      12px
      7px !important;
  }


  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      44px
      60px !important;

    row-gap:3px !important;
  }


  body.kh-dashboard-home .kh6012-company{
    margin-top:3px !important;

    padding:
      10px
      8px
      0
      0 !important;
  }


  body.kh-dashboard-home .kh6012-logo{
    width:48px !important;
    height:48px !important;

    margin-top:7px !important;
  }

}


/* ==========================================================
   KashfHesab V60.14.1 — Minimum Header Gap
   Top row untouched
   ========================================================== */

@media (max-width:760px){

  /*
   * First row remains 48px.
   * Second row starts almost immediately after it.
   */
  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      48px
      62px !important;

    row-gap:0 !important;

    height:auto !important;
    min-height:0 !important;

    align-content:start !important;
  }


  /*
   * Divider only 6px below first row.
   */
  body.kh-dashboard-home .kh6012-company{
    margin-top:6px !important;

    padding:
      10px
      12px
      0
      0 !important;

    align-self:start !important;
  }


  /*
   * Logo aligned with company row.
   */
  body.kh-dashboard-home .kh6012-logo{
    margin-top:6px !important;

    align-self:start !important;
  }


  /*
   * Remove remaining bottom blue space.
   */
  body.kh-dashboard-home .kh60-hero{
    height:auto !important;
    min-height:0 !important;

    padding:
      8px
      14px
      4px !important;

    margin:0 !important;
  }


  body.kh-dashboard-home .kh6012-header{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }


  body.kh-dashboard-home .kh6012-company{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }


  /*
   * Keep only a small gap between hero and balance card.
   */
  body.kh-dashboard-home .kh60-balance-card{
    margin-top:6px !important;
  }

}


@media (max-width:420px){

  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      44px
      57px !important;

    row-gap:0 !important;
  }


  body.kh-dashboard-home .kh6012-company{
    margin-top:5px !important;

    padding-top:9px !important;
  }


  body.kh-dashboard-home .kh6012-logo{
    margin-top:5px !important;
  }


  body.kh-dashboard-home .kh60-hero{
    padding:
      7px
      12px
      3px !important;
  }

}


/* ==========================================================
   KashfHesab V60.15 — Zero Blue Gap + Identity Spacing
   TOP ROW LOCKED / UNCHANGED
   ========================================================== */

@media (max-width:760px){

  /* --------------------------------------------------------
     HEADER:
     no artificial vertical space between rows
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      48px
      min-content !important;

    row-gap:0 !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    align-content:start !important;

    margin:0 !important;
    padding:0 !important;
  }


  /* --------------------------------------------------------
     COMPANY ROW:
     divider starts immediately after top row
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh6012-company{
    position:relative !important;

    align-self:start !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    margin:
      0
      0
      0
      0 !important;

    /*
     * 9px below divider for text.
     * Extra RIGHT padding creates breathing room
     * between company name and logo.
     */
    padding:
      9px
      24px
      2px
      0 !important;

    box-sizing:border-box !important;
  }


  /* divider is now the ONLY separation */
  body.kh-dashboard-home .kh6012-company::before{
    top:0 !important;
  }

  body.kh-dashboard-home .kh6012-company::after{
    top:-1px !important;
  }


  body.kh-dashboard-home .kh6012-company h1{
    margin:0 !important;
    padding:0 !important;

    line-height:1.25 !important;
  }


  body.kh-dashboard-home .kh6012-company span{
    margin:
      2px
      0
      0
      0 !important;

    padding:0 !important;

    line-height:1 !important;
  }


  /* --------------------------------------------------------
     LOGO:
     same row, but separated from company text
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh6012-logo{
    align-self:start !important;
    justify-self:end !important;

    width:54px !important;
    height:54px !important;

    margin:
      9px
      0
      0
      12px !important;

    padding:0 !important;

    transform:none !important;
  }


  /*
   * Add a subtle breathing zone between
   * the company text and logo.
   */
  body.kh-dashboard-home .kh6012-company{
    margin-right:12px !important;
  }


  /* --------------------------------------------------------
     HERO:
     wrap content tightly — no bottom blue reserve
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh60-hero{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    padding:
      8px
      14px
      3px !important;

    margin:0 !important;

    box-sizing:border-box !important;
  }


  body.kh-dashboard-home .kh605-head-row,
  body.kh-dashboard-home .kh6012-header,
  body.kh-dashboard-home .kh6012-company,
  body.kh-dashboard-home .kh6012-logo{
    margin-bottom:0 !important;
  }


  /* Small gap only between the two separate blue cards */
  body.kh-dashboard-home .kh60-balance-card{
    margin-top:6px !important;
  }

}


/* ==========================================================
   SMALL PHONES
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      44px
      min-content !important;

    row-gap:0 !important;
  }


  body.kh-dashboard-home .kh6012-company{
    margin-top:0 !important;
    margin-right:10px !important;

    padding:
      8px
      18px
      1px
      0 !important;
  }


  body.kh-dashboard-home .kh6012-logo{
    width:48px !important;
    height:48px !important;

    margin:
      8px
      0
      0
      10px !important;
  }


  body.kh-dashboard-home .kh60-hero{
    padding:
      7px
      12px
      2px !important;
  }

}


/* ==========================================================
   KashfHesab V60.16 — Tight Two-Line Mobile Header

   TOP ROW
      ↓ 5px
   DIVIDER
      ↓ 5px
   COMPANY + LOGO

   No additional vertical spacing.
   ========================================================== */

@media (max-width:760px){

  /* The whole hero wraps only its real content */
  body.kh-dashboard-home .kh60-hero{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    padding:6px 14px 3px !important;
    margin:0 !important;
  }


  /*
   * Keep existing TOP ROW positions exactly as they are.
   * Only make row 2 content-sized.
   */
  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      48px
      min-content !important;

    row-gap:0 !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    align-content:start !important;

    margin:0 !important;
    padding:0 !important;
  }


  /* ========================================================
     COMPANY ROW
     Divider is exactly 5px after first row.
     Text is exactly 5px after divider.
     ======================================================== */

  body.kh-dashboard-home .kh6012-company{
    grid-area:company !important;

    position:relative !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    align-self:start !important;

    margin:5px 12px 0 0 !important;

    /*
     * 1px divider at top.
     * 5px visual space after divider.
     */
    padding:6px 20px 0 0 !important;

    box-sizing:border-box !important;
  }


  body.kh-dashboard-home .kh6012-company::before{
    content:"" !important;

    position:absolute !important;

    top:0 !important;
    left:0 !important;
    right:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,.08) 10%,
        rgba(255,255,255,.30) 50%,
        rgba(255,255,255,.08) 90%,
        transparent 100%
      ) !important;
  }


  body.kh-dashboard-home .kh6012-company::after{
    content:"" !important;

    position:absolute !important;

    top:-1px !important;
    left:50% !important;

    width:34px !important;
    height:3px !important;

    transform:translateX(-50%) !important;

    border-radius:999px !important;

    background:rgba(96,165,250,.75) !important;
    box-shadow:0 0 9px rgba(59,130,246,.30) !important;
  }


  body.kh-dashboard-home .kh6012-company h1{
    margin:0 !important;
    padding:0 !important;

    font-size:13px !important;
    line-height:1.2 !important;
  }


  body.kh-dashboard-home .kh6012-company span{
    display:block !important;

    margin:2px 0 0 !important;
    padding:0 !important;

    line-height:1 !important;
  }


  /* ========================================================
     LOGO
     Its top matches the company content after divider.
     ======================================================== */

  body.kh-dashboard-home .kh6012-logo{
    grid-area:logo !important;

    width:50px !important;
    height:50px !important;

    align-self:start !important;
    justify-self:end !important;

    /*
     * 5px before divider + 1px divider + 5px after divider
     */
    margin:11px 0 0 10px !important;

    padding:0 !important;

    transform:none !important;
  }


  /* No hidden bottom space */
  body.kh-dashboard-home .kh6012-header,
  body.kh-dashboard-home .kh6012-company,
  body.kh-dashboard-home .kh6012-logo{
    margin-bottom:0 !important;
  }


  /* Keep the two blue cards separated only slightly */
  body.kh-dashboard-home .kh60-balance-card{
    margin-top:5px !important;
  }

}


/* Small phones: same exact spacing principle */
@media (max-width:420px){

  body.kh-dashboard-home .kh60-hero{
    padding:5px 12px 3px !important;
  }

  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      44px
      min-content !important;

    row-gap:0 !important;
  }

  body.kh-dashboard-home .kh6012-company{
    margin-top:5px !important;
    margin-right:10px !important;

    padding-top:6px !important;
    padding-right:16px !important;
  }

  body.kh-dashboard-home .kh6012-logo{
    width:46px !important;
    height:46px !important;

    margin-top:11px !important;
    margin-left:8px !important;
  }

}


/* ==========================================================
   KashfHesab V60.17 — Tight Identity Row
   TOP ROW IS LOCKED AND UNCHANGED
   ========================================================== */

@media (max-width:760px){

  /* --------------------------------------------------------
     GRID:
     row 1 stays exactly as before.
     row 2 contains company + logo only.
     -------------------------------------------------------- */

  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      48px
      auto !important;

    grid-template-areas:
      "user date controls"
      "company company logo" !important;

    row-gap:0 !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    align-content:start !important;

    margin:0 !important;
    padding:0 !important;
  }


  /* ========================================================
     COMPANY:
     4px above divider
     4px below divider
     ONE LINE ONLY
     ======================================================== */

  body.kh-dashboard-home .kh6012-company{
    grid-area:company !important;

    position:relative !important;

    align-self:start !important;
    justify-self:stretch !important;

    width:100% !important;
    min-width:0 !important;

    height:auto !important;
    min-height:0 !important;

    /*
       4px from top row to divider
    */
    margin:
      4px
      10px
      0
      0 !important;

    /*
       divider is at top.
       1px divider + ~4px below it.
    */
    padding:
      5px
      12px
      0
      0 !important;

    box-sizing:border-box !important;

    overflow:hidden !important;

    text-align:left !important;
  }


  /* Divider */
  body.kh-dashboard-home .kh6012-company::before{
    content:"" !important;

    position:absolute !important;

    top:0 !important;
    left:0 !important;
    right:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,.08) 10%,
        rgba(255,255,255,.30) 50%,
        rgba(255,255,255,.08) 90%,
        transparent 100%
      ) !important;
  }


  body.kh-dashboard-home .kh6012-company::after{
    content:"" !important;

    position:absolute !important;

    top:-1px !important;
    left:50% !important;

    width:34px !important;
    height:3px !important;

    transform:translateX(-50%) !important;

    border-radius:999px !important;

    background:rgba(96,165,250,.75) !important;
    box-shadow:0 0 9px rgba(59,130,246,.30) !important;
  }


  /* COMPANY NAME = ONE LINE */
  body.kh-dashboard-home .kh6012-company h1{
    display:block !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    font-size:11px !important;
    line-height:18px !important;
    font-weight:800 !important;

    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;

    text-align:left !important;
  }


  /* Administration directly underneath, compact */
  body.kh-dashboard-home .kh6012-company span{
    display:block !important;

    margin:0 !important;
    padding:0 !important;

    font-size:8px !important;
    line-height:11px !important;

    white-space:nowrap !important;

    text-align:left !important;

    opacity:.65 !important;
  }


  /* ========================================================
     LOGO:
     SAME ROW AS COMPANY.
     Clear horizontal space between them.
     ======================================================== */

  body.kh-dashboard-home .kh6012-logo{
    grid-area:logo !important;

    position:relative !important;

    align-self:start !important;
    justify-self:end !important;

    width:45px !important;
    height:45px !important;

    /*
       4px above divider
       + 1px divider
       + 4px below divider
       = same vertical start as company content
    */
    margin:
      9px
      0
      0
      14px !important;

    padding:0 !important;

    transform:none !important;

    flex:none !important;
  }


  body.kh-dashboard-home .kh6012-logo img{
    width:100% !important;
    height:100% !important;

    object-fit:contain !important;
  }


  /* ========================================================
     HERO:
     REMOVE ALL UNUSED BLUE HEIGHT
     ======================================================== */

  body.kh-dashboard-home .kh60-hero{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    padding:
      5px
      14px
      3px !important;

    margin:0 !important;

    box-sizing:border-box !important;
  }


  body.kh-dashboard-home .kh6012-header,
  body.kh-dashboard-home .kh6012-company,
  body.kh-dashboard-home .kh6012-logo{
    margin-bottom:0 !important;
  }


  /* Only a tiny separation from balance card */
  body.kh-dashboard-home .kh60-balance-card{
    margin-top:5px !important;
  }

}


/* ==========================================================
   NARROW PHONES
   Same geometry — only slightly smaller identity text.
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh6012-header{
    grid-template-rows:
      44px
      auto !important;

    row-gap:0 !important;
  }


  body.kh-dashboard-home .kh6012-company{
    margin-top:4px !important;
    margin-right:8px !important;

    padding:
      5px
      8px
      0
      0 !important;
  }


  body.kh-dashboard-home .kh6012-company h1{
    font-size:9.5px !important;
    line-height:16px !important;
  }


  body.kh-dashboard-home .kh6012-company span{
    font-size:7.5px !important;
    line-height:10px !important;
  }


  body.kh-dashboard-home .kh6012-logo{
    width:41px !important;
    height:41px !important;

    margin:
      9px
      0
      0
      12px !important;
  }


  body.kh-dashboard-home .kh60-hero{
    padding:
      4px
      12px
      2px !important;
  }

}


/* ==========================================================
   KashfHesab V60.18 — Remove Real Reserved Mobile Gap

   LOCKED:
   USER / DATE / BELL / MENU

   TARGET:
   TOP ROW
   4px
   DIVIDER
   4px
   COMPANY + LOGO SAME LINE
   ========================================================== */

@media (max-width:760px){

  /*
   * Stop old grid rules from stretching the identity row.
   * Header height is now explicitly the two real rows only.
   */
  body.kh-dashboard-home .kh6012-header{
    position:relative !important;

    display:grid !important;

    grid-template-columns:
      minmax(92px,1fr)
      minmax(130px,1.35fr)
      minmax(96px,1fr) !important;

    grid-template-rows:
      48px
      50px !important;

    grid-template-areas:
      "user date controls"
      "company company logo" !important;

    row-gap:0 !important;

    height:98px !important;
    min-height:98px !important;
    max-height:98px !important;

    align-content:start !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;
  }


  /* ========================================================
     SECOND ROW — STARTS IMMEDIATELY AFTER TOP 48px
     ======================================================== */

  body.kh-dashboard-home .kh6012-company{
    grid-area:company !important;

    position:relative !important;

    width:100% !important;
    min-width:0 !important;

    height:50px !important;
    min-height:50px !important;
    max-height:50px !important;

    align-self:start !important;

    /*
       EXACTLY 4px from first row to divider
    */
    margin:4px 12px 0 0 !important;

    /*
       divider at top + 4px below divider
    */
    padding:5px 16px 0 0 !important;

    box-sizing:border-box !important;

    overflow:hidden !important;
  }


  /* divider */
  body.kh-dashboard-home .kh6012-company::before{
    content:"" !important;

    position:absolute !important;

    top:0 !important;
    left:0 !important;
    right:0 !important;

    height:1px !important;

    background:
      linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,255,255,.08) 10%,
        rgba(255,255,255,.30) 50%,
        rgba(255,255,255,.08) 90%,
        transparent 100%
      ) !important;
  }


  body.kh-dashboard-home .kh6012-company::after{
    content:"" !important;

    position:absolute !important;

    top:-1px !important;
    left:50% !important;

    width:34px !important;
    height:3px !important;

    transform:translateX(-50%) !important;

    border-radius:999px !important;

    background:rgba(96,165,250,.75) !important;
    box-shadow:0 0 9px rgba(59,130,246,.30) !important;
  }


  /* company MUST remain one line */
  body.kh-dashboard-home .kh6012-company h1{
    display:block !important;

    width:100% !important;
    max-width:100% !important;

    margin:0 !important;
    padding:0 !important;

    font-size:10.5px !important;
    line-height:17px !important;
    font-weight:800 !important;

    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;

    text-align:left !important;
  }


  body.kh-dashboard-home .kh6012-company span{
    display:block !important;

    margin:1px 0 0 !important;
    padding:0 !important;

    font-size:8px !important;
    line-height:10px !important;

    white-space:nowrap !important;

    text-align:left !important;

    opacity:.65 !important;
  }


  /* ========================================================
     LOGO — SAME SECOND ROW
     ======================================================== */

  body.kh-dashboard-home .kh6012-logo{
    grid-area:logo !important;

    position:relative !important;

    width:42px !important;
    height:42px !important;

    align-self:start !important;
    justify-self:end !important;

    /*
       4px before divider
       + divider
       + 4px after divider
    */
    margin:9px 0 0 14px !important;

    padding:0 !important;

    transform:none !important;
  }


  body.kh-dashboard-home .kh6012-logo img{
    width:100% !important;
    height:100% !important;

    object-fit:contain !important;
  }


  /* ========================================================
     HERO — NO RESERVED BLUE SPACE
     ======================================================== */

  body.kh-dashboard-home .kh60-hero{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    padding:5px 14px 3px !important;

    margin:0 !important;

    box-sizing:border-box !important;
  }


  /*
   * Prevent older rules from creating vertical reserve.
   */
  body.kh-dashboard-home .kh605-head-row,
  body.kh-dashboard-home .kh6012-header{
    margin-bottom:0 !important;
    padding-bottom:0 !important;
  }


  /*
   * Only tiny visual separation between hero and balance.
   */
  body.kh-dashboard-home .kh60-balance-card{
    margin-top:5px !important;
  }

}


/* ==========================================================
   SMALL PHONE
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh6012-header{
    grid-template-columns:
      minmax(78px,.9fr)
      minmax(115px,1.25fr)
      minmax(88px,.9fr) !important;

    grid-template-rows:
      44px
      46px !important;

    height:90px !important;
    min-height:90px !important;
    max-height:90px !important;

    row-gap:0 !important;
  }


  body.kh-dashboard-home .kh6012-company{
    height:46px !important;
    min-height:46px !important;
    max-height:46px !important;

    margin:
      4px
      8px
      0
      0 !important;

    padding:
      5px
      10px
      0
      0 !important;
  }


  body.kh-dashboard-home .kh6012-company h1{
    font-size:9px !important;
    line-height:15px !important;
  }


  body.kh-dashboard-home .kh6012-company span{
    font-size:7px !important;
    line-height:9px !important;
  }


  body.kh-dashboard-home .kh6012-logo{
    width:39px !important;
    height:39px !important;

    margin:
      9px
      0
      0
      11px !important;
  }

}


/* ==========================================================
   KashfHesab V60.19
   Remove reserved height below mobile top row
   Top-row contents remain unchanged
   ========================================================== */

@media (max-width:760px){

  body.kh-dashboard-home .kh6012-header{

    /* first row follows its REAL content height */
    grid-template-rows:
      max-content
      46px !important;

    row-gap:0 !important;

    /* remove V60.18 forced total height */
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    align-content:start !important;

    margin:0 !important;
    padding:0 !important;
  }


  /*
   * Identity row begins immediately after
   * the real bottom edge of the top row.
   */
  body.kh-dashboard-home .kh6012-company{

    height:46px !important;
    min-height:46px !important;
    max-height:46px !important;

    margin:
      4px
      12px
      0
      0 !important;

    padding:
      5px
      16px
      0
      0 !important;

    align-self:start !important;
  }


  /*
   * Logo remains in SAME identity row.
   */
  body.kh-dashboard-home .kh6012-logo{

    width:40px !important;
    height:40px !important;

    margin:
      9px
      0
      0
      14px !important;

    align-self:start !important;

    transform:none !important;
  }


  /*
   * No parent may reserve extra vertical space.
   */
  body.kh-dashboard-home .kh605-head-row,
  body.kh-dashboard-home .kh60-head-row,
  body.kh-dashboard-home .kh6012-header{

    margin-bottom:0 !important;
    padding-bottom:0 !important;

    max-height:none !important;
  }

}


/* ----------------------------------------------------------
   Small phones:
   DO NOT restore the old 44px fixed first row.
   ---------------------------------------------------------- */

@media (max-width:420px){

  body.kh-dashboard-home .kh6012-header{

    grid-template-rows:
      max-content
      43px !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    row-gap:0 !important;

    align-content:start !important;
  }


  body.kh-dashboard-home .kh6012-company{

    height:43px !important;
    min-height:43px !important;
    max-height:43px !important;

    margin:
      4px
      8px
      0
      0 !important;

    padding:
      5px
      10px
      0
      0 !important;
  }


  body.kh-dashboard-home .kh6012-logo{

    width:37px !important;
    height:37px !important;

    margin:
      9px
      0
      0
      11px !important;
  }

}


/* ==========================================================
   KashfHesab V61 — Premium Main Balance Card
   Scope: balance card only
   ========================================================== */

body.kh-dashboard-home .kh60-balance-card{
  position:relative !important;
  overflow:hidden !important;

  min-height:230px !important;

  padding:25px 27px 22px !important;

  border:1px solid rgba(255,255,255,.20) !important;
  border-radius:30px !important;

  background:
    radial-gradient(
      circle at 12% 18%,
      rgba(56,189,248,.42) 0,
      rgba(56,189,248,.10) 30%,
      transparent 48%
    ),
    linear-gradient(
      125deg,
      #0899e8 0%,
      #087acb 43%,
      #0759a7 72%,
      #063d7d 100%
    ) !important;

  box-shadow:
    0 18px 40px rgba(15,73,130,.18),
    inset 0 1px 0 rgba(255,255,255,.18) !important;

  color:#fff !important;
}


/* subtle premium light */
body.kh-dashboard-home .kh60-balance-card::before{
  content:"" !important;

  position:absolute !important;
  width:210px !important;
  height:210px !important;

  left:-80px !important;
  top:-105px !important;

  border-radius:50% !important;

  background:
    radial-gradient(
      circle,
      rgba(255,255,255,.18),
      rgba(255,255,255,0) 68%
    ) !important;

  pointer-events:none !important;
}


/* decorative glow */
body.kh-dashboard-home .kh60-balance-card::after{
  content:"" !important;

  position:absolute !important;

  width:180px !important;
  height:180px !important;

  right:-100px !important;
  bottom:-110px !important;

  border-radius:50% !important;

  border:1px solid rgba(255,255,255,.10) !important;

  box-shadow:
    0 0 0 28px rgba(255,255,255,.025),
    0 0 0 58px rgba(255,255,255,.018) !important;

  pointer-events:none !important;
}


/* =========================
   TOP AREA
   ========================= */

body.kh-dashboard-home .kh60-balance-head{
  position:relative !important;
  z-index:2 !important;

  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;

  gap:16px !important;

  margin:0 !important;
}


body.kh-dashboard-home .kh60-balance-title{
  display:block !important;

  margin:0 0 8px !important;

  color:rgba(255,255,255,.86) !important;

  font-size:15px !important;
  font-weight:700 !important;
  line-height:1.4 !important;

  letter-spacing:0 !important;
}


/* =========================
   MAIN NUMBER
   ========================= */

body.kh-dashboard-home .kh60-balance-number{
  display:flex !important;
  align-items:baseline !important;

  gap:7px !important;

  margin:0 !important;

  color:#fff !important;

  font-size:43px !important;
  font-weight:900 !important;
  line-height:1.05 !important;

  letter-spacing:-1.2px !important;

  text-shadow:
    0 3px 14px rgba(0,35,85,.15) !important;

  font-variant-numeric:tabular-nums !important;
}


body.kh-dashboard-home .kh60-balance-number small{
  font-size:17px !important;
  font-weight:800 !important;

  color:rgba(255,255,255,.82) !important;

  letter-spacing:0 !important;
}


/* =========================
   CUSTOMER PILL
   ========================= */

body.kh-dashboard-home .kh60-customer-pill{
  position:relative !important;

  display:flex !important;
  align-items:center !important;

  gap:6px !important;

  flex:0 0 auto !important;

  min-height:40px !important;

  margin:1px 0 0 !important;
  padding:7px 12px !important;

  border:1px solid rgba(255,255,255,.19) !important;
  border-radius:16px !important;

  background:rgba(255,255,255,.09) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10) !important;

  backdrop-filter:blur(7px) !important;
  -webkit-backdrop-filter:blur(7px) !important;

  color:#fff !important;
}


body.kh-dashboard-home .kh60-customer-pill .kh60-people{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:22px !important;
  height:22px !important;

  opacity:.85 !important;
}


body.kh-dashboard-home .kh60-customer-pill .kh60-people svg{
  width:20px !important;
  height:20px !important;

  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.8 !important;
}


body.kh-dashboard-home .kh60-customer-pill strong{
  font-size:16px !important;
  font-weight:900 !important;
  line-height:1 !important;
}


body.kh-dashboard-home .kh60-customer-pill > span:last-child{
  font-size:11px !important;
  font-weight:600 !important;

  color:rgba(255,255,255,.76) !important;

  white-space:nowrap !important;
}


/* =========================
   LOWER AREA
   ========================= */

body.kh-dashboard-home .kh60-balance-bottom{
  position:absolute !important;

  z-index:2 !important;

  right:27px !important;
  left:27px !important;
  bottom:21px !important;

  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;

  gap:16px !important;

  margin:0 !important;
}


/* debt status */
body.kh-dashboard-home .kh60-balance-note{
  display:inline-flex !important;
  align-items:center !important;

  gap:7px !important;

  margin:0 !important;

  color:rgba(255,255,255,.78) !important;

  font-size:11.5px !important;
  font-weight:600 !important;
}


body.kh-dashboard-home .kh60-up{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:27px !important;
  height:27px !important;

  border-radius:9px !important;

  background:rgba(74,222,128,.14) !important;

  color:#55e98d !important;

  box-shadow:
    inset 0 0 0 1px rgba(85,233,141,.15) !important;
}


body.kh-dashboard-home .kh60-up svg{
  width:17px !important;
  height:17px !important;

  fill:none !important;
  stroke:currentColor !important;
  stroke-width:2.3 !important;

  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width:760px){

  body.kh-dashboard-home .kh60-balance-card{
    min-height:206px !important;

    padding:
      22px
      22px
      20px !important;

    border-radius:27px !important;

    /* keep existing distance from header */
    margin-top:5px !important;
  }


  body.kh-dashboard-home .kh60-balance-head{
    gap:10px !important;
  }


  body.kh-dashboard-home .kh60-balance-title{
    margin-bottom:6px !important;

    font-size:13px !important;
  }


  body.kh-dashboard-home .kh60-balance-number{
    gap:5px !important;

    font-size:37px !important;

    letter-spacing:-1px !important;
  }


  body.kh-dashboard-home .kh60-balance-number small{
    font-size:14px !important;
  }


  body.kh-dashboard-home .kh60-customer-pill{
    min-height:36px !important;

    padding:6px 9px !important;

    gap:4px !important;

    border-radius:14px !important;
  }


  body.kh-dashboard-home .kh60-customer-pill .kh60-people{
    width:18px !important;
    height:18px !important;
  }


  body.kh-dashboard-home .kh60-customer-pill .kh60-people svg{
    width:17px !important;
    height:17px !important;
  }


  body.kh-dashboard-home .kh60-customer-pill strong{
    font-size:14px !important;
  }


  body.kh-dashboard-home .kh60-customer-pill > span:last-child{
    font-size:9px !important;
  }


  body.kh-dashboard-home .kh60-balance-bottom{
    right:22px !important;
    left:22px !important;
    bottom:18px !important;
  }


  body.kh-dashboard-home .kh60-balance-note{
    gap:6px !important;

    font-size:10px !important;
  }


  body.kh-dashboard-home .kh60-up{
    width:25px !important;
    height:25px !important;

    border-radius:8px !important;
  }

}


/* ==========================================================
   NARROW MOBILE
   ========================================================== */

@media (max-width:420px){

  body.kh-dashboard-home .kh60-balance-card{
    min-height:194px !important;

    padding:
      20px
      18px
      18px !important;

    border-radius:25px !important;

    margin-top:5px !important;
  }


  body.kh-dashboard-home .kh60-balance-title{
    font-size:12px !important;
  }


  body.kh-dashboard-home .kh60-balance-number{
    font-size:33px !important;

    letter-spacing:-.8px !important;
  }


  body.kh-dashboard-home .kh60-balance-number small{
    font-size:12px !important;
  }


  body.kh-dashboard-home .kh60-customer-pill{
    padding:6px 8px !important;
  }


  body.kh-dashboard-home .kh60-customer-pill > span:last-child{
    display:none !important;
  }


  body.kh-dashboard-home .kh60-balance-bottom{
    right:18px !important;
    left:18px !important;
    bottom:16px !important;
  }

}


/* ==========================================================
   KashfHesab V61.2 — Exact Balance Layout

   RIGHT:
     Financial icon
     Customer count

   LEFT:
     Total receivables
     Amount
   ========================================================== */

@media (max-width:760px){

body.kh-dashboard-home .kh60-balance-card{
    position:relative !important;
    display:block !important;

    height:170px !important;
    min-height:170px !important;

    padding:0 !important;
    margin-top:10px !important;

    overflow:hidden !important;

    border-radius:26px !important;
}


/* ------------------------------------------
   MAIN CONTENT
   ------------------------------------------ */

body.kh-dashboard-home .kh60-balance-main{
    position:static !important;

    display:block !important;

    width:100% !important;
    height:100% !important;

    margin:0 !important;
    padding:0 !important;
}


/* ------------------------------------------
   REMOVE OLD INTERNAL LAYOUT
   ------------------------------------------ */

body.kh-dashboard-home .kh60-balance-head{
    position:static !important;

    display:block !important;

    width:auto !important;
    height:auto !important;
    min-height:0 !important;

    margin:0 !important;
    padding:0 !important;
}


/* ==========================================================
   RIGHT TOP — FINANCIAL ICON
   ========================================================== */

body.kh-dashboard-home .kh60-wallet{
    position:absolute !important;

    top:24px !important;
    right:24px !important;
    left:auto !important;
    bottom:auto !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:48px !important;
    height:48px !important;

    margin:0 !important;
    padding:0 !important;

    border-radius:15px !important;

    border:1px solid rgba(255,255,255,.25) !important;

    background:rgba(255,255,255,.15) !important;

    color:#fff !important;

    transform:none !important;

    z-index:5 !important;
}


body.kh-dashboard-home .kh60-wallet svg{
    width:25px !important;
    height:25px !important;

    stroke:currentColor !important;
    fill:none !important;

    stroke-width:1.9 !important;
}


/* ==========================================================
   RIGHT BOTTOM — CUSTOMER COUNT
   ========================================================== */

body.kh-dashboard-home .kh60-customer-pill{
    position:absolute !important;

    top:82px !important;
    right:20px !important;

    left:auto !important;
    bottom:auto !important;

    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;

    gap:5px !important;

    width:58px !important;
    min-width:58px !important;
    height:34px !important;
    min-height:34px !important;

    margin:0 !important;
    padding:0 7px !important;

    border:1px solid rgba(255,255,255,.17) !important;
    border-radius:11px !important;

    background:rgba(3,58,112,.18) !important;

    color:#fff !important;

    z-index:5 !important;
}


body.kh-dashboard-home .kh60-customer-pill .kh60-people{
    display:flex !important;

    width:16px !important;
    height:16px !important;

    margin:0 !important;
}


body.kh-dashboard-home .kh60-customer-pill .kh60-people svg{
    width:16px !important;
    height:16px !important;
}


body.kh-dashboard-home .kh60-customer-pill strong{
    font-size:15px !important;
    font-weight:900 !important;
    line-height:1 !important;
}


/* show only icon + number */
body.kh-dashboard-home .kh60-customer-pill > span:last-child{
    display:none !important;
}


/* ==========================================================
   LEFT TOP — TITLE
   ========================================================== */

body.kh-dashboard-home .kh60-balance-title{
    position:absolute !important;

    top:34px !important;
    left:24px !important;
    right:auto !important;

    display:block !important;

    width:auto !important;
    max-width:65% !important;

    margin:0 !important;
    padding:0 !important;

    color:rgba(255,255,255,.82) !important;

    font-size:13px !important;
    font-weight:700 !important;
    line-height:18px !important;

    white-space:nowrap !important;

    text-align:left !important;

    z-index:5 !important;
}


/* ==========================================================
   LEFT BOTTOM — AMOUNT
   ========================================================== */

body.kh-dashboard-home .kh60-balance-number{
    position:absolute !important;

    top:63px !important;
    left:24px !important;
    right:auto !important;

    display:flex !important;
    flex-direction:row !important;
    align-items:baseline !important;
    justify-content:flex-start !important;

    direction:ltr !important;

    gap:6px !important;

    width:auto !important;
    max-width:70% !important;

    margin:0 !important;
    padding:0 !important;

    color:#fff !important;

    font-size:39px !important;
    font-weight:900 !important;
    line-height:1.05 !important;

    letter-spacing:-1px !important;

    white-space:nowrap !important;

    z-index:5 !important;
}


body.kh-dashboard-home .kh60-balance-number small{
    font-size:13px !important;
    font-weight:800 !important;

    color:rgba(255,255,255,.75) !important;
}


/* ==========================================================
   REMOVE OLD BOTTOM STATUS FOR CLEAN TWO-COLUMN CARD
   ========================================================== */

body.kh-dashboard-home .kh60-balance-bottom{
    display:none !important;
}


/* remove old decorative lines/spark elements */
body.kh-dashboard-home .kh60-balance-card [class*="spark"],
body.kh-dashboard-home .kh60-balance-card [class*="trend"]{
    display:none !important;
}

}


/* ==========================================================
   VERY SMALL MOBILE
   ========================================================== */

@media (max-width:380px){

body.kh-dashboard-home .kh60-balance-card{
    height:160px !important;
    min-height:160px !important;
}


body.kh-dashboard-home .kh60-wallet{
    top:21px !important;
    right:19px !important;

    width:44px !important;
    height:44px !important;
}


body.kh-dashboard-home .kh60-customer-pill{
    top:75px !important;
    right:17px !important;

    width:54px !important;
    min-width:54px !important;
}


body.kh-dashboard-home .kh60-balance-title{
    top:30px !important;
    left:19px !important;

    font-size:12px !important;
}


body.kh-dashboard-home .kh60-balance-number{
    top:58px !important;
    left:19px !important;

    font-size:34px !important;
}

}



/* ==========================================================
   KashfHesab V62 — Professional KPI Cards
   Approved page margins are NOT changed
   ========================================================== */

body.kh-dashboard-home .kh62-stat{
  position:relative;
  overflow:hidden;

  display:flex;
  align-items:center;

  min-width:0;

  gap:13px;

  background:#fff;
  border:1px solid rgba(24,52,82,.08);

  box-shadow:
    0 8px 24px rgba(21,45,72,.055);

  transition:
    transform .18s ease,
    box-shadow .18s ease;
}


body.kh-dashboard-home .kh62-stat::after{
  content:"";

  position:absolute;
  right:0;
  top:14px;
  bottom:14px;

  width:3px;

  border-radius:3px 0 0 3px;

  background:var(--kh62-accent);
}


body.kh-dashboard-home .kh62-icon{
  flex:0 0 auto;

  width:44px;
  height:44px;

  display:grid;
  place-items:center;

  border-radius:14px;

  background:var(--kh62-soft);
  color:var(--kh62-accent);
}


body.kh-dashboard-home .kh62-icon svg{
  width:22px;
  height:22px;

  fill:none;
  stroke:currentColor;

  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}


body.kh-dashboard-home .kh62-copy{
  min-width:0;

  display:flex;
  flex-direction:column;

  justify-content:center;

  gap:3px;
}


body.kh-dashboard-home .kh62-copy > span{
  margin:0;

  color:#78899b;

  font-size:11.5px;
  font-weight:700;

  line-height:1.35;
}


body.kh-dashboard-home .kh62-copy > strong{
  margin:0;

  color:#13283f;

  font-size:21px;
  font-weight:900;

  line-height:1.15;

  letter-spacing:-.25px;
}


body.kh-dashboard-home .kh62-customers{
  --kh62-accent:#2878e8;
  --kh62-soft:#edf5ff;
}


body.kh-dashboard-home .kh62-invoices{
  --kh62-accent:#7258d8;
  --kh62-soft:#f2efff;
}


body.kh-dashboard-home .kh62-receipts{
  --kh62-accent:#15966a;
  --kh62-soft:#eaf9f3;
}


body.kh-dashboard-home .kh62-credit{
  --kh62-accent:#d78a28;
  --kh62-soft:#fff5e8;
}


@media(min-width:761px){

  body.kh-dashboard-home .kh62-stat:hover{
    transform:translateY(-2px);

    box-shadow:
      0 12px 28px rgba(21,45,72,.09);
  }

}


@media(max-width:760px){

  /* Keep existing 2 × 2 grid and approved outer spacing */

  body.kh-dashboard-home .kh62-stat{
    min-height:82px;

    gap:10px;
  }

  body.kh-dashboard-home .kh62-icon{
    width:39px;
    height:39px;

    border-radius:12px;
  }

  body.kh-dashboard-home .kh62-icon svg{
    width:20px;
    height:20px;
  }

  body.kh-dashboard-home .kh62-copy > span{
    font-size:10.5px;
  }

  body.kh-dashboard-home .kh62-copy > strong{
    font-size:19px;
  }

}


@media(max-width:390px){

  body.kh-dashboard-home .kh62-stat{
    gap:8px;
  }

  body.kh-dashboard-home .kh62-icon{
    width:36px;
    height:36px;
  }

  body.kh-dashboard-home .kh62-copy > span{
    font-size:9.8px;
  }

  body.kh-dashboard-home .kh62-copy > strong{
    font-size:17px;
  }

}


/* ==========================================================
   KashfHesab V63 — Real Financial KPI Details
   Outer dashboard/card margins intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh63-stat{
  min-width:0;
}

body.kh-dashboard-home .kh63-sales{
  --kh62-accent:#2878e8;
  --kh62-soft:#edf5ff;
}

body.kh-dashboard-home .kh63-purchases{
  --kh62-accent:#7258d8;
  --kh62-soft:#f2efff;
}

body.kh-dashboard-home .kh63-receipts{
  --kh62-accent:#15966a;
  --kh62-soft:#eaf9f3;
}

body.kh-dashboard-home .kh63-expenses{
  --kh62-accent:#d78a28;
  --kh62-soft:#fff5e8;
}

body.kh-dashboard-home .kh63-copy{
  flex:1 1 auto;
  overflow:hidden;
}

body.kh-dashboard-home .kh63-value{
  display:flex;
  align-items:baseline;
  gap:4px;
  min-width:0;
}

body.kh-dashboard-home .kh63-value strong{
  color:#13283f;
  font-size:19px;
  font-weight:900;
  line-height:1.15;
  white-space:nowrap;
}

body.kh-dashboard-home .kh63-value small{
  color:#8997a7;
  font-size:9px;
  font-weight:800;
  white-space:nowrap;
}

body.kh-dashboard-home .kh63-trend-row{
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
  margin-top:3px;
}

body.kh-dashboard-home .kh63-trend{
  display:inline-flex;
  align-items:center;
  gap:2px;
  flex:0 0 auto;
  padding:2px 5px;
  border-radius:7px;
  font-size:9px;
  line-height:1.2;
}

body.kh-dashboard-home .kh63-trend b{
  font-size:11px;
  line-height:1;
}

body.kh-dashboard-home .kh63-trend em{
  font-style:normal;
  font-weight:850;
}

body.kh-dashboard-home .kh63-trend.kh63-up{
  color:#14845e;
  background:#eaf8f2;
}

body.kh-dashboard-home .kh63-trend.kh63-down{
  color:#c45555;
  background:#fff0f0;
}

body.kh-dashboard-home .kh63-trend.kh63-flat{
  color:#657789;
  background:#f0f3f6;
}

body.kh-dashboard-home .kh63-period{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#9aa6b3;
  font-size:8px;
  font-weight:650;
}

body.kh-dashboard-home .kh63-spark{
  flex:0 0 58px;
  width:58px;
  height:34px;
  margin-inline-start:auto;
  opacity:.9;
}

body.kh-dashboard-home .kh63-spark svg{
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}

body.kh-dashboard-home .kh63-spark polyline{
  stroke:var(--kh62-accent);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body.kh-dashboard-home .kh63-spark.kh63-down{
  opacity:.72;
}

body.kh-dashboard-home .kh63-spark.kh63-flat{
  opacity:.55;
}

@media(max-width:760px){

  body.kh-dashboard-home .kh63-stat{
    min-height:94px;
    gap:8px;
  }

  body.kh-dashboard-home .kh63-main-icon{
    width:36px;
    height:36px;
  }

  body.kh-dashboard-home .kh63-value strong{
    font-size:16px;
  }

  body.kh-dashboard-home .kh63-value small{
    font-size:8px;
  }

  body.kh-dashboard-home .kh63-spark{
    flex-basis:40px;
    width:40px;
    height:28px;
  }

  body.kh-dashboard-home .kh63-period{
    display:none;
  }

  body.kh-dashboard-home .kh63-trend{
    padding:2px 4px;
    font-size:8px;
  }

}

@media(max-width:390px){

  body.kh-dashboard-home .kh63-main-icon{
    width:32px;
    height:32px;
  }

  body.kh-dashboard-home .kh63-value strong{
    font-size:14px;
  }

  body.kh-dashboard-home .kh63-spark{
    flex-basis:34px;
    width:34px;
  }

}

/* ==========================================================
   KashfHesab V63.3 — KPI Today Details
   Existing outer margins/layout intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh633-clickable{
  cursor:pointer;
}

body.kh-dashboard-home .kh633-clickable:focus-visible{
  outline:2px solid var(--kh62-accent);
  outline-offset:2px;
}

body.kh633-open{
  overflow:hidden;
}

.kh633-overlay[hidden],
.kh633-panel[hidden]{
  display:none !important;
}

.kh633-overlay{
  position:fixed;
  inset:0;
  z-index:5000;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:18px;

  background:rgba(7,20,35,.52);
  backdrop-filter:blur(4px);
}

.kh633-sheet{
  width:min(620px,100%);
  max-height:min(760px,88vh);

  overflow:hidden;

  background:#fff;
  border-radius:24px;

  box-shadow:
    0 24px 70px rgba(7,25,45,.24);
}

.kh633-panel{
  max-height:min(760px,88vh);
  display:flex;
  flex-direction:column;
}

.kh633-head{
  flex:0 0 auto;

  display:flex;
  align-items:center;
  gap:12px;

  padding:17px 18px;

  border-bottom:1px solid #edf1f5;
}

.kh633-close{
  flex:0 0 auto;

  width:36px;
  height:36px;

  display:grid;
  place-items:center;

  padding:0;

  border:0;
  border-radius:11px;

  background:#f2f5f8;
  color:#31465a;

  font-size:25px;
  line-height:1;

  cursor:pointer;
}

.kh633-head-copy{
  min-width:0;
}

.kh633-head-copy h3{
  margin:0;

  color:#142a40;

  font-size:17px;
  font-weight:900;
}

.kh633-head-copy span{
  display:block;

  margin-top:3px;

  color:#8998a8;

  font-size:11px;
  font-weight:700;
}

.kh633-list{
  flex:1 1 auto;
  min-height:0;

  overflow:auto;

  padding:7px 14px;
}

.kh633-row{
  display:flex;
  align-items:center;
  gap:10px;

  min-height:67px;

  padding:10px 6px;

  border-bottom:1px solid #edf1f5;

  color:inherit;
  text-decoration:none;
}

.kh633-row-main{
  flex:1 1 auto;
  min-width:0;
}

.kh633-row-title{
  color:#183149;

  font-size:13px;
  font-weight:850;
}

.kh633-row-title small{
  margin-inline-start:4px;

  color:#8595a5;

  font-size:10px;
  font-weight:700;
}

.kh633-customer{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  margin-top:4px;

  color:#758697;

  font-size:11px;
  font-weight:650;
}

.kh633-row-value{
  flex:0 0 auto;

  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

.kh633-row-value strong{
  color:#17334d;

  font-size:14px;
  font-weight:900;
}

.kh633-row-value small{
  color:#8b99a8;

  font-size:9px;
  font-weight:700;
}

.kh633-row-value em{
  margin-top:3px;
  padding:2px 6px;

  border-radius:7px;

  background:#fff1f1;
  color:#bc5555;

  font-size:8px;
  font-style:normal;
  font-weight:850;
}

.kh633-arrow{
  flex:0 0 auto;

  color:#9aa8b5;

  font-size:24px;
  line-height:1;
}

.kh633-return .kh633-row-title,
.kh633-return .kh633-row-value strong{
  color:#b65353;
}

.kh633-empty{
  padding:48px 20px;

  text-align:center;
}

.kh633-empty strong{
  display:block;

  color:#344b61;

  font-size:15px;
  font-weight:900;
}

.kh633-empty span{
  display:block;

  margin-top:7px;

  color:#8b99a7;

  font-size:11px;
}

.kh633-total{
  flex:0 0 auto;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;

  padding:15px 18px;

  border-top:1px solid #e8eef3;

  background:#f8fafc;
}

.kh633-total > span{
  color:#66798b;

  font-size:12px;
  font-weight:750;
}

.kh633-total > strong{
  color:#102d48;

  font-size:17px;
  font-weight:950;
}

.kh633-total small{
  color:#8392a1;

  font-size:9px;
}

@media(max-width:760px){

  .kh633-overlay{
    align-items:flex-end;
    padding:0;
  }

  .kh633-sheet{
    width:100%;
    max-height:82vh;

    border-radius:24px 24px 0 0;
  }

  .kh633-panel{
    max-height:82vh;
  }

  .kh633-head{
    padding:15px 16px;
  }

  .kh633-list{
    padding:5px 12px;
  }

  .kh633-row{
    min-height:64px;
  }

  .kh633-total{
    padding:
      14px
      16px
      calc(14px + env(safe-area-inset-bottom));
  }

}

/* ==========================================================
   KashfHesab V63.4 — KPI amount visibility + lower sparkline
   Outer dashboard/mobile margins intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh63-copy{
  overflow:visible;
  min-width:0;
  position:relative;
  z-index:2;
}

body.kh-dashboard-home .kh63-value{
  position:relative;
  z-index:3;
  overflow:visible;
}

body.kh-dashboard-home .kh63-value strong{
  position:relative;
  z-index:3;
}

body.kh-dashboard-home .kh63-spark{
  position:relative;
  top:16px;
  z-index:1;
  margin-inline-start:6px;
}

@media(max-width:760px){
  body.kh-dashboard-home .kh63-spark{
    top:18px;
  }
}

@media(max-width:430px){
  body.kh-dashboard-home .kh63-spark{
    top:19px;
  }
}


/* ==========================================================
   KashfHesab V63.5 — Professional KPI card borders & shadows
   Layout / dimensions / mobile margins intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh63-stat{
  border:1px solid color-mix(in srgb, var(--kh62-accent) 42%, #ffffff);
  box-shadow:
    0 7px 18px rgba(18,40,63,.075),
    0 2px 5px rgba(18,40,63,.045),
    inset 0 1px 0 rgba(255,255,255,.92);
  transition:
    border-color .20s ease,
    box-shadow .20s ease,
    transform .20s ease;
}

/* Sales — Blue */
body.kh-dashboard-home .kh63-sales{
  border-color:rgba(40,120,232,.42);
  box-shadow:
    0 7px 18px rgba(40,120,232,.09),
    0 2px 5px rgba(18,40,63,.04),
    inset 0 1px 0 rgba(255,255,255,.94);
}

/* Purchases — Purple */
body.kh-dashboard-home .kh63-purchases{
  border-color:rgba(114,88,216,.40);
  box-shadow:
    0 7px 18px rgba(114,88,216,.085),
    0 2px 5px rgba(18,40,63,.04),
    inset 0 1px 0 rgba(255,255,255,.94);
}

/* Receipts — Green */
body.kh-dashboard-home .kh63-receipts{
  border-color:rgba(30,168,108,.40);
  box-shadow:
    0 7px 18px rgba(30,168,108,.085),
    0 2px 5px rgba(18,40,63,.04),
    inset 0 1px 0 rgba(255,255,255,.94);
}

/* Expenses — Orange */
body.kh-dashboard-home .kh63-expenses{
  border-color:rgba(215,138,40,.42);
  box-shadow:
    0 7px 18px rgba(215,138,40,.09),
    0 2px 5px rgba(18,40,63,.04),
    inset 0 1px 0 rgba(255,255,255,.94);
}

/* Desktop hover — subtle professional lift */
@media(hover:hover) and (pointer:fine){

  body.kh-dashboard-home .kh63-stat:hover{
    border-color:var(--kh62-accent);
    box-shadow:
      0 10px 24px color-mix(in srgb, var(--kh62-accent) 14%, transparent),
      0 3px 7px rgba(18,40,63,.055),
      inset 0 1px 0 rgba(255,255,255,.96);
    transform:translateY(-2px);
  }

}


/* ==========================================================
   KashfHesab V63.6 — KPI titles one line
   Card layout / mobile margins intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh63-copy > span:first-child{
  display:block;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
  line-height:1.25;
}

@media(max-width:760px){
  body.kh-dashboard-home .kh63-copy > span:first-child{
    font-size:12px;
    letter-spacing:-.15px;
  }
}

@media(max-width:430px){
  body.kh-dashboard-home .kh63-copy > span:first-child{
    font-size:11.5px;
    letter-spacing:-.25px;
  }
}


/* ==========================================================
   KashfHesab V63.7 — Compact Professional Receivables Card
   Approved outer/mobile margins intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh60-balance-card{
  height:125px !important;
  min-height:125px !important;

  background:
    radial-gradient(circle at 12% 15%, rgba(45,166,236,.13), transparent 34%),
    linear-gradient(135deg,#f8fcff 0%,#f1f8ff 52%,#f7fbff 100%) !important;

  border:1px solid rgba(40,120,232,.38) !important;

  box-shadow:
    0 8px 22px rgba(40,120,232,.09),
    0 2px 6px rgba(18,40,63,.045),
    inset 0 1px 0 rgba(255,255,255,.96) !important;

  overflow:hidden !important;
}

/* subtle blue accent */
body.kh-dashboard-home .kh60-balance-card::before{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  right:0 !important;
  width:4px !important;
  height:100% !important;
  background:linear-gradient(180deg,#2878e8,#22a7df) !important;
  border-radius:0 18px 18px 0 !important;
  opacity:.95 !important;
}

/* Title */
body.kh-dashboard-home .kh60-balance-title{
  top:25px !important;
  left:22px !important;

  color:#63778d !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
}

/* Amount — approximately half the previous visual size */
body.kh-dashboard-home .kh60-balance-number{
  top:49px !important;
  left:22px !important;

  gap:5px !important;

  color:#13283f !important;
  font-size:22px !important;
  font-weight:900 !important;
  line-height:1.05 !important;
}

body.kh-dashboard-home .kh60-balance-number small{
  color:#7d8fa2 !important;
  font-size:10px !important;
  font-weight:800 !important;
}

/* Wallet icon */
body.kh-dashboard-home .kh60-wallet{
  top:20px !important;
  right:20px !important;

  width:42px !important;
  height:42px !important;

  color:#2878e8 !important;
  background:#eaf4ff !important;
  border:1px solid rgba(40,120,232,.18) !important;

  box-shadow:
    0 5px 12px rgba(40,120,232,.08),
    inset 0 1px 0 rgba(255,255,255,.9) !important;
}

/* Customer count */
body.kh-dashboard-home .kh60-customer-pill{
  top:70px !important;
  right:20px !important;

  height:30px !important;
  min-height:30px !important;

  color:#2878e8 !important;
  background:#f4f9ff !important;
  border:1px solid rgba(40,120,232,.18) !important;

  box-shadow:none !important;
}

body.kh-dashboard-home .kh60-customer-pill strong{
  color:#183b61 !important;
  font-size:13px !important;
}

/* Small mobile — same approved outer margins */
@media(max-width:380px){

  body.kh-dashboard-home .kh60-balance-card{
    height:118px !important;
    min-height:118px !important;
  }

  body.kh-dashboard-home .kh60-balance-title{
    top:23px !important;
    left:19px !important;
    font-size:12px !important;
  }

  body.kh-dashboard-home .kh60-balance-number{
    top:46px !important;
    left:19px !important;
    font-size:20px !important;
  }

  body.kh-dashboard-home .kh60-wallet{
    top:18px !important;
    right:18px !important;
    width:38px !important;
    height:38px !important;
  }

  body.kh-dashboard-home .kh60-customer-pill{
    top:64px !important;
    right:18px !important;
  }
}


/* ==========================================================
   KashfHesab V63.8 — Creative 3D Receivables Card
   Approved size and mobile outer margins remain untouched
   ========================================================== */

body.kh-dashboard-home .kh60-balance-card{
  background:
    radial-gradient(circle at 12% 8%,
      rgba(62,174,255,.18) 0%,
      rgba(62,174,255,.07) 24%,
      transparent 45%),
    radial-gradient(circle at 88% 100%,
      rgba(40,120,232,.10) 0%,
      transparent 42%),
    linear-gradient(135deg,
      #ffffff 0%,
      #f7fbff 48%,
      #edf7ff 100%) !important;

  border:1.5px solid rgba(40,120,232,.62) !important;

  box-shadow:
    0 2px 0 rgba(255,255,255,.95) inset,
    0 -1px 0 rgba(40,120,232,.08) inset,
    0 5px 0 rgba(40,120,232,.07),
    0 12px 25px rgba(26,92,170,.11),
    0 3px 8px rgba(18,40,63,.055) !important;
}

/* slim dimensional accent */
body.kh-dashboard-home .kh60-balance-card::before{
  content:"" !important;
  position:absolute !important;
  top:10px !important;
  right:0 !important;
  bottom:10px !important;
  width:4px !important;
  height:auto !important;

  border-radius:5px 0 0 5px !important;

  background:
    linear-gradient(
      180deg,
      #45b8ff 0%,
      #1688ee 48%,
      #1269ce 100%
    ) !important;

  box-shadow:
    -2px 0 7px rgba(40,120,232,.16) !important;

  opacity:1 !important;
}

/* soft decorative glow without affecting content */
body.kh-dashboard-home .kh60-balance-card::after{
  content:"" !important;
  position:absolute !important;
  width:150px !important;
  height:150px !important;
  left:-55px !important;
  bottom:-95px !important;

  border-radius:50% !important;

  background:
    radial-gradient(
      circle,
      rgba(61,173,255,.12) 0%,
      rgba(61,173,255,.04) 48%,
      transparent 70%
    ) !important;

  pointer-events:none !important;
}

/* title */
body.kh-dashboard-home .kh60-balance-title{
  color:#536d88 !important;
  text-shadow:0 1px 0 rgba(255,255,255,.95) !important;
}

/* amount */
body.kh-dashboard-home .kh60-balance-number{
  color:#102b49 !important;
  text-shadow:0 1px 0 #fff !important;
}

body.kh-dashboard-home .kh60-balance-number small{
  color:#71869b !important;
}

/* wallet — mini raised card */
body.kh-dashboard-home .kh60-wallet{
  color:#147de1 !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.96),
      rgba(224,242,255,.92)
    ) !important;

  border:1px solid rgba(40,120,232,.27) !important;

  box-shadow:
    0 2px 0 rgba(255,255,255,.98) inset,
    0 5px 11px rgba(40,120,232,.10),
    0 2px 4px rgba(18,40,63,.045) !important;
}

/* customer count — second raised mini card */
body.kh-dashboard-home .kh60-customer-pill{
  color:#147de1 !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.97),
      rgba(235,247,255,.94)
    ) !important;

  border:1px solid rgba(40,120,232,.25) !important;

  box-shadow:
    0 2px 0 rgba(255,255,255,.98) inset,
    0 5px 11px rgba(40,120,232,.08),
    0 2px 4px rgba(18,40,63,.04) !important;
}

body.kh-dashboard-home .kh60-customer-pill strong{
  color:#173c64 !important;
}

/* Desktop only: subtle premium lift */
@media(hover:hover) and (pointer:fine){

  body.kh-dashboard-home .kh60-balance-card{
    transition:
      transform .2s ease,
      border-color .2s ease,
      box-shadow .2s ease !important;
  }

  body.kh-dashboard-home .kh60-balance-card:hover{
    transform:translateY(-2px);

    border-color:rgba(40,120,232,.82) !important;

    box-shadow:
      0 2px 0 rgba(255,255,255,.98) inset,
      0 -1px 0 rgba(40,120,232,.10) inset,
      0 6px 0 rgba(40,120,232,.075),
      0 15px 30px rgba(26,92,170,.14),
      0 4px 9px rgba(18,40,63,.06) !important;
  }
}


/* ==========================================================
   KashfHesab V63.9 — Today Activity Glass Heading
   Approved dashboard/mobile margins intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh639-today-head{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;

  margin:10px 0 12px;
  padding:10px 14px;

  border:1px solid rgba(40,120,232,.20);
  border-radius:16px;

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.82),
      rgba(237,247,255,.68)
    );

  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 6px 18px rgba(28,87,150,.065);

  overflow:hidden;
}

body.kh-dashboard-home .kh639-today-head::before{
  content:"";
  position:absolute;
  top:0;
  right:0;
  width:110px;
  height:100%;

  background:
    radial-gradient(
      circle at 100% 0,
      rgba(45,159,239,.15),
      transparent 68%
    );

  pointer-events:none;
}

body.kh-dashboard-home .kh639-today-title{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  gap:10px;
}

body.kh-dashboard-home .kh639-today-icon{
  display:flex;
  align-items:center;
  justify-content:center;

  width:34px;
  height:34px;
  flex:0 0 34px;

  border-radius:11px;

  color:#197edb;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.98),
      rgba(222,241,255,.92)
    );

  border:1px solid rgba(40,120,232,.23);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 4px 10px rgba(40,120,232,.10);
}

body.kh-dashboard-home .kh639-today-icon svg{
  width:18px;
  height:18px;

  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body.kh-dashboard-home .kh639-today-title strong{
  display:block;
  color:#173552;
  font-size:14px;
  font-weight:900;
  line-height:1.2;
}

body.kh-dashboard-home .kh639-today-title small{
  display:block;
  margin-top:2px;

  color:#8495a6;
  font-size:9px;
  font-weight:700;
}

body.kh-dashboard-home .kh639-today-dot{
  position:relative;
  z-index:2;

  width:8px;
  height:8px;
  flex:0 0 8px;

  border-radius:50%;
  background:#28a978;

  box-shadow:
    0 0 0 4px rgba(40,169,120,.10),
    0 2px 5px rgba(40,169,120,.18);
}

@media(max-width:430px){

  body.kh-dashboard-home .kh639-today-head{
    padding:9px 11px;
    border-radius:14px;
  }

  body.kh-dashboard-home .kh639-today-icon{
    width:31px;
    height:31px;
    flex-basis:31px;
  }

  body.kh-dashboard-home .kh639-today-title strong{
    font-size:13px;
  }

  body.kh-dashboard-home .kh639-today-title small{
    font-size:8px;
  }
}


/* ==========================================================
   KashfHesab V64.0 — Unified Glass Section System
   Quick Actions + Creative Section Separators
   Approved mobile side margins remain untouched
   ========================================================== */

/* Quick actions glass header */
body.kh-dashboard-home .kh640-quick-head{
  border-color:rgba(103,91,211,.20);

  background:
    radial-gradient(circle at 92% 0,
      rgba(112,91,218,.10),
      transparent 38%),
    linear-gradient(
      135deg,
      rgba(255,255,255,.84),
      rgba(244,242,255,.68)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 6px 18px rgba(79,69,160,.065);
}

/* Lightning mini-card */
body.kh-dashboard-home .kh640-quick-icon{
  color:#6856d8;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.98),
      rgba(235,231,255,.94)
    );

  border-color:rgba(104,86,216,.24);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 4px 10px rgba(104,86,216,.11);
}

body.kh-dashboard-home .kh640-quick-icon svg{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linejoin:round;
}

/* Small purple status detail */
body.kh-dashboard-home .kh640-quick-dot{
  position:relative;
  z-index:2;

  width:8px;
  height:8px;
  flex:0 0 8px;

  border-radius:50%;

  background:#7058d8;

  box-shadow:
    0 0 0 4px rgba(112,88,216,.09),
    0 2px 5px rgba(112,88,216,.16);
}

/* ----------------------------------------------------------
   Creative separator between Quick Actions and Today Activity
   Does NOT change approved horizontal margins
   ---------------------------------------------------------- */

body.kh-dashboard-home .kh49-quick-section{
  position:relative;
  padding-bottom:18px;
  margin-bottom:13px;
}

body.kh-dashboard-home .kh49-quick-section::after{
  content:"";
  position:absolute;

  left:7%;
  right:7%;
  bottom:0;

  height:1px;

  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(40,120,232,.08) 12%,
      rgba(40,120,232,.30) 48%,
      rgba(112,88,216,.20) 70%,
      transparent 100%
    );

  box-shadow:
    0 1px 5px rgba(40,120,232,.055);

  pointer-events:none;
}

/* small center jewel on separator */
body.kh-dashboard-home .kh49-quick-section::before{
  content:"";
  position:absolute;

  left:50%;
  bottom:-2px;

  width:5px;
  height:5px;

  transform:translateX(-50%) rotate(45deg);

  border-radius:1px;

  background:#ffffff;
  border:1px solid rgba(40,120,232,.30);

  box-shadow:
    0 1px 5px rgba(40,120,232,.12);

  z-index:2;
}

/* Today heading gets its own subtle top separation */
body.kh-dashboard-home .kh639-today-head:not(.kh640-quick-head){
  position:relative;
  margin-top:0;
}

/* keep mobile layout compact */
@media(max-width:430px){

  body.kh-dashboard-home .kh49-quick-section{
    padding-bottom:15px;
    margin-bottom:11px;
  }

  body.kh-dashboard-home .kh49-quick-section::after{
    left:5%;
    right:5%;
  }
}


/* ==========================================================
   KashfHesab V64.1 — Interactive Compact Receivables Card
   Approved outer/mobile margins intentionally untouched
   ========================================================== */

body.kh-dashboard-home .kh641-balance-interactive{
  height:88px !important;
  min-height:88px !important;

  cursor:pointer;

  transition:
    height .30s cubic-bezier(.22,.8,.3,1),
    min-height .30s cubic-bezier(.22,.8,.3,1),
    transform .18s ease,
    box-shadow .25s ease,
    border-color .25s ease !important;
}

/* المحتوى فوق الزخارف */
body.kh-dashboard-home .kh641-balance-interactive > *{
  position:relative;
  z-index:3;
}

/* wallet compact */
body.kh-dashboard-home .kh641-balance-interactive .kh60-wallet{
  top:22px !important;
  right:18px !important;

  width:36px !important;
  height:36px !important;
  min-width:36px !important;
}

/* main content */
body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-title{
  top:18px !important;
  left:18px !important;

  font-size:11px !important;
  white-space:nowrap !important;
}

/* amount */
body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-number{
  top:39px !important;
  left:18px !important;

  font-size:19px !important;
  white-space:nowrap !important;
}

/* customer badge: icon + number same horizontal line */
body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill{
  top:24px !important;
  right:61px !important;

  width:auto !important;
  min-width:48px !important;

  height:32px !important;
  min-height:32px !important;

  padding:0 9px !important;

  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;

  border-radius:11px !important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill .kh60-people{
  width:15px !important;
  height:15px !important;
  flex:0 0 15px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill .kh60-people svg{
  width:15px !important;
  height:15px !important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill strong{
  font-size:12px !important;
  line-height:1 !important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill > span:last-child{
  display:none !important;
}

/* details hidden in compact state */
body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-bottom{
  display:flex !important;

  position:absolute !important;
  left:18px !important;
  right:18px !important;
  bottom:10px !important;

  opacity:0;
  visibility:hidden;
  transform:translateY(8px);

  pointer-events:none;

  transition:
    opacity .22s ease,
    transform .28s ease,
    visibility .22s ease;
}

/* =========================
   EXPANDED — first click
   ========================= */

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded{
  height:138px !important;
  min-height:138px !important;

  border-color:rgba(40,120,232,.78) !important;

  box-shadow:
    0 2px 0 rgba(255,255,255,.98) inset,
    0 -1px 0 rgba(40,120,232,.10) inset,
    0 6px 0 rgba(40,120,232,.075),
    0 15px 28px rgba(26,92,170,.13),
    0 4px 9px rgba(18,40,63,.055) !important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-balance-bottom{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

/* chart stays compact and elegant */
body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-mini-chart{
  display:block !important;
  width:82px !important;
  height:27px !important;
}

/* press feedback */
body.kh-dashboard-home .kh641-balance-interactive:active{
  transform:scale(.992);
}

/* keyboard accessibility */
body.kh-dashboard-home .kh641-balance-interactive:focus-visible{
  outline:2px solid rgba(40,120,232,.48);
  outline-offset:3px;
}

/* target customer row breathing room after smooth scroll */
body.kh-dashboard-home #kh641CustomersList{
  scroll-margin-top:90px;
}

/* Small mobile — preserve approved side margins */
@media(max-width:380px){

  body.kh-dashboard-home .kh641-balance-interactive{
    height:84px !important;
    min-height:84px !important;
  }

  body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded{
    height:132px !important;
    min-height:132px !important;
  }

  body.kh-dashboard-home .kh641-balance-interactive .kh60-wallet{
    top:21px !important;
    right:16px !important;

    width:34px !important;
    height:34px !important;
  }

  body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill{
    top:22px !important;
    right:56px !important;
  }

  body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-title{
    top:17px !important;
    left:16px !important;
    font-size:10.5px !important;
  }

  body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-number{
    top:37px !important;
    left:16px !important;
    font-size:18px !important;
  }
}


/* ==========================================================
   KashfHesab V64.1.3 — Unified Receivables Amount Row
   Visual order: Amount | Customers | Currency
   ========================================================== */

body.kh-dashboard-home .kh6413-balance-row{
  position:absolute;
  top:38px;
  left:18px;

  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  gap:7px;

  direction:ltr;
  white-space:nowrap;

  z-index:5;
}

/* Amount */
body.kh-dashboard-home .kh6413-balance-row .kh60-balance-number{
  position:static !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;

  display:block !important;
  line-height:1 !important;
}

body.kh-dashboard-home .kh6413-amount{
  display:block;

  color:#102b49;
  font-size:19px;
  font-weight:900;
  line-height:1;

  letter-spacing:-.3px;
}

/* Customers: icon + count */
body.kh-dashboard-home .kh6413-balance-row .kh60-customer-pill{
  position:static !important;

  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;

  width:auto !important;
  min-width:0 !important;

  height:25px !important;
  min-height:25px !important;

  padding:0 7px !important;

  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;

  direction:ltr !important;

  border-radius:9px !important;

  background:rgba(236,247,255,.90) !important;
  border:1px solid rgba(40,120,232,.22) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.96),
    0 2px 5px rgba(40,120,232,.07) !important;
}

body.kh-dashboard-home .kh6413-balance-row .kh60-people{
  width:14px !important;
  height:14px !important;
  flex:0 0 14px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

body.kh-dashboard-home .kh6413-balance-row .kh60-people svg{
  width:14px !important;
  height:14px !important;
}

body.kh-dashboard-home .kh6413-balance-row .kh60-customer-pill strong{
  color:#235b91 !important;
  font-size:11px !important;
  font-weight:900 !important;
  line-height:1 !important;
}

/* Currency at the far right of the visual row */
body.kh-dashboard-home .kh6413-currency{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  color:#71869b;
  font-size:11px;
  font-weight:900;
  line-height:1;

  padding:0 1px;
}

/* Small phones */
@media(max-width:380px){

  body.kh-dashboard-home .kh6413-balance-row{
    top:36px;
    left:16px;
    gap:5px;
  }

  body.kh-dashboard-home .kh6413-amount{
    font-size:18px;
  }

  body.kh-dashboard-home .kh6413-balance-row .kh60-customer-pill{
    height:23px !important;
    min-height:23px !important;
    padding:0 6px !important;
  }

  body.kh-dashboard-home .kh6413-currency{
    font-size:10px;
  }
}


/* ==========================================================
   KashfHesab V64.1.4
   Wallet + Customers icons side by side
   ========================================================== */

/* customer group stays beside wallet */
body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill{
  top:22px !important;
  right:59px !important;

  width:auto !important;
  min-width:0 !important;
  height:36px !important;
  min-height:36px !important;

  padding:0 !important;
  gap:4px !important;

  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* people icon becomes its own button beside wallet */
body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill .kh60-people{
  width:36px !important;
  height:36px !important;
  flex:0 0 36px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:11px !important;
  background:rgba(236,247,255,.96) !important;
  border:1px solid rgba(40,120,232,.22) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 3px 7px rgba(40,120,232,.09) !important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill .kh60-people svg{
  width:18px !important;
  height:18px !important;
}

/* customer count remains separate */
body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill strong{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  min-width:20px !important;
  height:25px !important;

  padding:0 5px !important;

  border-radius:8px !important;
  background:rgba(236,247,255,.82) !important;

  color:#235b91 !important;
  font-size:11px !important;
  font-weight:900 !important;
}

/* keep text hidden */
body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill > span:last-child{
  display:none !important;
}

@media(max-width:380px){

  body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill{
    top:21px !important;
    right:55px !important;
    height:34px !important;
    min-height:34px !important;
  }

  body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill .kh60-people{
    width:34px !important;
    height:34px !important;
    flex-basis:34px !important;
  }
}


/* ==========================================================
   KashfHesab V64.1.5
   Creative Customers Mini Card — Icon + Count as one unit
   ========================================================== */

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill{
  top:22px !important;
  right:59px !important;

  width:auto !important;
  min-width:58px !important;
  height:36px !important;
  min-height:36px !important;

  padding:0 10px !important;

  display:inline-flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;

  direction:ltr !important;

  border-radius:12px !important;

  background:
    radial-gradient(circle at 20% 10%,
      rgba(255,255,255,.95) 0%,
      rgba(255,255,255,.30) 30%,
      transparent 55%),
    linear-gradient(135deg,
      rgba(231,244,255,.98) 0%,
      rgba(222,236,255,.98) 48%,
      rgba(235,229,255,.98) 100%) !important;

  border:1px solid rgba(83,112,224,.30) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 3px 0 rgba(82,111,220,.08),
    0 6px 12px rgba(55,92,170,.11) !important;
}

/* people icon inside same card */
body.kh-dashboard-home .kh641-balance-interactive
.kh60-customer-pill .kh60-people{
  width:22px !important;
  height:22px !important;
  flex:0 0 22px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:7px !important;

  background:linear-gradient(
    135deg,
    rgba(74,144,255,.16),
    rgba(119,91,232,.15)
  ) !important;

  border:0 !important;
  box-shadow:none !important;
}

body.kh-dashboard-home .kh641-balance-interactive
.kh60-customer-pill .kh60-people svg{
  width:15px !important;
  height:15px !important;

  stroke:#416fd1 !important;
  stroke-width:1.9 !important;
}

/* number 10 — same unit, no separate box */
body.kh-dashboard-home .kh641-balance-interactive
.kh60-customer-pill strong{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  min-width:0 !important;
  height:auto !important;

  padding:0 !important;

  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;

  color:#314f9f !important;

  font-size:13px !important;
  font-weight:900 !important;
  line-height:1 !important;
}

/* hide "زبون مسجل" — icon + number only */
body.kh-dashboard-home .kh641-balance-interactive
.kh60-customer-pill > span:last-child{
  display:none !important;
}

/* subtle interaction */
@media (hover:hover){
  body.kh-dashboard-home .kh641-balance-interactive
  .kh60-customer-pill{
    transition:
      transform .18s ease,
      box-shadow .18s ease,
      border-color .18s ease;
  }

  body.kh-dashboard-home .kh641-balance-interactive:hover
  .kh60-customer-pill{
    transform:translateY(-1px);

    border-color:rgba(83,112,224,.43) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.98),
      0 4px 0 rgba(82,111,220,.08),
      0 8px 15px rgba(55,92,170,.14) !important;
  }
}

/* approved mobile spacing remains untouched */
@media(max-width:380px){

  body.kh-dashboard-home .kh641-balance-interactive
  .kh60-customer-pill{
    top:21px !important;
    right:55px !important;

    min-width:54px !important;

    height:34px !important;
    min-height:34px !important;

    padding:0 8px !important;
    gap:5px !important;
  }

  body.kh-dashboard-home .kh641-balance-interactive
  .kh60-customer-pill .kh60-people{
    width:20px !important;
    height:20px !important;
    flex-basis:20px !important;
  }
}


/* ==========================================================
   KashfHesab V64.1.6 — Receivables Focus Interaction
   First click: lift + enlarge
   Second click: customers
   ========================================================== */

body.kh-dashboard-home .kh641-balance-interactive{
  cursor:pointer;
  transform-origin:center center;
  transition:
    transform .32s cubic-bezier(.2,.8,.2,1),
    box-shadow .32s ease,
    border-color .32s ease,
    height .32s cubic-bezier(.2,.8,.2,1),
    min-height .32s cubic-bezier(.2,.8,.2,1) !important;
}

/* First click */
body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded{
  position:relative !important;
  z-index:80 !important;

  height:138px !important;
  min-height:138px !important;

  transform:
    translateY(-8px)
    scale(1.035) !important;

  border-color:rgba(40,120,232,.82) !important;

  box-shadow:
    0 2px 0 rgba(255,255,255,.98) inset,
    0 8px 0 rgba(40,120,232,.07),
    0 22px 42px rgba(26,92,170,.22),
    0 8px 18px rgba(18,40,63,.12) !important;
}

/* reveal lower details */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-balance-bottom{
  opacity:1 !important;
  visibility:visible !important;
  transform:translateY(0) !important;
  pointer-events:auto !important;
}

/* make the card feel active */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-wallet{
  transform:translateY(-1px) scale(1.06);
}

body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-customer-pill{
  transform:translateY(-1px);
}

/* Mobile — preserve approved outer margins */
@media(max-width:430px){

  body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded{
    height:132px !important;
    min-height:132px !important;

    transform:
      translateY(-6px)
      scale(1.025) !important;
  }
}


/* ==========================================================
   KashfHesab V64.2 — Receivables Premium Expand
   ========================================================== */

/* ---------- normal state: improve readability ---------- */

body.kh-dashboard-home
.kh641-balance-interactive .kh60-balance-note{
  color:#58728d !important;
  font-weight:700 !important;
}

body.kh-dashboard-home
.kh641-balance-interactive .kh60-balance-note > span:last-child{
  color:#58728d !important;
  opacity:1 !important;
  text-shadow:none !important;
}

body.kh-dashboard-home
.kh641-balance-interactive .kh60-up{
  color:#20b978 !important;
}

body.kh-dashboard-home
.kh641-balance-interactive .kh60-up svg{
  stroke:#20b978 !important;
}

/* ---------- expanded state ---------- */

body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded{
  z-index:100 !important;

  height:210px !important;
  min-height:210px !important;

  transform:
    translateY(-12px)
    scale(1.035) !important;

  border:1.5px solid rgba(52,123,235,.82) !important;

  background:
    radial-gradient(circle at 15% 5%,
      rgba(91,185,255,.23) 0%,
      transparent 38%),
    radial-gradient(circle at 92% 95%,
      rgba(110,91,235,.11) 0%,
      transparent 38%),
    linear-gradient(135deg,
      #ffffff 0%,
      #f4faff 48%,
      #eaf5ff 100%) !important;

  box-shadow:
    0 2px 0 rgba(255,255,255,.98) inset,
    0 7px 0 rgba(38,112,222,.08),
    0 24px 48px rgba(18,77,150,.24),
    0 10px 22px rgba(17,43,75,.13) !important;
}

/* title stronger when expanded */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-balance-title{
  color:#173b61 !important;
  font-weight:900 !important;
}

/* amount becomes the visual focus */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-balance-number{
  color:#0b2948 !important;
  font-size:24px !important;
  font-weight:950 !important;
}

/* wallet rises slightly */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-wallet{
  transform:translateY(-2px) scale(1.08) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 7px 16px rgba(24,107,196,.18) !important;
}

/* customer mini-card stays as one creative unit */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-customer-pill{
  transform:translateY(-2px) scale(1.04) !important;

  border-color:rgba(91,92,224,.42) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.98),
    0 6px 14px rgba(72,88,190,.16) !important;
}

/* reveal the existing lower information */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-balance-bottom{
  display:flex !important;

  left:20px !important;
  right:20px !important;
  bottom:46px !important;

  opacity:1 !important;
  visibility:visible !important;

  transform:translateY(0) !important;

  transition:
    opacity .28s ease .06s,
    transform .32s ease .06s !important;
}

/* readable explanatory text */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-balance-note{
  color:#45647f !important;
  font-size:11px !important;
  font-weight:800 !important;
  opacity:1 !important;
}

body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-balance-note > span:last-child{
  color:#45647f !important;
  opacity:1 !important;
}

/* chart becomes larger and clearer */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded
.kh60-mini-chart{
  width:118px !important;
  height:38px !important;

  opacity:1 !important;

  filter:
    drop-shadow(0 4px 5px rgba(28,190,116,.13));
}

/* second-click hint */
body.kh-dashboard-home
.kh641-balance-interactive.kh641-expanded::after{
  content:"👥  اضغط مرة أخرى للانتقال إلى الزبائن";

  position:absolute;

  left:20px;
  right:20px;
  bottom:10px;

  height:28px;

  display:flex;
  align-items:center;
  justify-content:center;

  direction:rtl;

  border-radius:10px;

  color:#ffffff;

  font-size:10.5px;
  font-weight:900;

  background:
    linear-gradient(
      100deg,
      #0878dc 0%,
      #176fe8 52%,
      #4b55e8 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 5px 11px rgba(25,93,190,.18);

  opacity:0;

  transform:translateY(5px);

  animation:kh642HintIn .28s ease .10s forwards;

  pointer-events:none;
}

@keyframes kh642HintIn{
  to{
    opacity:1;
    transform:translateY(0);
  }
}


/* ---------- mobile ---------- */

@media(max-width:430px){

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded{
    height:198px !important;
    min-height:198px !important;

    transform:
      translateY(-9px)
      scale(1.025) !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded
  .kh60-balance-number{
    font-size:22px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded
  .kh60-balance-bottom{
    left:16px !important;
    right:16px !important;
    bottom:44px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded
  .kh60-mini-chart{
    width:105px !important;
    height:34px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded::after{
    left:16px;
    right:16px;
    bottom:9px;

    height:27px;

    font-size:10px;
  }
}


/* ==========================================================
   KashfHesab V64.3 — Desktop Receivables Alignment
   Desktop only — mobile remains untouched
   ========================================================== */

@media (min-width:1025px){

  /* Keep the receivables card balanced on wide screens */
  body.kh-dashboard-home .kh641-balance-interactive{
    direction:rtl;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-main{
    width:100% !important;
    min-width:0 !important;
  }

  /* Main upper row */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-head{
    width:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:28px !important;
  }

  /* Title + amount stay together on the right */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-head > div:first-child{
    flex:1 1 auto !important;
    min-width:0 !important;
    text-align:right !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-title{
    display:block !important;
    text-align:right !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-number{
    display:flex !important;
    align-items:baseline !important;
    justify-content:flex-start !important;
    gap:6px !important;
    direction:rtl !important;
    text-align:right !important;
  }

  /* Customer mini-card gets its own clear area */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-customer-pill{
    flex:0 0 auto !important;
    margin:0 !important;
    white-space:nowrap !important;
  }

  /* Lower information uses the card width */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-bottom{
    width:auto !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:24px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-note{
    flex:1 1 auto !important;
    justify-content:flex-start !important;
    text-align:right !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-mini-chart{
    flex:0 0 118px !important;
    margin:0 !important;
  }

  /* Expanded desktop state — no horizontal distortion */
  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded{
    transform:translateY(-10px) scale(1.018) !important;
  }

}


/* ==========================================================
   KashfHesab V64.4 — Professional Desktop Receivables Rebuild
   DESKTOP ONLY — approved mobile remains untouched
   ========================================================== */

@media (min-width:1025px){

  body.kh-dashboard-home .kh641-balance-interactive{
    position:relative !important;
    display:flex !important;
    align-items:center !important;

    height:128px !important;
    min-height:128px !important;

    padding:20px 28px !important;

    overflow:hidden !important;

    direction:rtl !important;
  }

  /* ---------- WALLET ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-wallet{
    position:relative !important;

    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;

    flex:0 0 58px !important;

    width:58px !important;
    height:58px !important;

    margin:0 0 0 24px !important;

    display:grid !important;
    place-items:center !important;

    border-radius:17px !important;

    transform:none !important;

    z-index:3 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-wallet svg{
    width:28px !important;
    height:28px !important;
  }

  /* ---------- MAIN CONTENT ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-main{
    position:relative !important;

    flex:1 1 auto !important;

    width:auto !important;
    height:100% !important;
    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;

    margin:0 !important;
    padding:0 !important;
  }

  /* ---------- TOP ROW ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-head{
    position:relative !important;

    width:100% !important;
    min-height:58px !important;

    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;

    align-items:center !important;

    column-gap:34px !important;

    margin:0 !important;
    padding:0 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-balance-head > div:first-child{
    position:relative !important;

    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;

    text-align:right !important;
  }

  /* ---------- TITLE ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-title{
    position:static !important;

    display:block !important;

    width:auto !important;
    max-width:none !important;

    margin:0 0 5px 0 !important;
    padding:0 !important;

    font-size:13px !important;
    line-height:1.3 !important;
    font-weight:800 !important;

    text-align:right !important;
    white-space:nowrap !important;
  }

  /* ---------- AMOUNT ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-number{
    position:static !important;

    display:flex !important;
    align-items:baseline !important;
    justify-content:flex-start !important;

    width:auto !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;

    gap:7px !important;

    direction:ltr !important;

    font-size:30px !important;
    line-height:1 !important;
    font-weight:950 !important;

    letter-spacing:-.7px !important;

    white-space:nowrap !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-number small{
    font-size:11px !important;
    font-weight:850 !important;
  }

  /* ---------- CUSTOMER MINI CARD ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-customer-pill{
    position:static !important;

    width:auto !important;
    min-width:128px !important;
    height:46px !important;
    min-height:46px !important;

    display:grid !important;
    grid-template-columns:28px auto !important;
    grid-template-rows:20px 15px !important;

    column-gap:8px !important;

    align-items:center !important;

    margin:0 !important;
    padding:5px 12px !important;

    border-radius:14px !important;

    white-space:nowrap !important;

    transform:none !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-customer-pill .kh60-people{
    grid-column:1 !important;
    grid-row:1 / span 2 !important;

    width:28px !important;
    height:28px !important;

    display:grid !important;
    place-items:center !important;

    margin:0 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-customer-pill .kh60-people svg{
    width:18px !important;
    height:18px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-customer-pill strong{
    grid-column:2 !important;
    grid-row:1 !important;

    font-size:16px !important;
    line-height:20px !important;
    font-weight:950 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-customer-pill > span:last-child{
    grid-column:2 !important;
    grid-row:2 !important;

    display:block !important;

    font-size:9.5px !important;
    line-height:13px !important;
    font-weight:750 !important;
  }

  /* ---------- LOWER INFORMATION ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-bottom{
    position:relative !important;

    right:auto !important;
    left:auto !important;
    top:auto !important;
    bottom:auto !important;

    width:100% !important;
    height:32px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:24px !important;

    margin:7px 0 0 !important;
    padding:0 !important;

    opacity:1 !important;
    visibility:visible !important;

    transform:none !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-note{
    flex:1 1 auto !important;

    display:flex !important;
    align-items:center !important;

    gap:6px !important;

    font-size:10.5px !important;

    text-align:right !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-mini-chart{
    flex:0 0 110px !important;

    width:110px !important;
    height:30px !important;

    margin:0 !important;

    opacity:.95 !important;
  }

  /* ---------- EXPANDED DESKTOP ---------- */

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded{
    height:174px !important;
    min-height:174px !important;

    transform:translateY(-6px) scale(1.008) !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded
  .kh60-balance-bottom{
    margin-top:10px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded::after{
    left:28px !important;
    right:28px !important;
    bottom:9px !important;
  }

}


/* ==========================================================
   KashfHesab V64.5 — Professional Desktop Header Layout
   DESKTOP ONLY — mobile remains untouched

   RIGHT: menu | notifications | company
   LEFT : username | logo | date/time
   ========================================================== */

@media (min-width:1025px){

  /* ===== MAIN HEADER ===== */

  body.kh-dashboard-home .topbar{
    position:relative !important;

    min-height:76px !important;
    height:76px !important;

    display:flex !important;
    align-items:center !important;

    padding:0 76px 0 30px !important;

    direction:rtl !important;
  }


  /* ========================================================
     RIGHT SIDE — COMPANY
     ======================================================== */

  body.kh-dashboard-home .topbar-brand{
    position:static !important;

    display:flex !important;
    align-items:center !important;

    width:auto !important;
    min-width:0 !important;

    margin:0 !important;
    padding:0 !important;

    order:1 !important;
  }

  body.kh-dashboard-home .topbar-brand .brand{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;

    min-width:0 !important;

    margin:0 !important;
    padding:0 !important;
  }

  body.kh-dashboard-home .topbar-brand .brand h1{
    margin:0 !important;

    font-size:16px !important;
    line-height:20px !important;
    font-weight:900 !important;

    white-space:nowrap !important;
  }

  body.kh-dashboard-home .topbar-brand .brand span{
    margin-top:2px !important;

    font-size:10px !important;
    line-height:14px !important;

    white-space:nowrap !important;
  }


  /* ========================================================
     MOVE LOGO TO LEFT GROUP
     ======================================================== */

  body.kh-dashboard-home .topbar-brand .topbar-logo,
  body.kh-dashboard-home .topbar-brand .mark{
    position:absolute !important;

    left:150px !important;
    right:auto !important;
    top:50% !important;

    width:42px !important;
    height:42px !important;

    margin:0 !important;

    transform:translateY(-50%) !important;

    object-fit:contain !important;

    z-index:5 !important;
  }


  /* ========================================================
     HEADER ACTION AREA
     ======================================================== */

  body.kh-dashboard-home .topbar > .topbar-in{
    position:static !important;

    width:auto !important;

    display:flex !important;
    align-items:center !important;

    margin:0 !important;
    padding:0 !important;

    order:2 !important;
  }

  body.kh-dashboard-home .topbar .top-actions{
    position:static !important;

    display:flex !important;
    align-items:center !important;

    width:auto !important;

    margin:0 !important;
    padding:0 !important;
  }


  /* ========================================================
     NOTIFICATION BELL — BESIDE COMPANY
     ======================================================== */

  body.kh-dashboard-home .topbar .notif-bell{
    position:absolute !important;

    right:265px !important;
    left:auto !important;
    top:50% !important;

    margin:0 !important;

    transform:translateY(-50%) !important;

    z-index:7 !important;
  }

  body.kh-dashboard-home .topbar .notif-bell-btn{
    width:38px !important;
    height:38px !important;

    min-width:38px !important;

    display:grid !important;
    place-items:center !important;

    margin:0 !important;
    padding:0 !important;

    border-radius:12px !important;
  }


  /* ========================================================
     USERNAME — FAR LEFT
     ======================================================== */

  body.kh-dashboard-home .kh645-header-user{
    position:absolute !important;

    left:28px !important;
    right:auto !important;
    top:50% !important;

    height:38px !important;

    display:flex !important;
    align-items:center !important;

    margin:0 !important;
    padding:0 12px !important;

    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:12px !important;

    background:rgba(255,255,255,.08) !important;

    transform:translateY(-50%) !important;

    z-index:6 !important;
  }

  body.kh-dashboard-home .kh645-header-user-name{
    color:#fff !important;

    font-size:12px !important;
    font-weight:850 !important;

    line-height:1 !important;

    white-space:nowrap !important;
  }


  /* ========================================================
     DATE / TIME — RIGHT OF LOGO IN LEFT GROUP
     ======================================================== */

  body.kh-dashboard-home .topbar .live-clock{
    position:absolute !important;

    left:210px !important;
    right:auto !important;
    top:50% !important;

    display:flex !important;
    align-items:center !important;

    margin:0 !important;
    padding:0 !important;

    color:rgba(255,255,255,.86) !important;

    font-size:11px !important;
    font-weight:750 !important;

    white-space:nowrap !important;

    transform:translateY(-50%) !important;

    z-index:5 !important;
  }


  /* ========================================================
     MENU BUTTON — FAR RIGHT
     ======================================================== */

  body.kh-dashboard-home .kh-sidebar-toggle{
    position:fixed !important;

    top:19px !important;
    right:22px !important;
    left:auto !important;

    width:38px !important;
    height:38px !important;

    display:grid !important;
    place-items:center !important;

    margin:0 !important;
    padding:0 !important;

    border-radius:11px !important;

    z-index:1002 !important;
  }

}


/* ==========================================================
   KashfHesab V64.5.1 — Final Desktop Dashboard Header
   DESKTOP ONLY
   RIGHT: menu | bell | company
   LEFT : user | logo | date
   Mobile remains untouched
   ========================================================== */

@media (min-width:1025px){

  /* Old generic topbar is not used on dashboard desktop */
  body.kh-dashboard-home > .topbar{
    display:none !important;
  }

  /* Real dashboard header */
  body.kh-dashboard-home .kh6012-header{
    position:relative !important;

    display:grid !important;
    grid-template-columns:
      44px
      44px
      minmax(190px,1fr)
      minmax(20px,2fr)
      auto
      52px
      auto !important;

    grid-template-areas:
      "menu bell company spacer date logo user" !important;

    align-items:center !important;
    column-gap:10px !important;

    width:100% !important;
    min-height:76px !important;
    height:76px !important;

    margin:0 !important;
    padding:0 22px !important;

    box-sizing:border-box !important;
    direction:rtl !important;
  }

  /* Remove all old absolute positioning */
  body.kh-dashboard-home .kh6012-header > *{
    transform:none !important;
  }

  /* MENU — far right */
  body.kh-dashboard-home .kh6012-header .kh605-menu{
    grid-area:menu !important;
    position:static !important;

    width:40px !important;
    height:40px !important;

    margin:0 !important;

    justify-self:center !important;
    align-self:center !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;

    z-index:2 !important;
  }

  /* BELL */
  body.kh-dashboard-home .kh6012-header .kh605-bell{
    grid-area:bell !important;
    position:static !important;

    width:40px !important;
    height:40px !important;

    margin:0 !important;

    justify-self:center !important;
    align-self:center !important;

    z-index:2 !important;
  }

  /* COMPANY */
  body.kh-dashboard-home .kh6012-company{
    grid-area:company !important;
    position:static !important;

    width:auto !important;
    max-width:300px !important;

    margin:0 !important;
    padding:0 !important;

    justify-self:start !important;
    align-self:center !important;

    text-align:right !important;
    direction:rtl !important;

    transform:none !important;
  }

  body.kh-dashboard-home .kh6012-company h1{
    margin:0 !important;

    font-size:15px !important;
    line-height:1.35 !important;
    font-weight:900 !important;

    text-align:right !important;
    white-space:nowrap !important;
  }

  body.kh-dashboard-home .kh6012-company span{
    display:block !important;

    margin-top:2px !important;

    font-size:9px !important;
    line-height:1.2 !important;

    text-align:right !important;
    opacity:.72 !important;
  }

  /* DATE */
  body.kh-dashboard-home .kh6012-date{
    grid-area:date !important;
    position:static !important;

    width:auto !important;
    max-width:none !important;
    height:auto !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:6px !important;

    margin:0 !important;
    padding:0 !important;

    justify-self:end !important;
    align-self:center !important;

    white-space:nowrap !important;

    transform:none !important;
  }

  body.kh-dashboard-home .kh6012-date strong{
    font-size:10px !important;
    line-height:1.2 !important;
    white-space:nowrap !important;
  }

  /* LOGO */
  body.kh-dashboard-home .kh6012-logo{
    grid-area:logo !important;
    position:static !important;

    width:44px !important;
    height:44px !important;

    margin:0 !important;

    justify-self:center !important;
    align-self:center !important;

    transform:none !important;
  }

  body.kh-dashboard-home .kh6012-logo img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }

  /* USER — far left */
  body.kh-dashboard-home .kh6012-user{
    grid-area:user !important;
    position:static !important;

    width:auto !important;
    max-width:150px !important;
    height:auto !important;

    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;

    gap:6px !important;

    margin:0 !important;
    padding:0 !important;

    justify-self:end !important;
    align-self:center !important;

    direction:ltr !important;

    transform:none !important;
  }

  body.kh-dashboard-home .kh6012-user .kh60-avatar{
    width:34px !important;
    height:34px !important;
    flex:0 0 34px !important;
    margin:0 !important;
  }

  body.kh-dashboard-home .kh6012-user .kh60-user-copy{
    min-width:0 !important;
    direction:rtl !important;
    text-align:left !important;
  }

  body.kh-dashboard-home .kh6012-user .kh60-user-copy small{
    font-size:8px !important;
    line-height:1 !important;
  }

  body.kh-dashboard-home .kh6012-user .kh60-user-copy strong{
    display:block !important;
    margin:2px 0 !important;
    font-size:11px !important;
    line-height:1.1 !important;
    white-space:nowrap !important;
  }

  body.kh-dashboard-home .kh6012-user .kh60-online{
    font-size:7px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
}


/* ==========================================================
   KashfHesab V64.5.2 — Desktop Header Final Reorder
   RIGHT: menu | company | logo
   LEFT : user | bell | date/time
   DESKTOP ONLY
   ========================================================== */

@media (min-width:1025px){

  body.kh-dashboard-home .kh6012-header{
    grid-template-columns:
      44px
      minmax(220px,auto)
      52px
      minmax(20px,1fr)
      auto
      44px
      auto !important;

    grid-template-areas:
      "menu company logo spacer date bell user" !important;

    column-gap:10px !important;
  }

  /* RIGHT — MENU */
  body.kh-dashboard-home .kh6012-header .kh605-menu{
    grid-area:menu !important;
    position:static !important;
    justify-self:center !important;
  }

  /* RIGHT — COMPANY */
  body.kh-dashboard-home .kh6012-company{
    grid-area:company !important;
    position:static !important;
    justify-self:start !important;
    text-align:right !important;
  }

  body.kh-dashboard-home .kh6012-company h1,
  body.kh-dashboard-home .kh6012-company span{
    text-align:right !important;
  }

  /* RIGHT — LOGO AFTER COMPANY */
  body.kh-dashboard-home .kh6012-logo{
    grid-area:logo !important;
    position:static !important;
    justify-self:center !important;
  }

  /* LEFT — USER */
  body.kh-dashboard-home .kh6012-user{
    grid-area:user !important;
    position:static !important;
    justify-self:end !important;
  }

  /* LEFT — BELL BETWEEN USER AND DATE */
  body.kh-dashboard-home .kh6012-header .kh605-bell{
    grid-area:bell !important;
    position:static !important;
    justify-self:center !important;
    align-self:center !important;
  }

  /* LEFT — DATE / TIME */
  body.kh-dashboard-home .kh6012-date{
    grid-area:date !important;
    position:static !important;
    justify-self:end !important;
  }
}


/* ==========================================================
   KashfHesab V64.5.3 — Split Header Controls
   Fix bell/menu parent wrapper on DESKTOP ONLY
   ========================================================== */

@media (min-width:1025px){

  /* Allow menu + bell to participate independently in header grid */
  body.kh-dashboard-home .kh6012-header > .kh6012-controls{
    display:contents !important;
  }

  /* RIGHT — hamburger */
  body.kh-dashboard-home .kh6012-header .kh605-menu{
    grid-area:menu !important;
    position:static !important;
    top:auto !important;
    right:auto !important;
    left:auto !important;
    transform:none !important;
    justify-self:center !important;
    align-self:center !important;
  }

  /* LEFT — bell between date and user */
  body.kh-dashboard-home .kh6012-header .kh605-bell{
    grid-area:bell !important;
    position:static !important;
    top:auto !important;
    right:auto !important;
    left:auto !important;
    transform:none !important;
    justify-self:center !important;
    align-self:center !important;
  }
}


/* ==========================================================
   KashfHesab V64.6 — Refined Desktop Receivables Card
   DESKTOP ONLY — header/mobile untouched
   ========================================================== */

@media (min-width:1025px){

  /* ===== CARD ===== */
  body.kh-dashboard-home .kh641-balance-interactive{
    height:136px !important;
    min-height:136px !important;
    padding:18px 30px !important;
    align-items:center !important;
    gap:0 !important;
  }

  /* ===== WALLET ===== */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-wallet{
    flex:0 0 64px !important;
    width:64px !important;
    height:64px !important;
    margin:0 0 0 26px !important;
    border-radius:19px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-wallet svg{
    width:30px !important;
    height:30px !important;
  }

  /* ===== MAIN AREA ===== */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-main{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    height:100% !important;
    justify-content:center !important;
  }

  /* ===== TOP ROW ===== */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-head{
    width:100% !important;
    min-height:62px !important;
    grid-template-columns:minmax(0,1fr) 146px !important;
    column-gap:30px !important;
    align-items:center !important;
  }

  /* Title + amount */
  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-balance-head > div:first-child{
    align-items:flex-start !important;
    justify-content:center !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-title{
    margin:0 0 6px !important;
    font-size:13px !important;
    line-height:1.2 !important;
    font-weight:850 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-number{
    font-size:32px !important;
    line-height:1 !important;
    font-weight:950 !important;
    gap:7px !important;
    letter-spacing:-.8px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-number small{
    font-size:11px !important;
    font-weight:850 !important;
  }

  /* ===== CUSTOMER MINI CARD ===== */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-customer-pill{
    width:146px !important;
    min-width:146px !important;
    height:52px !important;
    min-height:52px !important;

    grid-template-columns:34px minmax(0,1fr) !important;
    grid-template-rows:22px 16px !important;

    column-gap:10px !important;

    padding:7px 13px !important;

    border-radius:16px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-customer-pill .kh60-people{
    width:34px !important;
    height:34px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-customer-pill .kh60-people svg{
    width:20px !important;
    height:20px !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-customer-pill strong{
    font-size:17px !important;
    line-height:21px !important;
    font-weight:950 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive
  .kh60-customer-pill > span:last-child{
    font-size:9.5px !important;
    line-height:14px !important;
    font-weight:800 !important;
  }

  /* ===== LOWER ROW ===== */
  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-bottom{
    width:100% !important;
    height:30px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:28px !important;

    margin:6px 0 0 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-balance-note{
    flex:1 1 auto !important;
    min-width:0 !important;

    display:flex !important;
    align-items:center !important;

    gap:6px !important;

    font-size:10.5px !important;
    line-height:1.25 !important;
  }

  body.kh-dashboard-home
  .kh641-balance-interactive .kh60-mini-chart{
    flex:0 0 124px !important;
    width:124px !important;
    height:30px !important;
    margin:0 !important;
  }

  /* ===== EXPANDED STATE ===== */
  body.kh-dashboard-home
  .kh641-balance-interactive.kh641-expanded{
    height:180px !important;
    min-height:180px !important;
    transform:translateY(-6px) scale(1.006) !important;
  }
}


/* ==========================================================
   KashfHesab V64.7 — Creative Receivables / Desktop Only
   ========================================================== */
@media (min-width:1025px){

body.kh-dashboard-home .kh641-balance-interactive{
  height:142px!important;
  min-height:142px!important;
  padding:20px 30px!important;
  overflow:hidden!important;
  isolation:isolate!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-wallet{
  flex:0 0 68px!important;
  width:68px!important;
  height:68px!important;
  margin:0 0 0 28px!important;
  border-radius:20px!important;
  position:relative!important;
  transform:none!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-wallet:after{
  content:""!important;
  position:absolute!important;
  inset:-7px!important;
  border:1px solid rgba(59,130,246,.12)!important;
  border-radius:25px!important;
  pointer-events:none!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-wallet svg{
  width:31px!important;
  height:31px!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-main{
  flex:1 1 auto!important;
  min-width:0!important;
  height:100%!important;
  display:grid!important;
  grid-template-rows:minmax(70px,1fr) 34px!important;
  row-gap:8px!important;
  align-content:center!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-head{
  width:100%!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(250px,1fr) 158px!important;
  column-gap:38px!important;
  align-items:center!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-title{
  margin:0 0 7px!important;
  font-size:13px!important;
  font-weight:850!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-number{
  font-size:34px!important;
  line-height:1!important;
  gap:8px!important;
  font-weight:950!important;
  direction:ltr!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill{
  width:158px!important;
  min-width:158px!important;
  height:58px!important;
  min-height:58px!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  grid-template-rows:24px 16px!important;
  column-gap:10px!important;
  padding:8px 13px!important;
  border-radius:17px!important;
  overflow:hidden!important;
  position:relative!important;
  transform:none!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill:after{
  content:""!important;
  position:absolute!important;
  width:70px!important;
  height:70px!important;
  left:-28px!important;
  bottom:-36px!important;
  border-radius:50%!important;
  background:rgba(99,102,241,.08)!important;
  pointer-events:none!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill .kh60-people{
  width:38px!important;
  height:38px!important;
  border-radius:12px!important;
  z-index:2!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill .kh60-people svg{
  width:21px!important;
  height:21px!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill strong{
  font-size:18px!important;
  line-height:23px!important;
  z-index:2!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-customer-pill > span:last-child{
  z-index:2!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-bottom{
  width:100%!important;
  height:34px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 145px!important;
  column-gap:30px!important;
  align-items:center!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-balance-note{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  white-space:nowrap!important;
}

body.kh-dashboard-home .kh641-balance-interactive .kh60-mini-chart{
  width:145px!important;
  height:32px!important;
  justify-self:end!important;
  margin:0!important;
}

/* FIRST CLICK — dedicated expanded layout */
body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded{
  height:200px!important;
  min-height:200px!important;
  padding:24px 32px!important;
  transform:translateY(-4px) scale(1.003)!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-wallet{
  flex-basis:76px!important;
  width:76px!important;
  height:76px!important;
  margin-left:32px!important;
  border-radius:22px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-wallet svg{
  width:35px!important;
  height:35px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-balance-main{
  grid-template-rows:minmax(94px,1fr) 50px!important;
  row-gap:12px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-balance-head{
  grid-template-columns:minmax(280px,1fr) 180px!important;
  column-gap:44px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-balance-number{
  font-size:40px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-customer-pill{
  width:180px!important;
  min-width:180px!important;
  height:68px!important;
  min-height:68px!important;
  grid-template-columns:44px minmax(0,1fr)!important;
  grid-template-rows:27px 17px!important;
  column-gap:11px!important;
  padding:10px 14px!important;
  border-radius:19px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-customer-pill .kh60-people{
  width:44px!important;
  height:44px!important;
  border-radius:14px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-customer-pill strong{
  font-size:20px!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-balance-bottom{
  height:50px!important;
  grid-template-columns:minmax(0,1fr) 200px!important;
  column-gap:40px!important;
  padding-top:9px!important;
  border-top:1px solid rgba(59,130,246,.11)!important;
}

body.kh-dashboard-home .kh641-balance-interactive.kh641-expanded .kh60-mini-chart{
  width:200px!important;
  height:40px!important;
}

}

/* V64.7.1 — Hide Receivables Card on Desktop ONLY */
@media (min-width:1025px){
  body.kh-dashboard-home .kh641-balance-interactive{
    display:none !important;
  }
}

/* ==========================================================
   KashfHesab V64.8 — Desktop Accounting Hub
   Desktop / Laptop ONLY
   ========================================================== */

.kh648-accounting-hub{
  display:none;
}

@media (min-width:1025px){

  body.kh-dashboard-home .kh648-accounting-hub{
    display:block;
    margin:18px 0 20px;
    direction:rtl;
  }

  body.kh-dashboard-home .kh648-hub-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:11px;
    padding:0 4px;
  }

  body.kh-dashboard-home .kh648-hub-head > div{
    display:flex;
    align-items:baseline;
    gap:10px;
  }

  body.kh-dashboard-home .kh648-hub-head strong{
    color:#0f172a;
    font-size:15px;
    font-weight:950;
  }

  body.kh-dashboard-home .kh648-hub-head small{
    color:#94a3b8;
    font-size:11px;
    font-weight:700;
  }

  body.kh-dashboard-home .kh648-hub-head > span{
    padding:6px 10px;
    border:1px solid #e2e8f0;
    border-radius:999px;
    background:#fff;
    color:#64748b;
    font-size:10px;
    font-weight:850;
  }

  body.kh-dashboard-home .kh648-hub-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    align-items:start;
  }

  body.kh-dashboard-home .kh648-hub-card{
    position:relative;
    min-width:0;
    border:1px solid #e6ebf2;
    border-radius:20px;
    background:rgba(255,255,255,.96);
    box-shadow:0 8px 25px rgba(15,23,42,.055);
    overflow:hidden;
    transition:
      transform .2s ease,
      box-shadow .2s ease,
      border-color .2s ease;
  }

  body.kh-dashboard-home .kh648-hub-card:hover{
    transform:translateY(-3px);
    border-color:#d5deeb;
    box-shadow:0 15px 34px rgba(15,23,42,.09);
  }

  body.kh-dashboard-home .kh648-hub-card[open]{
    border-color:#cbd9ed;
    box-shadow:0 17px 38px rgba(15,23,42,.11);
  }

  body.kh-dashboard-home .kh648-hub-card summary{
    list-style:none;
    min-height:94px;
    display:grid;
    grid-template-columns:54px minmax(0,1fr) 24px;
    gap:12px;
    align-items:center;
    padding:16px;
    cursor:pointer;
    user-select:none;
  }

  body.kh-dashboard-home .kh648-hub-card summary::-webkit-details-marker{
    display:none;
  }

  body.kh-dashboard-home .kh648-card-icon{
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    border-radius:17px;
    font-size:25px;
    line-height:1;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);
  }

  body.kh-dashboard-home .kh648-invoices .kh648-card-icon{
    background:linear-gradient(145deg,#e8f1ff,#dbeafe);
  }

  body.kh-dashboard-home .kh648-vouchers .kh648-card-icon{
    background:linear-gradient(145deg,#e8fff6,#d1fae5);
  }

  body.kh-dashboard-home .kh648-discounts .kh648-card-icon{
    background:linear-gradient(145deg,#fff7e5,#fef3c7);
    color:#b45309;
    font-size:28px;
    font-weight:950;
  }

  body.kh-dashboard-home .kh648-reports .kh648-card-icon{
    background:linear-gradient(145deg,#f1edff,#ede9fe);
  }

  body.kh-dashboard-home .kh648-card-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:5px;
  }

  body.kh-dashboard-home .kh648-card-copy strong{
    color:#172033;
    font-size:15px;
    line-height:1.2;
    font-weight:950;
  }

  body.kh-dashboard-home .kh648-card-copy small{
    overflow:hidden;
    color:#8491a5;
    font-size:10.5px;
    line-height:1.45;
    font-weight:700;
    white-space:nowrap;
    text-overflow:ellipsis;
  }

  body.kh-dashboard-home .kh648-arrow{
    width:24px;
    height:24px;
    display:grid;
    place-items:center;
    border-radius:8px;
    background:#f8fafc;
    color:#94a3b8;
    font-size:18px;
    font-weight:900;
    transition:transform .2s ease;
  }

  body.kh-dashboard-home .kh648-hub-card[open] .kh648-arrow{
    transform:rotate(180deg);
  }

  body.kh-dashboard-home .kh648-menu{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    padding:11px 13px 13px;
    border-top:1px solid #edf1f6;
    background:linear-gradient(180deg,#fbfdff,#f8fafc);
  }

  body.kh-dashboard-home .kh648-menu button,
  body.kh-dashboard-home .kh648-menu a{
    min-width:0;
    min-height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0;
    padding:7px 8px;
    border:1px solid #e3e9f1;
    border-radius:11px;
    background:#fff;
    color:#334155;
    text-decoration:none;
    font-family:inherit;
    font-size:10.5px;
    font-weight:850;
    cursor:pointer;
    box-shadow:none;
    transition:.18s ease;
  }

  body.kh-dashboard-home .kh648-menu button:hover,
  body.kh-dashboard-home .kh648-menu a:hover{
    border-color:#bfdbfe;
    background:#eff6ff;
    color:#1d4ed8;
    transform:translateY(-1px);
  }

  body.kh-dashboard-home .kh648-report-menu{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

}

/* ==========================================================
   KashfHesab V64.8.1 — Premium 3D Accounting Cards
   DESKTOP ONLY — Mobile untouched
   ========================================================== */

@media (min-width:1025px){

  body.kh-dashboard-home .kh648-hub-grid{
    perspective:1200px;
    gap:16px;
  }

  body.kh-dashboard-home .kh648-hub-card{
    --kh648-a:#2563eb;
    --kh648-b:#60a5fa;
    isolation:isolate;
    position:relative;
    overflow:hidden;
    border:1px solid rgba(255,255,255,.85);
    border-radius:22px;
    background:
      linear-gradient(145deg,rgba(255,255,255,.99),rgba(246,249,255,.94));
    box-shadow:
      0 2px 2px rgba(255,255,255,.9) inset,
      0 -1px 0 rgba(15,23,42,.05) inset,
      0 9px 0 rgba(15,23,42,.025),
      0 17px 32px rgba(15,23,42,.10);
    transform:translateZ(0) translateY(0) scale(1);
    transform-origin:center;
    transition:
      transform .28s cubic-bezier(.2,.8,.2,1),
      box-shadow .28s ease,
      border-color .28s ease;
  }

  body.kh-dashboard-home .kh648-invoices{
    --kh648-a:#2563eb;
    --kh648-b:#38bdf8;
  }

  body.kh-dashboard-home .kh648-vouchers{
    --kh648-a:#059669;
    --kh648-b:#34d399;
  }

  body.kh-dashboard-home .kh648-discounts{
    --kh648-a:#d97706;
    --kh648-b:#fbbf24;
  }

  body.kh-dashboard-home .kh648-reports{
    --kh648-a:#7c3aed;
    --kh648-b:#a78bfa;
  }

  body.kh-dashboard-home .kh648-hub-card::before{
    content:"";
    position:absolute;
    z-index:-2;
    inset:-2px;
    border-radius:23px;
    padding:2px;
    background:
      conic-gradient(
        from 0deg,
        transparent 0deg,
        transparent 70deg,
        var(--kh648-a) 105deg,
        var(--kh648-b) 135deg,
        transparent 170deg,
        transparent 360deg
      );
    opacity:0;
    transition:opacity .22s ease;
  }

  body.kh-dashboard-home .kh648-hub-card::after{
    content:"";
    position:absolute;
    z-index:-1;
    top:-70%;
    right:-35%;
    width:170px;
    height:230px;
    pointer-events:none;
    background:linear-gradient(
      115deg,
      transparent 25%,
      rgba(255,255,255,.72) 48%,
      transparent 70%
    );
    transform:rotate(15deg) translateX(110px);
    opacity:0;
  }

  body.kh-dashboard-home .kh648-hub-card:hover{
    z-index:5;
    border-color:color-mix(in srgb,var(--kh648-a) 32%,white);
    transform:
      translateY(-7px)
      scale(1.035)
      rotateX(1.5deg);
    box-shadow:
      0 2px 2px rgba(255,255,255,.95) inset,
      0 -2px 0 rgba(15,23,42,.045) inset,
      0 12px 0 rgba(15,23,42,.025),
      0 26px 44px rgba(15,23,42,.17),
      0 0 0 1px color-mix(in srgb,var(--kh648-a) 16%,transparent),
      0 0 24px color-mix(in srgb,var(--kh648-a) 13%,transparent);
  }

  body.kh-dashboard-home .kh648-hub-card:hover::before{
    opacity:.9;
    animation:kh648EdgeSpin 2.8s linear infinite;
  }

  body.kh-dashboard-home .kh648-hub-card:hover::after{
    opacity:.8;
    animation:kh648Shine .8s ease-out 1;
  }

  body.kh-dashboard-home .kh648-hub-card[open]{
    z-index:6;
    transform:translateY(-5px) scale(1.018);
    border-color:color-mix(in srgb,var(--kh648-a) 30%,white);
    box-shadow:
      0 18px 38px rgba(15,23,42,.15),
      0 0 0 2px color-mix(in srgb,var(--kh648-a) 10%,transparent);
  }

  body.kh-dashboard-home .kh648-hub-card summary{
    position:relative;
    z-index:2;
  }

  body.kh-dashboard-home .kh648-card-icon{
    position:relative;
    transform:translateZ(20px);
    border:1px solid rgba(255,255,255,.9);
    box-shadow:
      0 9px 18px rgba(15,23,42,.10),
      0 2px 0 rgba(255,255,255,.95) inset;
    transition:
      transform .28s cubic-bezier(.2,.8,.2,1),
      box-shadow .28s ease;
  }

  body.kh-dashboard-home .kh648-hub-card:hover .kh648-card-icon{
    transform:translateY(-3px) scale(1.08);
    box-shadow:
      0 13px 24px rgba(15,23,42,.15),
      0 2px 0 rgba(255,255,255,.95) inset;
  }

  body.kh-dashboard-home .kh648-card-copy strong{
    transition:color .22s ease,transform .22s ease;
  }

  body.kh-dashboard-home .kh648-hub-card:hover .kh648-card-copy strong{
    color:var(--kh648-a);
    transform:translateX(-2px);
  }

  body.kh-dashboard-home .kh648-arrow{
    border:1px solid #e8edf4;
    box-shadow:0 4px 10px rgba(15,23,42,.06);
  }

  body.kh-dashboard-home .kh648-hub-card:hover .kh648-arrow{
    color:var(--kh648-a);
    border-color:color-mix(in srgb,var(--kh648-a) 22%,white);
  }

  body.kh-dashboard-home .kh648-menu{
    position:relative;
    z-index:3;
  }

  @keyframes kh648EdgeSpin{
    to{transform:rotate(360deg);}
  }

  @keyframes kh648Shine{
    0%{
      transform:rotate(15deg) translateX(120px);
    }
    100%{
      transform:rotate(15deg) translateX(-330px);
    }
  }

  @media (prefers-reduced-motion:reduce){
    body.kh-dashboard-home .kh648-hub-card,
    body.kh-dashboard-home .kh648-card-icon{
      transition:none;
    }

    body.kh-dashboard-home .kh648-hub-card:hover::before,
    body.kh-dashboard-home .kh648-hub-card:hover::after{
      animation:none;
    }
  }

}

/* V64.8.2 — Clean 3D Hover: Scale Only */
@media (min-width:1025px){

  body.kh-dashboard-home .kh648-hub-card:hover{
    z-index:5;
    transform:scale(1.035) !important;
  }

  body.kh-dashboard-home .kh648-hub-card:hover::before,
  body.kh-dashboard-home .kh648-hub-card:hover::after{
    animation:none !important;
    opacity:0 !important;
    display:none !important;
  }

  body.kh-dashboard-home .kh648-hub-card:hover .kh648-card-icon{
    transform:none !important;
  }

  body.kh-dashboard-home .kh648-hub-card:hover .kh648-card-copy strong{
    transform:none !important;
  }

}

/* V64.8.2 — Clean 3D Hover: Scale Only */
@media (min-width:1025px){

  body.kh-dashboard-home .kh648-hub-card:hover{
    z-index:5;
    transform:scale(1.035) !important;
  }

  body.kh-dashboard-home .kh648-hub-card:hover::before,
  body.kh-dashboard-home .kh648-hub-card:hover::after{
    animation:none !important;
    opacity:0 !important;
    display:none !important;
  }

  body.kh-dashboard-home .kh648-hub-card:hover .kh648-card-icon{
    transform:none !important;
  }

  body.kh-dashboard-home .kh648-hub-card:hover .kh648-card-copy strong{
    transform:none !important;
  }

}

/* ==========================================================
   KashfHesab V64.9 — Mobile Add Sheet Premium Cards
   MOBILE ONLY
   ========================================================== */
@media (max-width:768px){

  .kh541-grid{
    gap:13px !important;
  }

  .kh541-action{
    position:relative;
    overflow:hidden;
    min-height:98px;
    padding:14px 9px !important;
    border:1px solid rgba(148,163,184,.18) !important;
    border-radius:20px !important;
    background:#fff !important;
    box-shadow:
      0 10px 24px rgba(15,23,42,.09),
      0 2px 5px rgba(15,23,42,.04),
      inset 0 1px 0 rgba(255,255,255,.95) !important;
    transition:
      transform .14s ease,
      box-shadow .14s ease !important;
  }

  .kh541-action::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.9;
  }

  .kh541-action.sales::before{
    background:linear-gradient(145deg,rgba(37,99,235,.10),transparent 62%);
  }

  .kh541-action.receipt::before{
    background:linear-gradient(145deg,rgba(5,150,105,.11),transparent 62%);
  }

  .kh541-action.purchase::before{
    background:linear-gradient(145deg,rgba(245,158,11,.12),transparent 62%);
  }

  .kh541-action.payment::before{
    background:linear-gradient(145deg,rgba(124,58,237,.11),transparent 62%);
  }

  .kh541-action.customer::before{
    background:linear-gradient(145deg,rgba(14,116,144,.10),transparent 68%);
  }

  .kh541-action:active{
    transform:scale(.965) !important;
    box-shadow:
      0 4px 12px rgba(15,23,42,.08),
      inset 0 1px 0 rgba(255,255,255,.9) !important;
  }

  .kh541-action-icon,
  .kh541-action strong{
    position:relative;
    z-index:1;
  }

  .kh541-action-icon{
    width:47px !important;
    height:47px !important;
    border-radius:15px !important;
    font-size:22px !important;
    border:1px solid rgba(255,255,255,.85);
    box-shadow:
      0 6px 14px rgba(15,23,42,.08),
      inset 0 1px 0 rgba(255,255,255,.95);
  }

  .kh541-action.sales .kh541-action-icon{
    background:linear-gradient(145deg,#dbeafe,#eff6ff) !important;
  }

  .kh541-action.receipt .kh541-action-icon{
    background:linear-gradient(145deg,#d1fae5,#ecfdf5) !important;
  }

  .kh541-action.purchase .kh541-action-icon{
    background:linear-gradient(145deg,#fef3c7,#fffbeb) !important;
  }

  .kh541-action.payment .kh541-action-icon{
    background:linear-gradient(145deg,#ede9fe,#f5f3ff) !important;
  }

  .kh541-action.customer .kh541-action-icon{
    background:linear-gradient(145deg,#cffafe,#ecfeff) !important;
  }

  .kh541-action strong{
    color:#172033;
    font-size:13.5px !important;
    font-weight:900 !important;
  }

  .kh541-action.customer{
    min-height:76px !important;
    border-color:rgba(14,116,144,.14) !important;
  }

}

/* =========================================================
   KashfHesab V65 — Mobile Invoice Customer Picker
   Scoped only to mobile invoice/new-customer UI
   ========================================================= */

@media (max-width: 768px) {

  #kh649-mobile-invoice .kh65-customer-picker {
    width: 100%;
  }

  #kh649-mobile-invoice .kh65-customer-picker > label {
    display: block;
    margin-bottom: 8px;
    font-weight: 800;
  }

  #kh649-mobile-invoice .kh65-customer-tools {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
  }

  #kh649-mobile-invoice .kh65-customer-tools input[type="search"] {
    width: 100%;
    min-height: 46px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid #dbe3ee;
    border-radius: 13px;
    background: #fff;
    font: inherit;
    outline: none;
  }

  #kh649-mobile-invoice .kh65-customer-tools input[type="search"]:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .10);
  }

  #kh649-mobile-invoice [data-kh65-new-customer] {
    width: 100%;
    min-height: 44px;
    border-radius: 13px;
  }

  #kh649-mobile-invoice .kh65-customer-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    max-height: 260px;
    margin-top: 10px;
    padding: 2px;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  #kh649-mobile-invoice .kh65-customer-card {
    overflow: hidden;
    border: 1px solid #e1e7ef;
    border-radius: 14px;
    background: #fff;
    transition:
      border-color .18s ease,
      box-shadow .18s ease,
      transform .18s ease;
  }

  #kh649-mobile-invoice .kh65-customer-card.is-open {
    position: relative;
    z-index: 2;
    border-color: #2563eb;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .16);
    transform: scale(.985);
  }

  #kh649-mobile-invoice .kh65-customer-main {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 11px 13px;
    border: 0;
    background: transparent;
    color: #172033;
    font: inherit;
    font-weight: 800;
    text-align: right;
    cursor: pointer;
  }

  #kh649-mobile-invoice .kh65-customer-main span {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #kh649-mobile-invoice .kh65-customer-confirm {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    padding: 9px 11px 11px;
    border-top: 1px solid #eef2f7;
    background: #f8fafc;
  }

  #kh649-mobile-invoice .kh65-customer-confirm[hidden] {
    display: none !important;
  }

  #kh649-mobile-invoice .kh65-customer-confirm .btn {
    width: 100%;
    min-height: 40px;
    margin: 0;
  }

  #kh649-mobile-invoice .kh65-customer-selected {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 52px;
    padding: 9px 12px;
    border: 1px solid #bbf7d0;
    border-radius: 14px;
    background: #f0fdf4;
  }

  #kh649-mobile-invoice .kh65-customer-selected[hidden] {
    display: none !important;
  }

  #kh649-mobile-invoice .kh65-customer-selected span {
    min-width: 0;
    color: #166534;
    font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #kh649-mobile-invoice .kh65-customer-selected .btn {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
  }

  #kh649-mobile-invoice .kh65-customer-empty {
    margin-top: 10px;
    padding: 13px;
    border: 1px dashed #cbd5e1;
    border-radius: 13px;
    background: #f8fafc;
    color: #64748b;
    text-align: center;
    font-weight: 700;
  }

  #kh649-mobile-invoice .kh65-customer-empty[hidden] {
    display: none !important;
  }

  #kh65-mobile-new-customer .sheet-body {
    display: grid;
    gap: 12px;
  }

  #kh65-mobile-new-customer .field {
    margin: 0;
  }

  #kh65-mobile-new-customer input[type="text"],
  #kh65-mobile-new-customer input[type="tel"] {
    width: 100%;
    min-height: 46px;
    border-radius: 13px;
  }

}

/* =========================================================
   KashfHesab V65.1 — New Customer Mobile Footer Fix
   Keep Cancel / Save always visible
   ========================================================= */
@media (max-width: 768px) {

  #kh65-mobile-new-customer {
    align-items: flex-end;
  }

  #kh65-mobile-new-customer .sheet {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-height: 92dvh;
    overflow: hidden;
  }

  #kh65-mobile-new-customer .sheet-head {
    flex: 0 0 auto;
  }

  #kh65-mobile-new-customer form {
    display: flex;
    flex-direction: column;
    min-height: 0;
    flex: 1 1 auto;
  }

  #kh65-mobile-new-customer .sheet-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  #kh65-mobile-new-customer .sheet-foot {
    position: relative;
    z-index: 5;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    flex: 0 0 auto;
    padding-bottom: max(12px, env(safe-area-inset-bottom));
    background: #fff;
    border-top: 1px solid #e8edf4;
  }

  #kh65-mobile-new-customer .sheet-foot .btn {
    width: 100%;
    min-height: 46px;
    margin: 0;
  }

}

/* =========================================================
   KashfHesab V65.2 — Quick Picker Add Customer
   ========================================================= */
@media (max-width:768px) {
  #kh532-picker .kh652-add-customer {
    width: calc(100% - 28px);
    min-height: 50px;
    margin: 10px 14px 6px;
    padding: 10px 14px;
    border: 1px dashed #2563eb;
    border-radius: 14px;
    background: #eff6ff;
    color: #1d4ed8;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font: inherit;
    cursor: pointer;
  }

  #kh532-picker .kh652-add-customer span {
    width: 27px;
    height: 27px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #2563eb;
    color: #fff;
    font-size: 20px;
    line-height: 1;
  }

  #kh532-picker .kh652-add-customer strong {
    font-size: 14px;
    font-weight: 800;
  }
}

/* =========================================================
   KashfHesab V65.3 — Mobile Add Forms Save / Cancel Footer
   Standard for all sheet add forms
   ========================================================= */
@media (max-width:768px) {

  .scrim:not([hidden]) > .sheet {
    max-height: 92dvh;
  }

  .scrim:not([hidden]) > .sheet > form {
    min-height: 0;
    max-height: inherit;
    display: flex;
    flex-direction: column;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot {
    flex: 0 0 auto;
    position: sticky;
    bottom: 0;
    z-index: 30;

    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 10px;

    width: 100%;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
    margin: 0;

    background: #fff;
    border-top: 1px solid #e5e7eb;
    box-sizing: border-box;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn {
    min-height: 48px;
    margin: 0;
    border-radius: 13px;
    font-size: 15px;
    font-weight: 800;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn.primary {
    font-size: 0;
    font-weight: 900;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn.primary::before {
    content: "💾";
    font-size: 18px;
    line-height: 1;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn.primary::after {
    content: "حفظ";
    font-size: 15px;
    line-height: 1;
    font-weight: 900;
  }

}

/* =========================================================
   KashfHesab V65.4 — Strong Mobile Save Button
   ========================================================= */
@media (max-width:768px) {

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn.primary {
    min-height: 52px !important;
    background: #2563eb !important;
    color: #ffffff !important;
    border: 2px solid #1d4ed8 !important;
    border-radius: 14px !important;

    box-shadow:
      0 6px 16px rgba(37, 99, 235, .28),
      inset 0 1px 0 rgba(255,255,255,.18);

    font-weight: 900 !important;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn.primary::before {
    content: "💾";
    font-size: 19px;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn.primary::after {
    content: "حفظ";
    color: #ffffff;
    font-size: 16px;
    font-weight: 900;
  }

  .scrim:not([hidden]) > .sheet > form > .sheet-foot .btn:not(.primary) {
    min-height: 52px;
    background: #f8fafc;
    color: #334155;
    border: 1px solid #cbd5e1;
    font-weight: 800;
  }
}

/* ==========================================================
   KashfHesab V66 — Premium Today Details
   Sales / Purchases / Receipts / Expenses
   Outer dashboard/mobile margins intentionally untouched
   ========================================================== */

.kh633-overlay{
  background:
    radial-gradient(circle at 50% 18%,rgba(255,255,255,.10),transparent 34%),
    rgba(7,20,35,.58);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.kh633-sheet{
  width:min(660px,100%);
  border:1px solid rgba(255,255,255,.72);
  background:#f8fafc;
  box-shadow:
    0 30px 80px rgba(7,25,45,.26),
    0 8px 24px rgba(15,40,65,.10);
}

/* ---------- Panel identity ---------- */

.kh633-panel{
  --kh633-accent:#2563eb;
  --kh633-accent-rgb:37,99,235;
  --kh633-soft:#eff6ff;
  --kh633-deep:#174da6;

  background:
    linear-gradient(
      180deg,
      rgba(var(--kh633-accent-rgb),.055) 0,
      #f8fafc 180px
    );
}

/* Sales — Blue */
.kh633-panel[data-kh633-panel="sales"]{
  --kh633-accent:#2563eb;
  --kh633-accent-rgb:37,99,235;
  --kh633-soft:#eff6ff;
  --kh633-deep:#174da6;
}

/* Purchases — Violet */
.kh633-panel[data-kh633-panel="purchases"]{
  --kh633-accent:#7c3aed;
  --kh633-accent-rgb:124,58,237;
  --kh633-soft:#f5f3ff;
  --kh633-deep:#6424c7;
}

/* Receipts — Green */
.kh633-panel[data-kh633-panel="receipts"]{
  --kh633-accent:#059669;
  --kh633-accent-rgb:5,150,105;
  --kh633-soft:#ecfdf5;
  --kh633-deep:#047857;
}

/* Expenses — Warm coral */
.kh633-panel[data-kh633-panel="expenses"]{
  --kh633-accent:#e05b52;
  --kh633-accent-rgb:224,91,82;
  --kh633-soft:#fff4f2;
  --kh633-deep:#bd4038;
}


/* ---------- Premium header ---------- */

.kh633-panel .kh633-head{
  position:relative;
  overflow:hidden;

  min-height:76px;
  padding:18px 20px;

  border-bottom:
    1px solid rgba(var(--kh633-accent-rgb),.12);

  background:
    radial-gradient(
      circle at 86% 12%,
      rgba(var(--kh633-accent-rgb),.16),
      transparent 38%
    ),
    linear-gradient(
      135deg,
      rgba(var(--kh633-accent-rgb),.105),
      rgba(255,255,255,.94) 58%
    );
}

.kh633-panel .kh633-head::after{
  content:"";
  position:absolute;
  inset-inline-end:-30px;
  top:-55px;

  width:145px;
  height:145px;
  border-radius:50%;

  border:24px solid rgba(var(--kh633-accent-rgb),.045);

  pointer-events:none;
}

.kh633-panel .kh633-head-copy{
  position:relative;
  z-index:2;
}

.kh633-panel .kh633-head-copy h3{
  color:var(--kh633-deep);
  font-size:18px;
  letter-spacing:-.15px;
}

.kh633-panel .kh633-head-copy span{
  color:#718397;
  font-size:11px;
}

.kh633-panel .kh633-close{
  position:relative;
  z-index:3;

  width:39px;
  height:39px;

  border:1px solid rgba(var(--kh633-accent-rgb),.12);

  background:rgba(255,255,255,.82);
  color:#52677b;

  box-shadow:
    0 5px 14px rgba(15,35,55,.07);

  transition:
    transform .18s ease,
    background .18s ease,
    color .18s ease,
    box-shadow .18s ease;
}

.kh633-panel .kh633-close:hover{
  transform:translateY(-1px);
  background:#fff;
  color:var(--kh633-accent);

  box-shadow:
    0 7px 18px rgba(var(--kh633-accent-rgb),.14);
}


/* ---------- Details area ---------- */

.kh633-panel .kh633-list{
  padding:14px;

  scrollbar-width:thin;
  scrollbar-color:
    rgba(var(--kh633-accent-rgb),.24)
    transparent;
}

.kh633-panel .kh633-list::-webkit-scrollbar{
  width:6px;
}

.kh633-panel .kh633-list::-webkit-scrollbar-thumb{
  background:rgba(var(--kh633-accent-rgb),.22);
  border-radius:20px;
}


/* ---------- Individual transaction cards ---------- */

.kh633-panel .kh633-row{
  position:relative;

  min-height:74px;

  margin-bottom:9px;
  padding:12px 14px;

  border:1px solid rgba(var(--kh633-accent-rgb),.105);
  border-radius:16px;

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.98),
      rgba(var(--kh633-accent-rgb),.035)
    );

  box-shadow:
    0 5px 15px rgba(15,40,65,.055),
    0 1px 2px rgba(15,40,65,.035);

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background .18s ease;
}

.kh633-panel .kh633-row:last-child{
  margin-bottom:0;
}

.kh633-panel .kh633-row::before{
  content:"";

  position:absolute;
  inset-inline-start:0;
  top:15px;
  bottom:15px;

  width:3px;

  border-radius:0 4px 4px 0;

  background:var(--kh633-accent);
  opacity:.76;
}

.kh633-panel .kh633-row:hover{
  transform:translateY(-2px);

  border-color:
    rgba(var(--kh633-accent-rgb),.22);

  background:#fff;

  box-shadow:
    0 10px 25px rgba(15,40,65,.085),
    0 3px 8px rgba(var(--kh633-accent-rgb),.055);
}

.kh633-panel .kh633-row-title{
  color:#20384e;
  font-size:13px;
  font-weight:900;
}

.kh633-panel .kh633-row-title small{
  display:inline-flex;
  align-items:center;

  margin-inline-start:6px;
  padding:3px 7px;

  border-radius:7px;

  background:
    rgba(var(--kh633-accent-rgb),.075);

  color:var(--kh633-deep);

  font-size:9px;
  font-weight:800;
}

.kh633-panel .kh633-customer{
  margin-top:6px;

  color:#718397;

  font-size:11px;
  font-weight:700;
}


/* ---------- Amount ---------- */

.kh633-panel .kh633-row-value{
  min-width:86px;

  padding:7px 10px;

  border-radius:12px;

  background:
    rgba(var(--kh633-accent-rgb),.065);

  align-items:flex-end;
}

.kh633-panel .kh633-row-value strong{
  color:var(--kh633-deep);
  font-size:15px;
  font-weight:950;
}

.kh633-panel .kh633-row-value small{
  margin-top:1px;

  color:
    rgba(var(--kh633-accent-rgb),.68);

  font-size:9px;
  font-weight:800;
}

.kh633-panel .kh633-arrow{
  color:
    rgba(var(--kh633-accent-rgb),.58);

  transition:transform .18s ease;
}

.kh633-panel .kh633-row:hover .kh633-arrow{
  transform:translateX(-2px);
}


/* ---------- Returns ---------- */

.kh633-panel .kh633-row.kh633-return{
  border-color:rgba(190,75,75,.13);

  background:
    linear-gradient(
      135deg,
      #fff,
      rgba(239,68,68,.035)
    );
}

.kh633-panel .kh633-return::before{
  background:#d85d5d;
}

.kh633-panel .kh633-return .kh633-row-value{
  background:#fff1f1;
}

.kh633-panel .kh633-return .kh633-row-title,
.kh633-panel .kh633-return .kh633-row-value strong{
  color:#b65353;
}


/* ---------- Empty state ---------- */

.kh633-panel .kh633-empty{
  margin:16px;
  padding:50px 20px;

  border:
    1px dashed rgba(var(--kh633-accent-rgb),.22);

  border-radius:18px;

  background:
    rgba(var(--kh633-accent-rgb),.035);
}

.kh633-panel .kh633-empty strong{
  color:var(--kh633-deep);
}


/* ---------- Premium total card ---------- */

.kh633-panel .kh633-total{
  position:relative;

  margin:0 14px 14px;
  padding:15px 17px;

  border:
    1px solid rgba(var(--kh633-accent-rgb),.13);

  border-radius:16px;

  background:
    linear-gradient(
      135deg,
      rgba(var(--kh633-accent-rgb),.10),
      rgba(255,255,255,.96) 65%
    );

  box-shadow:
    0 6px 18px rgba(15,40,65,.06);
}

.kh633-panel .kh633-total::before{
  content:"";

  width:8px;
  height:8px;

  margin-inline-end:8px;

  border-radius:50%;

  background:var(--kh633-accent);

  box-shadow:
    0 0 0 5px rgba(var(--kh633-accent-rgb),.09);
}

.kh633-panel .kh633-total > span{
  margin-inline-end:auto;

  color:#62778b;
  font-weight:800;
}

.kh633-panel .kh633-total > strong{
  color:var(--kh633-deep);

  font-size:18px;
  font-weight:950;
}

.kh633-panel .kh633-total small{
  color:
    rgba(var(--kh633-accent-rgb),.72);

  font-weight:800;
}


/* ---------- Mobile refinement ---------- */

@media(max-width:760px){

  .kh633-sheet{
    max-height:84vh;

    border-radius:25px 25px 0 0;

    box-shadow:
      0 -14px 45px rgba(7,25,45,.18);
  }

  .kh633-panel{
    max-height:84vh;
  }

  .kh633-panel .kh633-head{
    min-height:70px;
    padding:15px 16px;
  }

  .kh633-panel .kh633-list{
    padding:11px 12px;
  }

  .kh633-panel .kh633-row{
    min-height:70px;

    margin-bottom:8px;
    padding:11px 12px;

    border-radius:15px;
  }

  .kh633-panel .kh633-row:hover{
    transform:none;
  }

  .kh633-panel .kh633-row-value{
    min-width:78px;
    padding:6px 8px;
  }

  .kh633-panel .kh633-total{
    margin:
      0
      12px
      calc(12px + env(safe-area-inset-bottom));

    padding:14px 15px;
  }

}

/* ==========================================================
   End KashfHesab V66
   ========================================================== */

/* =========================================================
   KashfHesab V67.4 — Sales Invoice Mobile
   Hide duplicate bottom actions + maximize customer list
   ========================================================= */
@media (max-width:768px) {

  /* Respect hidden state of the bottom footer in sales invoice */
  #kh649-mobile-invoice
  [data-kh65-invoice-footer][hidden] {
    display: none !important;
  }

  /* Allow the customer picker to use the available screen height */
  #kh649-mobile-invoice form {
    min-height: 0;
    flex: 1 1 auto;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-picker] {
    min-height: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  }

  #kh649-mobile-invoice
  [data-kh65-browser] {
    min-height: 0;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-list] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

}

/* =========================================================
   KashfHesab V67.5 — Restore + Expand Customer List
   Sales invoice mobile only
   ========================================================= */
@media (max-width:768px) {

  /* Bottom duplicate Save / Cancel must stay hidden */
  #kh649-mobile-invoice
  [data-kh65-invoice-footer][hidden] {
    display: none !important;
  }

  /* Undo V67.4 flex chain that collapsed the customer list */
  #kh649-mobile-invoice form {
    flex: none !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-picker] {
    display: block !important;
    flex: none !important;
    min-height: initial !important;
  }

  #kh649-mobile-invoice
  [data-kh65-browser] {
    display: block !important;
    flex: none !important;
    min-height: initial !important;
  }

  /* Use remaining phone height for customer names */
  #kh649-mobile-invoice
  [data-kh65-customer-list] {
    display: block !important;
    flex: none !important;
    min-height: 220px !important;
    height: calc(100dvh - 245px) !important;
    max-height: calc(100dvh - 245px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }

}

/* =========================================================
   KashfHesab V67.6 — Respect Customer Browser Hidden State
   ========================================================= */
@media (max-width:768px) {

  #kh649-mobile-invoice
  [data-kh65-browser][hidden] {
    display: none !important;
  }

}


/* =========================================================
   KashfHesab V67.8 — Premium Notification Card
   ========================================================= */

body.kh-dashboard-home .kh678-notification-card{
  position:absolute;
  z-index:1200;
  top:72px;
  left:18px;
  width:min(360px,calc(100vw - 28px));
  overflow:hidden;

  direction:rtl;
  text-align:right;

  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  border-radius:22px;

  box-shadow:
    0 24px 60px rgba(15,23,42,.18),
    0 5px 18px rgba(15,23,42,.08);
}

body.kh-dashboard-home .kh678-notification-card[hidden]{
  display:none !important;
}

body.kh-dashboard-home .kh678-notification-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;

  padding:16px 17px;

  background:
    linear-gradient(135deg,
      rgba(37,99,235,.10),
      rgba(14,165,233,.04) 58%,
      rgba(16,185,129,.05)
    );

  border-bottom:1px solid rgba(15,23,42,.06);
}

body.kh-dashboard-home .kh678-notification-title{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:0;
}

body.kh-dashboard-home .kh678-notification-head-icon{
  width:39px;
  height:39px;
  flex:0 0 39px;

  display:grid;
  place-items:center;

  color:#2563eb;
  background:#fff;
  border-radius:13px;

  box-shadow:0 5px 14px rgba(37,99,235,.12);
}

body.kh-dashboard-home .kh678-notification-head-icon svg,
body.kh-dashboard-home .kh678-notification-empty-icon svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

body.kh-dashboard-home .kh678-notification-title div{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

body.kh-dashboard-home .kh678-notification-title strong{
  color:#0f172a;
  font-size:15px;
  font-weight:800;
}

body.kh-dashboard-home .kh678-notification-title span{
  color:#64748b;
  font-size:11px;
  line-height:1.5;
}

body.kh-dashboard-home .kh678-notification-close{
  width:32px;
  height:32px;
  flex:0 0 32px;

  display:grid;
  place-items:center;

  padding:0;
  border:0;
  border-radius:10px;

  color:#64748b;
  background:rgba(255,255,255,.75);

  font-size:22px;
  line-height:1;
  cursor:pointer;
}

body.kh-dashboard-home .kh678-notification-close:hover{
  color:#0f172a;
  background:#fff;
}

body.kh-dashboard-home .kh678-notification-empty{
  min-height:190px;
  padding:30px 20px 27px;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;

  text-align:center;
}

body.kh-dashboard-home .kh678-notification-empty-icon{
  width:64px;
  height:64px;

  display:grid;
  place-items:center;

  margin-bottom:6px;

  color:#2563eb;

  background:
    linear-gradient(145deg,#eff6ff,#f0fdf4);

  border:1px solid rgba(37,99,235,.10);
  border-radius:21px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 9px 24px rgba(37,99,235,.10);
}

body.kh-dashboard-home .kh678-notification-empty-icon svg{
  width:29px;
  height:29px;
}

body.kh-dashboard-home .kh678-notification-empty strong{
  color:#0f172a;
  font-size:15px;
  font-weight:800;
}

body.kh-dashboard-home .kh678-notification-empty > span{
  color:#64748b;
  font-size:12px;
}

/* Mobile — preserve approved dashboard margins */
@media(max-width:768px){
  body.kh-dashboard-home .kh678-notification-card{
    position:fixed;
    top:76px;
    left:14px;
    right:14px;
    width:auto;
    max-width:none;
    border-radius:20px;
  }

  body.kh-dashboard-home .kh678-notification-empty{
    min-height:175px;
  }
}


/* =========================================================
   KashfHesab V67.9 — Notification Card Layer Fix
   Keep notification above dashboard cards
   ========================================================= */

body.kh-dashboard-home .kh6012-header{
  position:relative;
  z-index:5000 !important;
}

body.kh-dashboard-home .kh6012-controls{
  position:relative;
  z-index:5010 !important;
}

body.kh-dashboard-home .kh678-notification-card{
  z-index:9999 !important;
}



/* =========================================================
   KashfHesab V67.10 — Notification Body Portal
   Escape header stacking context completely
   ========================================================= */

body.kh-dashboard-home > .kh678-notification-card{
  position:fixed !important;
  z-index:2147483000 !important;
  width:min(360px,calc(100vw - 28px));
}

/* Mobile: preserve approved 14px side margins */
@media(max-width:768px){
  body.kh-dashboard-home > .kh678-notification-card{
    top:76px !important;
    left:14px !important;
    right:14px !important;
    width:auto !important;
    max-width:none !important;
  }
}



/* =========================================================
   KashfHesab V67.13 — Mobile Financial Top Actions
   Receipt + Purchase Invoice + Payment
   ========================================================= */

/* Desktop: keep original behavior */
.kh6713-mobile-top-actions{
  display:none;
}

@media(max-width:768px){

  /* Use only the top Save / Cancel controls */
  .kh6713-mobile-financial
  .kh6713-mobile-top-actions{
    display:flex;
    align-items:center;
    gap:7px;
  }

  /* Hide old generic Close button on these financial sheets */
  .kh6713-mobile-financial
  .kh6713-default-close{
    display:none !important;
  }

  /* Hide bottom Save / Cancel only for these financial sheets */
  .kh6713-mobile-financial
  .kh6713-financial-bottom-actions{
    display:none !important;
  }

  .kh6713-mobile-financial
  .kh6713-mobile-top-actions .btn{
    min-height:34px;
    padding:6px 12px;
    border-radius:10px;
    font-size:12px;
    font-weight:800;
  }

}

/* Desktop must retain the original close + footer */
@media(min-width:769px){

  .kh6713-mobile-financial
  .kh6713-default-close{
    display:inline-flex;
  }

  .kh6713-mobile-financial
  .kh6713-financial-bottom-actions{
    display:grid;
  }

}

/* =========================================================
   KashfHesab V67.14 — Mobile Financial Bottom Actions OFF
   Mobile uses TOP Save / Cancel only
   ========================================================= */
@media (max-width:768px){

  body .scrim.kh6713-mobile-financial
  > .sheet
  > form
  > .sheet-foot.kh6713-financial-bottom-actions{
    display:none !important;
  }

}


/* =========================================================
   KashfHesab V67.16.2 — Bottom Nav Hidden During ADD Only
   ========================================================= */
@media (max-width:768px){

  .kh52-mobile-nav.kh6716-add-mode-hidden{
    display:none !important;
  }

}


/* =========================================================
   KashfHesab V67.17 — Mobile Add Customer Top Actions
   ========================================================= */

.kh6717-customer-top-actions{
  display:none;
}

@media (max-width:768px){

  #f-new.kh6717-mobile-customer-add
  .kh6717-customer-top-actions{
    display:flex;
    align-items:center;
    gap:7px;
  }

  #f-new.kh6717-mobile-customer-add
  .kh6717-customer-default-close{
    display:none !important;
  }

  body #f-new.kh6717-mobile-customer-add
  > .sheet
  > form
  > .sheet-foot.kh6717-customer-bottom-actions{
    display:none !important;
  }

  #f-new.kh6717-mobile-customer-add
  .kh6717-customer-top-actions .btn{
    min-height:34px;
    padding:6px 12px;
    border-radius:10px;
    font-size:12px;
    font-weight:800;
  }
}

@media (min-width:769px){

  #f-new.kh6717-mobile-customer-add
  .kh6717-customer-default-close{
    display:inline-flex;
  }

  #f-new.kh6717-mobile-customer-add
  .kh6717-customer-bottom-actions{
    display:grid;
  }
}


/* KashfHesab V67.18 — Hide Home Customers Section On Mobile Only
   Desktop/tablet desktop layout remains unchanged. */
@media (max-width:768px){
  .kh6718-home-customers{
    display:none !important;
  }
}


/* KashfHesab V67.20 — Dedicated Customers Page
   V67.18 keeps customers hidden on mobile HOME.
   The dedicated customers route explicitly reveals the same panel. */
@media (max-width:768px){
  .kh6718-home-customers.kh6720-customers-page{
    display:block !important;
  }
}


/* ==========================================================
   KashfHesab V67.23 — Mobile Dual Balances
   Receivables + Credit balances side-by-side
   MOBILE ONLY
   ========================================================== */

.kh6723-mobile-dual{
  display:none;
}

@media (max-width:768px){

  body.kh-dashboard-home #kh641Receivables{
    min-height:148px !important;
    height:auto !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh60-wallet{
    display:none !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh60-balance-main{
    width:100% !important;
    display:block !important;
  }

  /* Existing single-balance presentation is replaced on mobile only */
  body.kh-dashboard-home #kh641Receivables .kh60-balance-head,
  body.kh-dashboard-home #kh641Receivables .kh60-balance-bottom{
    display:none !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-mobile-dual{
    width:100%;
    min-height:116px;
    display:grid;
    grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr);
    align-items:stretch;
    direction:rtl;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-balance-side{
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:7px 4px;
    position:relative;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-label{
    display:block;
    margin-bottom:8px;
    color:#64748b;
    font-size:11px;
    line-height:1.2;
    font-weight:850;
    white-space:nowrap;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-amount{
    max-width:100%;
    color:#0f172a;
    font-size:21px;
    line-height:1.05;
    font-weight:950;
    letter-spacing:-.4px;
    direction:ltr;
    white-space:nowrap;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-amount small{
    margin-left:3px;
    color:#64748b;
    font-size:10px;
    font-weight:850;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-count{
    margin-top:9px;
    padding:5px 9px;
    border-radius:999px;
    background:rgba(15,23,42,.045);
    color:#64748b;
    font-size:9px;
    line-height:1;
    font-weight:800;
    white-space:nowrap;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-count span{
    color:#334155;
    font-size:11px;
    font-weight:950;
  }

  /* Receivables identity */
  body.kh-dashboard-home #kh641Receivables .kh6723-debit:before{
    content:"";
    position:absolute;
    top:9px;
    width:28px;
    height:3px;
    border-radius:999px;
    background:linear-gradient(90deg,rgba(37,99,235,.2),rgba(37,99,235,.9));
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-debit .kh6723-amount{
    color:#2563eb;
  }

  /* Credit identity */
  body.kh-dashboard-home #kh641Receivables .kh6723-credit:before{
    content:"";
    position:absolute;
    top:9px;
    width:28px;
    height:3px;
    border-radius:999px;
    background:linear-gradient(90deg,rgba(16,185,129,.9),rgba(16,185,129,.2));
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-credit .kh6723-amount{
    color:#059669;
  }

  /* Creative center divider */
  body.kh-dashboard-home #kh641Receivables .kh6723-divider{
    display:grid;
    grid-template-rows:1fr 22px 1fr;
    justify-items:center;
    align-items:center;
    padding:5px 0;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-divider i{
    width:1px;
    height:100%;
    min-height:25px;
    background:linear-gradient(
      to bottom,
      transparent,
      rgba(148,163,184,.55),
      transparent
    );
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-divider span{
    width:20px;
    height:20px;
    display:grid;
    place-items:center;
    border:1px solid rgba(148,163,184,.32);
    border-radius:7px;
    background:rgba(255,255,255,.82);
    box-shadow:0 4px 12px rgba(15,23,42,.07);
    color:#94a3b8;
    font-size:12px;
    transform:rotate(45deg);
  }

  /* Keep the approved first-click behavior without changing margins */
  body.kh-dashboard-home #kh641Receivables.kh641-expanded{
    min-height:158px !important;
    height:auto !important;
  }
}


/* ==========================================================
   KashfHesab V67.24 — Compact Mobile Dual Balance Card
   Remove unused bottom space only
   ========================================================== */
@media (max-width:768px){

  body.kh-dashboard-home #kh641Receivables{
    min-height:118px !important;
    height:118px !important;
    padding-top:10px !important;
    padding-bottom:10px !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh60-balance-main{
    height:100% !important;
    min-height:0 !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-mobile-dual{
    height:100% !important;
    min-height:0 !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-balance-side{
    padding-top:5px !important;
    padding-bottom:2px !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-label{
    margin-bottom:6px !important;
  }

  body.kh-dashboard-home #kh641Receivables .kh6723-count{
    margin-top:6px !important;
  }

  body.kh-dashboard-home #kh641Receivables.kh641-expanded{
    min-height:128px !important;
    height:128px !important;
  }
}


/* ==========================================================
   KashfHesab V67.29 — Activity Filter Illuminated Toggle Cards
   ========================================================== */

.kh6729-type-filter{
  width:100%;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  padding:10px 0;
}

.kh6729-filter-card{
  --kh6729-rgb:37,99,235;
  position:relative;
  display:block;
  min-width:0;
  margin:0;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
}

.kh6729-filter-input{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.kh6729-card-face{
  position:relative;
  min-height:74px;
  padding:9px 4px 8px;
  border:1px solid rgba(148,163,184,.26);
  border-radius:15px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.98),rgba(248,250,252,.92));
  box-shadow:
    0 3px 10px rgba(15,23,42,.045),
    inset 0 1px 0 rgba(255,255,255,.9);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  text-align:center;
  overflow:hidden;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease;
}

.kh6729-icon{
  width:28px;
  height:28px;
  border-radius:9px;
  display:grid;
  place-items:center;
  font-size:18px;
  line-height:1;
  font-weight:900;
  color:rgba(var(--kh6729-rgb),.55);
  background:rgba(var(--kh6729-rgb),.07);
  transition:all .18s ease;
}

.kh6729-label{
  max-width:100%;
  color:#64748b;
  font-size:11px;
  line-height:1.25;
  font-weight:800;
  white-space:nowrap;
  transition:color .18s ease;
}

.kh6729-state{
  position:absolute;
  top:7px;
  left:7px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#cbd5e1;
  box-shadow:0 0 0 3px rgba(203,213,225,.16);
  transition:all .18s ease;
}

/* ON */
.kh6729-filter-input:checked + .kh6729-card-face{
  border-color:rgba(var(--kh6729-rgb),.65);
  background:
    radial-gradient(circle at 50% 0%,
      rgba(var(--kh6729-rgb),.19),
      transparent 58%),
    linear-gradient(145deg,
      rgba(var(--kh6729-rgb),.11),
      rgba(255,255,255,.98));
  box-shadow:
    0 7px 18px rgba(var(--kh6729-rgb),.16),
    0 0 0 1px rgba(var(--kh6729-rgb),.12),
    inset 0 1px 0 rgba(255,255,255,.92);
  transform:translateY(-1px);
}

.kh6729-filter-input:checked + .kh6729-card-face .kh6729-icon{
  color:rgb(var(--kh6729-rgb));
  background:rgba(var(--kh6729-rgb),.14);
  box-shadow:0 0 16px rgba(var(--kh6729-rgb),.16);
}

.kh6729-filter-input:checked + .kh6729-card-face .kh6729-label{
  color:rgb(var(--kh6729-rgb));
}

.kh6729-filter-input:checked + .kh6729-card-face .kh6729-state{
  background:rgb(var(--kh6729-rgb));
  box-shadow:
    0 0 0 3px rgba(var(--kh6729-rgb),.13),
    0 0 10px rgba(var(--kh6729-rgb),.55);
}

/* keyboard accessibility */
.kh6729-filter-input:focus-visible + .kh6729-card-face{
  outline:3px solid rgba(var(--kh6729-rgb),.20);
  outline-offset:2px;
}

/* Individual identities */
.kh6729-sale{
  --kh6729-rgb:37,99,235;
}

.kh6729-purchase{
  --kh6729-rgb:124,58,237;
}

.kh6729-receipt{
  --kh6729-rgb:5,150,105;
}

.kh6729-payment{
  --kh6729-rgb:234,88,12;
}

.kh6729-created{
  --kh6729-rgb:14,165,233;
}

.kh6729-deleted{
  --kh6729-rgb:225,29,72;
}

.kh6729-login{
  --kh6729-rgb:8,145,178;
}

.kh6729-logout{
  --kh6729-rgb:100,116,139;
}

@media (max-width:768px){

  .kh6729-type-filter{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
    padding:8px 0 10px !important;
  }

  .kh6729-card-face{
    min-height:70px;
    padding:8px 2px 7px;
    border-radius:13px;
  }

  .kh6729-icon{
    width:26px;
    height:26px;
    border-radius:8px;
    font-size:17px;
  }

  .kh6729-label{
    font-size:10.5px;
  }

  .kh6729-state{
    top:6px;
    left:6px;
    width:6px;
    height:6px;
  }
}

/* ==========================================================
   KashfHesab V67.30 — Force Activity Toggle Cards
   Visible colored cards / no visible checkbox
   ========================================================== */

body .wrap > .panel > form.searchbar .kh6729-type-filter{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  width:100% !important;
  max-width:none !important;
  flex:0 0 100% !important;
  gap:8px !important;
  padding:10px 0 12px !important;
  margin:0 !important;
  box-sizing:border-box !important;
}

body .wrap > .panel > form.searchbar .kh6729-filter-card{
  --kh6729-rgb:37,99,235;
  display:block !important;
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:none !important;
  cursor:pointer !important;
  box-sizing:border-box !important;
}

/* Checkbox exists only for form submission — never visible */
body .wrap > .panel > form.searchbar
.kh6729-filter-card > input.kh6729-filter-input{
  position:absolute !important;
  inline-size:1px !important;
  block-size:1px !important;
  width:1px !important;
  height:1px !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  opacity:0 !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  pointer-events:none !important;
  overflow:hidden !important;
}

/* OFF — visible but softly illuminated */
body .wrap > .panel > form.searchbar .kh6729-card-face{
  display:flex !important;
  position:relative !important;
  width:100% !important;
  min-width:0 !important;
  min-height:82px !important;
  box-sizing:border-box !important;

  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;

  padding:10px 3px 9px !important;

  border:1.5px solid rgba(var(--kh6729-rgb),.20) !important;
  border-radius:15px !important;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(var(--kh6729-rgb),.09),
      transparent 62%
    ),
    linear-gradient(
      145deg,
      rgba(var(--kh6729-rgb),.055),
      rgba(255,255,255,.98)
    ) !important;

  box-shadow:
    0 4px 12px rgba(15,23,42,.055),
    inset 0 1px 0 rgba(255,255,255,.95) !important;

  overflow:hidden !important;
  text-align:center !important;

  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease !important;
}

body .wrap > .panel > form.searchbar .kh6729-icon{
  display:grid !important;
  place-items:center !important;
  width:31px !important;
  height:31px !important;
  flex:0 0 31px !important;

  padding:0 !important;
  margin:0 !important;

  border-radius:10px !important;
  border:1px solid rgba(var(--kh6729-rgb),.10) !important;

  color:rgba(var(--kh6729-rgb),.68) !important;
  background:rgba(var(--kh6729-rgb),.09) !important;

  font-size:19px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

body .wrap > .panel > form.searchbar .kh6729-label{
  display:block !important;
  width:100% !important;
  max-width:100% !important;

  padding:0 !important;
  margin:0 !important;

  color:#334155 !important;

  font-size:11px !important;
  line-height:1.25 !important;
  font-weight:850 !important;
  text-align:center !important;
  white-space:nowrap !important;
}

/* Small OFF/ON light — not a checkbox */
body .wrap > .panel > form.searchbar .kh6729-state{
  display:block !important;
  position:absolute !important;
  top:7px !important;
  left:7px !important;

  width:7px !important;
  height:7px !important;
  min-width:7px !important;
  min-height:7px !important;

  padding:0 !important;
  margin:0 !important;

  border-radius:50% !important;
  border:0 !important;

  background:rgba(100,116,139,.32) !important;
  box-shadow:
    0 0 0 3px rgba(148,163,184,.10) !important;
}

/* ==========================
   ON — illuminated card
   ========================== */

body .wrap > .panel > form.searchbar
.kh6729-filter-input:checked + .kh6729-card-face{
  border-color:rgba(var(--kh6729-rgb),.78) !important;

  background:
    radial-gradient(
      circle at 50% -10%,
      rgba(var(--kh6729-rgb),.30),
      transparent 64%
    ),
    linear-gradient(
      145deg,
      rgba(var(--kh6729-rgb),.16),
      rgba(255,255,255,.98)
    ) !important;

  box-shadow:
    0 8px 20px rgba(var(--kh6729-rgb),.20),
    0 0 0 1px rgba(var(--kh6729-rgb),.16),
    inset 0 1px 0 rgba(255,255,255,.96) !important;

  transform:translateY(-2px) !important;
}

body .wrap > .panel > form.searchbar
.kh6729-filter-input:checked + .kh6729-card-face .kh6729-icon{
  color:rgb(var(--kh6729-rgb)) !important;
  background:rgba(var(--kh6729-rgb),.17) !important;
  border-color:rgba(var(--kh6729-rgb),.22) !important;

  box-shadow:
    0 0 17px rgba(var(--kh6729-rgb),.22) !important;
}

body .wrap > .panel > form.searchbar
.kh6729-filter-input:checked + .kh6729-card-face .kh6729-label{
  color:rgb(var(--kh6729-rgb)) !important;
  font-weight:900 !important;
}

body .wrap > .panel > form.searchbar
.kh6729-filter-input:checked + .kh6729-card-face .kh6729-state{
  background:rgb(var(--kh6729-rgb)) !important;

  box-shadow:
    0 0 0 3px rgba(var(--kh6729-rgb),.15),
    0 0 11px rgba(var(--kh6729-rgb),.75) !important;
}

/* identities */
body .kh6729-sale{
  --kh6729-rgb:37,99,235;
}

body .kh6729-purchase{
  --kh6729-rgb:124,58,237;
}

body .kh6729-receipt{
  --kh6729-rgb:5,150,105;
}

body .kh6729-payment{
  --kh6729-rgb:234,88,12;
}

body .kh6729-created{
  --kh6729-rgb:234,179,8;
}

body .kh6729-deleted{
  --kh6729-rgb:225,29,72;
}

body .kh6729-login{
  --kh6729-rgb:8,145,178;
}

body .kh6729-logout{
  --kh6729-rgb:219,39,119;
}

@media (max-width:768px){

  body .wrap > .panel > form.searchbar .kh6729-type-filter{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
    width:100% !important;
    flex:0 0 100% !important;
    padding:9px 0 11px !important;
  }

  body .wrap > .panel > form.searchbar .kh6729-card-face{
    min-height:78px !important;
    padding:9px 2px 8px !important;
    border-radius:14px !important;
  }

  body .wrap > .panel > form.searchbar .kh6729-icon{
    width:29px !important;
    height:29px !important;
    flex-basis:29px !important;
    font-size:18px !important;
  }

  body .wrap > .panel > form.searchbar .kh6729-label{
    font-size:10px !important;
    letter-spacing:-.15px !important;
  }
}


/* ==========================================================
   KashfHesab V67.31 — Activity Archive Mobile Filter Layout
   Stable 4 x 2 illuminated cards + corrected form layout
   ========================================================== */

@media (max-width:768px){

  /* Activity archive gets its own layout.
     Do not alter the global searchbar used by other pages. */
  body .wrap > .panel > form.searchbar.kh6731-activity-searchbar{
    display:grid !important;
    grid-template-columns:34px minmax(0,1fr) 34px minmax(0,1fr) !important;
    gap:10px 8px !important;
    align-items:center !important;
    width:100% !important;
    padding:12px 10px !important;
    box-sizing:border-box !important;
  }

  /* Hidden routing fields must never occupy grid cells */
  body .kh6731-activity-searchbar > input[type="hidden"]{
    display:none !important;
  }

  /* Search field = full row */
  body .kh6731-activity-searchbar > input[type="search"]{
    grid-column:1 / -1 !important;
    grid-row:auto !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
  }

  /* Transaction cards = full row */
  body .kh6731-activity-searchbar > .kh6729-type-filter{
    grid-column:1 / -1 !important;
    grid-row:auto !important;

    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    gap:7px !important;
    padding:2px 0 4px !important;
    margin:0 !important;

    box-sizing:border-box !important;
  }

  /* Each toggle is a real equal-width card */
  body .kh6731-activity-searchbar
  .kh6729-type-filter > .kh6729-filter-card{
    display:block !important;
    position:relative !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    padding:0 !important;
    margin:0 !important;

    grid-column:auto !important;
    grid-row:auto !important;
  }

  /* Absolutely hide the native checkbox */
  body .kh6731-activity-searchbar
  .kh6729-filter-card > input.kh6729-filter-input{
    position:absolute !important;
    inset:auto !important;

    width:1px !important;
    height:1px !important;
    min-width:1px !important;
    min-height:1px !important;

    opacity:0 !important;
    visibility:hidden !important;

    appearance:none !important;
    -webkit-appearance:none !important;

    pointer-events:none !important;
  }

  /* OFF state */
  body .kh6731-activity-searchbar .kh6729-card-face{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    min-width:0 !important;
    min-height:82px !important;

    gap:6px !important;
    padding:9px 2px !important;

    border:1.5px solid rgba(var(--kh6729-rgb),.24) !important;
    border-radius:15px !important;

    background:
      linear-gradient(
        145deg,
        rgba(var(--kh6729-rgb),.09),
        rgba(var(--kh6729-rgb),.035)
      ),
      #fff !important;

    box-shadow:
      0 3px 10px rgba(15,23,42,.055),
      inset 0 1px 0 rgba(255,255,255,.95) !important;

    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  body .kh6731-activity-searchbar .kh6729-icon{
    display:grid !important;
    place-items:center !important;

    width:31px !important;
    height:31px !important;
    min-width:31px !important;
    min-height:31px !important;

    padding:0 !important;
    margin:0 !important;

    border-radius:10px !important;

    color:rgba(var(--kh6729-rgb),.70) !important;
    background:rgba(var(--kh6729-rgb),.10) !important;

    font-size:19px !important;
    line-height:1 !important;
    font-weight:900 !important;
  }

  body .kh6731-activity-searchbar .kh6729-label{
    display:block !important;

    width:100% !important;
    min-width:0 !important;

    padding:0 !important;
    margin:0 !important;

    color:#334155 !important;

    font-size:10.5px !important;
    line-height:1.2 !important;
    font-weight:850 !important;

    text-align:center !important;
    white-space:nowrap !important;
  }

  /* tiny OFF indicator */
  body .kh6731-activity-searchbar .kh6729-state{
    display:block !important;
    position:absolute !important;

    top:7px !important;
    left:7px !important;

    width:7px !important;
    height:7px !important;
    min-width:7px !important;
    min-height:7px !important;

    border-radius:50% !important;

    background:#cbd5e1 !important;
    box-shadow:0 0 0 3px rgba(203,213,225,.13) !important;
  }

  /* ON state — card itself lights up */
  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face{
    border-color:rgb(var(--kh6729-rgb)) !important;

    background:
      radial-gradient(
        circle at 50% 0%,
        rgba(var(--kh6729-rgb),.27),
        transparent 65%
      ),
      linear-gradient(
        145deg,
        rgba(var(--kh6729-rgb),.17),
        rgba(255,255,255,.98)
      ) !important;

    box-shadow:
      0 8px 20px rgba(var(--kh6729-rgb),.20),
      0 0 0 1px rgba(var(--kh6729-rgb),.15),
      inset 0 1px 0 rgba(255,255,255,.95) !important;

    transform:translateY(-2px) !important;
  }

  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face .kh6729-icon{
    color:rgb(var(--kh6729-rgb)) !important;
    background:rgba(var(--kh6729-rgb),.17) !important;

    box-shadow:
      0 0 17px rgba(var(--kh6729-rgb),.25) !important;
  }

  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face .kh6729-label{
    color:rgb(var(--kh6729-rgb)) !important;
    font-weight:900 !important;
  }

  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face .kh6729-state{
    background:rgb(var(--kh6729-rgb)) !important;

    box-shadow:
      0 0 0 3px rgba(var(--kh6729-rgb),.15),
      0 0 10px rgba(var(--kh6729-rgb),.70) !important;
  }

  /* Date labels */
  body .kh6731-activity-searchbar > span.mini{
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;

    color:var(--ink-3) !important;
    font-size:12px !important;
    font-weight:700 !important;

    text-align:center !important;
    white-space:nowrap !important;
  }

  /* Date controls */
  body .kh6731-activity-searchbar > .date-dmy-wrap{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
  }

  body .kh6731-activity-searchbar > .date-dmy-wrap input,
  body .kh6731-activity-searchbar > .date-dmy-wrap .date-dmy{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    box-sizing:border-box !important;
  }

  /* Sort = full row */
  body .kh6731-activity-searchbar > select[name="sort"]{
    grid-column:1 / -1 !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    margin:0 !important;
  }

  /* Search / clear buttons */
  body .kh6731-activity-searchbar > button.btn{
    grid-column:3 / -1 !important;

    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
  }

  body .kh6731-activity-searchbar > a.btn{
    grid-column:1 / 3 !important;

    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }
}


/* ==========================================================
   KashfHesab V67.32 — Creative Activity Identity
   Semantic colors + premium icon treatment
   ========================================================== */

/* SALES — Royal Blue */
body .kh6729-sale{
  --kh6729-rgb:29,78,216 !important;
}

/* PURCHASE — Premium Violet */
body .kh6729-purchase{
  --kh6729-rgb:126,34,206 !important;
}

/* RECEIPT — Emerald Green */
body .kh6729-receipt{
  --kh6729-rgb:5,150,105 !important;
}

/* PAYMENT — Warm Orange */
body .kh6729-payment{
  --kh6729-rgb:234,88,12 !important;
}

/* CREATE — Cyan / Turquoise */
body .kh6729-created{
  --kh6729-rgb:8,145,178 !important;
}

/* DELETE — Strong Red */
body .kh6729-deleted{
  --kh6729-rgb:220,38,38 !important;
}

/* LOGIN — Fresh Teal */
body .kh6729-login{
  --kh6729-rgb:13,148,136 !important;
}

/* LOGOUT — Rose */
body .kh6729-logout{
  --kh6729-rgb:219,39,119 !important;
}

@media (max-width:768px){

  /* Premium icon tile */
  body .kh6731-activity-searchbar .kh6729-icon{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;

    border-radius:11px !important;

    border:
      1px solid rgba(var(--kh6729-rgb),.18) !important;

    color:
      rgb(var(--kh6729-rgb)) !important;

    background:
      linear-gradient(
        145deg,
        rgba(var(--kh6729-rgb),.16),
        rgba(var(--kh6729-rgb),.07)
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.82),
      0 3px 8px rgba(var(--kh6729-rgb),.09) !important;

    font-size:20px !important;
    font-weight:900 !important;

    transition:
      transform .18s ease,
      background .18s ease,
      box-shadow .18s ease !important;
  }

  /* OFF card gets its own subtle identity */
  body .kh6731-activity-searchbar .kh6729-card-face{
    border-color:
      rgba(var(--kh6729-rgb),.22) !important;

    background:
      radial-gradient(
        circle at 50% -10%,
        rgba(var(--kh6729-rgb),.10),
        transparent 62%
      ),
      linear-gradient(
        145deg,
        rgba(var(--kh6729-rgb),.055),
        rgba(255,255,255,.98)
      ) !important;
  }

  /* ON = visibly illuminated */
  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face{
    border-color:
      rgba(var(--kh6729-rgb),.88) !important;

    background:
      radial-gradient(
        circle at 50% -15%,
        rgba(var(--kh6729-rgb),.34),
        transparent 64%
      ),
      linear-gradient(
        145deg,
        rgba(var(--kh6729-rgb),.19),
        rgba(255,255,255,.97)
      ) !important;

    box-shadow:
      0 9px 21px rgba(var(--kh6729-rgb),.22),
      0 0 0 1px rgba(var(--kh6729-rgb),.17),
      inset 0 1px 0 rgba(255,255,255,.96) !important;
  }

  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face .kh6729-icon{
    color:#fff !important;

    background:
      linear-gradient(
        145deg,
        rgba(var(--kh6729-rgb),1),
        rgba(var(--kh6729-rgb),.76)
      ) !important;

    border-color:
      rgba(var(--kh6729-rgb),1) !important;

    box-shadow:
      0 5px 12px rgba(var(--kh6729-rgb),.28),
      0 0 17px rgba(var(--kh6729-rgb),.28) !important;

    transform:scale(1.06) !important;
  }

  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face .kh6729-label{
    color:rgb(var(--kh6729-rgb)) !important;
    font-weight:900 !important;
  }

  /* OFF indicator */
  body .kh6731-activity-searchbar .kh6729-state{
    background:rgba(var(--kh6729-rgb),.25) !important;
    box-shadow:
      0 0 0 3px rgba(var(--kh6729-rgb),.07) !important;
  }

  /* ON indicator */
  body .kh6731-activity-searchbar
  .kh6729-filter-input:checked + .kh6729-card-face .kh6729-state{
    background:rgb(var(--kh6729-rgb)) !important;

    box-shadow:
      0 0 0 3px rgba(var(--kh6729-rgb),.16),
      0 0 12px rgba(var(--kh6729-rgb),.85) !important;
  }
}


/* ==========================================================
   KashfHesab V67.35 — Login / Logout Strong Visual Identity
   ========================================================== */

/* LOGIN — clear success green */
body .kh6729-login{
  --kh6729-rgb:22,163,74 !important;
}

/* LOGOUT — clear danger red */
body .kh6729-logout{
  --kh6729-rgb:220,38,38 !important;
}


/* ==========================================================
   KashfHesab V67.36 — Animated Activity Archive Cards
   Mobile visual layer only
   ========================================================== */

@media (max-width:768px){

  /* Keep the archive data/table semantics, but visually
     separate every movement into an independent card. */
  body #activity-rows{
    display:table !important;
    width:100% !important;
    border-collapse:separate !important;
    border-spacing:0 9px !important;
    table-layout:fixed !important;
    background:transparent !important;
  }

  body #activity-rows thead{
    display:none !important;
  }

  body #activity-rows tbody{
    background:transparent !important;
  }

  body #activity-rows .kh6736-activity-card{
    --kh6736-rgb:100,116,139;

    position:relative;

    background:
      radial-gradient(
        circle at 100% 0,
        rgba(var(--kh6736-rgb),.11),
        transparent 42%
      ),
      linear-gradient(
        145deg,
        rgba(255,255,255,.99),
        rgba(var(--kh6736-rgb),.035)
      ) !important;

    box-shadow:
      0 7px 20px rgba(15,23,42,.075),
      0 1px 3px rgba(15,23,42,.045),
      inset 3px 0 0 rgba(var(--kh6736-rgb),.88) !important;

    transform:translateY(9px) scale(.985);
    opacity:0;

    animation:
      kh6736CardIn .42s cubic-bezier(.2,.75,.25,1) forwards;

    transition:
      transform .18s ease,
      box-shadow .18s ease,
      background .18s ease !important;
  }

  /* stagger — same premium progressive feeling */
  body #activity-rows .kh6736-activity-card:nth-child(1){animation-delay:.02s}
  body #activity-rows .kh6736-activity-card:nth-child(2){animation-delay:.055s}
  body #activity-rows .kh6736-activity-card:nth-child(3){animation-delay:.09s}
  body #activity-rows .kh6736-activity-card:nth-child(4){animation-delay:.125s}
  body #activity-rows .kh6736-activity-card:nth-child(5){animation-delay:.16s}
  body #activity-rows .kh6736-activity-card:nth-child(6){animation-delay:.195s}
  body #activity-rows .kh6736-activity-card:nth-child(7){animation-delay:.23s}
  body #activity-rows .kh6736-activity-card:nth-child(8){animation-delay:.265s}
  body #activity-rows .kh6736-activity-card:nth-child(n+9){animation-delay:.30s}

  body #activity-rows .kh6736-activity-card > td{
    background:transparent !important;
    border-top:1px solid rgba(var(--kh6736-rgb),.12) !important;
    border-bottom:1px solid rgba(var(--kh6736-rgb),.12) !important;
    padding-top:11px !important;
    padding-bottom:11px !important;
    vertical-align:middle !important;
  }

  body #activity-rows .kh6736-activity-card > td:first-child{
    border-right:1px solid rgba(var(--kh6736-rgb),.12) !important;
    border-radius:0 15px 15px 0 !important;
  }

  body #activity-rows .kh6736-activity-card > td:last-child{
    border-left:1px solid rgba(var(--kh6736-rgb),.12) !important;
    border-radius:15px 0 0 15px !important;
  }

  body #activity-rows .kh6736-activity-card:active{
    transform:scale(.985) !important;

    box-shadow:
      0 3px 10px rgba(15,23,42,.08),
      inset 3px 0 0 rgba(var(--kh6736-rgb),1) !important;
  }

  /* Movement identities */
  body #activity-rows .kh6736-sale{
    --kh6736-rgb:37,99,235;
  }

  body #activity-rows .kh6736-purchase{
    --kh6736-rgb:124,58,237;
  }

  body #activity-rows .kh6736-receipt{
    --kh6736-rgb:5,150,105;
  }

  body #activity-rows .kh6736-payment{
    --kh6736-rgb:234,88,12;
  }

  body #activity-rows .kh6736-created{
    --kh6736-rgb:8,145,178;
  }

  body #activity-rows .kh6736-deleted{
    --kh6736-rgb:220,38,38;
  }

  body #activity-rows .kh6736-login{
    --kh6736-rgb:22,163,74;
  }

  body #activity-rows .kh6736-logout{
    --kh6736-rgb:219,39,119;
  }

  @keyframes kh6736CardIn{
    from{
      opacity:0;
      transform:translateY(9px) scale(.985);
    }
    to{
      opacity:1;
      transform:translateY(0) scale(1);
    }
  }
}

/* Desktop: subtle interaction without changing table layout */
@media (min-width:769px){
  body #activity-rows .kh6736-activity-card{
    transition:
      background .18s ease,
      box-shadow .18s ease !important;
  }

  body #activity-rows .kh6736-activity-card:hover{
    background:rgba(15,23,42,.025);
  }
}

/* Accessibility */
@media (prefers-reduced-motion:reduce){
  body #activity-rows .kh6736-activity-card{
    animation:none !important;
    transition:none !important;
    opacity:1 !important;
    transform:none !important;
  }
}


/* ==========================================================
   KashfHesab V67.37 — Maximize Activity Details Column
   ========================================================== */

@media (max-width:768px){

  /* Date stays compact */
  body #activity-rows .kh6736-activity-card > td:first-child{
    width:58px !important;
    padding-left:3px !important;
    padding-right:3px !important;
  }

  /* Middle/details column receives maximum available space */
  body #activity-rows .kh6736-activity-card > td:nth-child(2){
    width:auto !important;
    padding-left:7px !important;
    padding-right:7px !important;
    word-break:normal !important;
    overflow-wrap:anywhere !important;
  }

  /* User column: intentionally very compact */
  body #activity-rows .kh6736-activity-card > td:last-child{
    width:38px !important;
    min-width:38px !important;
    max-width:38px !important;

    padding-left:2px !important;
    padding-right:2px !important;

    font-size:9px !important;
    line-height:1.25 !important;

    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }
}


/* ==========================================================
   KashfHesab V67.39 — Customer Balance Filter One Row
   ========================================================== */

.kh6739-balance-row{
  display:flex;
  align-items:center;
  gap:6px;
}

@media (max-width:768px){

  body #customer-search-form .kh6739-balance-row{
    width:100%;
    min-width:0;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr);
    align-items:center;
    gap:5px;
    white-space:nowrap;
  }

  body #customer-search-form .kh6739-balance-row .mini{
    margin:0 !important;
    white-space:nowrap;
    font-size:11px;
  }

  body #customer-search-form .kh6739-balance-row .range-num-input{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    padding-left:5px !important;
    padding-right:5px !important;
  }
}


/* ==========================================================
   KashfHesab V67.40 — Premium Customer Filter Cards
   Mobile only — approved outer margins remain untouched
   ========================================================== */

@media (max-width:768px){

  /* Each filter becomes an independent premium section */
  body #customer-search-form .kh6740-filter-card{
    width:100%;
    min-width:0;
    box-sizing:border-box;

    border:1px solid rgba(var(--kh6740-rgb),.25) !important;
    border-radius:14px !important;

    background:
      radial-gradient(
        circle at 100% 0,
        rgba(var(--kh6740-rgb),.075),
        transparent 45%
      ),
      rgba(255,255,255,.96) !important;

    box-shadow:
      0 4px 12px rgba(15,23,42,.035),
      inset 3px 0 0 rgba(var(--kh6740-rgb),.72);

    transition:
      border-color .18s ease,
      box-shadow .18s ease,
      transform .18s ease;
  }

  /* Different professional identity for every section */
  body #customer-search-form .kh6740-search-card{
    --kh6740-rgb:37,99,235;
  }

  body #customer-search-form .kh6740-rep-card{
    --kh6740-rgb:14,116,144;
  }

  body #customer-search-form .kh6740-balance-card{
    --kh6740-rgb:5,150,105;
  }

  body #customer-search-form .kh6740-account-card{
    --kh6740-rgb:124,58,237;
  }

  body #customer-search-form .kh6740-sort-card{
    --kh6740-rgb:234,88,12;
  }

  /* Search */
  body #customer-search-form .kh6740-search-card{
    padding:0;
  }

  body #customer-search-form .kh6740-search-card #main-search-input{
    width:100% !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background:transparent !important;
  }

  /* Representative */
  body #customer-search-form .kh6740-rep-card{
    padding:0;
  }

  body #customer-search-form .kh6740-rep-card .rep-filter-select{
    width:100% !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background-color:transparent !important;
  }

  /* Balance = full-width row, not a small centered control */
  body #customer-search-form .kh6739-balance-row.kh6740-balance-card{
    width:100% !important;
    padding:10px 12px !important;

    display:grid !important;
    grid-template-columns:
      auto
      minmax(0,1fr)
      auto
      minmax(0,1fr) !important;

    gap:7px !important;
    align-items:center !important;
  }

  body #customer-search-form
  .kh6740-balance-card .mini{
    font-size:11px !important;
    font-weight:800 !important;
    white-space:nowrap !important;
  }

  body #customer-search-form
  .kh6740-balance-card .range-num-input{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:44px !important;

    margin:0 !important;
    padding:7px 6px !important;

    border:1px solid rgba(5,150,105,.18) !important;
    border-radius:11px !important;

    background:#fff !important;
    box-shadow:
      inset 0 1px 2px rgba(15,23,42,.035) !important;
  }

  body #customer-search-form
  .kh6740-balance-card .range-num-input:focus{
    border-color:rgba(5,150,105,.60) !important;
    box-shadow:
      0 0 0 3px rgba(5,150,105,.10) !important;
    outline:none !important;
  }

  /* Account-search dropdown = full-width card */
  body #customer-search-form .kh6740-account-card{
    display:block !important;
    padding:0 !important;
  }

  body #customer-search-form
  .kh6740-account-card > summary{
    width:100% !important;
    box-sizing:border-box !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background:transparent !important;
  }

  /* Sort = full-width card */
  body #customer-search-form .kh6740-sort-card{
    width:100% !important;
    padding:9px 11px !important;
  }

  body #customer-search-form
  .kh6740-sort-card select{
    min-width:0 !important;
  }

  /* Small active/focus polish */
  body #customer-search-form
  .kh6740-filter-card:focus-within{
    border-color:rgba(var(--kh6740-rgb),.55) !important;

    box-shadow:
      0 6px 16px rgba(var(--kh6740-rgb),.09),
      0 0 0 3px rgba(var(--kh6740-rgb),.055),
      inset 3px 0 0 rgba(var(--kh6740-rgb),.95) !important;
  }
}


/* ==========================================================
   KashfHesab V67.40 — Premium Customer Filter Cards
   Mobile only — approved outer margins remain untouched
   ========================================================== */

@media (max-width:768px){

  /* Each filter becomes an independent premium section */
  body #customer-search-form .kh6740-filter-card{
    width:100%;
    min-width:0;
    box-sizing:border-box;

    border:1px solid rgba(var(--kh6740-rgb),.25) !important;
    border-radius:14px !important;

    background:
      radial-gradient(
        circle at 100% 0,
        rgba(var(--kh6740-rgb),.075),
        transparent 45%
      ),
      rgba(255,255,255,.96) !important;

    box-shadow:
      0 4px 12px rgba(15,23,42,.035),
      inset 3px 0 0 rgba(var(--kh6740-rgb),.72);

    transition:
      border-color .18s ease,
      box-shadow .18s ease,
      transform .18s ease;
  }

  /* Different professional identity for every section */
  body #customer-search-form .kh6740-search-card{
    --kh6740-rgb:37,99,235;
  }

  body #customer-search-form .kh6740-rep-card{
    --kh6740-rgb:14,116,144;
  }

  body #customer-search-form .kh6740-balance-card{
    --kh6740-rgb:5,150,105;
  }

  body #customer-search-form .kh6740-account-card{
    --kh6740-rgb:124,58,237;
  }

  body #customer-search-form .kh6740-sort-card{
    --kh6740-rgb:234,88,12;
  }

  /* Search */
  body #customer-search-form .kh6740-search-card{
    padding:0;
  }

  body #customer-search-form .kh6740-search-card #main-search-input{
    width:100% !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background:transparent !important;
  }

  /* Representative */
  body #customer-search-form .kh6740-rep-card{
    padding:0;
  }

  body #customer-search-form .kh6740-rep-card .rep-filter-select{
    width:100% !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background-color:transparent !important;
  }

  /* Balance = full-width row, not a small centered control */
  body #customer-search-form .kh6739-balance-row.kh6740-balance-card{
    width:100% !important;
    padding:10px 12px !important;

    display:grid !important;
    grid-template-columns:
      auto
      minmax(0,1fr)
      auto
      minmax(0,1fr) !important;

    gap:7px !important;
    align-items:center !important;
  }

  body #customer-search-form
  .kh6740-balance-card .mini{
    font-size:11px !important;
    font-weight:800 !important;
    white-space:nowrap !important;
  }

  body #customer-search-form
  .kh6740-balance-card .range-num-input{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:44px !important;

    margin:0 !important;
    padding:7px 6px !important;

    border:1px solid rgba(5,150,105,.18) !important;
    border-radius:11px !important;

    background:#fff !important;
    box-shadow:
      inset 0 1px 2px rgba(15,23,42,.035) !important;
  }

  body #customer-search-form
  .kh6740-balance-card .range-num-input:focus{
    border-color:rgba(5,150,105,.60) !important;
    box-shadow:
      0 0 0 3px rgba(5,150,105,.10) !important;
    outline:none !important;
  }

  /* Account-search dropdown = full-width card */
  body #customer-search-form .kh6740-account-card{
    display:block !important;
    padding:0 !important;
  }

  body #customer-search-form
  .kh6740-account-card > summary{
    width:100% !important;
    box-sizing:border-box !important;
    margin:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background:transparent !important;
  }

  /* Sort = full-width card */
  body #customer-search-form .kh6740-sort-card{
    width:100% !important;
    padding:9px 11px !important;
  }

  body #customer-search-form
  .kh6740-sort-card select{
    min-width:0 !important;
  }

  /* Small active/focus polish */
  body #customer-search-form
  .kh6740-filter-card:focus-within{
    border-color:rgba(var(--kh6740-rgb),.55) !important;

    box-shadow:
      0 6px 16px rgba(var(--kh6740-rgb),.09),
      0 0 0 3px rgba(var(--kh6740-rgb),.055),
      inset 3px 0 0 rgba(var(--kh6740-rgb),.95) !important;
  }
}


/* ==========================================================
   KashfHesab V67.41 — Customer Filters Full Mobile Rows
   Fix parent-grid occupancy without changing outer margins
   ========================================================== */

@media (max-width:768px){

  /* Every premium customer filter occupies the complete form row */
  body #customer-search-form > .kh6740-filter-card{
    grid-column:1 / -1 !important;
    justify-self:stretch !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  /* Balance card specifically must span the complete row */
  body #customer-search-form >
  .kh6739-balance-row.kh6740-balance-card{
    grid-column:1 / -1 !important;
    justify-self:stretch !important;

    width:100% !important;
    max-width:none !important;
    min-width:0 !important;

    display:grid !important;
    grid-template-columns:
      auto
      minmax(0,1fr)
      auto
      minmax(0,1fr) !important;

    column-gap:8px !important;
  }

  /* Give the two amount fields all remaining usable width */
  body #customer-search-form
  .kh6740-balance-card > .range-num-input{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    box-sizing:border-box !important;
  }
}


/* KashfHesab V67.43 — Mobile Customer More Options */
.kh6743-more-btn{display:none}
.kh6743-more-options{display:contents}
@media (max-width:768px){body.kh-customers-page #customer-search-form>.kh6743-search-row{grid-column:1/-1;width:100%;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:stretch}body.kh-customers-page #customer-search-form .kh6743-search-row .kh6740-search-card{width:100%!important;min-width:0!important;margin:0!important}body.kh-customers-page .kh6743-more-btn{display:flex;align-items:center;justify-content:center;border:1px solid rgba(37,99,235,.24);border-radius:12px;padding:0 10px;min-height:44px;background:rgba(37,99,235,.06);font:inherit;font-size:11px;font-weight:800;color:#1d4ed8;white-space:nowrap;cursor:pointer}body.kh-customers-page #customer-search-form>.kh6743-more-options{grid-column:1/-1;width:100%;min-width:0;display:none}body.kh-customers-page #customer-search-form>.kh6743-more-options.is-open{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}body.kh-customers-page .kh6743-more-options>.kh6740-filter-card{width:100%!important;min-width:0!important;max-width:none!important;box-sizing:border-box!important}}
/* KashfHesab V67.45 — Premium Mobile Customer Cards */
@media (max-width:768px){
  body.kh-customers-page #customer-rows{
    display:grid;
    gap:10px;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card{
    position:relative;
    z-index:1;
    overflow:hidden;
    width:100%;
    box-sizing:border-box;
    min-height:76px;
    margin:0;
    padding:12px 13px;
    border:1px solid rgba(37,99,235,.16);
    border-radius:16px;
    background:
      radial-gradient(circle at 92% 10%,rgba(37,99,235,.09),transparent 42%),
      linear-gradient(135deg,#fff 0%,#f8fbff 100%);
    box-shadow:0 5px 16px rgba(15,23,42,.07);
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,min-height .22s ease,padding .22s ease;
    isolation:isolate;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card::before{
    content:"";
    position:absolute;
    top:10px;
    bottom:10px;
    right:0;
    width:4px;
    border-radius:4px 0 0 4px;
    background:#2563eb;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card:has(.bal.pos){
    border-color:rgba(239,68,68,.20);
    background:
      radial-gradient(circle at 92% 10%,rgba(239,68,68,.10),transparent 42%),
      linear-gradient(135deg,#fff 0%,#fff8f7 100%);
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card:has(.bal.pos)::before{
    background:#ef4444;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card:has(.bal.neg){
    border-color:rgba(5,150,105,.20);
    background:
      radial-gradient(circle at 92% 10%,rgba(5,150,105,.10),transparent 42%),
      linear-gradient(135deg,#fff 0%,#f5fdf9 100%);
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card:has(.bal.neg)::before{
    background:#059669;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card > span:first-child > b{
    font-size:14px;
    font-weight:900;
    line-height:1.35;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card > span:first-child > em{
    margin-top:3px;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card .bal{
    font-size:14px;
    font-weight:900;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card .seen{
    opacity:.72;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card.is-expanded{
    z-index:20;
    min-height:108px;
    padding:17px 15px;
    transform:scale(1.025);
    border-color:rgba(37,99,235,.32);
    box-shadow:0 15px 35px rgba(15,23,42,.18);
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card.is-expanded > span:first-child > b{
    font-size:17px;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card.is-expanded > span:first-child > em{
    font-size:12px;
    margin-top:5px;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card.is-expanded .bal{
    font-size:17px;
  }

  body.kh-customers-page #customer-rows .kh6745-customer-card.is-expanded::after{
    content:"اضغط مرة أخرى لفتح الحساب";
    position:absolute;
    right:15px;
    bottom:8px;
    font-size:9px;
    font-weight:800;
    color:#64748b;
  }
}

@media (prefers-reduced-motion:reduce){
  .kh6745-customer-card{transition:none!important}
}

/* KashfHesab V67.48 — Customer Account Signature Card */
body:has(#customer-account-users) .wrap > .readout{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  color:#0f172a;
  border:1px solid #dbe5f1;
  border-inline-start:6px solid #2563eb;
  border-radius:20px;
  background:
    radial-gradient(circle at 8% 8%,rgba(59,130,246,.09) 0,transparent 30%),
    linear-gradient(135deg,#ffffff 0%,#f8fbff 55%,#eef5ff 100%);
  box-shadow:
    0 14px 34px rgba(15,23,42,.10),
    0 3px 8px rgba(15,23,42,.05);
}

/* مستحق على الزبون */
body:has(#customer-account-users) .wrap > .readout.owed{
  border-inline-start-color:#ef4444;
  border-color:rgba(239,68,68,.20);
  border-inline-start-width:6px;
  background:
    radial-gradient(circle at 8% 8%,rgba(239,68,68,.10),transparent 31%),
    linear-gradient(135deg,#ffffff 0%,#fffafa 56%,#fff1f2 100%);
}

/* رصيد للزبون */
body:has(#customer-account-users) .wrap > .readout.credit{
  border-inline-start-color:#10b981;
  border-color:rgba(16,185,129,.21);
  border-inline-start-width:6px;
  background:
    radial-gradient(circle at 8% 8%,rgba(16,185,129,.10),transparent 31%),
    linear-gradient(135deg,#ffffff 0%,#f7fffb 56%,#ecfdf5 100%);
}

/* الحساب مسدد */
body:has(#customer-account-users) .wrap > .readout.settled{
  border-inline-start-color:#2563eb;
  background:
    radial-gradient(circle at 8% 8%,rgba(37,99,235,.10),transparent 31%),
    linear-gradient(135deg,#ffffff 0%,#f8fbff 56%,#eff6ff 100%);
}

body:has(#customer-account-users) .wrap > .readout::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:180px;
  height:180px;
  left:-85px;
  top:-105px;
  border-radius:50%;
  background:rgba(37,99,235,.055);
  pointer-events:none;
}

body:has(#customer-account-users) .wrap > .readout::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:110px;
  height:110px;
  right:-55px;
  bottom:-60px;
  border-radius:50%;
  border:18px solid rgba(37,99,235,.035);
  pointer-events:none;
}

body:has(#customer-account-users) .wrap > .readout .readout-body{
  position:relative;
  padding:24px 26px 20px;
}

body:has(#customer-account-users) .wrap > .readout .lbl{
  color:#64748b;
}

body:has(#customer-account-users) .wrap > .readout .cust-name{
  color:#0f2747;
  font-size:15px;
  font-weight:800;
}

body:has(#customer-account-users) .wrap > .readout .amt{
  color:#1d4ed8;
  font-weight:900;
  text-shadow:none;
}

body:has(#customer-account-users) .wrap > .readout.owed .amt{
  color:#dc2626;
}

body:has(#customer-account-users) .wrap > .readout.credit .amt{
  color:#059669;
}

body:has(#customer-account-users) .wrap > .readout.settled .amt{
  color:#2563eb;
}

body:has(#customer-account-users) .wrap > .readout .amt small{
  color:#64748b;
}

body:has(#customer-account-users) .wrap > .readout .state{
  color:#475569;
  background:#eef4fb;
  border:1px solid #e2e8f0;
  padding:5px 11px;
  border-radius:999px;
}

body:has(#customer-account-users) .wrap > .readout.owed .state{
  color:#b91c1c;
  background:#fff1f2;
  border-color:#fecdd3;
}

body:has(#customer-account-users) .wrap > .readout.credit .state{
  color:#047857;
  background:#ecfdf5;
  border-color:#a7f3d0;
}

body:has(#customer-account-users) .wrap > .readout.settled .state{
  color:#1d4ed8;
  background:#eff6ff;
  border-color:#bfdbfe;
}

body:has(#customer-account-users) .wrap > .readout .stripe{
  display:block;
  height:1px;
  margin:0 24px;
  background:linear-gradient(90deg,transparent,#dbe5f1 18%,#dbe5f1 82%,transparent);
  opacity:1;
}

body:has(#customer-account-users) .wrap > .readout .readout-meta{
  border-top:0;
  background:rgba(248,250,252,.72);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}

body:has(#customer-account-users) .wrap > .readout .readout-meta div{
  padding:13px 22px;
  border-inline-start:1px solid #e2e8f0;
}

body:has(#customer-account-users) .wrap > .readout .readout-meta b{
  color:#172033;
  font-weight:800;
}

body:has(#customer-account-users) .wrap > .readout .readout-meta em{
  color:#64748b;
  font-weight:600;
}

@media (hover:hover){
  body:has(#customer-account-users) .wrap > .readout:hover{
    transform:translateY(-2px);
    box-shadow:
      0 18px 42px rgba(15,23,42,.13),
      0 4px 10px rgba(15,23,42,.05);
  }
}

@media (max-width:768px){
  body:has(#customer-account-users) .wrap > .readout{
    border-radius:18px;
    border-inline-start-width:5px;
  }

  body:has(#customer-account-users) .wrap > .readout.owed,
  body:has(#customer-account-users) .wrap > .readout.credit{
    border-inline-start-width:5px;
  }

  body:has(#customer-account-users) .wrap > .readout .readout-body{
    padding:19px 18px 16px;
  }

  body:has(#customer-account-users) .wrap > .readout .amt{
    font-size:30px;
  }

  body:has(#customer-account-users) .wrap > .readout .readout-meta div{
    padding:11px 13px;
  }
}

/* KashfHesab V67.49.1 — Customer Account Top Tool Cards */
.kh6749-top-tool{
  position:relative;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:34px;
  padding:6px 11px !important;
  border-radius:11px !important;
  font-weight:700;
  line-height:1.1;
  box-shadow:0 4px 12px rgba(15,23,42,.07) !important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease !important;
}

.kh6749-top-tool b{
  font-size:11.5px;
  white-space:nowrap;
}

.kh6749-top-tool em{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:19px;
  height:19px;
  padding:0 5px;
  border-radius:999px;
  font-size:10px;
  font-style:normal;
  font-weight:800;
}

.kh6749-users-tool{
  color:#4338ca !important;
  border-color:#c7d2fe !important;
  background:linear-gradient(135deg,#fff,#eef2ff) !important;
}

.kh6749-users-tool span{
  filter:drop-shadow(0 2px 3px rgba(79,70,229,.18));
}

.kh6749-rejected-tool{
  color:#b45309 !important;
  border-color:#fde68a !important;
  background:linear-gradient(135deg,#fff,#fffbeb) !important;
}

.kh6749-rejected-tool em{
  color:#92400e;
  background:#fef3c7;
  box-shadow:inset 0 0 0 1px #fde68a;
}

/* رجوع + الرئيسية كبطاقات متناسقة */
.topbar-backrow > a.btn{
  min-height:34px;
  padding:6px 11px;
  border-radius:11px;
  border:1px solid #dbe5f1;
  background:linear-gradient(135deg,#fff,#f8fafc);
  box-shadow:0 4px 12px rgba(15,23,42,.06);
  font-weight:700;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

.topbar-backrow > a.btn:first-child{
  color:#334155;
  border-color:#cbd5e1;
}

.topbar-backrow > a.btn:nth-child(2){
  color:#1d4ed8;
  border-color:#bfdbfe;
  background:linear-gradient(135deg,#fff,#eff6ff);
}

@media (hover:hover){
  .kh6749-top-tool:hover,
  .topbar-backrow > a.btn:hover{
    transform:translateY(-2px);
    box-shadow:0 7px 17px rgba(15,23,42,.11) !important;
  }
}

.kh6749-top-tool:active,
.topbar-backrow > a.btn:active{
  transform:scale(.97);
}

@media (max-width:768px){
  .topbar-backrow{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
  }

  .topbar-backrow-trailing{
    display:contents;
  }

  .topbar-backrow > a.btn,
  .kh6749-top-tool{
    min-height:36px;
    padding:7px 9px !important;
    border-radius:11px !important;
  }

  .kh6749-top-tool b{
    font-size:10.5px;
  }
}

@media (prefers-reduced-motion:reduce){
  .kh6749-top-tool,
  .topbar-backrow > a.btn{
    transition:none !important;
  }
}

/* =========================================================
   KashfHesab V67.51.1
   Customer account — premium progressive More Options
   ========================================================= */

.kh6751-more-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
  z-index:90;
}

.kh6751-more-btn{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:36px;
  padding:7px 12px !important;
  border-radius:12px !important;
  border:1px solid #c7d2fe !important;
  background:linear-gradient(135deg,#ffffff 0%,#eef2ff 100%) !important;
  color:#3730a3 !important;
  box-shadow:0 5px 15px rgba(67,56,202,.10) !important;
  font-weight:800;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease !important;
}

.kh6751-more-btn:hover{
  transform:translateY(-1px);
  border-color:#a5b4fc !important;
  box-shadow:0 8px 20px rgba(67,56,202,.16) !important;
}

.kh6751-more-btn[aria-expanded="true"]{
  border-color:#818cf8 !important;
  box-shadow:0 8px 22px rgba(67,56,202,.18) !important;
}

.kh6751-dots{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
  letter-spacing:1px;
  line-height:1;
}

.kh6751-chev{
  display:inline-block;
  font-size:13px;
  transition:transform .22s ease;
}

.kh6751-more-btn[aria-expanded="true"] .kh6751-chev{
  transform:rotate(180deg);
}

/* Floating menu */
.kh6751-menu{
  position:absolute;
  top:calc(100% + 9px);
  inset-inline-start:0;
  width:min(330px,calc(100vw - 30px));
  padding:10px;
  border:1px solid rgba(148,163,184,.26);
  border-radius:18px;
  background:rgba(255,255,255,.98);
  box-shadow:
    0 22px 55px rgba(15,23,42,.18),
    0 5px 16px rgba(15,23,42,.08);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  z-index:999;
  transform-origin:top right;
}

.kh6751-menu:not([hidden]){
  display:grid;
  gap:8px;
  animation:kh6751MenuIn .22s ease both;
}

@keyframes kh6751MenuIn{
  from{
    opacity:0;
    transform:translateY(-8px) scale(.97);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

/* Option cards */
.kh6751-option{
  position:relative;
  width:100%;
  min-height:62px;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  gap:11px;
  padding:10px 11px;
  border-radius:14px;
  border:1px solid transparent;
  text-align:right;
  text-decoration:none !important;
  cursor:pointer;
  overflow:hidden;
  opacity:0;
  transform:translateY(-7px);
  animation:kh6751CardIn .28s ease forwards;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
  font-family:inherit;
}

.kh6751-menu:not([hidden]) .kh6751-option:nth-child(1){animation-delay:.04s}
.kh6751-menu:not([hidden]) .kh6751-option:nth-child(2){animation-delay:.09s}
.kh6751-menu:not([hidden]) .kh6751-option:nth-child(3){animation-delay:.14s}
.kh6751-menu:not([hidden]) .kh6751-option:nth-child(4){animation-delay:.19s}

@keyframes kh6751CardIn{
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.kh6751-option:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 18px rgba(15,23,42,.09);
}

.kh6751-option-icon{
  flex:0 0 39px;
  width:39px;
  height:39px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:rgba(255,255,255,.82);
  box-shadow:0 4px 10px rgba(15,23,42,.07);
  font-size:19px;
}

.kh6751-option-text{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.kh6751-option-text b{
  font-size:13px;
  line-height:1.25;
}

.kh6751-option-text small{
  font-size:10.5px;
  line-height:1.35;
  opacity:.70;
}

/* individual identities */
.kh6751-print{
  color:#1e40af;
  border-color:#bfdbfe;
  background:linear-gradient(135deg,#eff6ff,#ffffff);
}

.kh6751-notes{
  color:#047857;
  border-color:#a7f3d0;
  background:linear-gradient(135deg,#ecfdf5,#ffffff);
}

.kh6751-users{
  color:#6d28d9;
  border-color:#ddd6fe;
  background:linear-gradient(135deg,#f5f3ff,#ffffff);
}

.kh6751-rejected{
  color:#b45309;
  border-color:#fde68a;
  background:linear-gradient(135deg,#fffbeb,#ffffff);
}

.kh6751-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:24px;
  height:24px;
  padding:0 6px;
  border-radius:999px;
  background:#fef3c7;
  color:#92400e;
  border:1px solid #fde68a;
  font-size:11px;
  font-weight:900;
  font-style:normal;
}

/* Customer top back-row only */
.topbar-backrow:has(.kh6751-more-wrap){
  overflow:visible;
  position:relative;
  z-index:80;
}

@media (max-width:768px){
  .topbar-backrow:has(.kh6751-more-wrap){
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
  }

  .topbar-backrow:has(.kh6751-more-wrap) .topbar-backrow-trailing{
    display:contents;
  }

  .kh6751-more-btn{
    min-height:36px;
    padding:7px 9px !important;
    font-size:11px;
  }

  .kh6751-menu{
    position:fixed;
    top:auto;
    right:10px;
    left:10px;
    bottom:76px;
    width:auto;
    max-width:none;
    border-radius:20px;
    padding:10px;
    transform-origin:bottom center;
  }

  .kh6751-menu:not([hidden]){
    animation:kh6751MobileIn .24s ease both;
  }

  @keyframes kh6751MobileIn{
    from{
      opacity:0;
      transform:translateY(15px) scale(.98);
    }
    to{
      opacity:1;
      transform:translateY(0) scale(1);
    }
  }

  .kh6751-option{
    min-height:59px;
  }
}

@media (prefers-reduced-motion:reduce){
  .kh6751-menu,
  .kh6751-option,
  .kh6751-more-btn,
  .kh6751-chev{
    animation:none !important;
    transition:none !important;
  }

  .kh6751-option{
    opacity:1;
    transform:none;
  }
}


/* KashfHesab V67.52.1 — Purchase invoice number + date same row */
.kh67521-purchase-meta{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:10px !important;
  align-items:end;
}

.kh67521-purchase-meta > .field{
  min-width:0;
  margin-bottom:0;
}

.kh67521-purchase-meta input{
  width:100%;
  min-width:0;
  box-sizing:border-box;
}

@media (max-width:640px){
  .kh67521-purchase-meta{
    grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr) !important;
    gap:8px !important;
  }

  .kh67521-purchase-meta .field{
    min-width:0 !important;
  }

  .kh67521-purchase-meta label{
    white-space:nowrap;
    font-size:12px;
  }

  .kh67521-purchase-meta input{
    font-size:13px;
    padding-left:8px;
    padding-right:8px;
  }
}


/* KashfHesab V67.53 — Premium success modal */
.kh6753-success-backdrop{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:22px;
  background:
    radial-gradient(circle at 50% 42%,rgba(16,185,129,.10),transparent 34%),
    rgba(15,23,42,.46);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  direction:rtl;
}

.kh6753-success-backdrop[hidden]{
  display:none !important;
}

.kh6753-success-card{
  position:relative;
  width:min(100%,430px);
  overflow:hidden;
  padding:32px 28px 24px;
  border:1px solid rgba(16,185,129,.20);
  border-radius:26px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.99),rgba(248,255,252,.98));
  box-shadow:
    0 30px 80px rgba(15,23,42,.25),
    0 12px 30px rgba(15,23,42,.13),
    0 2px 8px rgba(16,185,129,.08),
    inset 0 1px 0 rgba(255,255,255,.95);
  text-align:center;
  animation:kh6753SuccessIn .34s cubic-bezier(.2,.9,.3,1.15);
}

.kh6753-success-card::before{
  content:"";
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:5px;
  background:linear-gradient(90deg,#34d399,#10b981,#059669);
}

.kh6753-success-card::after{
  content:"";
  position:absolute;
  width:190px;
  height:190px;
  top:-110px;
  right:-80px;
  border-radius:50%;
  background:rgba(16,185,129,.07);
  pointer-events:none;
}

.kh6753-success-glow{
  position:absolute;
  width:150px;
  height:150px;
  top:-75px;
  left:-65px;
  border-radius:50%;
  background:rgba(52,211,153,.09);
  pointer-events:none;
}

.kh6753-success-close{
  position:absolute;
  top:15px;
  left:15px;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  padding:0;
  border:1px solid #e5e7eb;
  border-radius:11px;
  background:rgba(255,255,255,.88);
  color:#64748b;
  font-size:23px;
  font-family:Arial,sans-serif;
  line-height:1;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(15,23,42,.06);
  transition:transform .18s ease,background .18s ease,color .18s ease;
}

.kh6753-success-close:hover{
  transform:rotate(5deg) scale(1.05);
  background:#f8fafc;
  color:#0f172a;
}

.kh6753-success-icon-wrap{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:center;
  margin-bottom:17px;
}

.kh6753-success-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:78px;
  height:78px;
  border:8px solid #d1fae5;
  border-radius:50%;
  background:linear-gradient(145deg,#10b981,#059669);
  box-shadow:
    0 14px 28px rgba(5,150,105,.23),
    0 0 0 7px rgba(16,185,129,.07);
}

.kh6753-success-icon svg{
  width:39px;
  height:39px;
  fill:none;
  stroke:#fff;
  stroke-width:2.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.kh6753-success-content{
  position:relative;
  z-index:2;
}

.kh6753-success-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:7px;
  padding:5px 11px;
  border:1px solid #a7f3d0;
  border-radius:999px;
  background:#ecfdf5;
  color:#047857;
  font-size:11px;
  font-weight:800;
}

.kh6753-success-content h3{
  margin:0;
  color:#0f172a;
  font-size:21px;
  font-weight:900;
  line-height:1.45;
}

.kh6753-success-content #ok-modal-msg{
  margin:7px 0 0;
  color:#475569;
  font-size:14px;
  font-weight:700;
  line-height:1.7;
}

.kh6753-success-status{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin:18px 0 20px;
  padding:10px 12px;
  border:1px solid #dbeee6;
  border-radius:13px;
  background:linear-gradient(180deg,#f8fffc,#f1fbf7);
  color:#52645d;
  font-size:12px;
  font-weight:700;
}

.kh6753-success-dot{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:#10b981;
  box-shadow:0 0 0 4px rgba(16,185,129,.12);
}

.kh6753-success-ok{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  min-height:48px;
  border:0;
  border-radius:14px;
  background:linear-gradient(135deg,#059669,#10b981);
  color:#fff;
  font-size:14px;
  font-weight:900;
  cursor:pointer;
  box-shadow:
    0 11px 22px rgba(5,150,105,.22),
    inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .18s ease,box-shadow .18s ease;
}

.kh6753-success-ok:hover{
  transform:translateY(-1px);
  box-shadow:
    0 14px 27px rgba(5,150,105,.27),
    inset 0 1px 0 rgba(255,255,255,.22);
}

.kh6753-success-ok:active{
  transform:translateY(1px);
}

.kh6753-success-ok:focus-visible,
.kh6753-success-close:focus-visible{
  outline:3px solid rgba(16,185,129,.22);
  outline-offset:3px;
}

.kh6753-success-ok-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  border-radius:50%;
  background:rgba(255,255,255,.18);
  font-size:13px;
}

@keyframes kh6753SuccessIn{
  from{
    opacity:0;
    transform:translateY(18px) scale(.94);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@media (max-width:640px){
  .kh6753-success-backdrop{
    padding:18px;
  }

  .kh6753-success-card{
    width:100%;
    max-width:390px;
    padding:29px 20px 20px;
    border-radius:22px;
  }

  .kh6753-success-icon{
    width:68px;
    height:68px;
    border-width:7px;
  }

  .kh6753-success-icon svg{
    width:34px;
    height:34px;
  }

  .kh6753-success-content h3{
    font-size:19px;
  }

  .kh6753-success-content #ok-modal-msg{
    font-size:13px;
  }

  .kh6753-success-status{
    font-size:11.5px;
    margin-top:16px;
  }
}

@media (prefers-reduced-motion:reduce){
  .kh6753-success-card{
    animation:none;
  }
}


/* KashfHesab V67.54 — customer top actions touch fix
   إصلاح منطقة اللمس لرجوع / الشاشة الرئيسية / خيارات أخرى
   بدون تغيير الشكل أو الهوامش المعتمدة */
.topbar-backrow:has(.kh6751-more-wrap){
  position:relative !important;
  z-index:500 !important;
  isolation:isolate;
  pointer-events:auto !important;
}

.topbar-backrow:has(.kh6751-more-wrap) > a,
.topbar-backrow:has(.kh6751-more-wrap) .topbar-backrow-trailing,
.topbar-backrow:has(.kh6751-more-wrap) .kh6751-more-wrap,
.topbar-backrow:has(.kh6751-more-wrap) .kh6751-more-btn{
  position:relative;
  z-index:502 !important;
  pointer-events:auto !important;
  touch-action:manipulation;
}

.topbar-backrow:has(.kh6751-more-wrap) > a::before,
.topbar-backrow:has(.kh6751-more-wrap) > a::after,
.topbar-backrow:has(.kh6751-more-wrap) .kh6751-more-btn::before,
.topbar-backrow:has(.kh6751-more-wrap) .kh6751-more-btn::after{
  pointer-events:none !important;
}

.topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu{
  z-index:5100 !important;
  pointer-events:auto !important;
}

.topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu[hidden]{
  display:none !important;
  pointer-events:none !important;
}

.topbar-backrow:has(.kh6751-more-wrap) .kh6751-option{
  position:relative;
  z-index:5101;
  pointer-events:auto !important;
  touch-action:manipulation;
}

/* أي طبقة زخرفية داخل topbar لا يجوز أن تمنع الضغط على أزرار التنقل */
.topbar::before,
.topbar::after,
.topbar-backrow::before,
.topbar-backrow::after{
  pointer-events:none;
}

@media (max-width:768px){
  .topbar-backrow:has(.kh6751-more-wrap){
    z-index:5000 !important;
    pointer-events:auto !important;
  }

  .topbar-backrow:has(.kh6751-more-wrap) > a,
  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-more-btn{
    pointer-events:auto !important;
    touch-action:manipulation;
  }

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu{
    z-index:99999 !important;
  }
}

/* KashfHesab V67.56 — More Options premium dropdown
   القائمة تنسدل مباشرة من زر "خيارات أخرى" بدل Bottom Sheet */
@media (max-width:768px){

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-more-wrap{
    position:relative !important;
    overflow:visible !important;
  }

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu{
    position:absolute !important;

    /* RTL: محاذاة القائمة مع زر خيارات أخرى */
    top:calc(100% + 8px) !important;
    right:0 !important;
    left:auto !important;
    bottom:auto !important;

    width:min(310px, calc(100vw - 28px)) !important;
    max-width:calc(100vw - 28px) !important;

    padding:9px !important;
    border-radius:18px !important;

    z-index:99999 !important;

    transform-origin:top right !important;

    box-shadow:
      0 18px 45px rgba(15,23,42,.18),
      0 5px 14px rgba(15,23,42,.08) !important;
  }

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu:not([hidden]){
    animation:kh6756DropdownIn .20s cubic-bezier(.2,.8,.2,1) both !important;
  }

  /* السهم الصغير الذي يربط القائمة بالزر */
  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu::before{
    content:"";
    position:absolute;
    top:-7px;
    right:24px;

    width:14px;
    height:14px;

    background:inherit;
    border-top:1px solid rgba(148,163,184,.28);
    border-right:1px solid rgba(148,163,184,.28);

    transform:rotate(-45deg);
    border-radius:3px 0 0 0;

    pointer-events:none;
  }
}

@keyframes kh6756DropdownIn{
  from{
    opacity:0;
    transform:translateY(-7px) scale(.975);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

/* KashfHesab V67.56.1 — keep More Options dropdown inside mobile viewport */
@media (max-width:768px){

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-more-wrap{
    position:relative !important;
    min-width:0 !important;
  }

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu{
    /* الزر موجود قرب يسار الشاشة:
       ثبّت القائمة من اليسار كي تتمدد للداخل وليس خارج الصفحة */
    left:0 !important;
    right:auto !important;

    width:280px !important;
    max-width:calc(100vw - 24px) !important;

    box-sizing:border-box !important;
    overflow-x:hidden !important;
  }

  /* إبقاء جميع عناصر القائمة ضمن حدودها */
  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-option{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    min-width:0 !important;
  }

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-option-text{
    min-width:0 !important;
  }

  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-option-text b,
  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-option-text small{
    max-width:100% !important;
  }

  /* نقل سهم القائمة ليبقى مقابل زر خيارات أخرى */
  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu::before{
    left:28px !important;
    right:auto !important;
  }
}

@media (max-width:380px){
  .topbar-backrow:has(.kh6751-more-wrap) .kh6751-menu{
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
  }
}


/* KashfHesab V67.57.2 — Barcode hero inside mobile + sheet */
#kh541-sheet .kh541-grid .kh67572-barcode-hero{
  grid-column:1 / -1 !important;
  min-height:82px !important;
  position:relative !important;
  overflow:hidden !important;
  border:1px solid rgba(37,99,235,.20) !important;
  border-radius:20px !important;
  background:
    radial-gradient(circle at 12% 15%, rgba(255,255,255,.22), transparent 28%),
    linear-gradient(135deg, #0f3d91 0%, #1769d2 55%, #0ea5a8 100%) !important;
  box-shadow:0 12px 28px rgba(30,64,175,.20) !important;
  color:#fff !important;
}

#kh541-sheet .kh541-grid .kh67572-barcode-hero::after{
  content:"بيع سريع • افتح الكاميرا وامسح الأصناف";
  display:block;
  font-size:11px;
  line-height:1.4;
  font-weight:600;
  color:rgba(255,255,255,.82);
  margin-top:4px;
}

#kh541-sheet .kh541-grid .kh67572-barcode-hero:hover,
#kh541-sheet .kh541-grid .kh67572-barcode-hero:active{
  transform:translateY(-1px);
  box-shadow:0 15px 32px rgba(30,64,175,.26) !important;
}

#kh541-sheet .kh541-grid .kh67572-barcode-hero span,
#kh541-sheet .kh541-grid .kh67572-barcode-hero strong{
  color:#fff !important;
}

@media (max-width:480px){
  #kh541-sheet .kh541-grid .kh67572-barcode-hero{
    min-height:76px !important;
  }
}


/* KashfHesab V67.59 — Sticky mobile invoice actions */
@media (max-width:899px){

  #kh649-mobile-invoice .sheet{
    position:relative;
    padding-bottom:88px !important;
  }

  #kh649-mobile-invoice .kh6759-invoice-actions{
    position:sticky !important;
    left:0;
    right:0;
    bottom:0;
    z-index:80;
    display:grid !important;
    grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);
    gap:10px;
    width:100%;
    box-sizing:border-box;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    margin-top:14px;
    background:rgba(255,255,255,.96);
    border-top:1px solid rgba(148,163,184,.22);
    box-shadow:0 -10px 28px rgba(15,23,42,.10);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  #kh649-mobile-invoice .kh6759-invoice-actions .btn{
    width:100%;
    min-height:48px;
    margin:0;
    justify-content:center;
    border-radius:14px;
    font-weight:800;
  }

  #kh649-mobile-invoice .kh6759-save{
    box-shadow:0 7px 18px rgba(37,99,235,.18);
  }

  #kh649-mobile-invoice .kh6759-cancel{
    background:#fff;
  }
}

/* KashfHesab V67.59.1 — restore customer card + safe fixed invoice actions */
@media (max-width:899px){

  /* لا نغيّر بنية/تمرير الـsheet الأصلية */
  #kh649-mobile-invoice .sheet{
    padding-bottom:0 !important;
  }

  /* اترك مساحة داخل النموذج للشريط الثابت */
  #kh649-mobile-invoice form{
    padding-bottom:92px !important;
  }

  /* صندوق الزبون المختار يبقى ظاهراً بطبيعته أعلى الفاتورة */
  #kh649-mobile-invoice .kh65-customer-picker{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
  }

  #kh649-mobile-invoice .kh65-customer-selected:not([hidden]){
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
  }

  /* حفظ / إلغاء ثابتان في أسفل الشاشة */
  #kh649-mobile-invoice .kh6759-invoice-actions{
    position:fixed !important;
    right:0 !important;
    left:0 !important;
    bottom:0 !important;
    top:auto !important;

    z-index:10020 !important;

    display:grid !important;
    grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr) !important;
    gap:10px !important;

    width:100% !important;
    max-width:none !important;
    box-sizing:border-box !important;

    margin:0 !important;
    padding:
      10px
      max(14px, env(safe-area-inset-right))
      max(10px, env(safe-area-inset-bottom))
      max(14px, env(safe-area-inset-left)) !important;

    background:rgba(255,255,255,.97) !important;
    border-top:1px solid rgba(148,163,184,.24) !important;
    box-shadow:0 -8px 26px rgba(15,23,42,.12) !important;

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }

  #kh649-mobile-invoice .kh6759-invoice-actions .btn{
    width:100% !important;
    min-height:48px !important;
    margin:0 !important;
  }
}

/* =========================================================
   KashfHesab V67.60 — Premium Sales Invoice Customer Card
   ========================================================= */

#kh649-mobile-invoice .kh65-customer-picker{
  position:relative;
}

/* عنوان الزبون */
#kh649-mobile-invoice .kh65-customer-picker > label{
  display:block;
  margin:0 2px 7px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
}

/* البطاقة بعد اعتماد الزبون */
#kh649-mobile-invoice .kh65-customer-selected:not([hidden]){
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;

  min-height:66px;
  width:100%;
  box-sizing:border-box;

  margin:0 0 14px !important;
  padding:12px 14px !important;

  overflow:hidden;

  background:
    radial-gradient(circle at 92% 15%,
      rgba(37,99,235,.11) 0,
      rgba(37,99,235,0) 38%),
    linear-gradient(135deg,
      #ffffff 0%,
      #f8fbff 58%,
      #f1f7ff 100%) !important;

  border:1px solid rgba(59,130,246,.24) !important;
  border-radius:18px !important;

  box-shadow:
    0 10px 25px rgba(15,23,42,.08),
    0 3px 8px rgba(37,99,235,.07),
    inset 0 1px 0 rgba(255,255,255,.92) !important;
}

/* الشريط الجانبي المميز */
#kh649-mobile-invoice .kh65-customer-selected:not([hidden])::before{
  content:"";
  position:absolute;
  top:11px;
  bottom:11px;
  right:0;
  width:4px;

  border-radius:4px 0 0 4px;

  background:linear-gradient(
    180deg,
    #2563eb 0%,
    #0ea5e9 55%,
    #14b8a6 100%
  );

  box-shadow:0 0 12px rgba(37,99,235,.25);
}

/* أيقونة العميل */
#kh649-mobile-invoice .kh65-customer-selected:not([hidden])::after{
  content:"👤";
  display:grid;
  place-items:center;

  width:38px;
  height:38px;
  flex:0 0 38px;

  order:-1;

  border-radius:12px;

  background:linear-gradient(
    145deg,
    rgba(37,99,235,.12),
    rgba(14,165,233,.08)
  );

  border:1px solid rgba(59,130,246,.15);

  font-size:18px;
}

/* اسم الزبون */
#kh649-mobile-invoice [data-kh65-selected-name]{
  flex:1 1 auto;
  min-width:0;

  color:#0f2747 !important;

  font-size:15px !important;
  font-weight:900 !important;
  line-height:1.35;

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* زر تغيير */
#kh649-mobile-invoice [data-kh65-change-customer]{
  flex:0 0 auto;

  min-height:36px !important;
  padding:7px 13px !important;
  margin:0 !important;

  border-radius:11px !important;

  color:#1d4ed8 !important;
  background:rgba(255,255,255,.90) !important;

  border:1px solid rgba(37,99,235,.20) !important;

  box-shadow:
    0 3px 9px rgba(15,23,42,.05),
    inset 0 1px 0 rgba(255,255,255,.95) !important;

  font-size:12px !important;
  font-weight:800 !important;
}

#kh649-mobile-invoice [data-kh65-change-customer]:active{
  transform:scale(.97);
}

/* هواتف صغيرة */
@media (max-width:380px){

  #kh649-mobile-invoice .kh65-customer-selected:not([hidden]){
    min-height:62px;
    padding:10px 11px !important;
    gap:8px !important;
  }

  #kh649-mobile-invoice [data-kh65-selected-name]{
    font-size:14px !important;
  }

  #kh649-mobile-invoice [data-kh65-change-customer]{
    padding:6px 9px !important;
  }
}


/* =========================================================
   KashfHesab V67.61 — Invoice Number + Date Premium Cards
   ========================================================= */

#kh649-mobile-invoice .kh6761-invoice-meta{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:10px !important;
  width:100%;
  margin:2px 0 16px !important;
}

/* البطاقة الأساسية */
#kh649-mobile-invoice .kh6761-meta-card{
  position:relative;
  min-width:0;

  margin:0 !important;
  padding:11px 12px 12px !important;

  border-radius:17px !important;
  overflow:hidden;

  box-sizing:border-box;

  box-shadow:
    0 8px 20px rgba(15,23,42,.07),
    0 2px 6px rgba(15,23,42,.04),
    inset 0 1px 0 rgba(255,255,255,.95);
}

/* رقم الفاتورة — أزرق */
#kh649-mobile-invoice .kh6761-number-card{
  background:
    radial-gradient(circle at 92% 10%,
      rgba(37,99,235,.12),
      transparent 44%),
    linear-gradient(145deg,#ffffff 0%,#f2f7ff 100%) !important;

  border:1px solid rgba(37,99,235,.22) !important;
}

/* التاريخ — تركواز */
#kh649-mobile-invoice .kh6761-date-card{
  background:
    radial-gradient(circle at 92% 10%,
      rgba(13,148,136,.12),
      transparent 44%),
    linear-gradient(145deg,#ffffff 0%,#f0fdfa 100%) !important;

  border:1px solid rgba(13,148,136,.22) !important;
}

/* العناوين */
#kh649-mobile-invoice .kh6761-meta-card > label{
  display:flex !important;
  align-items:center;
  gap:6px;

  margin:0 0 7px !important;

  color:#64748b !important;
  font-size:11px !important;
  line-height:1.2;
  font-weight:800 !important;
}

/* الأيقونة */
#kh649-mobile-invoice .kh6761-meta-icon{
  display:inline-grid;
  place-items:center;

  width:22px;
  height:22px;
  flex:0 0 22px;

  border-radius:7px;

  font-size:12px;
  font-weight:900;
}

#kh649-mobile-invoice .kh6761-number-card .kh6761-meta-icon{
  color:#1d4ed8;
  background:rgba(37,99,235,.10);
}

#kh649-mobile-invoice .kh6761-date-card .kh6761-meta-icon{
  color:#0f766e;
  background:rgba(13,148,136,.10);
}

/* الحقول داخل البطاقات */
#kh649-mobile-invoice .kh6761-meta-card > input{
  width:100% !important;
  min-width:0 !important;
  height:38px !important;

  margin:0 !important;
  padding:6px 8px !important;

  border-radius:10px !important;

  background:rgba(255,255,255,.88) !important;
  border:1px solid rgba(148,163,184,.20) !important;

  box-shadow:
    inset 0 1px 3px rgba(15,23,42,.035) !important;

  color:#0f172a !important;

  font-size:13px !important;
  font-weight:850 !important;
  text-align:center;
}

/* رقم الفاتورة المعطل يبقى واضحاً */
#kh649-mobile-invoice .kh6761-number-card > input:disabled{
  opacity:1 !important;
  -webkit-text-fill-color:#1e3a5f !important;
  color:#1e3a5f !important;
  cursor:default;
}

/* التاريخ */
#kh649-mobile-invoice .kh6761-date-card > input{
  color:#115e59 !important;
}

/* شاشات الهاتف الصغيرة جداً:
   يبقى الاثنان في نفس السطر */
@media (max-width:380px){

  #kh649-mobile-invoice .kh6761-invoice-meta{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:7px !important;
  }

  #kh649-mobile-invoice .kh6761-meta-card{
    padding:9px 8px 10px !important;
    border-radius:14px !important;
  }

  #kh649-mobile-invoice .kh6761-meta-card > label{
    font-size:10px !important;
    gap:4px;
  }

  #kh649-mobile-invoice .kh6761-meta-card > input{
    padding:5px 4px !important;
    font-size:12px !important;
  }
}


/* =========================================================
   KashfHesab V67.62 — Premium Document Import Card
   ========================================================= */

#kh649-mobile-invoice .kh6762-document-card{
  position:relative;
  margin:0 0 16px !important;
  padding:14px !important;

  overflow:visible;

  border:1px solid rgba(124,58,237,.18) !important;
  border-radius:19px !important;

  background:
    radial-gradient(circle at 94% 8%,
      rgba(124,58,237,.11),
      transparent 40%),
    radial-gradient(circle at 5% 100%,
      rgba(14,165,233,.08),
      transparent 38%),
    linear-gradient(145deg,#fff 0%,#faf8ff 58%,#f7fbff 100%) !important;

  box-shadow:
    0 10px 26px rgba(15,23,42,.075),
    0 3px 9px rgba(124,58,237,.055),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
}

#kh649-mobile-invoice .kh6762-document-top{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

#kh649-mobile-invoice .kh6762-document-title{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}

#kh649-mobile-invoice .kh6762-document-icon{
  display:grid;
  place-items:center;

  width:38px;
  height:38px;
  flex:0 0 38px;

  border-radius:12px;

  background:linear-gradient(
    145deg,
    rgba(124,58,237,.14),
    rgba(59,130,246,.09)
  );

  border:1px solid rgba(124,58,237,.13);

  box-shadow:
    0 5px 13px rgba(124,58,237,.09);

  font-size:17px;
}

#kh649-mobile-invoice .kh6762-document-title > div{
  min-width:0;
}

#kh649-mobile-invoice .kh6762-document-title strong{
  display:block;

  color:#312e81;
  font-size:13px;
  font-weight:900;
  line-height:1.35;
}

#kh649-mobile-invoice .kh6762-document-title small{
  display:block;
  margin-top:2px;

  color:#7c8498;
  font-size:10px;
  font-weight:700;
  line-height:1.35;
}

/* زر خيارات */
#kh649-mobile-invoice .kh6762-options-wrap{
  position:relative;
  flex:0 0 auto;
}

#kh649-mobile-invoice .kh6762-options-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;

  min-height:38px;
  padding:7px 11px;

  cursor:pointer;

  border:1px solid rgba(124,58,237,.18);
  border-radius:11px;

  color:#5b21b6;
  background:rgba(255,255,255,.88);

  box-shadow:
    0 4px 12px rgba(15,23,42,.055),
    inset 0 1px 0 rgba(255,255,255,.95);

  font-family:inherit;
  font-size:11px;
  font-weight:850;
}

#kh649-mobile-invoice .kh6762-dots{
  font-size:15px;
  line-height:1;
  color:#7c3aed;
}

/* القائمة */
#kh649-mobile-invoice .kh6762-options-menu{
  position:absolute;
  top:calc(100% + 8px);
  left:0;

  z-index:150;

  width:235px;
  max-width:calc(100vw - 40px);

  padding:7px;

  border:1px solid rgba(148,163,184,.20);
  border-radius:15px;

  background:rgba(255,255,255,.98);

  box-shadow:
    0 18px 40px rgba(15,23,42,.16),
    0 5px 14px rgba(15,23,42,.08);

  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

#kh649-mobile-invoice .kh6762-options-menu[hidden]{
  display:none !important;
}

#kh649-mobile-invoice .kh6762-option{
  display:flex;
  align-items:center;
  gap:10px;

  width:100%;
  padding:10px;

  border:0;
  border-radius:11px;

  cursor:pointer;

  text-align:right;
  color:#0f172a;
  background:transparent;

  font-family:inherit;
}

#kh649-mobile-invoice .kh6762-option + .kh6762-option{
  margin-top:3px;
  border-top:1px solid #f1f5f9;
}

#kh649-mobile-invoice .kh6762-option:active{
  background:#f8fafc;
}

#kh649-mobile-invoice .kh6762-option > span{
  display:grid;
  place-items:center;

  width:34px;
  height:34px;
  flex:0 0 34px;

  border-radius:10px;

  background:#f5f3ff;

  font-size:16px;
}

#kh649-mobile-invoice .kh6762-option div{
  min-width:0;
}

#kh649-mobile-invoice .kh6762-option strong{
  display:block;

  font-size:12px;
  font-weight:850;
}

#kh649-mobile-invoice .kh6762-option small{
  display:block;
  margin-top:2px;

  color:#94a3b8;
  font-size:9px;
  font-weight:650;
}

/* حالة المصدر */
#kh649-mobile-invoice .kh6762-document-status{
  display:flex;
  align-items:center;
  gap:7px;

  margin-top:11px;
  padding-top:9px;

  border-top:1px dashed rgba(124,58,237,.13);

  color:#7c8498;

  font-size:10px;
  font-weight:700;
}

#kh649-mobile-invoice .kh6762-status-dot{
  width:7px;
  height:7px;
  flex:0 0 7px;

  border-radius:50%;

  background:#8b5cf6;

  box-shadow:0 0 0 4px rgba(139,92,246,.09);
}

/* زر الذكاء بعد اختيار المستند */
#kh649-mobile-invoice .kh6762-fetch-ai:not([hidden]){
  display:flex !important;
  align-items:center;
  justify-content:center;

  width:100% !important;
  min-height:43px;

  margin:11px 0 0 !important;

  border-radius:12px !important;

  background:linear-gradient(
    135deg,
    #7c3aed,
    #4f46e5
  ) !important;

  box-shadow:
    0 7px 18px rgba(79,70,229,.20) !important;

  font-weight:850 !important;
}

/* معاينة الملف */
#kh649-mobile-invoice .kh6762-preview:not(:empty){
  margin-top:10px;
}

/* الهواتف الصغيرة */
@media (max-width:380px){

  #kh649-mobile-invoice .kh6762-document-card{
    padding:11px !important;
  }

  #kh649-mobile-invoice .kh6762-document-title{
    gap:7px;
  }

  #kh649-mobile-invoice .kh6762-document-icon{
    width:34px;
    height:34px;
    flex-basis:34px;
  }

  #kh649-mobile-invoice .kh6762-document-title strong{
    font-size:12px;
  }

  #kh649-mobile-invoice .kh6762-options-btn{
    padding:7px 9px;
  }
}

/* =========================================================
   KashfHesab V67.64B.1 — Edit action inside success popup
   ========================================================= */
.kh6764-success-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  width:100%;
  margin-top:4px;
}

.kh6764-success-actions > *{
  min-width:0;
}

.kh6764-success-edit{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 16px;
  box-sizing:border-box;
  border-radius:12px;
  border:1px solid rgba(37,99,235,.20);
  background:linear-gradient(135deg,rgba(239,246,255,.98),rgba(219,234,254,.96));
  color:#1d4ed8;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 6px 18px rgba(37,99,235,.10);
  transition:transform .16s ease,box-shadow .16s ease;
}

.kh6764-success-edit:hover{
  transform:translateY(-1px);
  box-shadow:0 9px 22px rgba(37,99,235,.15);
}

.kh6764-success-edit[hidden]{
  display:none !important;
}

.kh6764-success-actions:has(.kh6764-success-edit[hidden]){
  grid-template-columns:1fr;
}

.kh6764-success-actions .kh6753-success-ok{
  width:100%;
  margin:0;
}

@media (max-width:520px){
  .kh6764-success-actions{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   KashfHesab V68.3D.1 premium financial account card
   Scoped only to receipt/payment financial-account selector.
   ========================================================= */

.kh683d-financial-account{
  position:relative;
  overflow:hidden;
  margin:16px 0 18px;
  padding:16px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:20px;
  background:
    radial-gradient(circle at 8% 0%,rgba(255,255,255,.94),transparent 34%),
    linear-gradient(145deg,#f8fafc,#eef2ff);
  box-shadow:
    0 12px 32px rgba(15,23,42,.08),
    0 2px 7px rgba(15,23,42,.04);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

.kh683d-financial-account::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:0;
  bottom:0;
  width:5px;
  border-radius:20px 0 0 20px;
  background:linear-gradient(180deg,#2563eb,#4f46e5);
}

.kh683d-financial-account--receipt{
  background:
    radial-gradient(circle at 8% 0%,rgba(255,255,255,.96),transparent 34%),
    linear-gradient(145deg,#f0fdf9,#ecfdf5);
  border-color:rgba(5,150,105,.15);
  box-shadow:
    0 12px 32px rgba(5,150,105,.09),
    0 2px 7px rgba(15,23,42,.04);
}

.kh683d-financial-account--receipt::before{
  background:linear-gradient(180deg,#10b981,#059669);
}

.kh683d-financial-account--payment{
  background:
    radial-gradient(circle at 8% 0%,rgba(255,255,255,.96),transparent 34%),
    linear-gradient(145deg,#eff6ff,#eef2ff);
  border-color:rgba(79,70,229,.15);
  box-shadow:
    0 12px 32px rgba(79,70,229,.09),
    0 2px 7px rgba(15,23,42,.04);
}

.kh683d-financial-account--payment::before{
  background:linear-gradient(180deg,#2563eb,#6366f1);
}

.kh683d-financial-account:hover{
  transform:translateY(-1px);
  box-shadow:
    0 16px 38px rgba(15,23,42,.11),
    0 3px 9px rgba(15,23,42,.05);
}

.kh683d-account-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:14px;
}

.kh683d-account-icon{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  font-size:22px;
  line-height:1;
  font-weight:900;
  background:#fff;
  color:#2563eb;
  border:1px solid rgba(37,99,235,.12);
  box-shadow:0 7px 18px rgba(37,99,235,.10);
}

.kh683d-financial-account--receipt .kh683d-account-icon{
  color:#047857;
  border-color:rgba(5,150,105,.14);
  box-shadow:0 7px 18px rgba(5,150,105,.11);
}

.kh683d-account-title{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.kh683d-account-title strong{
  color:#0f172a;
  font-size:15px;
  font-weight:900;
  line-height:1.35;
}

.kh683d-account-title span{
  color:#64748b;
  font-size:11.5px;
  font-weight:600;
  line-height:1.5;
}

.kh683d-account-badge{
  flex:0 0 auto;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(37,99,235,.09);
  border:1px solid rgba(37,99,235,.10);
  color:#1d4ed8;
  font-size:10.5px;
  font-weight:900;
  white-space:nowrap;
}

.kh683d-financial-account--receipt .kh683d-account-badge{
  background:rgba(5,150,105,.09);
  border-color:rgba(5,150,105,.11);
  color:#047857;
}

.kh683d-account-select-wrap{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 12px;
  border-radius:15px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(148,163,184,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    0 5px 16px rgba(15,23,42,.05);
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

.kh683d-account-select-wrap:focus-within{
  background:#fff;
  border-color:rgba(37,99,235,.38);
  box-shadow:
    0 0 0 4px rgba(37,99,235,.08),
    0 8px 20px rgba(37,99,235,.08);
}

.kh683d-financial-account--receipt
.kh683d-account-select-wrap:focus-within{
  border-color:rgba(5,150,105,.40);
  box-shadow:
    0 0 0 4px rgba(5,150,105,.08),
    0 8px 20px rgba(5,150,105,.08);
}

.kh683d-account-wallet{
  flex:0 0 40px;
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#f8fafc;
  font-size:20px;
  box-shadow:inset 0 0 0 1px rgba(148,163,184,.14);
}

.kh683d-account-select-content{
  min-width:0;
  flex:1;
}

.kh683d-account-select-label{
  display:block;
  margin:0 2px 4px;
  color:#64748b;
  font-size:10.5px;
  font-weight:800;
}

.kh683d-financial-account
.kh683d-account-select-content select{
  width:100%;
  min-height:36px;
  margin:0;
  padding:3px 2px;
  border:0;
  outline:0;
  box-shadow:none;
  background:transparent;
  color:#0f172a;
  font-size:14px;
  font-weight:850;
  cursor:pointer;
}

.kh683d-financial-account
.kh683d-account-select-content select:focus{
  border:0;
  outline:0;
  box-shadow:none;
}

.kh683d-account-foot{
  position:relative;
  z-index:1;
  display:flex;
  align-items:flex-start;
  gap:7px;
  margin-top:11px;
  padding-inline:3px;
  color:#64748b;
  font-size:11px;
  font-weight:600;
  line-height:1.65;
}

.kh683d-account-info{
  flex:0 0 18px;
  width:18px;
  height:18px;
  margin-top:1px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(37,99,235,.09);
  color:#2563eb;
  font-family:Arial,sans-serif;
  font-size:11px;
  font-weight:900;
}

.kh683d-financial-account--receipt .kh683d-account-info{
  background:rgba(5,150,105,.10);
  color:#047857;
}

@media (max-width:520px){
  .kh683d-financial-account{
    margin:14px 0 16px;
    padding:13px;
    border-radius:17px;
  }

  .kh683d-account-head{
    gap:9px;
    margin-bottom:12px;
  }

  .kh683d-account-icon{
    flex-basis:38px;
    width:38px;
    height:38px;
    border-radius:12px;
    font-size:20px;
  }

  .kh683d-account-title strong{
    font-size:14px;
  }

  .kh683d-account-title span{
    font-size:10.5px;
  }

  .kh683d-account-badge{
    padding:5px 7px;
    font-size:9.5px;
  }

  .kh683d-account-select-wrap{
    gap:9px;
    padding:9px 10px;
    border-radius:13px;
  }

  .kh683d-account-wallet{
    flex-basis:36px;
    width:36px;
    height:36px;
    font-size:18px;
  }

  .kh683d-financial-account
  .kh683d-account-select-content select{
    min-height:34px;
    font-size:13px;
  }

  .kh683d-account-foot{
    font-size:10.5px;
  }
}


/* =========================================================
   KashfHesab V68.3D.2 premium document meta cards
   Receipt / Payment only
   ========================================================= */

.kh683d2-document-meta{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:12px !important;
  margin:2px 0 6px;
  align-items:stretch;
}

.kh683d2-meta-card{
  position:relative;
  min-width:0;
  margin:0 !important;
  padding:13px 14px 12px;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(37,99,235,.14);
  background:
    radial-gradient(
      circle at 10% 0%,
      rgba(255,255,255,.98),
      transparent 42%
    ),
    linear-gradient(145deg,#f8fbff,#edf4ff);
  box-shadow:
    0 9px 24px rgba(37,99,235,.08),
    0 2px 6px rgba(15,23,42,.04);
  transition:
    transform .17s ease,
    box-shadow .17s ease;
}

.kh683d2-meta-card::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,#2563eb,#4f46e5);
}

.kh683d2-meta-card--date{
  border-color:rgba(124,58,237,.14);
  background:
    radial-gradient(
      circle at 10% 0%,
      rgba(255,255,255,.98),
      transparent 42%
    ),
    linear-gradient(145deg,#fbf9ff,#f2efff);
}

.kh683d2-meta-card--date::before{
  background:linear-gradient(180deg,#8b5cf6,#6366f1);
}

.kh683d2-document-meta--receipt
.kh683d2-meta-card--number{
  border-color:rgba(5,150,105,.15);
  background:
    radial-gradient(
      circle at 10% 0%,
      rgba(255,255,255,.98),
      transparent 42%
    ),
    linear-gradient(145deg,#f3fcf9,#eafbf3);
}

.kh683d2-document-meta--receipt
.kh683d2-meta-card--number::before{
  background:linear-gradient(180deg,#10b981,#059669);
}

.kh683d2-meta-card:hover{
  transform:translateY(-1px);
  box-shadow:
    0 13px 29px rgba(15,23,42,.10),
    0 3px 7px rgba(15,23,42,.04);
}

.kh683d2-meta-head{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:9px;
}

.kh683d2-meta-icon{
  flex:0 0 34px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(37,99,235,.12);
  color:#2563eb;
  font-size:16px;
  font-weight:900;
  line-height:1;
  box-shadow:0 5px 14px rgba(37,99,235,.08);
}

.kh683d2-meta-card--date
.kh683d2-meta-icon{
  color:#6d28d9;
  border-color:rgba(124,58,237,.13);
}

.kh683d2-document-meta--receipt
.kh683d2-meta-card--number
.kh683d2-meta-icon{
  color:#047857;
  border-color:rgba(5,150,105,.14);
}

.kh683d2-meta-title{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:1px;
}

.kh683d2-meta-title strong{
  color:#0f172a;
  font-size:13px;
  font-weight:900;
  line-height:1.35;
}

.kh683d2-meta-title span{
  color:#64748b;
  font-size:10px;
  font-weight:650;
  line-height:1.4;
}

.kh683d2-meta-card > input{
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  min-width:0;
  height:42px;
  margin:0 !important;
  padding:0 10px !important;
  box-sizing:border-box;
  border:1px solid rgba(148,163,184,.24) !important;
  border-radius:12px !important;
  outline:0;
  background:rgba(255,255,255,.94) !important;
  color:#0f172a !important;
  font-size:14px;
  font-weight:850;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.8),
    0 3px 10px rgba(15,23,42,.035) !important;
}

.kh683d2-meta-card > input:focus{
  background:#fff !important;
  border-color:rgba(37,99,235,.40) !important;
  box-shadow:
    0 0 0 4px rgba(37,99,235,.07),
    0 5px 14px rgba(37,99,235,.06) !important;
}

.kh683d2-meta-card--date > input:focus{
  border-color:rgba(124,58,237,.40) !important;
  box-shadow:
    0 0 0 4px rgba(124,58,237,.07),
    0 5px 14px rgba(124,58,237,.06) !important;
}

/* Mobile: number and date stay in one row. */
@media (max-width:520px){

  .kh683d2-document-meta{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:8px !important;
  }

  .kh683d2-meta-card{
    padding:10px 9px 9px;
    border-radius:15px;
  }

  .kh683d2-meta-head{
    gap:6px;
    margin-bottom:7px;
  }

  .kh683d2-meta-icon{
    flex-basis:29px;
    width:29px;
    height:29px;
    border-radius:9px;
    font-size:14px;
  }

  .kh683d2-meta-title strong{
    font-size:11.5px;
  }

  .kh683d2-meta-title span{
    font-size:8.5px;
  }

  .kh683d2-meta-card > input{
    height:38px;
    padding:0 7px !important;
    border-radius:10px !important;
    font-size:12px;
  }
}

@media (max-width:370px){

  .kh683d2-document-meta{
    gap:6px !important;
  }

  .kh683d2-meta-card{
    padding:8px 7px;
  }

  .kh683d2-meta-icon{
    flex-basis:26px;
    width:26px;
    height:26px;
  }

  .kh683d2-meta-title span{
    display:none;
  }

  .kh683d2-meta-card > input{
    height:36px;
    font-size:11px;
  }
}


/* =========================================================
   KashfHesab V68.3D.3A premium voucher attachments
   ========================================================= */

.kh683d3-attachments{
  margin:10px 0 12px !important;
}

.kh683d3-attachments-main{
  position:relative;
  width:100%;
  min-height:72px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 15px;
  border:1px solid rgba(37,99,235,.15);
  border-radius:18px;
  cursor:pointer;
  text-align:right;
  color:#0f172a;
  background:
    linear-gradient(
      145deg,
      #f8fbff,
      #edf4ff
    );
  box-shadow:
    0 9px 24px rgba(37,99,235,.08),
    0 2px 6px rgba(15,23,42,.04);
  transition:.17s ease;
}

.kh683d3-attachments-main::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:0;
  bottom:0;
  width:4px;
  background:
    linear-gradient(
      180deg,
      #2563eb,
      #4f46e5
    );
}

.kh683d3-attachments-main:hover{
  transform:translateY(-1px);
  box-shadow:
    0 13px 29px rgba(37,99,235,.11);
}

.kh683d3-main-icon{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#fff;
  font-size:20px;
  box-shadow:
    0 5px 14px rgba(37,99,235,.09);
}

.kh683d3-main-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.kh683d3-main-copy strong{
  color:#0f172a;
  font-size:14px;
  font-weight:900;
}

.kh683d3-main-copy small{
  color:#64748b;
  font-size:10.5px;
  font-weight:650;
}

.kh683d3-main-arrow{
  flex:0 0 30px;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:rgba(255,255,255,.82);
  color:#475569;
  font-size:19px;
  font-weight:900;
  transition:transform .18s ease;
}

.kh683d3-attachments.is-open
.kh683d3-main-arrow{
  transform:rotate(180deg);
}

.kh683d3-panel{
  margin-top:9px;
  padding:12px;
  border:1px solid rgba(148,163,184,.17);
  border-radius:18px;
  background:#fff;
  box-shadow:
    0 12px 30px rgba(15,23,42,.07);
}

.kh683d3-actions{
  display:grid;
  grid-template-columns:
    minmax(0,1fr)
    minmax(0,1fr);
  gap:10px;
}

.kh683d3-action{
  min-width:0;
  min-height:88px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  border-radius:16px;
  cursor:pointer;
  text-align:right;
  transition:.16s ease;
}

.kh683d3-action--camera{
  border:
    1px solid rgba(5,150,105,.16);
  background:
    linear-gradient(
      145deg,
      #f3fcf9,
      #e9fbf3
    );
}

.kh683d3-action--file{
  border:
    1px solid rgba(124,58,237,.16);
  background:
    linear-gradient(
      145deg,
      #fbf9ff,
      #f1eeff
    );
}

.kh683d3-action:hover{
  transform:translateY(-1px);
  box-shadow:
    0 11px 24px rgba(15,23,42,.09);
}

.kh683d3-action-icon{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#fff;
  font-size:20px;
  box-shadow:
    0 4px 12px rgba(15,23,42,.06);
}

.kh683d3-action-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.kh683d3-action-copy strong{
  color:#0f172a;
  font-size:13px;
  font-weight:900;
}

.kh683d3-action-copy small{
  color:#64748b;
  font-size:9.5px;
  line-height:1.45;
  font-weight:650;
}

.kh683d3-selected{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 11px;
  border:
    1px solid rgba(37,99,235,.13);
  border-radius:14px;
  background:#f8fbff;
}

.kh683d3-selected[hidden]{
  display:none !important;
}

.kh683d3-selected-icon{
  flex:0 0 36px;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#fff;
}

.kh683d3-selected-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.kh683d3-selected-copy strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#0f172a;
  font-size:11px;
  font-weight:850;
}

.kh683d3-selected-copy small{
  color:#64748b;
  font-size:9px;
}

.kh683d3-remove{
  flex:0 0 30px;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:9px;
  cursor:pointer;
  background:#fee2e2;
  color:#b91c1c;
  font-size:19px;
}

.kh683d3-hint{
  margin:10px 2px 0;
  color:#64748b;
  font-size:9.5px;
  line-height:1.6;
  font-weight:600;
}

@media(max-width:520px){

  .kh683d3-attachments-main{
    min-height:64px;
    padding:10px 11px;
    border-radius:16px;
  }

  .kh683d3-main-icon{
    flex-basis:36px;
    width:36px;
    height:36px;
    font-size:17px;
  }

  .kh683d3-main-copy strong{
    font-size:12px;
  }

  .kh683d3-main-copy small{
    font-size:9px;
  }

  .kh683d3-panel{
    padding:9px;
    border-radius:15px;
  }

  .kh683d3-actions{
    gap:7px;
  }

  .kh683d3-action{
    min-height:76px;
    padding:8px;
    gap:7px;
    border-radius:13px;
  }

  .kh683d3-action-icon{
    flex-basis:34px;
    width:34px;
    height:34px;
    font-size:16px;
  }

  .kh683d3-action-copy strong{
    font-size:10.5px;
  }

  .kh683d3-action-copy small{
    font-size:8px;
  }
}


/* ============================================================
   KashfHesab V68.3D.5
   Premium Receipt / Payment Edit Cards
   ============================================================ */

.kh683d5-voucher-edit{
  --kh-card-radius:22px;
  --kh-card-border:#e7ebf2;
  --kh-card-shadow:
    0 12px 32px rgba(15,23,42,.065),
    0 2px 8px rgba(15,23,42,.035);

  display:flex;
  flex-direction:column;
  gap:15px;
}

/* ---------- Shared premium section ---------- */

.kh683d5-voucher-edit .kh683d5-section{
  position:relative;
  margin:0;
  padding:18px;
  border:1px solid var(--kh-card-border);
  border-radius:var(--kh-card-radius);
  background:#fff;
  box-shadow:var(--kh-card-shadow);
  overflow:hidden;
  isolation:isolate;
}

.kh683d5-voucher-edit .kh683d5-section::before{
  content:"";
  position:absolute;
  inset-block:0;
  inset-inline-start:0;
  width:5px;
  border-radius:5px;
  background:#2563eb;
}

.kh683d5-voucher-edit .kh683d5-section::after{
  content:"";
  position:absolute;
  width:125px;
  height:125px;
  border-radius:50%;
  inset-inline-end:-58px;
  inset-block-start:-65px;
  background:rgba(37,99,235,.045);
  z-index:-1;
}

.kh683d5-section-head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:15px;
}

.kh683d5-section-head > div{
  min-width:0;
  flex:1;
}

.kh683d5-section-head strong{
  display:block;
  margin:0 0 3px;
  color:#172033;
  font-size:15px;
  font-weight:800;
  line-height:1.45;
}

.kh683d5-section-head small{
  display:block;
  color:#7b8495;
  font-size:12px;
  line-height:1.55;
}

.kh683d5-section-icon{
  width:43px;
  height:43px;
  flex:0 0 43px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:#eff6ff;
  box-shadow:
    inset 0 0 0 1px rgba(37,99,235,.08),
    0 5px 12px rgba(37,99,235,.08);
  font-size:21px;
}

/* ---------- Premium inputs ---------- */

.kh683d5-voucher-edit .field{
  margin-bottom:0;
}

.kh683d5-voucher-edit .field > label{
  display:block;
  margin-bottom:8px;
  color:#4b5565;
  font-size:13px;
  font-weight:700;
}

.kh683d5-voucher-edit input[type="text"],
.kh683d5-voucher-edit input[type="number"],
.kh683d5-voucher-edit input[type="date"],
.kh683d5-voucher-edit select,
.kh683d5-voucher-edit textarea{
  width:100%;
  min-height:52px;
  border:1px solid #dce2eb;
  border-radius:15px;
  background:#fff;
  box-shadow:
    0 1px 2px rgba(15,23,42,.02),
    inset 0 1px 1px rgba(15,23,42,.015);
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.kh683d5-voucher-edit textarea{
  min-height:105px;
  resize:vertical;
}

.kh683d5-voucher-edit input:focus,
.kh683d5-voucher-edit select:focus,
.kh683d5-voucher-edit textarea:focus{
  outline:none;
  border-color:#75a7f8;
  box-shadow:
    0 0 0 4px rgba(37,99,235,.09),
    0 6px 16px rgba(37,99,235,.06);
}

/* ============================================================
   DATE — violet
   ============================================================ */

.kh683d5-section-date{
  background:
    linear-gradient(135deg,#fff 0%,#fbfaff 100%) !important;
}

.kh683d5-section-date::before{
  background:#7c3aed !important;
}

.kh683d5-section-date::after{
  background:rgba(124,58,237,.055) !important;
}

.kh683d5-section-date .kh683d5-section-icon{
  background:#f3e8ff;
  color:#7c3aed;
  box-shadow:
    inset 0 0 0 1px rgba(124,58,237,.08),
    0 5px 12px rgba(124,58,237,.10);
}

/* ============================================================
   CUSTOMER — blue
   ============================================================ */

.kh683d5-section-customer{
  background:
    linear-gradient(135deg,#fff 0%,#f7fbff 100%) !important;
}

.kh683d5-section-customer::before{
  background:#1684e8 !important;
}

.kh683d5-section-customer::after{
  background:rgba(22,132,232,.06) !important;
}

.kh683d5-section-customer .kh683d4-edit-customer-card{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}

.kh683d5-section-customer .kh683d4-edit-customer-info{
  gap:12px;
}

.kh683d5-section-customer .kh683d4-edit-customer-icon{
  width:46px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 46px;
  border-radius:15px;
  background:#eaf5ff;
  box-shadow:inset 0 0 0 1px rgba(22,132,232,.08);
  font-size:22px;
}

.kh683d5-section-customer #kh683d4b-edit-customer-name{
  display:block;
  color:#142033;
  font-size:17px;
  font-weight:850;
}

.kh683d5-section-customer [data-kh683d4b-edit-reassign]{
  border-radius:12px;
  background:#eef7ff;
  border-color:#cfe8ff;
  color:#1769aa;
  font-weight:750;
}

/* ============================================================
   FINANCIAL ACCOUNT — green
   ============================================================ */

.kh683d5-section-financial{
  background:
    linear-gradient(135deg,#fff 0%,#f6fdf9 100%) !important;
}

.kh683d5-section-financial::before{
  background:#16a36a !important;
}

.kh683d5-section-financial::after{
  background:rgba(22,163,106,.06) !important;
}

.kh683d5-section-financial .kh683d5-section-icon{
  background:#e9f9f0;
  color:#128454;
  box-shadow:
    inset 0 0 0 1px rgba(22,163,106,.09),
    0 5px 12px rgba(22,163,106,.10);
}

.kh683d5-section-financial .kh683d4-financial-card{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}

.kh683d5-section-financial select{
  border-color:#cfe8db;
  background:#fff;
}

.kh683d5-section-financial .hint{
  margin:9px 2px 0;
  color:#718079;
  line-height:1.65;
}

/* ============================================================
   AMOUNT — amber
   ============================================================ */

.kh683d5-section-amount{
  background:
    linear-gradient(135deg,#fff 0%,#fffcf5 100%) !important;
}

.kh683d5-section-amount::before{
  background:#e99a12 !important;
}

.kh683d5-section-amount::after{
  background:rgba(233,154,18,.065) !important;
}

.kh683d5-section-amount .kh683d5-section-icon{
  background:#fff4d9;
  color:#c77c00;
  box-shadow:
    inset 0 0 0 1px rgba(233,154,18,.10),
    0 5px 12px rgba(233,154,18,.10);
}

.kh683d5-amount-wrap{
  position:relative;
}

.kh683d5-amount-wrap input{
  min-height:60px !important;
  padding-inline-end:58px !important;
  border-color:#f0dfb9 !important;
  font-size:21px !important;
  font-weight:850;
  letter-spacing:.3px;
}

.kh683d5-amount-wrap > span{
  position:absolute;
  inset-inline-end:15px;
  top:50%;
  transform:translateY(-50%);
  padding:4px 7px;
  border-radius:8px;
  background:#fff5dc;
  color:#9d680d;
  font-size:12px;
  font-weight:800;
  pointer-events:none;
}

/* ============================================================
   METHOD — cyan / blue
   ============================================================ */

.kh683d5-section-method{
  background:
    linear-gradient(135deg,#fff 0%,#f7fcff 100%) !important;
}

.kh683d5-section-method::before{
  background:#0b94c8 !important;
}

.kh683d5-section-method::after{
  background:rgba(11,148,200,.055) !important;
}

.kh683d5-section-method .kh683d5-section-icon{
  background:#e7f8fd;
  color:#087fae;
  box-shadow:
    inset 0 0 0 1px rgba(11,148,200,.09),
    0 5px 12px rgba(11,148,200,.09);
}

.kh683d5-section-method [data-check-fields="edit"]{
  margin-top:13px;
  padding:14px;
  border:1px dashed #bcddea;
  border-radius:16px;
  background:rgba(255,255,255,.72);
}

.kh683d5-section-method [data-check-fields="edit"][hidden]{
  display:none !important;
}

/* ============================================================
   ATTACHMENTS — purple
   ============================================================ */

.kh683d5-section-attachments{
  background:
    linear-gradient(135deg,#fff 0%,#fcf9ff 100%) !important;
}

.kh683d5-section-attachments::before{
  background:#8b5cf6 !important;
}

.kh683d5-section-attachments::after{
  background:rgba(139,92,246,.055) !important;
}

.kh683d5-section-attachments .kh683d4-attachment-card{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}

.kh683d5-section-attachments .kh683d4-attachment-head{
  margin-bottom:14px;
}

.kh683d5-section-attachments .kh683d4-attachment-icon{
  background:#f2ebff;
  box-shadow:inset 0 0 0 1px rgba(139,92,246,.10);
}

.kh683d5-section-attachments .kh683d4-current-file,
.kh683d5-section-attachments .kh683d4-no-file{
  border-radius:14px;
  background:rgba(255,255,255,.78);
}

.kh683d5-section-attachments .kh683d4-attachment-toggle{
  border-radius:13px;
  font-weight:800;
}

.kh683d5-section-attachments .kh683d4-attachment-options{
  gap:10px;
}

.kh683d5-section-attachments .kh683d4-attachment-option{
  border-radius:16px;
  min-height:105px;
  box-shadow:0 5px 14px rgba(15,23,42,.04);
}

/* ============================================================
   NOTE — slate
   ============================================================ */

.kh683d5-section-note{
  background:
    linear-gradient(135deg,#fff 0%,#fafbfc 100%) !important;
}

.kh683d5-section-note::before{
  background:#64748b !important;
}

.kh683d5-section-note::after{
  background:rgba(100,116,139,.055) !important;
}

.kh683d5-section-note .kh683d5-section-icon{
  background:#edf1f5;
  color:#526174;
  box-shadow:
    inset 0 0 0 1px rgba(100,116,139,.08),
    0 5px 12px rgba(100,116,139,.08);
}

/* ============================================================
   SAVE / CANCEL
   ============================================================ */

.kh683d5-actions{
  position:sticky;
  bottom:10px;
  z-index:12;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.8fr);
  gap:10px;
  margin-top:3px;
  padding:10px;
  border:1px solid rgba(220,226,235,.92);
  border-radius:19px;
  background:rgba(255,255,255,.94);
  box-shadow:
    0 12px 32px rgba(15,23,42,.13),
    0 3px 9px rgba(15,23,42,.05);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.kh683d5-actions .btn{
  min-height:51px;
  border-radius:14px;
  justify-content:center;
  font-weight:800;
}

.kh683d5-save{
  background:
    linear-gradient(135deg,#146ee8 0%,#2457d6 100%) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(37,99,235,.22);
}

.kh683d5-cancel{
  background:#f5f7fa !important;
  border-color:#e2e7ee !important;
  color:#5b6472 !important;
}

/* ============================================================
   Mobile
   ============================================================ */

@media (max-width:640px){

  .kh683d5-voucher-edit{
    gap:13px;
  }

  .kh683d5-voucher-edit .kh683d5-section{
    padding:16px;
    border-radius:20px;
    box-shadow:
      0 8px 22px rgba(15,23,42,.055),
      0 2px 6px rgba(15,23,42,.025);
  }

  .kh683d5-section-head{
    margin-bottom:13px;
  }

  .kh683d5-section-icon{
    width:40px;
    height:40px;
    flex-basis:40px;
    border-radius:13px;
    font-size:19px;
  }

  .kh683d5-section-head strong{
    font-size:14.5px;
  }

  .kh683d5-section-head small{
    font-size:11.5px;
  }

  .kh683d5-voucher-edit input[type="text"],
  .kh683d5-voucher-edit input[type="number"],
  .kh683d5-voucher-edit input[type="date"],
  .kh683d5-voucher-edit select{
    min-height:50px;
    border-radius:14px;
  }

  .kh683d5-section-customer .kh683d4-edit-customer-card{
    align-items:flex-start;
    gap:12px;
  }

  .kh683d5-section-customer [data-kh683d4b-edit-reassign]{
    white-space:nowrap;
  }

  .kh683d5-amount-wrap input{
    min-height:57px !important;
    font-size:20px !important;
  }

  .kh683d5-actions{
    bottom:7px;
    padding:8px;
    border-radius:17px;
  }

  .kh683d5-actions .btn{
    min-height:48px;
  }
}

/* ============================================================
   Very small phones
   ============================================================ */

@media (max-width:380px){

  .kh683d5-voucher-edit .kh683d5-section{
    padding:14px;
  }

  .kh683d5-section-customer .kh683d4-edit-customer-card{
    display:block;
  }

  .kh683d5-section-customer [data-kh683d4b-edit-reassign]{
    width:100%;
    margin-top:12px;
    justify-content:center;
  }

  .kh683d5-actions{
    grid-template-columns:1fr;
  }

  .kh683d5-save{
    order:-1;
  }
}

/* ============================================================
   KashfHesab V68.3D.5.1
   Fix amount / currency overlap
   ============================================================ */

.kh683d5-amount-wrap{
  position:relative;
  display:block;
}

/* الرقم يبقى بعيداً تماماً عن شارة العملة */
.kh683d5-amount-wrap input[type="number"]{
  width:100%;
  padding-inline-start:18px !important;
  padding-inline-end:82px !important;
  text-align:start;
  box-sizing:border-box;
}

/* شارة العملة مستقلة ولا تدخل فوق الرقم */
.kh683d5-amount-wrap > span{
  position:absolute;
  inset-inline-end:12px;
  top:50%;
  transform:translateY(-50%);
  min-width:48px;
  max-width:64px;
  height:34px;
  padding:0 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:#fff3d3;
  border:1px solid rgba(233,154,18,.16);
  color:#98620b;
  font-size:12px;
  font-weight:850;
  line-height:1;
  white-space:nowrap;
  pointer-events:none;
  z-index:2;
  box-shadow:0 2px 6px rgba(233,154,18,.08);
}

@media (max-width:640px){
  .kh683d5-amount-wrap input[type="number"]{
    padding-inline-end:78px !important;
    font-size:20px !important;
  }

  .kh683d5-amount-wrap > span{
    inset-inline-end:10px;
    min-width:45px;
    max-width:60px;
  }
}

/* ============================================================
   KashfHesab V68.3D.5.2
   Final amount field layout
   Currency isolated from numeric value
   ============================================================ */

.kh683d5-section-amount .kh683d5-amount-wrap{
  position:relative;
  width:100%;
}

/* الرقم */
.kh683d5-section-amount
.kh683d5-amount-wrap input[type="number"]{
  width:100% !important;
  min-height:60px !important;

  /* العملة موجودة فعلياً على اليسار */
  padding-left:88px !important;
  padding-right:18px !important;

  direction:ltr !important;
  text-align:right !important;

  box-sizing:border-box !important;
  font-size:21px !important;
  font-weight:850 !important;
  line-height:1.2 !important;
  font-variant-numeric:tabular-nums;
}

/* شارة العملة */
.kh683d5-section-amount
.kh683d5-amount-wrap > span{
  position:absolute !important;

  left:12px !important;
  right:auto !important;
  inset-inline-start:auto !important;
  inset-inline-end:auto !important;

  top:50% !important;
  transform:translateY(-50%) !important;

  width:58px !important;
  min-width:58px !important;
  max-width:58px !important;
  height:36px !important;

  padding:0 6px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  box-sizing:border-box !important;

  border:1px solid rgba(233,154,18,.18) !important;
  border-radius:11px !important;

  background:#fff3d3 !important;
  color:#96610b !important;

  font-size:13px !important;
  font-weight:850 !important;
  line-height:1 !important;

  white-space:nowrap !important;
  pointer-events:none !important;
  z-index:3 !important;

  box-shadow:0 2px 7px rgba(233,154,18,.09) !important;
}

/* فاصل خفيف بين العملة والرقم */
.kh683d5-section-amount
.kh683d5-amount-wrap::after{
  content:"";
  position:absolute;
  left:80px;
  top:14px;
  bottom:14px;
  width:1px;
  background:#f0dfb9;
  pointer-events:none;
}

/* الهاتف */
@media (max-width:640px){

  .kh683d5-section-amount
  .kh683d5-amount-wrap input[type="number"]{
    min-height:58px !important;
    padding-left:82px !important;
    padding-right:16px !important;
    font-size:20px !important;
  }

  .kh683d5-section-amount
  .kh683d5-amount-wrap > span{
    left:10px !important;
    width:54px !important;
    min-width:54px !important;
    max-width:54px !important;
    height:34px !important;
  }

  .kh683d5-section-amount
  .kh683d5-amount-wrap::after{
    left:73px;
    top:13px;
    bottom:13px;
  }
}

/* =========================================================
   KashfHesab V68.5 — Sales Invoice Premium Item Rows
   Scope: mobile sales invoice only
   ========================================================= */

#kh649-mobile-invoice .items.items-wide-name{
  width:100%;
  border-collapse:separate;
  border-spacing:0 6px;
  table-layout:fixed;
}

/* Keep quantity / price / total exactly at their current widths */
#kh649-mobile-invoice .items.items-wide-name th:nth-child(2),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(2){
  width:48px !important;
  min-width:48px !important;
  max-width:48px !important;
}

#kh649-mobile-invoice .items.items-wide-name th:nth-child(3),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(3){
  width:70px !important;
  min-width:70px !important;
  max-width:70px !important;
}

#kh649-mobile-invoice .items.items-wide-name th:nth-child(4),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(4){
  width:70px !important;
  min-width:70px !important;
  max-width:70px !important;
}

/* Delete column: minimum practical footprint */
#kh649-mobile-invoice .items.items-wide-name th:nth-child(5),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(5){
  width:26px !important;
  min-width:26px !important;
  max-width:26px !important;
  padding-left:1px !important;
  padding-right:1px !important;
}

/* Give all recovered space to product name */
#kh649-mobile-invoice .items.items-wide-name th:first-child,
#kh649-mobile-invoice .items.items-wide-name td:first-child{
  width:auto !important;
}

/* Individual, clearly separated product rows */
#kh649-mobile-invoice .items.items-wide-name tbody td{
  background:#eef2f6;
  border-top:1px solid #d9e1ea;
  border-bottom:1px solid #d9e1ea;
  padding-top:7px;
  padding-bottom:7px;
}

#kh649-mobile-invoice .items.items-wide-name tbody tr:nth-child(even) td{
  background:#e7edf3;
}

#kh649-mobile-invoice .items.items-wide-name tbody td:first-child{
  border-right:1px solid #d9e1ea;
  border-radius:0 9px 9px 0;
}

#kh649-mobile-invoice .items.items-wide-name tbody td:last-child{
  border-left:1px solid #d9e1ea;
  border-radius:9px 0 0 9px;
}

/* Product-name field gets the useful space */
#kh649-mobile-invoice .items.items-wide-name tbody td:first-child input,
#kh649-mobile-invoice .items.items-wide-name tbody td:first-child select{
  width:100% !important;
  min-width:0 !important;
}

/* Tiny delete control — do not consume product-name space */
#kh649-mobile-invoice .items.items-wide-name tbody td:last-child button{
  width:24px !important;
  min-width:24px !important;
  max-width:24px !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 !important;
  margin:0 !important;
  border-radius:7px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:0 !important;
  line-height:1 !important;
}

/* Replace visual X with trash icon without changing delete behavior */
#kh649-mobile-invoice .items.items-wide-name tbody td:last-child button::before{
  content:"🗑";
  font-size:14px;
  line-height:1;
}


/* =========================================================
   KashfHesab V68.5 — Sales Invoice Premium Item Rows
   Scope: mobile sales invoice only
   ========================================================= */

#kh649-mobile-invoice .items.items-wide-name{
  width:100%;
  border-collapse:separate;
  border-spacing:0 6px;
  table-layout:fixed;
}

/* Keep quantity / price / total exactly at their current widths */
#kh649-mobile-invoice .items.items-wide-name th:nth-child(2),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(2){
  width:48px !important;
  min-width:48px !important;
  max-width:48px !important;
}

#kh649-mobile-invoice .items.items-wide-name th:nth-child(3),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(3){
  width:70px !important;
  min-width:70px !important;
  max-width:70px !important;
}

#kh649-mobile-invoice .items.items-wide-name th:nth-child(4),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(4){
  width:70px !important;
  min-width:70px !important;
  max-width:70px !important;
}

/* Delete column: minimum practical footprint */
#kh649-mobile-invoice .items.items-wide-name th:nth-child(5),
#kh649-mobile-invoice .items.items-wide-name td:nth-child(5){
  width:26px !important;
  min-width:26px !important;
  max-width:26px !important;
  padding-left:1px !important;
  padding-right:1px !important;
}

/* Give all recovered space to product name */
#kh649-mobile-invoice .items.items-wide-name th:first-child,
#kh649-mobile-invoice .items.items-wide-name td:first-child{
  width:auto !important;
}

/* Individual, clearly separated product rows */
#kh649-mobile-invoice .items.items-wide-name tbody td{
  background:#eef2f6;
  border-top:1px solid #d9e1ea;
  border-bottom:1px solid #d9e1ea;
  padding-top:7px;
  padding-bottom:7px;
}

#kh649-mobile-invoice .items.items-wide-name tbody tr:nth-child(even) td{
  background:#e7edf3;
}

#kh649-mobile-invoice .items.items-wide-name tbody td:first-child{
  border-right:1px solid #d9e1ea;
  border-radius:0 9px 9px 0;
}

#kh649-mobile-invoice .items.items-wide-name tbody td:last-child{
  border-left:1px solid #d9e1ea;
  border-radius:9px 0 0 9px;
}

/* Product-name field gets the useful space */
#kh649-mobile-invoice .items.items-wide-name tbody td:first-child input,
#kh649-mobile-invoice .items.items-wide-name tbody td:first-child select{
  width:100% !important;
  min-width:0 !important;
}

/* Tiny delete control — do not consume product-name space */
#kh649-mobile-invoice .items.items-wide-name tbody td:last-child button{
  width:24px !important;
  min-width:24px !important;
  max-width:24px !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 !important;
  margin:0 !important;
  border-radius:7px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:0 !important;
  line-height:1 !important;
}

/* Replace visual X with trash icon without changing delete behavior */
#kh649-mobile-invoice .items.items-wide-name tbody td:last-child button::before{
  content:"🗑";
  font-size:14px;
  line-height:1;
}



/* =========================================================
   KashfHesab V68.5.1 — Sales Invoice Entry UX
   ========================================================= */

/* Clear operation identity above invoice number */
#kh649-mobile-invoice .kh6851-operation-title{
  position:sticky;
  top:0;
  z-index:4;
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 12px;
  padding:11px 13px;
  border:1px solid rgba(37,99,235,.20);
  border-radius:13px;
  background:linear-gradient(135deg,#eff6ff 0%,#f8fbff 100%);
  box-shadow:0 5px 16px rgba(37,99,235,.08);
}

#kh649-mobile-invoice .kh6851-operation-icon{
  flex:0 0 34px;
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:#2563eb;
  color:#fff;
  font-size:22px;
  font-weight:800;
  line-height:1;
}

#kh649-mobile-invoice .kh6851-operation-title strong{
  display:block;
  color:#163d78;
  font-size:15px;
  font-weight:800;
  line-height:1.35;
}

#kh649-mobile-invoice .kh6851-operation-title small{
  display:block;
  margin-top:2px;
  color:#64748b;
  font-size:11px;
  line-height:1.4;
}

/* Primary add-item action */
#kh649-mobile-invoice .kh6851-add-item{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1.5px solid #16a34a !important;
  border-radius:11px !important;
  background:linear-gradient(135deg,#ecfdf3,#f7fff9) !important;
  color:#137333 !important;
  font-weight:800 !important;
  box-shadow:
    0 0 0 3px rgba(34,197,94,.08),
    0 6px 15px rgba(22,163,74,.12) !important;
  transition:
    transform .16s ease,
    box-shadow .16s ease,
    background .16s ease;
}

#kh649-mobile-invoice .kh6851-add-item:active{
  transform:scale(.985);
}

#kh649-mobile-invoice .kh6851-add-item-plus{
  width:25px;
  height:25px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#16a34a;
  color:#fff;
  font-size:19px;
  font-weight:900;
  line-height:1;
  box-shadow:0 0 10px rgba(22,163,74,.22);
}

/* Empty item warning when user tries to add another row */
#kh649-mobile-invoice .items.items-wide-name .i-name.kh6851-item-required{
  border-color:#dc2626 !important;
  box-shadow:
    0 0 0 3px rgba(220,38,38,.12),
    0 0 12px rgba(220,38,38,.10) !important;
  animation:kh6851RequiredPulse .42s ease 2;
}

@keyframes kh6851RequiredPulse{
  0%,100%{ transform:translateX(0); }
  35%{ transform:translateX(3px); }
  70%{ transform:translateX(-3px); }
}

/* Actual trash control */
#kh649-mobile-invoice .items.items-wide-name .i-del{
  font-family:inherit !important;
  font-size:14px !important;
  color:#b42318 !important;
  background:#fff5f4 !important;
  border:1px solid #f2c7c3 !important;
}


/* KashfHesab V68.5.2 — inline transaction identity beside customer label */
#kh649-mobile-invoice .kh6852-customer-label{
  display:flex;
  align-items:center;
  gap:5px;
}

#kh649-mobile-invoice .kh6852-operation-inline{
  display:inline;
  font:inherit;
  font-size:inherit;
  font-weight:700;
  color:#2563eb;
}


/* KashfHesab V68.5.3 — center customer + transaction title */
#kh649-mobile-invoice .kh6852-customer-label{
  width:100%;
  display:flex !important;
  align-items:center;
  justify-content:center !important;
  gap:5px;
  text-align:center !important;
}

#kh649-mobile-invoice .kh6852-operation-inline{
  display:inline;
  font:inherit;
  font-size:inherit;
  font-weight:700;
  color:#2563eb;
}



/* =========================================================
   KashfHesab V68.5.4 — Unpriced Items Warning
   ========================================================= */

#kh649-mobile-invoice .kh6854-unpriced-warning{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}

#kh649-mobile-invoice .kh6854-warning-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.52);
  backdrop-filter:blur(2px);
}

#kh649-mobile-invoice .kh6854-warning-box{
  position:relative;
  z-index:1;
  width:min(100%,390px);
  padding:20px 17px 16px;
  border-radius:18px;
  background:#fff;
  border:1px solid #fed7aa;
  box-shadow:0 22px 60px rgba(15,23,42,.25);
  text-align:center;
}

#kh649-mobile-invoice .kh6854-warning-icon{
  width:48px;
  height:48px;
  margin:0 auto 9px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#fff7ed;
  border:1px solid #fed7aa;
  font-size:25px;
  line-height:1;
}

#kh649-mobile-invoice .kh6854-warning-box h3{
  margin:0 0 7px;
  color:#9a3412;
  font-size:17px;
  font-weight:900;
}

#kh649-mobile-invoice .kh6854-warning-box p{
  margin:4px 0;
  color:#475569;
  font-size:13px;
  line-height:1.65;
}

#kh649-mobile-invoice .kh6854-warning-question{
  font-weight:700;
  color:#334155 !important;
}

#kh649-mobile-invoice .kh6854-warning-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:15px;
}

#kh649-mobile-invoice .kh6854-back-price{
  min-height:43px;
  border:1px solid #fdba74;
  background:#fff7ed;
  color:#9a3412;
  font-weight:800;
}

#kh649-mobile-invoice .kh6854-confirm-save{
  min-height:43px;
  font-weight:800;
}

#kh649-mobile-invoice .i-price.kh6854-price-required{
  border-color:#f59e0b !important;
  background:#fffbeb !important;
  box-shadow:
    0 0 0 3px rgba(245,158,11,.16),
    0 0 14px rgba(245,158,11,.13) !important;
  animation:kh6854PricePulse .45s ease 2;
}

@keyframes kh6854PricePulse{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.035); }
}



/* =========================================================
   KashfHesab V68.5.5 — Final Item Guard + Empty Transaction
   ========================================================= */

#kh649-mobile-invoice .kh6855-empty-box{
  border-color:#fecaca;
}

#kh649-mobile-invoice .kh6855-empty-icon{
  background:#fef2f2;
  border-color:#fecaca;
  color:#dc2626;
  font-size:25px;
  font-weight:900;
}

#kh649-mobile-invoice .kh6855-empty-box h3{
  color:#b91c1c;
}

#kh649-mobile-invoice .kh6855-return{
  min-height:43px;
  border:1px solid #bfdbfe;
  background:#eff6ff;
  color:#1d4ed8;
  font-weight:900;
}

#kh649-mobile-invoice .kh6855-cancel-add{
  min-height:43px;
  border:1px solid #fecaca;
  background:#fff;
  color:#b91c1c;
  font-weight:900;
}

#kh649-mobile-invoice .kh6855-return:active,
#kh649-mobile-invoice .kh6855-cancel-add:active{
  transform:scale(.98);
}



/* =========================================================
   KashfHesab V68.5.6 — Accounting Cancel Confirmation
   ========================================================= */

.kh6856-cancel-confirm{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  direction:rtl;
}

.kh6856-cancel-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.58);
  backdrop-filter:blur(3px);
}

.kh6856-cancel-card{
  position:relative;
  z-index:1;
  width:min(430px,100%);
  padding:24px 20px 18px;
  border:1px solid #fecaca;
  border-radius:22px;
  background:#fff;
  box-shadow:
    0 24px 70px rgba(15,23,42,.28),
    0 8px 24px rgba(185,28,28,.12);
  text-align:center;
}

.kh6856-cancel-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  margin:0 auto 13px;
  border:1px solid #fecaca;
  border-radius:18px;
  background:#fef2f2;
  color:#dc2626;
  font-size:30px;
  line-height:1;
  font-weight:900;
}

.kh6856-cancel-card h3{
  margin:0 0 10px;
  color:#991b1b;
  font-size:19px;
  font-weight:900;
}

.kh6856-cancel-card p{
  margin:6px 0;
  color:#334155;
  font-size:14px;
  line-height:1.8;
}

.kh6856-cancel-note{
  color:#64748b !important;
  font-size:13px !important;
}

.kh6856-cancel-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
  margin-top:18px;
}

.kh6856-cancel-back{
  min-height:44px;
  border:1px solid #cbd5e1;
  background:#f8fafc;
  color:#334155;
  font-weight:900;
}

.kh6856-cancel-confirm-btn{
  min-height:44px;
  border:1px solid #dc2626;
  background:#dc2626;
  color:#fff;
  font-weight:900;
  box-shadow:0 7px 18px rgba(220,38,38,.22);
}

.kh6856-cancel-back:active,
.kh6856-cancel-confirm-btn:active{
  transform:scale(.98);
}

@media (max-width:420px){
  .kh6856-cancel-card{
    padding:21px 15px 15px;
    border-radius:19px;
  }

  .kh6856-cancel-actions{
    grid-template-columns:1fr;
  }

  .kh6856-cancel-confirm-btn{
    order:-1;
  }
}


/* =========================================================
   KashfHesab V68.5.7 — Premium Invoice Items Header
   الصنف | الكمية | السعر | الإجمالي
   ========================================================= */

#kh649-mobile-invoice .items.items-wide-name thead {
  position: relative;
}

#kh649-mobile-invoice .items.items-wide-name thead tr {
  background:
    linear-gradient(
      180deg,
      rgba(239, 246, 255, .98) 0%,
      rgba(248, 250, 252, .98) 100%
    );
}

#kh649-mobile-invoice .items.items-wide-name thead th {
  background: transparent;
  color: #263a55;

  font-size: 12px;
  font-weight: 800;
  letter-spacing: .01em;

  padding-top: 10px;
  padding-bottom: 9px;

  border-top: 1px solid rgba(59, 130, 246, .20);
  border-bottom: 3px solid rgba(30, 64, 175, .62);

  vertical-align: middle;
}

/* تمييز عنوان الصنف بشكل بسيط */
#kh649-mobile-invoice .items.items-wide-name thead th:first-child {
  color: #163a6b;
}

/* عمود الحذف ليس عنواناً — يبقى هادئاً */
#kh649-mobile-invoice .items.items-wide-name thead th:last-child {
  color: transparent;
}

/* لمسة فصل خفيفة بين العناوين */
#kh649-mobile-invoice .items.items-wide-name thead th:not(:last-child) {
  box-shadow: -1px 0 0 rgba(148, 163, 184, .10) inset;
}


/* ============================================================
   KashfHesab V68.6B.3
   Mobile invoice — responsive financial summary
   ============================================================ */

#kh649-mobile-invoice .kh686b3-summary {
  width: 100%;
  box-sizing: border-box;
  margin: 14px 0 16px;
  padding: 14px 14px 10px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 16px;
  background: #fff;
  direction: rtl;
}

#kh649-mobile-invoice .kh686b3-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 38px;
  padding: 5px 0;
}

#kh649-mobile-invoice .kh686b3-label {
  min-width: 0;
  color: #475569;
  font-size: clamp(.78rem, 3.35vw, .92rem);
  font-weight: 600;
  line-height: 1.45;
}

#kh649-mobile-invoice .kh686b3-value {
  flex: 0 0 auto;
  color: #0f172a;
  font-size: clamp(.9rem, 4vw, 1.08rem);
  font-weight: 750;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Main gross amount */
#kh649-mobile-invoice .kh686b3-gross-row {
  padding-top: 1px;
}

#kh649-mobile-invoice .kh686b3-gross-row .kh686b3-label {
  color: #0f172a;
  font-weight: 750;
}

#kh649-mobile-invoice .kh686b3-gross-row .kh686b3-value {
  font-size: clamp(1rem, 4.8vw, 1.28rem);
  font-weight: 850;
}

/* After discount */
#kh649-mobile-invoice .kh686b3-after-discount-row {
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px dashed rgba(148, 163, 184, .28);
}

#kh649-mobile-invoice .kh686b3-after-discount-row .kh686b3-label {
  color: #334155;
  font-weight: 700;
}

/* Tax */
#kh649-mobile-invoice .kh686b3-tax-block {
  margin-top: 4px;
  padding-top: 5px;
}

#kh649-mobile-invoice .kh686b3-tax-title {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

#kh649-mobile-invoice .kh686b3-tax-rate-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: auto;
  margin: 0;
  padding: 2px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: clamp(.7rem, 3vw, .8rem);
  font-weight: 700;
  line-height: 1;
}

#kh649-mobile-invoice .kh686b3-tax-rate-wrap input {
  width: 42px !important;
  min-width: 0 !important;
  height: 25px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #0f172a;
  text-align: center;
  font-size: clamp(.72rem, 3.1vw, .82rem);
  font-weight: 800;
  line-height: 1;
  appearance: textfield;
  -moz-appearance: textfield;
}

#kh649-mobile-invoice .kh686b3-tax-rate-wrap input::-webkit-outer-spin-button,
#kh649-mobile-invoice .kh686b3-tax-rate-wrap input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

#kh649-mobile-invoice .kh686b3-tax-base {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 0 7px;
  color: #94a3b8;
  font-size: clamp(.68rem, 2.9vw, .78rem);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

/* Final net result — clearly separated by two lines */
#kh649-mobile-invoice .kh686b3-net-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin-top: 5px;
  padding: 12px 0;
  border-top: 2px solid #0f172a;
  border-bottom: 2px solid #0f172a;
}

#kh649-mobile-invoice .kh686b3-net-label {
  min-width: 0;
  color: #0f172a;
  font-size: clamp(.84rem, 3.6vw, 1rem);
  font-weight: 850;
  line-height: 1.35;
}

#kh649-mobile-invoice .kh686b3-net-value {
  flex: 0 0 auto;
  color: #0f172a;
  font-size: clamp(1.08rem, 5.1vw, 1.38rem);
  font-weight: 900;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

#kh649-mobile-invoice .kh686b3-currency {
  padding-top: 6px;
  color: #94a3b8;
  text-align: left;
  font-size: clamp(.65rem, 2.7vw, .76rem);
  font-weight: 600;
}

/* Statement / note */
#kh649-mobile-invoice .kh686b3-note-field {
  margin-top: 12px;
}

#kh649-mobile-invoice .kh686b3-note-field > label {
  margin-bottom: 6px;
  color: #334155;
  font-size: clamp(.78rem, 3.3vw, .9rem);
  font-weight: 700;
}

#kh649-mobile-invoice .kh686b3-note-field textarea {
  min-height: 72px;
  resize: vertical;
  border-radius: 12px;
  font-size: clamp(.78rem, 3.3vw, .9rem);
  line-height: 1.55;
}

/* Extra-small phones */
@media (max-width: 380px) {
  #kh649-mobile-invoice .kh686b3-summary {
    padding: 12px 11px 9px;
    border-radius: 14px;
  }

  #kh649-mobile-invoice .kh686b3-row,
  #kh649-mobile-invoice .kh686b3-net-row {
    gap: 8px;
  }

  #kh649-mobile-invoice .kh686b3-tax-rate-wrap {
    gap: 1px;
    padding-inline: 4px;
  }

  #kh649-mobile-invoice .kh686b3-tax-rate-wrap input {
    width: 36px !important;
  }
}

/* ============================================================
   KashfHesab V68.6B.3
   Mobile invoice — responsive financial summary
   ============================================================ */

#kh649-mobile-invoice .kh686b3-summary {
  width: 100%;
  box-sizing: border-box;
  margin: 14px 0 16px;
  padding: 14px 14px 10px;
  border: 1px solid rgba(15, 23, 42, .08);
  border-radius: 16px;
  background: #fff;
  direction: rtl;
}

#kh649-mobile-invoice .kh686b3-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 38px;
  padding: 5px 0;
}

#kh649-mobile-invoice .kh686b3-label {
  min-width: 0;
  color: #475569;
  font-size: clamp(.78rem, 3.35vw, .92rem);
  font-weight: 600;
  line-height: 1.45;
}

#kh649-mobile-invoice .kh686b3-value {
  flex: 0 0 auto;
  color: #0f172a;
  font-size: clamp(.9rem, 4vw, 1.08rem);
  font-weight: 750;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Main gross amount */
#kh649-mobile-invoice .kh686b3-gross-row {
  padding-top: 1px;
}

#kh649-mobile-invoice .kh686b3-gross-row .kh686b3-label {
  color: #0f172a;
  font-weight: 750;
}

#kh649-mobile-invoice .kh686b3-gross-row .kh686b3-value {
  font-size: clamp(1rem, 4.8vw, 1.28rem);
  font-weight: 850;
}

/* After discount */
#kh649-mobile-invoice .kh686b3-after-discount-row {
  margin-top: 2px;
  padding-top: 8px;
  border-top: 1px dashed rgba(148, 163, 184, .28);
}

#kh649-mobile-invoice .kh686b3-after-discount-row .kh686b3-label {
  color: #334155;
  font-weight: 700;
}

/* Tax */
#kh649-mobile-invoice .kh686b3-tax-block {
  margin-top: 4px;
  padding-top: 5px;
}

#kh649-mobile-invoice .kh686b3-tax-title {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

#kh649-mobile-invoice .kh686b3-tax-rate-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: auto;
  margin: 0;
  padding: 2px 6px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  font-size: clamp(.7rem, 3vw, .8rem);
  font-weight: 700;
  line-height: 1;
}

#kh649-mobile-invoice .kh686b3-tax-rate-wrap input {
  width: 42px !important;
  min-width: 0 !important;
  height: 25px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #0f172a;
  text-align: center;
  font-size: clamp(.72rem, 3.1vw, .82rem);
  font-weight: 800;
  line-height: 1;
  appearance: textfield;
  -moz-appearance: textfield;
}

#kh649-mobile-invoice .kh686b3-tax-rate-wrap input::-webkit-outer-spin-button,
#kh649-mobile-invoice .kh686b3-tax-rate-wrap input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

#kh649-mobile-invoice .kh686b3-tax-base {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 0 7px;
  color: #94a3b8;
  font-size: clamp(.68rem, 2.9vw, .78rem);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

/* Final net result — clearly separated by two lines */
#kh649-mobile-invoice .kh686b3-net-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin-top: 5px;
  padding: 12px 0;
  border-top: 2px solid #0f172a;
  border-bottom: 2px solid #0f172a;
}

#kh649-mobile-invoice .kh686b3-net-label {
  min-width: 0;
  color: #0f172a;
  font-size: clamp(.84rem, 3.6vw, 1rem);
  font-weight: 850;
  line-height: 1.35;
}

#kh649-mobile-invoice .kh686b3-net-value {
  flex: 0 0 auto;
  color: #0f172a;
  font-size: clamp(1.08rem, 5.1vw, 1.38rem);
  font-weight: 900;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

#kh649-mobile-invoice .kh686b3-currency {
  padding-top: 6px;
  color: #94a3b8;
  text-align: left;
  font-size: clamp(.65rem, 2.7vw, .76rem);
  font-weight: 600;
}

/* Statement / note */
#kh649-mobile-invoice .kh686b3-note-field {
  margin-top: 12px;
}

#kh649-mobile-invoice .kh686b3-note-field > label {
  margin-bottom: 6px;
  color: #334155;
  font-size: clamp(.78rem, 3.3vw, .9rem);
  font-weight: 700;
}

#kh649-mobile-invoice .kh686b3-note-field textarea {
  min-height: 72px;
  resize: vertical;
  border-radius: 12px;
  font-size: clamp(.78rem, 3.3vw, .9rem);
  line-height: 1.55;
}

/* Extra-small phones */
@media (max-width: 380px) {
  #kh649-mobile-invoice .kh686b3-summary {
    padding: 12px 11px 9px;
    border-radius: 14px;
  }

  #kh649-mobile-invoice .kh686b3-row,
  #kh649-mobile-invoice .kh686b3-net-row {
    gap: 8px;
  }

  #kh649-mobile-invoice .kh686b3-tax-rate-wrap {
    gap: 1px;
    padding-inline: 4px;
  }

  #kh649-mobile-invoice .kh686b3-tax-rate-wrap input {
    width: 36px !important;
  }
}


/* KashfHesab V68.6B.5 — smart discount */

.kh686b5-discount-row {
  position: relative;
  align-items: center;
  gap: 12px;
}

.kh686b5-discount-control {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.kh686b5-discount-title {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.kh686b5-discount-settings {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 27px;
  min-width: 27px;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 8px;
  background: rgba(15, 23, 42, .06);
  color: #475569;
  font-size: 14px;
  cursor: pointer;
}

.kh686b5-discount-settings:hover,
.kh686b5-discount-settings:focus-visible {
  background: rgba(37, 99, 235, .10);
  outline: none;
}

.kh686b5-discount-menu {
  position: absolute;
  z-index: 150;
  top: calc(100% + 7px);
  right: 0;
  width: max-content;
  min-width: 185px;
  padding: 6px;
  border: 1px solid rgba(148, 163, 184, .25);
  border-radius: 12px;
  background: #fff;
  box-shadow:
    0 14px 35px rgba(15, 23, 42, .14),
    0 3px 10px rgba(15, 23, 42, .06);
}

.kh686b5-discount-menu[hidden] {
  display: none !important;
}

.kh686b5-discount-choice {
  display: block;
  width: 100%;
  padding: 9px 11px;
  margin: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #334155;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  text-align: right;
  white-space: nowrap;
  cursor: pointer;
}

.kh686b5-discount-choice:hover {
  background: #f8fafc;
}

.kh686b5-discount-choice.is-active {
  background: #eff6ff;
  color: #1d4ed8;
}

.kh686b5-discount-input-wrap {
  display: inline-flex;
  align-items: center;
  direction: ltr;
  width: 104px;
  height: 34px;
  overflow: hidden;
  border: 1px solid #dbe3ee;
  border-radius: 9px;
  background: #fff;
}

.kh686b5-discount-input-wrap:focus-within {
  border-color: #93c5fd;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, .09);
}

.kh686b5-discount-input-wrap input[type="number"] {
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0 7px;
  margin: 0;
  border: 0 !important;
  border-radius: 0;
  background: transparent;
  box-shadow: none !important;
  outline: none;
  color: #0f172a;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
}

.kh686b5-discount-unit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  min-width: 29px;
  padding: 0 6px;
  border-left: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
}

.kh686b5-discount-row > .kh686b3-value {
  margin-inline-start: auto;
  font-weight: 700;
}

@media (max-width: 480px) {
  .kh686b5-discount-row {
    gap: 7px;
  }

  .kh686b5-discount-control {
    gap: 5px;
  }

  .kh686b5-discount-input-wrap {
    width: 88px;
    height: 32px;
  }

  .kh686b5-discount-settings {
    width: 25px;
    height: 25px;
    min-width: 25px;
  }

  .kh686b5-discount-menu {
    min-width: 175px;
  }
}

/* =========================================================
   KashfHesab V68.6C.M1
   Mobile invoice — AI document reader responsive fix
   Scope: #kh649-mobile-invoice only
   ========================================================= */

@media (max-width: 768px){

  #kh649-mobile-invoice .kh686c-ai-reader{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:88px !important;
    height:auto !important;

    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:12px !important;

    box-sizing:border-box !important;
    margin:0 !important;
    padding:15px 16px !important;

    text-align:right !important;
    white-space:normal !important;

    border:1px solid rgba(124,58,237,.14) !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.78) !important;
    box-shadow:0 8px 22px rgba(76,29,149,.055) !important;

    cursor:pointer;
  }

  #kh649-mobile-invoice .kh686c-ai-reader-icon{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    flex:0 0 44px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:14px !important;
    background:#f3f0ff !important;

    font-size:22px !important;
    line-height:1 !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-ai-reader-copy{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:4px !important;

    text-align:right !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-ai-reader-copy strong{
    display:block !important;
    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    color:#172033 !important;
    font-size:15px !important;
    font-weight:800 !important;
    line-height:1.55 !important;

    white-space:normal !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-ai-reader-copy small{
    display:block !important;
    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    color:#7b8495 !important;
    font-size:12px !important;
    font-weight:500 !important;
    line-height:1.65 !important;

    white-space:normal !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-ai-reader-arrow{
    width:24px !important;
    min-width:24px !important;
    flex:0 0 24px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    color:#64748b !important;
    font-size:30px !important;
    font-weight:400 !important;
    line-height:1 !important;

    writing-mode:horizontal-tb !important;
  }

  /*
   * Prevent generic mobile button/span rules from turning
   * the reader content into narrow vertical columns.
   */
  #kh649-mobile-invoice .kh686c-ai-reader *,
  #kh649-mobile-invoice .kh686c-ai-reader{
    writing-mode:horizontal-tb !important;
  }

}


/* =========================================================
   KashfHesab V68.6C.M2
   Mobile invoice — document reader FINAL responsive layout
   ========================================================= */

@media (max-width:768px){

  /* Main document area must remain one normal vertical column */
  #kh649-mobile-invoice .kh6762-document-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    box-sizing:border-box !important;
  }

  /* New smart-reader card */
  #kh649-mobile-invoice .kh686c-ai-reader{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    box-sizing:border-box !important;
  }

  #kh649-mobile-invoice .kh686c-ai-reader-copy{
    flex:1 1 0 !important;
    min-width:0 !important;
    width:auto !important;
  }

  /* Status/help line */
  #kh649-mobile-invoice .kh6762-document-status{
    display:flex !important;
    flex-direction:row !important;
    align-items:flex-start !important;
    gap:8px !important;

    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    height:auto !important;

    box-sizing:border-box !important;
    margin:12px 0 0 !important;
    padding:10px 12px !important;

    white-space:normal !important;
    text-align:right !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh6762-document-status > span:last-child{
    display:block !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    width:auto !important;

    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:break-word !important;
    writing-mode:horizontal-tb !important;

    font-size:12px !important;
    line-height:1.65 !important;
  }

  #kh649-mobile-invoice .kh6762-status-dot{
    flex:0 0 auto !important;
  }

  /* Selected document preview */
  #kh649-mobile-invoice .kh6762-preview{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    box-sizing:border-box !important;
  }

  /*
   * Actual blue AI extraction button.
   * This was the element collapsing vertically on mobile.
   */
  #kh649-mobile-invoice .kh6762-fetch-ai{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    height:48px !important;
    min-height:48px !important;

    box-sizing:border-box !important;
    margin:12px 0 0 !important;
    padding:0 16px !important;

    border-radius:14px !important;

    white-space:nowrap !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    writing-mode:horizontal-tb !important;

    text-align:center !important;
    font-size:14px !important;
    font-weight:800 !important;
    line-height:1 !important;
  }

  /* hidden must always win */
  #kh649-mobile-invoice .kh6762-fetch-ai[hidden]{
    display:none !important;
  }

  /* Items must start below the reader, never beside it */
  #kh649-mobile-invoice .kh6762-document-card + [data-items]{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    clear:both !important;
    margin-top:16px !important;
  }

}


/* =========================================================
   KashfHesab V68.6C.M3
   Compact document import — approved mobile design
   ========================================================= */

@media (max-width:768px){

  #kh649-mobile-invoice .kh686c-docbar-card{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    margin:14px 0 16px !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
  }

  #kh649-mobile-invoice .kh686c-docbar{
    appearance:none !important;
    -webkit-appearance:none !important;

    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;

    width:100% !important;
    min-width:0 !important;
    height:62px !important;
    min-height:62px !important;

    box-sizing:border-box !important;
    margin:0 !important;
    padding:8px 12px !important;

    direction:rtl !important;
    writing-mode:horizontal-tb !important;
    white-space:nowrap !important;

    border:1px solid rgba(139,92,246,.22) !important;
    border-radius:18px !important;
    background:
      linear-gradient(135deg,
        rgba(250,247,255,.98),
        rgba(245,242,255,.96)) !important;

    box-shadow:
      0 8px 22px rgba(109,40,217,.055),
      inset 0 0 0 1px rgba(255,255,255,.6) !important;

    color:#172033 !important;
    text-align:right !important;
    cursor:pointer !important;
    overflow:hidden !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-upload{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:42px !important;
    height:42px !important;
    flex:0 0 42px !important;

    margin:0 0 0 11px !important;
    border-radius:13px !important;
    background:#eee7ff !important;

    font-size:20px !important;
    line-height:1 !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-text{
    display:block !important;
    flex:1 1 auto !important;
    min-width:0 !important;

    overflow:hidden !important;
    text-overflow:ellipsis !important;

    color:#172033 !important;
    font-size:14px !important;
    font-weight:800 !important;
    line-height:1 !important;

    white-space:nowrap !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-ai{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    flex:0 0 auto !important;
    margin:0 8px !important;

    font-size:18px !important;
    line-height:1 !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-arrow{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:18px !important;
    flex:0 0 18px !important;

    direction:ltr !important;
    color:#64748b !important;
    font-size:27px !important;
    line-height:1 !important;
    writing-mode:horizontal-tb !important;
  }

  /* Old helper/status/preview/fetch UI must not occupy layout space. */
  #kh649-mobile-invoice .kh686c-docbar-card
  .kh6762-document-status,

  #kh649-mobile-invoice .kh686c-docbar-card
  .kh6762-preview,

  #kh649-mobile-invoice .kh686c-docbar-card
  .kh6762-fetch-ai{
    display:none !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-card + [data-items]{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    clear:both !important;
    margin-top:0 !important;
  }

}


/* =========================================================
   KashfHesab V68.6C.M4
   Split document actions — UI only
   AI integration intentionally deferred
   ========================================================= */

@media (max-width:768px){

  #kh649-mobile-invoice .kh686c-docbar{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    width:100% !important;
    height:58px !important;
    min-height:58px !important;
    padding:6px !important;
    gap:0 !important;
    direction:rtl !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-read{
    appearance:none !important;
    -webkit-appearance:none !important;
    border:0 !important;
    outline:0 !important;
    background:transparent !important;

    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;

    flex:1 1 auto !important;
    min-width:0 !important;
    height:46px !important;
    padding:0 12px !important;

    color:#172033 !important;
    cursor:pointer !important;
    white-space:nowrap !important;
    writing-mode:horizontal-tb !important;
    text-align:right !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-read .kh686c-docbar-ai{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 auto !important;
    margin:0 !important;
    font-size:18px !important;
    line-height:1 !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-read .kh686c-docbar-text{
    display:block !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    font-size:14px !important;
    font-weight:800 !important;
    line-height:1 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-divider{
    display:block !important;
    width:1px !important;
    height:30px !important;
    flex:0 0 1px !important;
    margin:0 4px !important;
    background:rgba(100,116,139,.18) !important;
  }

  #kh649-mobile-invoice button.kh686c-docbar-upload{
    appearance:none !important;
    -webkit-appearance:none !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:48px !important;
    height:46px !important;
    min-width:48px !important;
    flex:0 0 48px !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    border-radius:13px !important;
    background:#eee7ff !important;

    cursor:pointer !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-upload-icon{
    display:block !important;
    font-size:21px !important;
    line-height:1 !important;
    transform:rotate(-8deg);
  }

  #kh649-mobile-invoice button.kh686c-docbar-upload:active,
  #kh649-mobile-invoice .kh686c-docbar-read:active{
    transform:scale(.97);
  }

}


/* KashfHesab V68.6C.M4.1 — attachment label */
@media (max-width:768px){

  #kh649-mobile-invoice button.kh686c-docbar-upload{
    width:auto !important;
    min-width:112px !important;
    flex:0 0 auto !important;
    padding:0 10px !important;
    gap:6px !important;
    white-space:nowrap !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-upload-text{
    display:block !important;
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1 !important;
    color:#4c3b78 !important;
    white-space:nowrap !important;
    writing-mode:horizontal-tb !important;
  }

  #kh649-mobile-invoice .kh686c-docbar-upload-icon{
    flex:0 0 auto !important;
  }

}

/* KashfHesab V68.6C.M4.2 — selected attachment */
@media (max-width:768px){

  #kh649-mobile-invoice button.kh686c-docbar-upload.is-selected{
    background:#ecfdf3 !important;
    border:1px solid rgba(22,163,74,.18) !important;
  }

  #kh649-mobile-invoice button.kh686c-docbar-upload.is-selected
  .kh686c-docbar-upload-text{
    color:#15803d !important;
  }

}

/* =========================================================
   KashfHesab V68.6C.M4.3
   Selected attachment information
   ========================================================= */
@media (max-width:768px){

  #kh649-mobile-invoice .kh686c-fileinfo{
    display:flex;
    align-items:center;
    gap:9px;

    width:100%;
    box-sizing:border-box;

    margin:7px 0 0;
    padding:8px 10px;

    direction:rtl;

    border:1px solid rgba(148,163,184,.20);
    border-radius:12px;

    background:#f8fafc;
  }

  #kh649-mobile-invoice .kh686c-fileinfo[hidden]{
    display:none !important;
  }

  #kh649-mobile-invoice .kh686c-fileinfo-icon{
    display:flex;
    align-items:center;
    justify-content:center;

    width:34px;
    height:34px;
    flex:0 0 34px;

    border-radius:9px;
    background:#eef2ff;

    font-size:17px;
    line-height:1;
  }

  #kh649-mobile-invoice .kh686c-fileinfo-main{
    display:flex;
    flex-direction:column;
    gap:3px;

    flex:1 1 auto;
    min-width:0;
  }

  #kh649-mobile-invoice .kh686c-fileinfo-main strong{
    display:block;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    color:#172033;
    font-size:12px;
    font-weight:800;
    line-height:1.35;
  }

  #kh649-mobile-invoice .kh686c-fileinfo-main small{
    display:block;

    color:#64748b;
    font-size:10px;
    font-weight:700;
    line-height:1.25;
  }

}

/* =========================================================
   KashfHesab V68.6B.15H
   Invoice summary — compact secondary totals
   Keep NET TOTAL unchanged and visually dominant.
   ========================================================= */

#kh649-mobile-invoice .kh686b3-summary .kh686b3-row {
    padding-inline-end: 8px;
}

/* المبلغ الإجمالي + الخصم + بعد الخصم + الضريبة */
#kh649-mobile-invoice .kh686b3-summary .kh686b3-row .kh686b3-label {
    font-size: 13px;
    line-height: 1.35;
}

#kh649-mobile-invoice .kh686b3-summary .kh686b3-row .kh686b3-value {
    font-size: 13px;
    line-height: 1.35;
}

/* Keep the discount control compact as part of the same row */
#kh649-mobile-invoice .kh686b5-discount-row
.kh686b5-discount-input-wrap {
    font-size: 13px;
}

/*
 * IMPORTANT:
 * .kh686b3-net-label / .kh686b3-net-value intentionally untouched.
 * Net total keeps its current large size.
 */


/* =========================================================
   KashfHesab V68.6B.15I
   Net total / Round button layout
   ROUND = right side
   NET TOTAL = left side
   ========================================================= */

#kh649-mobile-invoice .kh686b3-net-row{
    display:flex;
    align-items:center;
    gap:10px;
}

/* Net total label stays with its amount on the left side */
#kh649-mobile-invoice .kh686b3-net-label{
    order:2;
}

#kh649-mobile-invoice .kh686b3-net-value{
    order:3;
    margin-inline-start:auto;
}

/* Round button — right side, compact but visually distinct */
#kh649-mobile-invoice [data-kh686b15-round]{
    order:1 !important;
    margin:0 !important;
    padding:6px 11px !important;

    min-height:30px;

    border:1px solid #bfdbfe !important;
    border-radius:9px !important;

    background:#eff6ff !important;
    color:#1d4ed8 !important;

    font-size:12px !important;
    font-weight:800 !important;
    line-height:1 !important;

    box-shadow:0 2px 7px rgba(37,99,235,.12);
    white-space:nowrap;
}

#kh649-mobile-invoice [data-kh686b15-round]:hover{
    background:#dbeafe !important;
    border-color:#93c5fd !important;
}

#kh649-mobile-invoice [data-kh686b15-round]:active{
    transform:translateY(1px);
    box-shadow:0 1px 3px rgba(37,99,235,.12);
}


/* =========================================================
   KashfHesab V68.6B.15J
   Correct NET row:
   RTL = Net label -> Round -> Net amount
   Net amount aligned with amounts above.
   ========================================================= */

#kh649-mobile-invoice .kh686b3-net-row{
    display:grid !important;

    /*
     * RTL visual order:
     * label | round | amount
     *
     * First column takes remaining space.
     * Last column follows the same amount width as rows above.
     */
    grid-template-columns:minmax(0,1fr) auto 92px !important;
    align-items:center !important;
    column-gap:8px !important;
}

/* Right: المبلغ الإجمالي الصافي */
#kh649-mobile-invoice .kh686b3-net-label{
    order:unset !important;
    margin:0 !important;
    justify-self:start !important;
}

/* Middle: تقريب */
#kh649-mobile-invoice [data-kh686b15-round]{
    order:unset !important;
    margin:0 !important;

    justify-self:center !important;

    min-height:28px !important;
    padding:5px 10px !important;

    border:1px solid #bfdbfe !important;
    border-radius:9px !important;

    background:#eff6ff !important;
    color:#1d4ed8 !important;

    font-size:11px !important;
    font-weight:800 !important;
    line-height:1 !important;

    box-shadow:0 2px 6px rgba(37,99,235,.12) !important;
    white-space:nowrap !important;
}

/* Left: net amount — aligned like the values above */
#kh649-mobile-invoice .kh686b3-net-value{
    order:unset !important;
    margin:0 !important;

    width:92px !important;
    text-align:right !important;
    justify-self:end !important;
}


/* =========================================================
   KashfHesab V68.6B.15K
   FINAL net row order:
   RIGHT: Net label
   CENTER: Round
   LEFT: Net amount
   ========================================================= */

#kh649-mobile-invoice .kh686b3-net-row{
    display:flex !important;
    direction:rtl !important;
    align-items:center !important;
    width:100% !important;
    gap:8px !important;
}

/* 1 — RIGHT */
#kh649-mobile-invoice .kh686b3-net-label{
    order:1 !important;
    margin:0 !important;
    flex:0 0 auto !important;
}

/* 2 — BETWEEN LABEL AND AMOUNT */
#kh649-mobile-invoice [data-kh686b15-round]{
    order:2 !important;

    margin:0 8px 0 0 !important;
    padding:5px 10px !important;
    min-height:28px !important;

    flex:0 0 auto !important;

    border:1px solid #bfdbfe !important;
    border-radius:9px !important;
    background:#eff6ff !important;
    color:#1d4ed8 !important;

    font-size:11px !important;
    font-weight:800 !important;
    line-height:1 !important;

    box-shadow:0 2px 6px rgba(37,99,235,.12) !important;
    white-space:nowrap !important;
}

/* 3 — LEFT / SAME AMOUNT COLUMN AS ABOVE */
#kh649-mobile-invoice .kh686b3-net-value{
    order:3 !important;

    margin-inline-start:auto !important;
    margin-inline-end:0 !important;

    flex:0 0 auto !important;

    text-align:left !important;
    direction:ltr !important;
}


/* =========================================================
   KashfHesab V68.6B.15L
   Keep ROUND + NET AMOUNT together on the left
   ========================================================= */

/* Push ROUND and the amount together toward the left */
#kh649-mobile-invoice [data-kh686b15-round]{
    margin-inline-start:auto !important;
    margin-inline-end:0 !important;
}

/* Amount immediately beside ROUND */
#kh649-mobile-invoice .kh686b3-net-value{
    margin:0 !important;
    margin-inline-start:0 !important;
    margin-inline-end:0 !important;

    width:auto !important;
    min-width:78px !important;

    text-align:left !important;
    direction:ltr !important;
}

/* Small controlled distance between ROUND and amount */
#kh649-mobile-invoice .kh686b3-net-row{
    column-gap:7px !important;
}


/* =========================================================
   KashfHesab V68.6B.15O
   Invoice payment row + note below payment
   ========================================================= */

#kh649-mobile-invoice .kh686b15o-payment-field{
    margin:0 !important;
}

#kh649-mobile-invoice .kh686b15o-payment-line{
    display:grid;
    grid-template-columns:auto auto minmax(105px,145px);
    align-items:center;
    gap:10px;
    width:100%;
}

#kh649-mobile-invoice .kh686b15o-payment-label{
    margin:0 !important;
    font-weight:800 !important;
    white-space:nowrap;
}

/* Prominent Full Payment action */
#kh649-mobile-invoice .kh686b15o-full-pay{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:5px;

    min-height:38px;
    padding:7px 14px !important;

    border:1px solid #16a34a !important;
    border-radius:10px !important;
    background:#16a34a !important;
    color:#fff !important;

    font-size:13px !important;
    font-weight:900 !important;
    line-height:1 !important;

    box-shadow:0 4px 12px rgba(22,163,74,.20) !important;
    white-space:nowrap;
}

#kh649-mobile-invoice .kh686b15o-full-pay:hover{
    transform:translateY(-1px);
    box-shadow:0 6px 15px rgba(22,163,74,.26) !important;
}

#kh649-mobile-invoice .kh686b15o-payment-amount{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;

    text-align:center !important;
    font-size:16px !important;
    font-weight:800 !important;
}

/* Note now belongs visually after the payment section */
#kh649-mobile-invoice .kh686b15o-note-after-payment{
    margin-top:16px;
}

#kh649-mobile-invoice
.kh686b15o-note-after-payment
.kh686b3-note-field{
    margin-bottom:0;
}

/* Mobile: preserve the same one-line concept */
@media (max-width:600px){
    #kh649-mobile-invoice .kh686b15o-payment-line{
        grid-template-columns:auto auto minmax(82px,1fr);
        gap:6px;
    }

    #kh649-mobile-invoice .kh686b15o-full-pay{
        padding:7px 9px !important;
        font-size:12px !important;
    }

    #kh649-mobile-invoice .kh686b15o-payment-amount{
        font-size:14px !important;
    }
}


/* =========================================================
   KashfHesab V68.6B.15P
   Professional standalone invoice payment card
   ========================================================= */

#kh649-mobile-invoice .kh686b2-payment-card{
    position:relative;

    margin:6px 0 0 !important;
    padding:18px !important;

    background:#fff !important;

    border:1px solid rgba(148,163,184,.26) !important;
    border-radius:16px !important;

    box-shadow:
        0 10px 28px rgba(15,23,42,.08),
        0 2px 7px rgba(15,23,42,.04) !important;

    overflow:visible;
}

/* Small professional accent at the top */
#kh649-mobile-invoice .kh686b2-payment-card::before{
    content:"";
    position:absolute;

    top:0;
    right:18px;
    left:18px;

    height:3px;

    border-radius:0 0 6px 6px;
    background:linear-gradient(
        90deg,
        #2563eb,
        #16a34a
    );
}

/* Payment title */
#kh649-mobile-invoice
.kh686b2-payment-card > .field:first-child{
    margin:0 0 14px !important;
}

#kh649-mobile-invoice
.kh686b2-payment-card > .field:first-child > label{
    display:flex;
    align-items:center;
    gap:7px;

    margin:0 !important;

    font-size:14px !important;
    font-weight:900 !important;
    color:#0f172a !important;
}

#kh649-mobile-invoice
.kh686b2-payment-card > .field:first-child > label::before{
    content:"₪";

    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:27px;
    height:27px;

    border-radius:8px;

    background:#ecfdf5;
    color:#15803d;

    font-size:14px;
    font-weight:900;
}

/* Main payment/account grid */
#kh649-mobile-invoice .kh686b2-payment-card > .grid2{
    align-items:start;
    gap:14px !important;
}

/* Full-payment button remains the focal action */
#kh649-mobile-invoice .kh686b15o-full-pay{
    border-color:#15803d !important;

    background:linear-gradient(
        135deg,
        #16a34a,
        #15803d
    ) !important;

    box-shadow:
        0 5px 14px rgba(22,163,74,.22) !important;
}

/* Account selector slightly cleaner inside card */
#kh649-mobile-invoice
.kh686b2-payment-card
select[name="pay_financial_account_id"]{
    background-color:#f8fafc !important;
    border-color:#dbe3ee !important;
}

/* Payment attachments become a soft inner zone */
#kh649-mobile-invoice
.kh686b2-payment-card
.kh686c-payment-attachments{
    margin-top:16px !important;
    padding:14px !important;

    background:#f8fafc !important;

    border:1px solid #e2e8f0 !important;
    border-radius:12px !important;
}

/* Clear visual separation before the note */
#kh649-mobile-invoice .kh686b15o-note-after-payment{
    margin-top:20px !important;
}

/* Mobile */
@media (max-width:600px){

    #kh649-mobile-invoice .kh686b2-payment-card{
        padding:14px !important;
        border-radius:14px !important;

        box-shadow:
            0 8px 22px rgba(15,23,42,.08),
            0 2px 6px rgba(15,23,42,.04) !important;
    }

    #kh649-mobile-invoice
    .kh686b2-payment-card
    .kh686c-payment-attachments{
        padding:11px !important;
    }
}


/* =========================================================
   KashfHesab V68.6B.15R
   Creative standalone invoice notes card
   ========================================================= */

#kh649-mobile-invoice .kh686b15r-notes-card{
    position:relative;
    overflow:hidden;

    margin:20px 0 4px !important;
    padding:17px !important;

    background:
        linear-gradient(
            135deg,
            rgba(239,246,255,.92),
            rgba(255,255,255,.98) 48%,
            rgba(240,253,250,.72)
        ) !important;

    border:1px solid rgba(59,130,246,.18) !important;
    border-radius:16px !important;

    box-shadow:
        0 10px 28px rgba(15,23,42,.07),
        0 2px 7px rgba(37,99,235,.05) !important;
}

/* Decorative accent */
#kh649-mobile-invoice .kh686b15r-notes-card::before{
    content:"";
    position:absolute;

    top:0;
    right:0;

    width:5px;
    height:100%;

    background:linear-gradient(
        180deg,
        #2563eb,
        #14b8a6
    );
}

/* Header */
#kh649-mobile-invoice .kh686b15r-notes-head{
    display:flex;
    align-items:center;
    gap:10px;

    margin-bottom:12px;
}

/* Icon */
#kh649-mobile-invoice .kh686b15r-notes-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    flex:0 0 34px;
    width:34px;
    height:34px;

    border-radius:10px;

    background:#dbeafe;
    color:#1d4ed8;

    font-size:18px;
    font-weight:900;

    box-shadow:
        inset 0 0 0 1px rgba(37,99,235,.08);
}

/* Title */
#kh649-mobile-invoice .kh686b15r-notes-title{
    display:flex;
    flex-direction:column;
    gap:2px;

    min-width:0;
}

#kh649-mobile-invoice .kh686b15r-notes-title label{
    margin:0 !important;

    color:#0f172a !important;

    font-size:15px !important;
    font-weight:900 !important;
    line-height:1.3;
}

#kh649-mobile-invoice .kh686b15r-notes-title small{
    color:#64748b;

    font-size:11px;
    font-weight:600;
    line-height:1.4;
}

/* Text area */
#kh649-mobile-invoice .kh686b15r-notes-input{
    display:block;

    width:100% !important;
    min-height:92px !important;

    margin:0 !important;
    padding:12px 14px !important;

    resize:vertical;

    background:rgba(255,255,255,.94) !important;

    border:1px solid #dbe3ee !important;
    border-radius:12px !important;

    color:#0f172a !important;

    font-size:13px !important;
    line-height:1.65 !important;

    box-shadow:
        inset 0 1px 2px rgba(15,23,42,.025) !important;

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

#kh649-mobile-invoice .kh686b15r-notes-input:focus{
    outline:none !important;

    background:#fff !important;
    border-color:#60a5fa !important;

    box-shadow:
        0 0 0 3px rgba(59,130,246,.11),
        inset 0 1px 2px rgba(15,23,42,.02) !important;
}

#kh649-mobile-invoice
.kh686b15r-notes-input::placeholder{
    color:#94a3b8;
}

/* Mobile */
@media (max-width:600px){

    #kh649-mobile-invoice .kh686b15r-notes-card{
        margin-top:16px !important;
        padding:14px !important;
        border-radius:14px !important;

        box-shadow:
            0 8px 22px rgba(15,23,42,.07),
            0 2px 6px rgba(37,99,235,.04) !important;
    }

    #kh649-mobile-invoice .kh686b15r-notes-input{
        min-height:82px !important;
    }
}


/* =========================================================
   KashfHesab V68.6B.15S
   Remove gap between customer area and invoice meta cards
   ========================================================= */

#kh649-mobile-invoice
[data-kh65-invoice-details]{
    padding-top:0 !important;
}

#kh649-mobile-invoice
.kh6761-invoice-meta{
    margin-top:0 !important;
}

#kh649-mobile-invoice
.kh6761-invoice-meta
.kh6761-meta-card{
    margin-top:0 !important;
}


/* =========================================================
   KashfHesab V68.6B.15U
   Items / totals visual divider
   ========================================================= */

#kh649-mobile-invoice .kh686b15u-items-divider{
    position:relative;

    width:100%;
    height:1px;

    margin:16px 0 14px;

    background:linear-gradient(
        90deg,
        transparent 0%,
        #cbd5e1 12%,
        #94a3b8 50%,
        #cbd5e1 88%,
        transparent 100%
    );
}

/* subtle center accent */
#kh649-mobile-invoice .kh686b15u-items-divider::after{
    content:"";

    position:absolute;
    top:-1px;
    left:50%;

    width:54px;
    height:3px;

    transform:translateX(-50%);

    border-radius:999px;

    background:linear-gradient(
        90deg,
        #2563eb,
        #14b8a6
    );

    box-shadow:0 1px 4px rgba(37,99,235,.16);
}

@media (max-width:600px){
    #kh649-mobile-invoice .kh686b15u-items-divider{
        margin:13px 0 12px;
    }
}


/* =========================================================
   KashfHesab V68.6B.15V
   Compact invoice totals
   ========================================================= */

/* Entire totals area closer to divider */
#kh649-mobile-invoice .kh686b3-summary{
    margin-top:0 !important;
    padding-top:0 !important;
}

/* Secondary total rows */
#kh649-mobile-invoice
.kh686b3-summary
.kh686b3-row:not(.kh686b3-net-row){
    min-height:0 !important;

    margin-top:0 !important;
    margin-bottom:0 !important;

    padding-top:3px !important;
    padding-bottom:3px !important;

    line-height:1.2 !important;
}

/* Secondary labels */
#kh649-mobile-invoice
.kh686b3-summary
.kh686b3-row:not(.kh686b3-net-row)
.kh686b3-label{
    font-size:11.5px !important;
    line-height:1.2 !important;
}

/* Secondary amounts */
#kh649-mobile-invoice
.kh686b3-summary
.kh686b3-row:not(.kh686b3-net-row)
.kh686b3-value{
    font-size:11.5px !important;
    line-height:1.2 !important;
}

/* Discount row itself more compact */
#kh649-mobile-invoice .kh686b5-discount-row{
    min-height:0 !important;
    margin:0 !important;
    padding-top:3px !important;
    padding-bottom:3px !important;
}

/* Discount input / type controls */
#kh649-mobile-invoice
.kh686b5-discount-row
.kh686b5-discount-input-wrap{
    font-size:11.5px !important;
    line-height:1.2 !important;
}

/* Keep NET TOTAL visually important */
#kh649-mobile-invoice .kh686b3-net-row{
    margin-top:5px !important;
    margin-bottom:0 !important;

    padding-top:7px !important;
    padding-bottom:5px !important;
}

/* Net label remains stronger */
#kh649-mobile-invoice
.kh686b3-net-row
.kh686b3-net-label{
    font-size:14px !important;
    font-weight:900 !important;
    line-height:1.25 !important;
}

/* Net amount remains prominent */
#kh649-mobile-invoice
.kh686b3-net-row
.kh686b3-net-value{
    font-size:17px !important;
    font-weight:900 !important;
    line-height:1.2 !important;
}

/* Slightly reduce divider -> totals gap */
#kh649-mobile-invoice .kh686b15u-items-divider{
    margin-bottom:8px !important;
}

@media (max-width:600px){

    #kh649-mobile-invoice
    .kh686b3-summary
    .kh686b3-row:not(.kh686b3-net-row){
        padding-top:2px !important;
        padding-bottom:2px !important;
    }

    #kh649-mobile-invoice
    .kh686b3-summary
    .kh686b3-row:not(.kh686b3-net-row)
    .kh686b3-label,

    #kh649-mobile-invoice
    .kh686b3-summary
    .kh686b3-row:not(.kh686b3-net-row)
    .kh686b3-value{
        font-size:11px !important;
    }
}


/* ============================================================
   KashfHesab V68.6B.17A
   Professional Sales-Invoice Customer Cards
   ============================================================ */

#kh649-mobile-invoice .kh65-customer-browser{
  padding:4px 2px 10px;
}

#kh649-mobile-invoice .kh65-customer-tools{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  margin-bottom:16px;
}

#kh649-mobile-invoice
.kh65-customer-tools
input[data-kh65-customer-search]{
  min-height:46px;
  border:1px solid #dbe4f0;
  border-radius:14px;
  background:#f8fafc;
  padding:0 15px;
  font-size:14px;
  font-weight:600;
  outline:none;
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

#kh649-mobile-invoice
.kh65-customer-tools
input[data-kh65-customer-search]:focus{
  background:#fff;
  border-color:#60a5fa;
  box-shadow:0 0 0 4px rgba(37,99,235,.10);
}

#kh649-mobile-invoice .kh65-customer-list{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px !important;
  padding:3px 2px 8px;
}

#kh649-mobile-invoice .kh65-customer-card{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  overflow:hidden;

  border:1px solid #e1e8f2 !important;
  border-radius:18px !important;

  background:
    radial-gradient(circle at 100% 0,
      rgba(37,99,235,.075),
      transparent 42%),
    linear-gradient(145deg,#ffffff 0%,#fbfdff 100%) !important;

  box-shadow:
    0 2px 4px rgba(15,23,42,.035),
    0 9px 24px rgba(15,23,42,.075) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

#kh649-mobile-invoice .kh65-customer-card::before{
  content:"";
  position:absolute;
  inset-block:13px;
  inset-inline-start:0;
  width:4px;
  border-radius:0 999px 999px 0;
  background:linear-gradient(180deg,#2563eb,#14b8a6);
  opacity:.82;
}

#kh649-mobile-invoice .kh65-customer-main{
  position:relative;
  width:100%;
  min-height:88px;

  display:flex;
  align-items:center;
  gap:13px;

  padding:15px 17px !important;

  border:0 !important;
  border-radius:18px !important;
  background:transparent !important;

  color:#0f172a !important;
  text-align:right !important;
  cursor:pointer;
}

#kh649-mobile-invoice .kh686b17a-avatar{
  width:48px;
  height:48px;
  flex:0 0 48px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:1px solid rgba(37,99,235,.14);
  border-radius:15px;

  background:
    linear-gradient(145deg,#eff6ff,#ecfeff);

  color:#1d4ed8;
  font-size:19px;
  font-weight:900;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 5px 13px rgba(37,99,235,.10);
}

#kh649-mobile-invoice .kh686b17a-customer-copy{
  min-width:0;
  flex:1;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
}

#kh649-mobile-invoice .kh686b17a-customer-name{
  display:block;
  width:100%;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:#0f172a;
  font-size:15px;
  line-height:1.35;
  font-weight:900;
}

#kh649-mobile-invoice .kh686b17a-customer-type{
  color:#64748b;
  font-size:11.5px;
  font-weight:700;
}

#kh649-mobile-invoice .kh686b17a-customer-arrow{
  width:29px;
  height:29px;
  flex:0 0 29px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:1px solid #dbeafe;
  border-radius:10px;

  background:#eff6ff;
  color:#2563eb;

  font-size:15px;
  font-weight:900;

  transition:
    transform .18s ease,
    background .18s ease,
    color .18s ease;
}

#kh649-mobile-invoice .kh65-customer-card:hover{
  transform:translateY(-2px);
  border-color:#bfdbfe !important;

  box-shadow:
    0 4px 8px rgba(15,23,42,.05),
    0 15px 30px rgba(37,99,235,.12) !important;
}

#kh649-mobile-invoice
.kh65-customer-card:hover
.kh686b17a-customer-arrow{
  transform:translateX(-2px);
  background:#2563eb;
  color:#fff;
}

#kh649-mobile-invoice .kh65-customer-card.is-open{
  transform:translateY(-1px);

  border-color:#60a5fa !important;

  background:
    radial-gradient(circle at 100% 0,
      rgba(37,99,235,.12),
      transparent 45%),
    linear-gradient(145deg,#ffffff,#f0f9ff) !important;

  box-shadow:
    0 0 0 3px rgba(37,99,235,.08),
    0 15px 32px rgba(37,99,235,.14) !important;
}

#kh649-mobile-invoice .kh65-customer-card.is-open::before{
  width:5px;
  background:linear-gradient(180deg,#2563eb,#10b981);
  opacity:1;
}

#kh649-mobile-invoice .kh65-customer-confirm{
  display:flex;
  align-items:center;
  gap:8px;

  margin:0 14px 13px;
  padding-top:11px;

  border-top:1px solid #e2e8f0;
}

#kh649-mobile-invoice .kh65-customer-confirm[hidden]{
  display:none !important;
}

#kh649-mobile-invoice .kh65-customer-confirm .btn{
  min-height:36px;
  border-radius:10px;
  font-weight:800;
}

#kh649-mobile-invoice .kh65-customer-empty{
  margin-top:12px;
  padding:20px 16px;

  border:1px dashed #cbd5e1;
  border-radius:16px;

  background:#f8fafc;
  color:#64748b;

  text-align:center;
  font-weight:700;
}

/* Tablet / narrow modal */
@media (max-width:760px){

  #kh649-mobile-invoice .kh65-customer-list{
    grid-template-columns:1fr !important;
    gap:11px !important;
  }

  #kh649-mobile-invoice .kh65-customer-main{
    min-height:82px;
  }
}

/* Phones */
@media (max-width:560px){

  #kh649-mobile-invoice .kh65-customer-tools{
    grid-template-columns:1fr;
    gap:9px;
    margin-bottom:13px;
  }

  #kh649-mobile-invoice
  .kh65-customer-tools
  [data-kh65-new-customer]{
    width:100%;
    min-height:43px;
  }

  #kh649-mobile-invoice .kh65-customer-list{
    padding-inline:1px;
  }

  #kh649-mobile-invoice .kh65-customer-card{
    border-radius:16px !important;
  }

  #kh649-mobile-invoice .kh65-customer-main{
    min-height:78px;
    padding:13px 14px !important;
    gap:11px;
    border-radius:16px !important;
  }

  #kh649-mobile-invoice .kh686b17a-avatar{
    width:44px;
    height:44px;
    flex-basis:44px;
    border-radius:13px;
    font-size:18px;
  }

  #kh649-mobile-invoice .kh686b17a-customer-name{
    font-size:14.5px;
  }

  #kh649-mobile-invoice .kh686b17a-customer-arrow{
    width:28px;
    height:28px;
    flex-basis:28px;
  }

  #kh649-mobile-invoice .kh65-customer-confirm{
    margin:0 12px 12px;
  }
}

@media (prefers-reduced-motion:reduce){
  #kh649-mobile-invoice .kh65-customer-card,
  #kh649-mobile-invoice .kh686b17a-customer-arrow{
    transition:none !important;
  }
}

/* ============================================================
   KashfHesab V68.6B.17B
   Customer cards — definitive mobile sizing / clipping fix
   ============================================================ */

#kh649-mobile-invoice
[data-kh65-customer-list].kh65-customer-list{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;

  height:auto !important;
  max-height:none !important;
  min-height:0 !important;

  overflow:visible !important;
}

#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card{
  position:relative !important;

  display:flex !important;
  flex-direction:column !important;

  width:100% !important;
  height:auto !important;
  min-height:86px !important;
  max-height:none !important;

  margin:0 !important;
  padding:0 !important;

  overflow:visible !important;

  border:1px solid #dbe5f1 !important;
  border-radius:17px !important;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #fbfdff 65%,
      #f1f7ff 100%
    ) !important;

  box-shadow:
    0 2px 4px rgba(15,23,42,.04),
    0 8px 22px rgba(15,23,42,.08) !important;

  isolation:isolate;
}

#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card::before{
  content:"" !important;

  position:absolute !important;
  z-index:1 !important;

  inset-inline-start:0 !important;
  top:15px !important;
  bottom:15px !important;

  width:4px !important;
  height:auto !important;

  border-radius:999px !important;

  background:
    linear-gradient(180deg,#2563eb,#14b8a6) !important;
}

#kh649-mobile-invoice
[data-kh65-customer-main].kh65-customer-main{
  position:relative !important;
  z-index:2 !important;

  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;

  width:100% !important;

  height:auto !important;
  min-height:86px !important;
  max-height:none !important;

  margin:0 !important;
  padding:14px 16px !important;

  gap:12px !important;

  overflow:visible !important;

  border:0 !important;
  border-radius:17px !important;

  background:transparent !important;

  text-align:right !important;
  white-space:normal !important;

  opacity:1 !important;
  visibility:visible !important;
}

#kh649-mobile-invoice
[data-kh65-customer-main]
.kh686b17a-avatar{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  min-height:46px !important;
  flex:0 0 46px !important;

  margin:0 !important;

  overflow:hidden !important;

  border:1px solid #bfdbfe !important;
  border-radius:14px !important;

  background:
    linear-gradient(145deg,#eff6ff,#ecfeff) !important;

  color:#1d4ed8 !important;

  font-size:19px !important;
  font-weight:900 !important;
  line-height:1 !important;

  opacity:1 !important;
  visibility:visible !important;

  box-shadow:
    0 5px 12px rgba(37,99,235,.10) !important;
}

#kh649-mobile-invoice
[data-kh65-customer-main]
.kh686b17a-customer-copy{
  display:flex !important;
  flex:1 1 auto !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;

  min-width:0 !important;
  height:auto !important;

  gap:3px !important;

  overflow:visible !important;

  opacity:1 !important;
  visibility:visible !important;
}

#kh649-mobile-invoice
[data-kh65-customer-main]
.kh686b17a-customer-name{
  display:block !important;

  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;

  margin:0 !important;
  padding:0 !important;

  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;

  color:#0f172a !important;

  font-size:15px !important;
  font-weight:900 !important;
  line-height:1.35 !important;

  opacity:1 !important;
  visibility:visible !important;
}

#kh649-mobile-invoice
[data-kh65-customer-main]
.kh686b17a-customer-type{
  display:block !important;

  height:auto !important;
  margin:0 !important;
  padding:0 !important;

  color:#64748b !important;

  font-size:11px !important;
  font-weight:700 !important;
  line-height:1.35 !important;

  opacity:1 !important;
  visibility:visible !important;
}

#kh649-mobile-invoice
[data-kh65-customer-main]
.kh686b17a-customer-arrow{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  min-height:30px !important;
  flex:0 0 30px !important;

  margin-inline-start:auto !important;

  border:1px solid #dbeafe !important;
  border-radius:10px !important;

  background:#eff6ff !important;
  color:#2563eb !important;

  font-size:15px !important;
  font-weight:900 !important;
  line-height:1 !important;

  opacity:1 !important;
  visibility:visible !important;
}

/* Selected/open customer */
#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card.is-open{
  height:auto !important;
  max-height:none !important;

  border-color:#60a5fa !important;

  box-shadow:
    0 0 0 3px rgba(37,99,235,.08),
    0 12px 28px rgba(37,99,235,.14) !important;
}

#kh649-mobile-invoice
[data-kh65-customer-confirm].kh65-customer-confirm{
  position:relative !important;
  z-index:3 !important;

  height:auto !important;
  max-height:none !important;

  margin:0 14px 13px !important;
  padding:10px 0 0 !important;

  overflow:visible !important;
}

#kh649-mobile-invoice
[data-kh65-customer-confirm].kh65-customer-confirm[hidden]{
  display:none !important;
}

/* Mobile: one proper card per row */
@media (max-width:760px){

  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card{
    min-height:82px !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-main].kh65-customer-main{
    min-height:82px !important;
    padding:13px 15px !important;
  }
}

/* Very small phones */
@media (max-width:380px){

  #kh649-mobile-invoice
  [data-kh65-customer-main].kh65-customer-main{
    min-height:78px !important;
    padding:12px 13px !important;
    gap:10px !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-main]
  .kh686b17a-avatar{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    flex-basis:42px !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-main]
  .kh686b17a-customer-name{
    font-size:14px !important;
  }
}


/* ============================================================
   KashfHesab V68.6B.17C
   Customer Cards — Restore Full Scrollable Customer List
   ============================================================ */

#kh649-mobile-invoice
[data-kh65-customer-list].kh65-customer-list{
  height:min(58vh, 520px) !important;
  max-height:min(58vh, 520px) !important;
  min-height:180px !important;

  overflow-x:hidden !important;
  overflow-y:auto !important;

  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;

  padding:3px 3px 12px !important;

  scrollbar-width:thin;
  scrollbar-color:#cbd5e1 transparent;
}

#kh649-mobile-invoice
[data-kh65-customer-list].kh65-customer-list::-webkit-scrollbar{
  width:6px;
}

#kh649-mobile-invoice
[data-kh65-customer-list].kh65-customer-list::-webkit-scrollbar-track{
  background:transparent;
}

#kh649-mobile-invoice
[data-kh65-customer-list].kh65-customer-list::-webkit-scrollbar-thumb{
  background:#cbd5e1;
  border-radius:999px;
}

/* Keep every customer card complete — never clip card content */
#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card{
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}

/* Mobile */
@media (max-width:760px){

  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    display:grid !important;
    grid-template-columns:1fr !important;

    height:calc(100dvh - 285px) !important;
    max-height:calc(100dvh - 285px) !important;
    min-height:220px !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;

    gap:10px !important;
    align-content:start !important;
  }
}

/* Short phone screens */
@media (max-width:760px) and (max-height:650px){

  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    height:calc(100dvh - 255px) !important;
    max-height:calc(100dvh - 255px) !important;
    min-height:180px !important;
  }
}


/* ============================================================
   KashfHesab V68.6B.17D
   Creative 3D Customer Cards + Expanding Selection
   ============================================================ */

/* ------------------------------------------------------------
   1. Card foundation
   ------------------------------------------------------------ */

#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card{
  --kh17d-accent:#2563eb;
  --kh17d-soft:#eff6ff;
  --kh17d-soft2:#dbeafe;
  --kh17d-dark:#1e3a8a;

  position:relative !important;

  height:auto !important;
  min-height:82px !important;
  max-height:none !important;

  overflow:visible !important;

  border:
    1px solid color-mix(
      in srgb,
      var(--kh17d-accent) 24%,
      #ffffff
    ) !important;

  border-radius:18px !important;

  background:
    radial-gradient(
      circle at 90% 8%,
      color-mix(in srgb,var(--kh17d-accent) 14%,transparent),
      transparent 42%
    ),
    linear-gradient(
      145deg,
      #ffffff 0%,
      var(--kh17d-soft) 100%
    ) !important;

  box-shadow:
    0 2px 2px rgba(255,255,255,.95) inset,
    0 -1px 0 rgba(15,23,42,.035) inset,
    0 5px 10px rgba(15,23,42,.07),
    0 13px 24px rgba(15,23,42,.08) !important;

  transform:
    perspective(900px)
    translateZ(0);

  transform-origin:center;

  transition:
    transform .22s cubic-bezier(.2,.8,.2,1),
    box-shadow .22s ease,
    border-color .22s ease,
    background .22s ease !important;
}


/* slim dimensional accent */
#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card::before{
  content:"";

  position:absolute;
  z-index:1;

  top:13px;
  bottom:13px;
  right:0;

  width:4px;

  border-radius:4px 0 0 4px;

  background:
    linear-gradient(
      180deg,
      color-mix(in srgb,var(--kh17d-accent) 72%,#fff),
      var(--kh17d-accent)
    );

  box-shadow:
    -2px 0 8px
    color-mix(in srgb,var(--kh17d-accent) 18%,transparent);

  pointer-events:none;
}


/* ------------------------------------------------------------
   2. Different creative palettes
   ------------------------------------------------------------ */

/* Royal blue */
#kh649-mobile-invoice
[data-kh65-customer-card]:nth-child(6n+1){
  --kh17d-accent:#2563eb;
  --kh17d-soft:#eff6ff;
  --kh17d-soft2:#dbeafe;
  --kh17d-dark:#1e40af;
}

/* Emerald */
#kh649-mobile-invoice
[data-kh65-customer-card]:nth-child(6n+2){
  --kh17d-accent:#059669;
  --kh17d-soft:#ecfdf5;
  --kh17d-soft2:#d1fae5;
  --kh17d-dark:#047857;
}

/* Violet */
#kh649-mobile-invoice
[data-kh65-customer-card]:nth-child(6n+3){
  --kh17d-accent:#7c3aed;
  --kh17d-soft:#f5f3ff;
  --kh17d-soft2:#ede9fe;
  --kh17d-dark:#6d28d9;
}

/* Amber */
#kh649-mobile-invoice
[data-kh65-customer-card]:nth-child(6n+4){
  --kh17d-accent:#d97706;
  --kh17d-soft:#fffbeb;
  --kh17d-soft2:#fef3c7;
  --kh17d-dark:#b45309;
}

/* Cyan */
#kh649-mobile-invoice
[data-kh65-customer-card]:nth-child(6n+5){
  --kh17d-accent:#0891b2;
  --kh17d-soft:#ecfeff;
  --kh17d-soft2:#cffafe;
  --kh17d-dark:#0e7490;
}

/* Rose */
#kh649-mobile-invoice
[data-kh65-customer-card]:nth-child(6n){
  --kh17d-accent:#e11d48;
  --kh17d-soft:#fff1f2;
  --kh17d-soft2:#ffe4e6;
  --kh17d-dark:#be123c;
}


/* ------------------------------------------------------------
   3. Main customer row
   ------------------------------------------------------------ */

#kh649-mobile-invoice
[data-kh65-customer-main].kh65-customer-main{
  position:relative !important;
  z-index:3 !important;

  border-radius:18px !important;

  transition:
    transform .2s ease,
    padding .2s ease !important;
}


/* Avatar inherits each card palette */
#kh649-mobile-invoice
[data-kh65-customer-card]
.kh686b17a-avatar{
  color:#fff !important;

  background:
    linear-gradient(
      145deg,
      color-mix(in srgb,var(--kh17d-accent) 72%,#fff),
      var(--kh17d-accent)
    ) !important;

  border:
    1px solid
    color-mix(in srgb,var(--kh17d-accent) 62%,#fff) !important;

  box-shadow:
    0 2px 2px rgba(255,255,255,.35) inset,
    0 5px 11px
    color-mix(in srgb,var(--kh17d-accent) 27%,transparent) !important;

  text-shadow:0 1px 2px rgba(0,0,0,.15);

  transition:
    transform .22s ease,
    box-shadow .22s ease !important;
}


/* Customer name */
#kh649-mobile-invoice
[data-kh65-customer-card]
.kh686b17a-customer-name{
  color:#172033 !important;
}


/* subtitle uses palette */
#kh649-mobile-invoice
[data-kh65-customer-card]
.kh686b17a-customer-type{
  color:var(--kh17d-dark) !important;
  opacity:.76;
}


/* Arrow */
#kh649-mobile-invoice
[data-kh65-customer-card]
.kh686b17a-customer-arrow{
  color:var(--kh17d-dark) !important;

  background:
    color-mix(
      in srgb,
      var(--kh17d-accent) 10%,
      #ffffff
    ) !important;

  border:
    1px solid
    color-mix(
      in srgb,
      var(--kh17d-accent) 18%,
      #ffffff
    ) !important;

  box-shadow:
    0 3px 8px
    color-mix(
      in srgb,
      var(--kh17d-accent) 12%,
      transparent
    );
}


/* ------------------------------------------------------------
   4. Hover / touch feedback
   ------------------------------------------------------------ */

@media (hover:hover){

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card:hover{
    transform:
      perspective(900px)
      translateY(-3px)
      translateZ(8px);

    border-color:
      color-mix(
        in srgb,
        var(--kh17d-accent) 42%,
        #ffffff
      ) !important;

    box-shadow:
      0 2px 2px rgba(255,255,255,.98) inset,
      0 7px 14px rgba(15,23,42,.09),
      0 17px 30px
      color-mix(
        in srgb,
        var(--kh17d-accent) 13%,
        rgba(15,23,42,.08)
      ) !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card:hover
  .kh686b17a-avatar{
    transform:translateY(-1px) scale(1.04);
  }
}


/* ------------------------------------------------------------
   5. OPEN CARD
   Important:
   it grows in normal document flow.
   Therefore cards below are pushed down instead of covered.
   ------------------------------------------------------------ */

#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card.is-open{
  z-index:8 !important;

  transform:
    perspective(900px)
    translateY(-2px)
    scale(1.012) !important;

  border-color:
    color-mix(
      in srgb,
      var(--kh17d-accent) 55%,
      #ffffff
    ) !important;

  background:
    radial-gradient(
      circle at 90% 5%,
      color-mix(in srgb,var(--kh17d-accent) 20%,transparent),
      transparent 43%
    ),
    linear-gradient(
      145deg,
      #ffffff 0%,
      var(--kh17d-soft2) 145%
    ) !important;

  box-shadow:
    0 2px 2px rgba(255,255,255,.98) inset,
    0 8px 16px rgba(15,23,42,.10),
    0 19px 36px
    color-mix(
      in srgb,
      var(--kh17d-accent) 18%,
      transparent
    ) !important;
}


/* Slight avatar emphasis when selected */
#kh649-mobile-invoice
[data-kh65-customer-card].is-open
.kh686b17a-avatar{
  transform:scale(1.07);

  box-shadow:
    0 2px 2px rgba(255,255,255,.40) inset,
    0 7px 15px
    color-mix(
      in srgb,
      var(--kh17d-accent) 34%,
      transparent
    ) !important;
}


/* ------------------------------------------------------------
   6. Confirmation area
   Must participate in normal layout.
   ------------------------------------------------------------ */

#kh649-mobile-invoice
[data-kh65-customer-confirm].kh65-customer-confirm{
  position:relative !important;
  inset:auto !important;

  z-index:4 !important;

  width:auto !important;
  height:auto !important;
  max-height:none !important;

  margin:0 13px 13px !important;
  padding:10px !important;

  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;

  overflow:visible !important;

  border:
    1px solid
    color-mix(
      in srgb,
      var(--kh17d-accent) 16%,
      #ffffff
    ) !important;

  border-radius:13px !important;

  background:
    rgba(255,255,255,.76) !important;

  box-shadow:
    0 1px 0 rgba(255,255,255,.9) inset,
    0 5px 13px rgba(15,23,42,.055) !important;

  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);

  transform-origin:top center;

  animation:
    kh686b17dConfirmIn
    .20s cubic-bezier(.2,.8,.2,1)
    both;
}


/* Hidden must stay hidden */
#kh649-mobile-invoice
[data-kh65-customer-confirm].kh65-customer-confirm[hidden]{
  display:none !important;
}


/* Confirmation buttons */
#kh649-mobile-invoice
[data-kh65-customer-confirm]
.btn{
  min-height:40px !important;
  margin:0 !important;

  border-radius:11px !important;

  font-weight:850 !important;
}


/* Add button follows card color */
#kh649-mobile-invoice
[data-kh65-customer-confirm]
.btn.primary{
  color:#fff !important;

  background:
    linear-gradient(
      135deg,
      color-mix(in srgb,var(--kh17d-accent) 78%,#fff),
      var(--kh17d-accent)
    ) !important;

  border:
    1px solid var(--kh17d-accent) !important;

  box-shadow:
    0 5px 11px
    color-mix(
      in srgb,
      var(--kh17d-accent) 24%,
      transparent
    ) !important;
}


/* Cancel */
#kh649-mobile-invoice
[data-kh65-customer-confirm]
.btn.ghost{
  background:#fff !important;
  color:#475569 !important;
  border:1px solid #dbe3ee !important;
}


/* ------------------------------------------------------------
   7. Animations
   ------------------------------------------------------------ */

@keyframes kh686b17dConfirmIn{
  from{
    opacity:0;
    transform:translateY(-7px) scale(.985);
  }

  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}


/* ------------------------------------------------------------
   8. Mobile:
   keep expansion inside normal flow and preserve scrolling.
   ------------------------------------------------------------ */

@media (max-width:760px){

  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    align-items:start !important;
    align-content:start !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card{
    width:100% !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card.is-open{
    transform:
      perspective(900px)
      translateY(-1px)
      scale(1.008) !important;

    margin-top:2px !important;
    margin-bottom:4px !important;
  }
}


/* Accessibility */
@media (prefers-reduced-motion:reduce){

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card,

  #kh649-mobile-invoice
  [data-kh65-customer-card]
  .kh686b17a-avatar,

  #kh649-mobile-invoice
  [data-kh65-customer-confirm].kh65-customer-confirm{
    transition:none !important;
    animation:none !important;
  }
}


/* ============================================================
   KashfHesab V68.6B.17E
   Customer Card — True Flow Expansion
   Open card pushes neighbouring cards instead of covering them
   ============================================================ */

@media (max-width:760px){

  /* Grid rows must follow real card height */
  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-auto-rows:auto !important;
    grid-auto-flow:row !important;

    align-items:start !important;
    align-content:start !important;

    row-gap:10px !important;
  }

  /* Every card occupies its real height */
  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card{
    position:relative !important;

    display:flex !important;
    flex-direction:column !important;

    align-self:start !important;

    width:100% !important;
    height:auto !important;
    min-height:82px !important;
    max-height:none !important;

    margin:0 !important;

    overflow:visible !important;

    /* Important:
       no visual scale that can overlap next card */
    transform:none !important;

    transition:
      min-height .24s cubic-bezier(.2,.8,.2,1),
      margin .24s cubic-bezier(.2,.8,.2,1),
      box-shadow .24s ease,
      border-color .24s ease,
      background .24s ease !important;
  }

  /* Main row remains normal document flow */
  #kh649-mobile-invoice
  [data-kh65-customer-main].kh65-customer-main{
    position:relative !important;

    flex:0 0 auto !important;

    width:100% !important;
    min-height:82px !important;

    transform:none !important;
  }

  /* Open card becomes physically taller */
  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card.is-open{
    position:relative !important;

    height:auto !important;
    min-height:142px !important;
    max-height:none !important;

    margin:
      3px
      0
      7px
      0 !important;

    transform:none !important;

    overflow:visible !important;

    z-index:2 !important;
  }

  /* Confirmation panel is PART of card height */
  #kh649-mobile-invoice
  [data-kh65-customer-card].is-open
  [data-kh65-customer-confirm].kh65-customer-confirm:not([hidden]){
    position:relative !important;

    inset:auto !important;

    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    flex:0 0 auto !important;

    width:auto !important;
    height:auto !important;
    min-height:58px !important;
    max-height:none !important;

    margin:
      0
      13px
      13px
      13px !important;

    padding:9px !important;

    overflow:visible !important;

    transform:none !important;
  }

  /* Closed confirmation panel occupies zero space */
  #kh649-mobile-invoice
  [data-kh65-customer-confirm].kh65-customer-confirm[hidden]{
    display:none !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* Keep following cards in their own layout rows */
  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card + 
  [data-kh65-customer-card].kh65-customer-card{
    position:relative !important;
  }
}

/* Desktop/tablet also expand in normal flow */
@media (min-width:761px){

  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    align-items:start !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card.is-open{
    height:auto !important;
    max-height:none !important;

    transform:translateY(-2px) !important;

    margin-bottom:8px !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].is-open
  [data-kh65-customer-confirm].kh65-customer-confirm:not([hidden]){
    position:relative !important;
    inset:auto !important;

    height:auto !important;
    max-height:none !important;

    overflow:visible !important;
  }
}


/* ============================================================
   KashfHesab V68.6B.17E
   Customer Card — True Flow Expansion
   Open card pushes neighbouring cards instead of covering them
   ============================================================ */

@media (max-width:760px){

  /* Grid rows must follow real card height */
  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-auto-rows:auto !important;
    grid-auto-flow:row !important;

    align-items:start !important;
    align-content:start !important;

    row-gap:10px !important;
  }

  /* Every card occupies its real height */
  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card{
    position:relative !important;

    display:flex !important;
    flex-direction:column !important;

    align-self:start !important;

    width:100% !important;
    height:auto !important;
    min-height:82px !important;
    max-height:none !important;

    margin:0 !important;

    overflow:visible !important;

    /* Important:
       no visual scale that can overlap next card */
    transform:none !important;

    transition:
      min-height .24s cubic-bezier(.2,.8,.2,1),
      margin .24s cubic-bezier(.2,.8,.2,1),
      box-shadow .24s ease,
      border-color .24s ease,
      background .24s ease !important;
  }

  /* Main row remains normal document flow */
  #kh649-mobile-invoice
  [data-kh65-customer-main].kh65-customer-main{
    position:relative !important;

    flex:0 0 auto !important;

    width:100% !important;
    min-height:82px !important;

    transform:none !important;
  }

  /* Open card becomes physically taller */
  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card.is-open{
    position:relative !important;

    height:auto !important;
    min-height:142px !important;
    max-height:none !important;

    margin:
      3px
      0
      7px
      0 !important;

    transform:none !important;

    overflow:visible !important;

    z-index:2 !important;
  }

  /* Confirmation panel is PART of card height */
  #kh649-mobile-invoice
  [data-kh65-customer-card].is-open
  [data-kh65-customer-confirm].kh65-customer-confirm:not([hidden]){
    position:relative !important;

    inset:auto !important;

    display:grid !important;
    grid-template-columns:1fr 1fr !important;

    flex:0 0 auto !important;

    width:auto !important;
    height:auto !important;
    min-height:58px !important;
    max-height:none !important;

    margin:
      0
      13px
      13px
      13px !important;

    padding:9px !important;

    overflow:visible !important;

    transform:none !important;
  }

  /* Closed confirmation panel occupies zero space */
  #kh649-mobile-invoice
  [data-kh65-customer-confirm].kh65-customer-confirm[hidden]{
    display:none !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  /* Keep following cards in their own layout rows */
  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card + 
  [data-kh65-customer-card].kh65-customer-card{
    position:relative !important;
  }
}

/* Desktop/tablet also expand in normal flow */
@media (min-width:761px){

  #kh649-mobile-invoice
  [data-kh65-customer-list].kh65-customer-list{
    align-items:start !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].kh65-customer-card.is-open{
    height:auto !important;
    max-height:none !important;

    transform:translateY(-2px) !important;

    margin-bottom:8px !important;
  }

  #kh649-mobile-invoice
  [data-kh65-customer-card].is-open
  [data-kh65-customer-confirm].kh65-customer-confirm:not([hidden]){
    position:relative !important;
    inset:auto !important;

    height:auto !important;
    max-height:none !important;

    overflow:visible !important;
  }
}


/* ============================================================
   KashfHesab V68.6B.17F
   Restore Instant Customer Search
   Respect JS card.hidden while keeping V17E flow expansion
   ============================================================ */

/* A customer hidden by the live-search JS must disappear
   even though the card normally uses display:flex !important. */
#kh649-mobile-invoice
[data-kh65-customer-card].kh65-customer-card[hidden]{
  display:none !important;
}

/* Empty-search-result message must also respect hidden state. */
#kh649-mobile-invoice
[data-kh65-customer-empty][hidden]{
  display:none !important;
}


/* ============================================================
   KashfHesab V68.6B.20B.2 — Accounting UI Polish
   ============================================================ */

/* ---------- Accounting sidebar submenu ---------- */

.kh-accounting-menu{
  margin-top:3px;
}

.kh-accounting-toggle{
  position:relative;
}

.kh-accounting-menu.is-open .kh-accounting-toggle{
  background:rgba(255,255,255,.07);
}

.kh-accounting-submenu{
  margin:5px 9px 8px 0;
  padding:6px;
  border-right:1px solid rgba(148,163,184,.24);
  border-radius:10px;
  background:rgba(255,255,255,.035);
}

.kh-accounting-subitem{
  display:flex;
  align-items:center;
  gap:9px;

  min-height:38px;
  padding:8px 10px;
  margin:2px 0;

  border-radius:9px;

  /* Important: light readable text on dark sidebar */
  color:#dbe7f5 !important;
  text-decoration:none;

  font-size:12.5px;
  font-weight:700;

  transition:
    background .15s ease,
    color .15s ease,
    transform .15s ease;
}

.kh-accounting-subitem span{
  color:inherit !important;
}

.kh-accounting-subicon{
  width:25px;
  height:25px;
  flex:0 0 25px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:7px;

  background:rgba(255,255,255,.08);

  color:#f8fbff !important;
  font-size:13px;
}

.kh-accounting-subitem:hover{
  color:#ffffff !important;
  background:rgba(59,130,246,.16);
  transform:translateX(-2px);
}

.kh-accounting-subitem:hover .kh-accounting-subicon{
  background:rgba(59,130,246,.24);
}

.kh-accounting-subitem.active{
  color:#ffffff !important;
  background:linear-gradient(
    135deg,
    rgba(37,99,235,.38),
    rgba(14,165,233,.20)
  );

  box-shadow:
    inset -3px 0 0 #60a5fa,
    0 4px 12px rgba(0,0,0,.08);
}

.kh-accounting-subitem.active .kh-accounting-subicon{
  color:#ffffff !important;
  background:rgba(96,165,250,.25);
}

.kh-accounting-arrow{
  color:#cbd5e1 !important;
}


/* ---------- Accounting Home button ---------- */

.kh-accounting-home-back{
  position:relative;

  min-height:44px !important;
  padding:0 17px !important;

  gap:9px !important;

  border:1px solid rgba(37,99,235,.22) !important;
  border-radius:13px !important;

  background:
    linear-gradient(135deg,#173f7a,#2563eb) !important;

  color:#ffffff !important;

  font-size:13px !important;
  font-weight:900 !important;

  box-shadow:
    0 7px 18px rgba(37,99,235,.20),
    inset 0 1px 0 rgba(255,255,255,.16);

  overflow:hidden;

  transition:
    transform .15s ease,
    box-shadow .15s ease,
    filter .15s ease !important;
}

.kh-accounting-home-back::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    120deg,
    rgba(255,255,255,.12),
    transparent 45%
  );
  pointer-events:none;
}

.kh-accounting-home-back span{
  position:relative;
  z-index:1;
  color:#ffffff !important;
}

.kh-accounting-home-back-icon{
  width:27px;
  height:27px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  border-radius:8px;

  background:rgba(255,255,255,.15);

  font-size:17px !important;
  line-height:1;
}

.kh-accounting-home-back:hover{
  color:#ffffff !important;
  transform:translateY(-2px) !important;

  filter:brightness(1.06);

  box-shadow:
    0 10px 24px rgba(37,99,235,.27),
    inset 0 1px 0 rgba(255,255,255,.18);
}

.kh-accounting-home-back:active{
  transform:translateY(0) !important;
}


/* ---------- Mobile ---------- */

@media(max-width:700px){

  .kh-accounting-home-back{
    min-height:42px !important;
    padding:0 14px !important;
  }

  .kh-accounting-subitem{
    min-height:40px;
    font-size:13px;
  }

}

/* ============================================================
   KashfHesab V68.6B.20B.4 — Accounting Transaction Cards
   ============================================================ */

/*
 * كل حركة تظهر كبطاقة مستقلة.
 * لا تغيير في HTML أو البيانات أو منطق المحاسبة.
 */

.kh-accounting-table-wrap{
  background:transparent !important;
  border:0 !important;
  overflow:visible !important;
}

.kh-accounting-table-head{
  margin-bottom:10px;
  border:1px solid var(--line) !important;
  border-radius:13px;
  background:var(--panel);
}

/* مساحة بين البطاقات */
.kh-accounting-table-wrap .scrollx{
  overflow-x:auto;
  padding:3px 3px 12px;
}

.kh-accounting-table-wrap table.items{
  border-collapse:separate !important;
  border-spacing:0 9px !important;
  background:transparent !important;
}

/* رأس الأعمدة */
.kh-accounting-table-wrap table.items thead th{
  border:0 !important;
  background:transparent !important;
  color:var(--ink-3);
  font-size:11px;
  font-weight:800;
  padding-top:5px;
  padding-bottom:5px;
}

/* ===========================
   Transaction Card
   =========================== */

.kh-accounting-table-wrap
table.items
tbody
.kh-accounting-row{
  position:relative;

  background:var(--panel) !important;

  cursor:pointer;

  filter:
    drop-shadow(0 3px 7px rgba(15,23,42,.035));

  transition:
    transform .16s ease,
    filter .16s ease,
    background .16s ease;
}

/*
 * حدود البطاقة باستخدام خلايا الصف
 */
.kh-accounting-table-wrap
.kh-accounting-row td{
  position:relative;

  padding-top:14px !important;
  padding-bottom:14px !important;

  background:var(--panel) !important;

  border-top:1px solid var(--line) !important;
  border-bottom:1px solid var(--line) !important;

  transition:
    background .16s ease,
    border-color .16s ease,
    color .16s ease,
    box-shadow .16s ease;
}

/* أول خلية في RTL */
.kh-accounting-table-wrap
.kh-accounting-row td:first-child{
  border-right:1px solid var(--line) !important;
  border-radius:0 13px 13px 0 !important;
}

/* آخر خلية في RTL */
.kh-accounting-table-wrap
.kh-accounting-row td:last-child{
  border-left:1px solid var(--line) !important;
  border-radius:13px 0 0 13px !important;
}


/* ===========================
   Hover
   =========================== */

.kh-accounting-table-wrap
.kh-accounting-row:hover{
  transform:translateY(-2px);
  filter:
    drop-shadow(0 7px 13px rgba(15,23,42,.08));
}

.kh-accounting-table-wrap
.kh-accounting-row:hover td{
  border-color:rgba(37,99,235,.24) !important;
  background:
    linear-gradient(
      180deg,
      rgba(248,250,252,.95),
      rgba(255,255,255,1)
    ) !important;
}


/* ===========================
   First click — Selected
   =========================== */

.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected{
  transform:translateY(-2px) scale(1.002);
  filter:
    drop-shadow(0 9px 18px rgba(37,99,235,.14));
}

/* يلغي التحديد القديم الموجود في admin.php بصرياً */
.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected td{
  background:
    linear-gradient(
      135deg,
      rgba(239,246,255,.98),
      rgba(248,251,255,1)
    ) !important;

  border-top-color:rgba(37,99,235,.52) !important;
  border-bottom-color:rgba(37,99,235,.52) !important;

  color:var(--ink) !important;
}

/* يمين البطاقة */
.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected td:first-child{
  border-right:4px solid #2563eb !important;

  box-shadow:
    inset -8px 0 14px rgba(37,99,235,.045);
}

/* يسار البطاقة */
.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected td:last-child{
  border-left-color:rgba(37,99,235,.52) !important;
}


/* ===========================
   Selected check indicator
   =========================== */

.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected
td:first-child::after{
  content:"✓";

  position:absolute;
  top:-8px;
  right:-7px;

  width:21px;
  height:21px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:2px solid #fff;
  border-radius:50%;

  background:#2563eb;
  color:#fff;

  font-size:11px;
  font-weight:900;

  box-shadow:
    0 3px 8px rgba(37,99,235,.30);

  animation:
    khAccountingCardSelect .18s ease-out;
}

@keyframes khAccountingCardSelect{
  from{
    opacity:0;
    transform:scale(.65);
  }

  to{
    opacity:1;
    transform:scale(1);
  }
}


/* ===========================
   Important values
   =========================== */

.kh-accounting-table-wrap
.kh-accounting-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-width:55px;
  min-height:27px;

  padding:3px 9px;

  border-radius:8px;

  background:rgba(15,23,42,.045);

  color:var(--ink);

  font-weight:900;
}

.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected
.kh-accounting-number{
  background:rgba(37,99,235,.10);
  color:#1d4ed8;
}

.kh-accounting-table-wrap
.kh-accounting-customer{
  color:var(--ink);
  font-weight:800;
}

.kh-accounting-table-wrap
.kh-accounting-amount{
  font-size:14px;
  font-weight:900 !important;
}


/* ===========================
   Mobile
   =========================== */

@media(max-width:700px){

  .kh-accounting-table-wrap
  table.items{
    border-spacing:0 8px !important;
  }

  .kh-accounting-table-wrap
  .kh-accounting-row td{
    padding-top:13px !important;
    padding-bottom:13px !important;
  }

  .kh-accounting-table-wrap
  .kh-accounting-row.kh-accounting-selected{
    transform:translateY(-1px);
  }

}

/* ============================================================
   KashfHesab V68.6B.20B.5 — Balanced Accounting Cards
   ============================================================ */

/* Four balanced accounting columns */
.kh-accounting-table-wrap table.items{
  width:100%;
  table-layout:fixed;
}

.kh-accounting-table-wrap table.items th:nth-child(1),
.kh-accounting-table-wrap table.items td:nth-child(1){
  width:17%;
}

.kh-accounting-table-wrap table.items th:nth-child(2),
.kh-accounting-table-wrap table.items td:nth-child(2){
  width:18%;
}

.kh-accounting-table-wrap table.items th:nth-child(3),
.kh-accounting-table-wrap table.items td:nth-child(3){
  width:43%;
}

.kh-accounting-table-wrap table.items th:nth-child(4),
.kh-accounting-table-wrap table.items td:nth-child(4){
  width:22%;
}

/* Unified vertical alignment */
.kh-accounting-table-wrap .kh-accounting-row td{
  vertical-align:middle !important;
  line-height:1.35;
}

/* Date + user */
.kh-accounting-date{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:3px;
  min-height:35px;
}

.kh-accounting-date strong{
  direction:ltr;
  display:inline-block;
  color:var(--ink);
  font-size:13.5px;
  font-weight:900;
  line-height:1.15;
}

.kh-accounting-date-user{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  color:var(--ink-3);
  font-size:9.5px;
  font-weight:600;
  line-height:1.2;
}

/* Number */
.kh-accounting-table-wrap .kh-accounting-number{
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

/* Customer */
.kh-accounting-table-wrap .kh-accounting-customer{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Amount */
.kh-accounting-table-wrap .kh-accounting-amount{
  text-align:left !important;
  direction:ltr;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}

/* Selected card: make date/user part of same visual hierarchy */
.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected
.kh-accounting-date-user{
  color:#64748b;
}

/* Mobile keeps the same clean four-column structure */
@media(max-width:700px){

  .kh-accounting-table-wrap table.items{
    min-width:540px;
  }

  .kh-accounting-table-wrap table.items th:nth-child(1),
  .kh-accounting-table-wrap table.items td:nth-child(1){
    width:18%;
  }

  .kh-accounting-table-wrap table.items th:nth-child(2),
  .kh-accounting-table-wrap table.items td:nth-child(2){
    width:18%;
  }

  .kh-accounting-table-wrap table.items th:nth-child(3),
  .kh-accounting-table-wrap table.items td:nth-child(3){
    width:40%;
  }

  .kh-accounting-table-wrap table.items th:nth-child(4),
  .kh-accounting-table-wrap table.items td:nth-child(4){
    width:24%;
  }

  .kh-accounting-date strong{
    font-size:13px;
  }

  .kh-accounting-date-user{
    font-size:9px;
  }
}

/* ============================================================
   KashfHesab V68.6B.20B.6 — Professional Accounting Colors
   ============================================================ */

/* ---------- Base professional card ---------- */

.kh-accounting-table-wrap .kh-accounting-row td{
  background:
    linear-gradient(
      110deg,
      rgba(255,255,255,.99),
      rgba(248,250,252,.97)
    ) !important;

  border-top-color:rgba(148,163,184,.22) !important;
  border-bottom-color:rgba(148,163,184,.22) !important;
}

.kh-accounting-table-wrap .kh-accounting-row td:first-child{
  border-right-width:4px !important;
}

.kh-accounting-table-wrap .kh-accounting-row{
  filter:
    drop-shadow(0 4px 9px rgba(15,23,42,.055));
}


/* ---------- Sales invoice / Blue ---------- */

.kh-accounting-table-wrap
.kh-accounting-type-invoice td{
  background:
    linear-gradient(
      110deg,
      rgba(239,246,255,.96),
      rgba(255,255,255,.99) 45%,
      rgba(248,251,255,.98)
    ) !important;
}

.kh-accounting-table-wrap
.kh-accounting-type-invoice td:first-child{
  border-right-color:#3b82f6 !important;
}


/* ---------- Receipt / Green ---------- */

.kh-accounting-table-wrap
.kh-accounting-type-receipt td{
  background:
    linear-gradient(
      110deg,
      rgba(236,253,245,.96),
      rgba(255,255,255,.99) 45%,
      rgba(247,254,250,.98)
    ) !important;
}

.kh-accounting-table-wrap
.kh-accounting-type-receipt td:first-child{
  border-right-color:#22c55e !important;
}


/* ---------- Purchase invoice / Orange ---------- */

.kh-accounting-table-wrap
.kh-accounting-type-purchase_invoice td{
  background:
    linear-gradient(
      110deg,
      rgba(255,247,237,.97),
      rgba(255,255,255,.99) 45%,
      rgba(255,251,245,.98)
    ) !important;
}

.kh-accounting-table-wrap
.kh-accounting-type-purchase_invoice td:first-child{
  border-right-color:#f59e0b !important;
}


/* ---------- Payment / Red ---------- */

.kh-accounting-table-wrap
.kh-accounting-type-payment td{
  background:
    linear-gradient(
      110deg,
      rgba(255,241,242,.97),
      rgba(255,255,255,.99) 45%,
      rgba(255,248,248,.98)
    ) !important;
}

.kh-accounting-table-wrap
.kh-accounting-type-payment td:first-child{
  border-right-color:#ef4444 !important;
}


/* ---------- Sales return / Cyan ---------- */

.kh-accounting-table-wrap
.kh-accounting-type-sales_return td{
  background:
    linear-gradient(
      110deg,
      rgba(236,254,255,.97),
      rgba(255,255,255,.99) 45%,
      rgba(247,254,255,.98)
    ) !important;
}

.kh-accounting-table-wrap
.kh-accounting-type-sales_return td:first-child{
  border-right-color:#06b6d4 !important;
}


/* ---------- Purchase return / Violet ---------- */

.kh-accounting-table-wrap
.kh-accounting-type-purchase_return td{
  background:
    linear-gradient(
      110deg,
      rgba(245,243,255,.97),
      rgba(255,255,255,.99) 45%,
      rgba(250,248,255,.98)
    ) !important;
}

.kh-accounting-table-wrap
.kh-accounting-type-purchase_return td:first-child{
  border-right-color:#8b5cf6 !important;
}


/* ============================================================
   Hover effects
   ============================================================ */

.kh-accounting-table-wrap
.kh-accounting-row:hover{
  transform:translateY(-3px) scale(1.001);

  filter:
    drop-shadow(0 10px 18px rgba(15,23,42,.11));
}

.kh-accounting-table-wrap
.kh-accounting-row:hover td{
  border-top-color:rgba(59,130,246,.25) !important;
  border-bottom-color:rgba(59,130,246,.25) !important;
}


/* ============================================================
   Selected — first click
   ============================================================ */

.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected{
  transform:translateY(-3px) scale(1.003);

  filter:
    drop-shadow(0 11px 21px rgba(37,99,235,.18));
}

.kh-accounting-table-wrap
.kh-accounting-row.kh-accounting-selected td{
  border-top-color:rgba(37,99,235,.58) !important;
  border-bottom-color:rgba(37,99,235,.58) !important;
}


/* Invoice selected */

.kh-accounting-table-wrap
.kh-accounting-type-invoice.kh-accounting-selected td{
  background:
    linear-gradient(
      110deg,
      rgba(219,234,254,.98),
      rgba(239,246,255,.98) 48%,
      rgba(255,255,255,.99)
    ) !important;
}


/* Receipt selected */

.kh-accounting-table-wrap
.kh-accounting-type-receipt.kh-accounting-selected{
  filter:
    drop-shadow(0 11px 21px rgba(34,197,94,.17));
}

.kh-accounting-table-wrap
.kh-accounting-type-receipt.kh-accounting-selected td{
  background:
    linear-gradient(
      110deg,
      rgba(220,252,231,.98),
      rgba(240,253,244,.98) 48%,
      rgba(255,255,255,.99)
    ) !important;

  border-top-color:rgba(34,197,94,.50) !important;
  border-bottom-color:rgba(34,197,94,.50) !important;
}


/* Purchase selected */

.kh-accounting-table-wrap
.kh-accounting-type-purchase_invoice.kh-accounting-selected{
  filter:
    drop-shadow(0 11px 21px rgba(245,158,11,.17));
}

.kh-accounting-table-wrap
.kh-accounting-type-purchase_invoice.kh-accounting-selected td{
  background:
    linear-gradient(
      110deg,
      rgba(254,243,199,.98),
      rgba(255,247,237,.98) 48%,
      rgba(255,255,255,.99)
    ) !important;

  border-top-color:rgba(245,158,11,.50) !important;
  border-bottom-color:rgba(245,158,11,.50) !important;
}


/* Payment selected */

.kh-accounting-table-wrap
.kh-accounting-type-payment.kh-accounting-selected{
  filter:
    drop-shadow(0 11px 21px rgba(239,68,68,.16));
}

.kh-accounting-table-wrap
.kh-accounting-type-payment.kh-accounting-selected td{
  background:
    linear-gradient(
      110deg,
      rgba(254,226,226,.98),
      rgba(255,241,242,.98) 48%,
      rgba(255,255,255,.99)
    ) !important;

  border-top-color:rgba(239,68,68,.48) !important;
  border-bottom-color:rgba(239,68,68,.48) !important;
}


/* Sales return selected */

.kh-accounting-table-wrap
.kh-accounting-type-sales_return.kh-accounting-selected{
  filter:
    drop-shadow(0 11px 21px rgba(6,182,212,.16));
}

.kh-accounting-table-wrap
.kh-accounting-type-sales_return.kh-accounting-selected td{
  background:
    linear-gradient(
      110deg,
      rgba(207,250,254,.98),
      rgba(236,254,255,.98) 48%,
      rgba(255,255,255,.99)
    ) !important;

  border-top-color:rgba(6,182,212,.48) !important;
  border-bottom-color:rgba(6,182,212,.48) !important;
}


/* Purchase return selected */

.kh-accounting-table-wrap
.kh-accounting-type-purchase_return.kh-accounting-selected{
  filter:
    drop-shadow(0 11px 21px rgba(139,92,246,.17));
}

.kh-accounting-table-wrap
.kh-accounting-type-purchase_return.kh-accounting-selected td{
  background:
    linear-gradient(
      110deg,
      rgba(237,233,254,.98),
      rgba(245,243,255,.98) 48%,
      rgba(255,255,255,.99)
    ) !important;

  border-top-color:rgba(139,92,246,.48) !important;
  border-bottom-color:rgba(139,92,246,.48) !important;
}


/* ============================================================
   Amount styling
   ============================================================ */

.kh-accounting-table-wrap .kh-accounting-amount{
  font-size:15px !important;
  letter-spacing:.1px;
}

.kh-accounting-type-invoice .kh-accounting-amount,
.kh-accounting-type-receipt .kh-accounting-amount{
  color:#059669 !important;
}

.kh-accounting-type-payment .kh-accounting-amount,
.kh-accounting-type-sales_return .kh-accounting-amount,
.kh-accounting-type-purchase_return .kh-accounting-amount{
  color:#dc2626 !important;
}

.kh-accounting-type-purchase_invoice .kh-accounting-amount{
  color:#d97706 !important;
}


/* ============================================================
   Number badge follows transaction color
   ============================================================ */

.kh-accounting-type-invoice .kh-accounting-number{
  background:rgba(59,130,246,.10) !important;
  color:#1d4ed8 !important;
}

.kh-accounting-type-receipt .kh-accounting-number{
  background:rgba(34,197,94,.11) !important;
  color:#15803d !important;
}

.kh-accounting-type-purchase_invoice .kh-accounting-number{
  background:rgba(245,158,11,.12) !important;
  color:#b45309 !important;
}

.kh-accounting-type-payment .kh-accounting-number{
  background:rgba(239,68,68,.10) !important;
  color:#b91c1c !important;
}

.kh-accounting-type-sales_return .kh-accounting-number{
  background:rgba(6,182,212,.11) !important;
  color:#0e7490 !important;
}

.kh-accounting-type-purchase_return .kh-accounting-number{
  background:rgba(139,92,246,.11) !important;
  color:#6d28d9 !important;
}


/* Mobile: keep shadows elegant, not heavy */
@media(max-width:700px){

  .kh-accounting-table-wrap
  .kh-accounting-row{
    filter:
      drop-shadow(0 3px 7px rgba(15,23,42,.055));
  }

  .kh-accounting-table-wrap
  .kh-accounting-row:hover{
    transform:none;
  }

  .kh-accounting-table-wrap
  .kh-accounting-row.kh-accounting-selected{
    transform:translateY(-1px);

    filter:
      drop-shadow(0 7px 13px rgba(37,99,235,.15));
  }

}

/* ============================================================
   KashfHesab V68.6B.20B.8 — Safe Mobile Accounting Cards
   كامل البطاقة داخل شاشة الهاتف بدون كسر صفحة المحاسبة
   ============================================================ */

@media (max-width:700px){

  /*
   * لا نخفي scrollx كما حدث في V20B.7.
   * نضغط الجدول نفسه فقط.
   */
  .kh-accounting-table-wrap table.items{
    width:100% !important;
    min-width:100% !important;
    table-layout:fixed !important;
  }

  .kh-accounting-table-wrap table.items th,
  .kh-accounting-table-wrap table.items td{
    box-sizing:border-box !important;
  }

  /* التاريخ */
  .kh-accounting-table-wrap table.items th:nth-child(1),
  .kh-accounting-table-wrap table.items td:nth-child(1){
    width:18% !important;
  }

  /* الرقم */
  .kh-accounting-table-wrap table.items th:nth-child(2),
  .kh-accounting-table-wrap table.items td:nth-child(2){
    width:19% !important;
  }

  /* الزبون */
  .kh-accounting-table-wrap table.items th:nth-child(3),
  .kh-accounting-table-wrap table.items td:nth-child(3){
    width:36% !important;
  }

  /* المبلغ */
  .kh-accounting-table-wrap table.items th:nth-child(4),
  .kh-accounting-table-wrap table.items td:nth-child(4){
    width:27% !important;
  }

  .kh-accounting-table-wrap table.items th{
    padding-right:3px !important;
    padding-left:3px !important;
    font-size:9px !important;
  }

  .kh-accounting-table-wrap .kh-accounting-row td{
    padding-right:4px !important;
    padding-left:4px !important;
  }

  .kh-accounting-date strong{
    font-size:10.5px !important;
  }

  .kh-accounting-date-user{
    display:block;
    max-width:100%;
    font-size:7.5px !important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* رقم الفاتورة/السند */
  .kh-accounting-table-wrap .kh-accounting-number{
    display:block !important;
    width:auto !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:4px 2px !important;
    font-size:9.5px !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-align:center;
  }

  /* اسم الزبون */
  .kh-accounting-table-wrap .kh-accounting-customer{
    display:block;
    width:100%;
    min-width:0;
    font-size:9.5px !important;
    line-height:1.2;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* المبلغ: نعطيه مساحة أكبر ليبقى ظاهرًا */
  .kh-accounting-table-wrap td.kh-accounting-amount{
    padding-right:2px !important;
    padding-left:3px !important;
    font-size:10.5px !important;
    font-weight:900 !important;
    letter-spacing:-.25px;
    white-space:nowrap !important;
    direction:ltr;
    text-align:left !important;
  }

}

/* V68.6B.20B.8 — التحديد يجب أن يبقى واضحاً لبطاقة واحدة فقط */
.kh-accounting-row.kh-accounting-selected{
  position:relative;
  z-index:2;
}

/* ============================================================
   KashfHesab V68.6B.20B.9 — Centered Accounting Values
   توسيط التاريخ + رقم الحركة + المبلغ
   ============================================================ */

/* التاريخ */
.kh-accounting-table-wrap table.items th:nth-child(1),
.kh-accounting-table-wrap table.items td:nth-child(1){
  text-align:center !important;
}

.kh-accounting-date{
  width:100%;
  display:flex !important;
  flex-direction:column;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
}

.kh-accounting-date strong,
.kh-accounting-date-user{
  width:100%;
  text-align:center !important;
}

/* رقم الفاتورة / السند */
.kh-accounting-table-wrap table.items th:nth-child(2),
.kh-accounting-table-wrap table.items td:nth-child(2){
  text-align:center !important;
}

.kh-accounting-table-wrap .kh-accounting-number{
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}

/* المبلغ */
.kh-accounting-table-wrap table.items th:nth-child(4),
.kh-accounting-table-wrap table.items td:nth-child(4){
  text-align:center !important;
}

.kh-accounting-table-wrap td.kh-accounting-amount{
  text-align:center !important;
  direction:ltr;
  font-variant-numeric:tabular-nums;
}

/* تثبيت التوسيط على الهاتف فوق قواعد V20B.8 */
@media (max-width:700px){

  .kh-accounting-table-wrap .kh-accounting-number{
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
  }

  .kh-accounting-table-wrap td.kh-accounting-amount{
    text-align:center !important;
    padding-left:2px !important;
    padding-right:2px !important;
  }

}

/* ============================================================
   KashfHesab V68.6B.20B.10 — Linked Transactions
   تمييز الفاتورة / السند المرتبط
   ============================================================ */

.kh-accounting-number-wrap{
  width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  flex-wrap:wrap;
}

/* شارة الارتباط */
.kh-accounting-linked-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;

  min-height:20px;
  padding:2px 7px;

  border:1px solid rgba(124,58,237,.24);
  border-radius:999px;

  background:rgba(124,58,237,.10);
  color:#6d28d9;

  font-size:9px;
  font-weight:900;
  line-height:1;

  white-space:nowrap;
}

/*
 * الحركة المرتبطة:
 * نحتفظ بلون نوع الحركة الأصلي،
 * ونضيف إطار/توهج بنفسجي للتمييز.
 */
.kh-accounting-row.kh-accounting-linked td{
  border-top-color:rgba(124,58,237,.30) !important;
  border-bottom-color:rgba(124,58,237,.30) !important;
}

.kh-accounting-row.kh-accounting-linked td:first-child{
  border-right-color:#8b5cf6 !important;
  border-right-width:4px !important;
}

.kh-accounting-row.kh-accounting-linked td:last-child{
  border-left-color:rgba(124,58,237,.30) !important;
}

.kh-accounting-row.kh-accounting-linked{
  filter:drop-shadow(0 5px 10px rgba(109,40,217,.08));
}

/* عند التحديد يبقى تأثير الضغط الحالي أقوى */
.kh-accounting-row.kh-accounting-linked.kh-accounting-selected{
  filter:drop-shadow(0 8px 15px rgba(109,40,217,.16));
}

@media (max-width:700px){

  .kh-accounting-number-wrap{
    gap:2px;
    flex-direction:column;
    flex-wrap:nowrap;
  }

  .kh-accounting-linked-badge{
    min-height:15px;
    padding:1px 4px;
    gap:2px;
    font-size:6.8px;
  }

  .kh-accounting-linked-badge span:first-child{
    font-size:7px;
  }

  .kh-accounting-row.kh-accounting-linked td:first-child{
    border-right-width:3px !important;
  }

}

/* ============================================================
   KashfHesab V68.6B.20B.11 — Compact Accounting Cards
   ضغط ارتفاع البطاقات وتقليل المسافات بينها
   ============================================================ */

/* تقليل المسافة بين البطاقات */
.kh-accounting-table-wrap table.items{
  border-spacing:0 5px !important;
}

/* تقليل ارتفاع البطاقة */
.kh-accounting-table-wrap .kh-accounting-row td{
  padding-top:8px !important;
  padding-bottom:8px !important;
}

/* التاريخ والمستخدم أكثر تماسكاً */
.kh-accounting-date{
  gap:1px !important;
  line-height:1.05 !important;
}

.kh-accounting-date-user{
  margin-top:1px !important;
  line-height:1.05 !important;
}

/* رقم الحركة */
.kh-accounting-number-wrap{
  gap:3px !important;
}

.kh-accounting-number{
  line-height:1.05 !important;
}

/* شارة مرتبط أصغر قليلاً */
.kh-accounting-linked-badge{
  min-height:17px !important;
  padding-top:1px !important;
  padding-bottom:1px !important;
}

/* الهاتف: ضغط إضافي بسيط */
@media (max-width:700px){

  .kh-accounting-table-wrap table.items{
    border-spacing:0 4px !important;
  }

  .kh-accounting-table-wrap .kh-accounting-row td{
    padding-top:6px !important;
    padding-bottom:6px !important;
  }

  .kh-accounting-date{
    gap:0 !important;
  }

  .kh-accounting-number-wrap{
    gap:1px !important;
  }

  .kh-accounting-table-wrap .kh-accounting-number{
    min-height:20px !important;
    padding-top:3px !important;
    padding-bottom:3px !important;
  }

  .kh-accounting-linked-badge{
    min-height:14px !important;
    padding-top:1px !important;
    padding-bottom:1px !important;
  }

}


/* =========================================================
   KashfHesab V68.6B.20B.10.3 — Mobile Accounting Stability
   Prevent repeated paint/animation flicker on accounting rows.
   ========================================================= */
@media (max-width:768px){

  .kh-accounting-page,
  .kh-accounting-page *,
  .kh-accounting-table-wrap,
  .kh-accounting-table-wrap *,
  .kh-accounting-row,
  .kh-accounting-row *{
    animation:none !important;
  }

  .kh-accounting-row,
  .kh-accounting-row td,
  .kh-accounting-number,
  .kh-accounting-customer,
  .kh-accounting-amount,
  .kh-accounting-date,
  .kh-accounting-linked-badge{
    transition:none !important;
  }

  .kh-accounting-row{
    transform:none !important;
  }

  .kh-accounting-row:hover{
    transform:none !important;
  }
}


/* =========================================================
   KashfHesab V68.6B.20B.10.7 — Mobile Accounting Repaint Fix
   Native table painting for Chromium/mobile stability.
   ========================================================= */
@media (max-width:768px){

  .kh-accounting-table-wrap{
    overflow:hidden !important;
    contain:none !important;
    transform:none !important;
    filter:none !important;
    backdrop-filter:none !important;
    box-shadow:none !important;
  }

  .kh-accounting-table-wrap .scrollx{
    overflow-x:auto !important;
    overflow-y:visible !important;
    contain:none !important;
    transform:none !important;
    filter:none !important;
    backdrop-filter:none !important;
  }

  .kh-accounting-table-wrap table.items{
    display:table !important;
    width:100% !important;
    min-width:0 !important;
    border-collapse:collapse !important;
    border-spacing:0 !important;
    transform:none !important;
    contain:none !important;
  }

  .kh-accounting-table-wrap table.items thead{
    display:table-header-group !important;
  }

  .kh-accounting-table-wrap table.items tbody{
    display:table-row-group !important;
  }

  .kh-accounting-table-wrap .kh-accounting-row{
    display:table-row !important;
    position:static !important;

    transform:none !important;
    translate:none !important;
    scale:none !important;
    rotate:none !important;

    filter:none !important;
    backdrop-filter:none !important;

    box-shadow:none !important;
    border-radius:0 !important;

    animation:none !important;
    transition:none !important;

    opacity:1 !important;
    visibility:visible !important;

    contain:none !important;
    isolation:auto !important;
    will-change:auto !important;
  }

  .kh-accounting-table-wrap .kh-accounting-row td{
    display:table-cell !important;
    position:static !important;

    transform:none !important;
    filter:none !important;
    backdrop-filter:none !important;

    box-shadow:none !important;
    border-radius:0 !important;

    animation:none !important;
    transition:none !important;

    opacity:1 !important;
    visibility:visible !important;

    vertical-align:middle !important;
  }

  .kh-accounting-table-wrap .kh-accounting-row:hover{
    transform:none !important;
    filter:none !important;
  }

  .kh-accounting-table-wrap
  .kh-accounting-row.kh-accounting-selected{
    transform:none !important;
    filter:none !important;
    box-shadow:none !important;
  }

  .kh-accounting-table-wrap
  .kh-accounting-row.kh-accounting-linked{
    transform:none !important;
    filter:none !important;
    box-shadow:none !important;
  }

  .kh-accounting-number,
  .kh-accounting-customer,
  .kh-accounting-amount,
  .kh-accounting-date,
  .kh-accounting-date-user,
  .kh-accounting-number-wrap,
  .kh-accounting-linked-badge{
    transform:none !important;
    filter:none !important;
    animation:none !important;
    transition:none !important;
    will-change:auto !important;
  }
}

/* =========================================================
   KashfHesab V68.6B.21C.20.2
   Customer Ledger — All Columns Fit Mobile Screen
   ========================================================= */
@media screen and (max-width: 600px) {

  /* كشف الزبون فقط */
  .kh686b21c19-ledger {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    margin: 0 !important;
  }

  /* جميع الخلايا */
  .kh686b21c19-ledger th,
  .kh686b21c19-ledger td {
    box-sizing: border-box !important;
    min-width: 0 !important;
    padding: 5px 2px !important;
    vertical-align: middle !important;
  }

  /* التاريخ: 05/10 */
  .kh686b21c19-ledger .kh686b21c19-date {
    width: 42px !important;
    max-width: 42px !important;
    white-space: nowrap !important;
    font-size: 10px !important;
  }

  /* البيان يأخذ المساحة الأكبر */
  .kh686b21c19-ledger .kh686b21c19-desc {
    width: auto !important;
    max-width: none !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    font-size: 10.5px !important;
    line-height: 1.3 !important;
    padding-right: 4px !important;
    padding-left: 4px !important;
  }

  /* مدين */
  .kh686b21c19-ledger th:nth-last-child(3),
  .kh686b21c19-ledger td:nth-last-child(3) {
    width: 49px !important;
    max-width: 49px !important;
    white-space: nowrap !important;
    font-size: 9.5px !important;
  }

  /* دائن */
  .kh686b21c19-ledger th:nth-last-child(2),
  .kh686b21c19-ledger td:nth-last-child(2) {
    width: 49px !important;
    max-width: 49px !important;
    white-space: nowrap !important;
    font-size: 9.5px !important;
  }

  /* الرصيد */
  .kh686b21c19-ledger th:last-child,
  .kh686b21c19-ledger td:last-child {
    width: 58px !important;
    max-width: 58px !important;
    white-space: nowrap !important;
    font-size: 9.5px !important;
  }

  .kh686b21c19-ledger thead th {
    font-size: 9.5px !important;
    line-height: 1.2 !important;
  }

  /* منع الجدول نفسه من فرض سحب أفقي */
  .scrollx:has(.kh686b21c19-ledger) {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
}

/* Products — equal Add Product / Add Group actions */
.products-hero-actions{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:10px;
}

.products-hero-actions .products-hero-add{
  width:100%;
  min-width:150px;
  height:44px;
  margin:0 !important;
  padding:0 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  box-sizing:border-box;
  white-space:nowrap;
}

@media (max-width:700px){
  .products-hero-actions{
    width:100%;
    gap:10px;
  }

  .products-hero-actions .products-hero-add{
    width:100%;
    min-width:0;
    height:44px;
  }
}

/* Products — professional stacked icon + title */
.products-hero .products-hero-main{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:8px;
}

.products-hero .products-hero-icon{
  width:58px;
  height:58px;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 58px;
  border-radius:18px;
  font-size:30px;
  line-height:1;
}

.products-hero .products-hero-main > div:last-child{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.products-hero .products-hero-main h1{
  margin:0 !important;
  text-align:center;
  line-height:1.25;
}

@media (max-width:700px){
  .products-hero .products-hero-main{
    width:100%;
    gap:7px;
  }

  .products-hero .products-hero-icon{
    width:56px;
    height:56px;
    flex-basis:56px;
    font-size:29px;
  }
}


/* ========================================================
   KashfHesab — REAL Product Statistics Cards
   ======================================================== */

.products-v2 .kh-products-real-stats{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
  margin:16px 0 20px !important;
}

.products-v2 .kh-real-stat{
  position:relative !important;
  isolation:isolate;
  overflow:hidden !important;
  width:100% !important;
  min-width:0 !important;
  min-height:126px !important;
  margin:0 !important;
  padding:16px !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  border:1px solid transparent !important;
  border-radius:22px !important;
  text-align:right !important;
  font-family:inherit !important;
  cursor:pointer !important;
  appearance:none;
  -webkit-appearance:none;
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    filter .22s ease !important;
}

/* Colored glow */
.products-v2 .kh-real-stat::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:125px;
  height:125px;
  right:-48px;
  bottom:-58px;
  border-radius:50%;
  opacity:.38;
  transition:transform .25s ease;
}

/* Light reflection */
.products-v2 .kh-real-stat::after{
  content:"";
  position:absolute;
  z-index:1;
  top:-80%;
  left:-45%;
  width:35%;
  height:250%;
  border-radius:50%;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.72),
    transparent
  );
  transform:rotate(20deg);
  opacity:0;
  pointer-events:none;
  transition:left .55s ease,opacity .15s ease;
}

.products-v2 .kh-real-stat:hover{
  transform:translateY(-5px) scale(1.015) !important;
  filter:saturate(1.08);
}

.products-v2 .kh-real-stat:hover::before{
  transform:scale(1.2);
}

.products-v2 .kh-real-stat:hover::after{
  left:115%;
  opacity:.75;
}

.products-v2 .kh-real-stat:active{
  transform:translateY(-1px) scale(.98) !important;
}


/* BLUE — All products */
.products-v2 .kh-real-stat-all{
  background:linear-gradient(
    145deg,#dcecff 0%,#edf6ff 52%,#fff 100%
  ) !important;
  border-color:#bcd8ff !important;
  box-shadow:
    0 14px 32px rgba(39,111,207,.20),
    0 4px 10px rgba(39,111,207,.08) !important;
}

.products-v2 .kh-real-stat-all::before{
  background:#64a4f5;
}


/* PURPLE — Groups */
.products-v2 .kh-real-stat-groups{
  background:linear-gradient(
    145deg,#e9ddff 0%,#f4edff 52%,#fff 100%
  ) !important;
  border-color:#d5bcff !important;
  box-shadow:
    0 14px 32px rgba(119,73,190,.20),
    0 4px 10px rgba(119,73,190,.08) !important;
}

.products-v2 .kh-real-stat-groups::before{
  background:#a777eb;
}


/* GREEN — Tracked */
.products-v2 .kh-real-stat-tracked{
  background:linear-gradient(
    145deg,#d8f5e6 0%,#ebfaf2 52%,#fff 100%
  ) !important;
  border-color:#b7e7ce !important;
  box-shadow:
    0 14px 32px rgba(27,145,92,.20),
    0 4px 10px rgba(27,145,92,.08) !important;
}

.products-v2 .kh-real-stat-tracked::before{
  background:#54ca91;
}


/* ORANGE — Disabled */
.products-v2 .kh-real-stat-disabled{
  background:linear-gradient(
    145deg,#ffe5c8 0%,#fff1df 52%,#fff 100%
  ) !important;
  border-color:#ffcd99 !important;
  box-shadow:
    0 14px 32px rgba(216,123,31,.20),
    0 4px 10px rgba(216,123,31,.08) !important;
}

.products-v2 .kh-real-stat-disabled::before{
  background:#f3a14d;
}


/* Icons */
.products-v2 .kh-real-stat .product-stat-icon{
  position:relative;
  z-index:3;
  width:52px !important;
  height:52px !important;
  min-width:52px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid rgba(255,255,255,.8) !important;
  border-radius:17px !important;
  font-size:25px !important;
  box-shadow:
    0 8px 18px rgba(15,23,42,.13),
    inset 0 1px 0 rgba(255,255,255,.9) !important;
  transition:transform .22s ease !important;
}

.products-v2 .kh-real-stat-all .product-stat-icon{
  background:#d4e7ff !important;
}

.products-v2 .kh-real-stat-groups .product-stat-icon{
  background:#e3d3ff !important;
}

.products-v2 .kh-real-stat-tracked .product-stat-icon{
  background:#cef0df !important;
}

.products-v2 .kh-real-stat-disabled .product-stat-icon{
  background:#ffdfbd !important;
}

.products-v2 .kh-real-stat:hover .product-stat-icon{
  transform:translateY(-2px) scale(1.07) rotate(-3deg);
}


/* Text */
.products-v2 .kh-real-stat > div{
  position:relative;
  z-index:3;
  flex:1;
  min-width:0;
}

.products-v2 .kh-real-stat small{
  display:block !important;
  color:#64748b !important;
  font-size:11px !important;
  font-weight:800 !important;
}

.products-v2 .kh-real-stat strong{
  display:block !important;
  margin-top:3px !important;
  color:#15365d !important;
  font-size:27px !important;
  font-weight:900 !important;
  line-height:1.05 !important;
}

.products-v2 .kh-real-stat em{
  display:block;
  margin-top:7px;
  color:#8291a4;
  font-size:9px;
  font-style:normal;
  font-weight:700;
}


/* Arrow */
.products-v2 .kh-real-stat-arrow{
  position:relative;
  z-index:3;
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:rgba(255,255,255,.72);
  color:#63758a;
  font-size:20px;
  font-weight:900;
  box-shadow:0 4px 10px rgba(15,23,42,.08);
  transition:transform .2s ease;
}

.products-v2 .kh-real-stat:hover .kh-real-stat-arrow{
  transform:translateX(-4px);
}


/* Selected */
.products-v2 .kh-real-stat.is-selected{
  transform:translateY(-2px);
  outline:2px solid rgba(57,126,216,.22);
  outline-offset:2px;
}


/* Tablet */
@media(max-width:900px){
  .products-v2 .kh-products-real-stats{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}


/* Mobile — 2 x 2 */
@media(max-width:600px){
  .products-v2 .kh-products-real-stats{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  .products-v2 .kh-real-stat{
    min-height:116px !important;
    padding:12px 10px !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:7px !important;
    border-radius:19px !important;
  }

  .products-v2 .kh-real-stat .product-stat-icon{
    width:43px !important;
    height:43px !important;
    min-width:43px !important;
    border-radius:14px !important;
    font-size:21px !important;
  }

  .products-v2 .kh-real-stat strong{
    font-size:23px !important;
  }

  .products-v2 .kh-real-stat em{
    display:none;
  }

  .products-v2 .kh-real-stat-arrow{
    position:absolute;
    left:10px;
    bottom:10px;
    width:24px;
    height:24px;
    font-size:17px;
  }

  .products-v2 .kh-real-stat:hover{
    transform:none !important;
  }

  .products-v2 .kh-real-stat:active{
    transform:scale(.97) !important;
  }

  .products-v2 .kh-real-stat::after{
    display:none;
  }
}


/* ========================================================
   KashfHesab — Product Detail Cards V1
   ======================================================== */

.products-v2 .product-line-v6{
  position:relative;
  display:block !important;
  padding:16px 18px 15px !important;
  margin-bottom:13px !important;
  overflow:hidden;
  border:1px solid #e3eaf2 !important;
  border-radius:20px !important;
  background:#fff !important;
  box-shadow:
    0 8px 22px rgba(15,38,68,.065),
    0 2px 5px rgba(15,38,68,.035) !important;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease !important;
}

.products-v2 .product-line-v6:hover{
  transform:translateY(-2px);
  border-color:#cbdbea !important;
  box-shadow:
    0 14px 30px rgba(15,38,68,.10),
    0 3px 7px rgba(15,38,68,.04) !important;
}

.products-v2 .product-line-accent{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:4px;
  border-radius:0 20px 20px 0;
  background:linear-gradient(180deg,#2682df,#25b28a);
}

.products-v2 .product-line-check{
  position:absolute;
  top:14px;
  left:14px;
  z-index:5;
}

.products-v2 .kh-product-card-body{
  width:100%;
  min-width:0;
}

/* Identity */
.products-v2 .kh-product-identity{
  display:flex;
  align-items:center;
  gap:12px;
  padding-left:34px;
  margin-bottom:13px;
}

.products-v2 .kh-product-sequence{
  width:42px;
  height:42px;
  min-width:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:13px;
  color:#1767b4;
  background:linear-gradient(145deg,#e1efff,#f3f8ff);
  border:1px solid #cce2fa;
  font-size:14px;
  font-weight:900;
  direction:ltr;
  box-shadow:0 5px 12px rgba(31,111,190,.10);
}

.products-v2 .kh-product-title-area{
  flex:1;
  min-width:0;
}

.products-v2 .kh-product-name{
  overflow:hidden;
  color:#15365d;
  font-size:16px;
  font-weight:900;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.products-v2 .kh-product-number{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:5px;
  color:#8492a3;
  font-size:10px;
  font-weight:700;
}

.products-v2 .kh-product-number bdi{
  color:#52677e;
  font-weight:900;
}

/* Price cards */
.products-v2 .kh-product-price-grid{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(190px,.8fr);
  gap:10px;
  margin-bottom:10px;
}

.products-v2 .kh-product-detail-card{
  min-width:0;
  padding:12px;
  border-radius:16px;
}

.products-v2 .kh-product-sales-card{
  background:linear-gradient(145deg,#edf7ff,#f8fcff);
  border:1px solid #d4e9fb;
  box-shadow:0 5px 13px rgba(37,119,190,.06);
}

.products-v2 .kh-product-purchase-card{
  background:linear-gradient(145deg,#fff4e7,#fffbf5);
  border:1px solid #f5dfc4;
  box-shadow:0 5px 13px rgba(190,117,37,.06);
}

.products-v2 .kh-product-detail-head{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:9px;
}

.products-v2 .kh-product-detail-icon{
  width:29px;
  height:29px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:rgba(255,255,255,.82);
  font-size:15px;
  box-shadow:0 3px 8px rgba(15,38,68,.06);
}

.products-v2 .kh-product-detail-head strong{
  color:#294967;
  font-size:11px;
  font-weight:900;
}

.products-v2 .kh-product-price-items{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.products-v2 .kh-product-price-item{
  min-width:0;
  padding:8px 7px;
  border-radius:11px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(207,225,241,.85);
}

.products-v2 .kh-product-price-item.is-main{
  background:#fff;
  box-shadow:0 3px 9px rgba(25,94,157,.07);
}

.products-v2 .kh-product-price-item small{
  display:block;
  margin-bottom:3px;
  color:#8190a0;
  font-size:8px;
  font-weight:800;
}

.products-v2 .kh-product-price-item strong{
  display:block;
  overflow:hidden;
  color:#164d7d;
  font-size:12px;
  font-weight:900;
  direction:ltr;
  text-align:right;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.products-v2 .kh-product-price-item em{
  color:#8796a7;
  font-size:7px;
  font-style:normal;
  font-weight:700;
}

.products-v2 .kh-product-purchase-value{
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  border-radius:12px;
  background:rgba(255,255,255,.7);
  direction:ltr;
}

.products-v2 .kh-product-purchase-value strong{
  color:#a65e18;
  font-size:17px;
  font-weight:900;
}

.products-v2 .kh-product-purchase-value small{
  color:#9b826b;
  font-size:8px;
  font-weight:800;
}

/* Bottom information cards */
.products-v2 .kh-product-meta-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:9px;
}

.products-v2 .kh-product-mini-card{
  min-width:0;
  min-height:58px;
  padding:9px 10px;
  display:flex;
  align-items:center;
  gap:9px;
  border-radius:14px;
  background:#f8fafc;
  border:1px solid #e6ecf2;
}

.products-v2 .kh-product-mini-icon{
  width:34px;
  height:34px;
  min-width:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:#fff;
  font-size:16px;
  box-shadow:0 3px 8px rgba(15,38,68,.06);
}

.products-v2 .kh-product-mini-card > div{
  min-width:0;
}

.products-v2 .kh-product-mini-card small{
  display:block;
  margin-bottom:3px;
  color:#8795a5;
  font-size:8px;
  font-weight:800;
}

.products-v2 .kh-product-mini-card strong{
  display:block;
  overflow:hidden;
  color:#294967;
  font-size:10px;
  font-weight:900;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.products-v2 .kh-product-mini-card em{
  display:block;
  margin-top:2px;
  color:#8c99a7;
  font-size:7px;
  font-style:normal;
  font-weight:700;
}

.products-v2 .kh-product-code-card{
  background:linear-gradient(145deg,#f3f6ff,#fafbff);
  border-color:#e1e6f6;
}

.products-v2 .kh-product-group-card{
  background:linear-gradient(145deg,#f5efff,#fbf9ff);
  border-color:#e8dcf8;
}

.products-v2 .kh-product-stock-card{
  background:linear-gradient(145deg,#edf9f3,#f9fdfb);
  border-color:#d7eee3;
}

.products-v2 .kh-product-stock-card.is-negative{
  background:linear-gradient(145deg,#fff0f0,#fffafa);
  border-color:#f4d3d3;
}

.products-v2 .kh-product-stock-card.is-off{
  background:linear-gradient(145deg,#f4f5f7,#fafafa);
  border-color:#e3e6ea;
}

.products-v2 .kh-product-empty-value{
  color:#a5afba !important;
}

/* Existing action buttons */
.products-v2 .product-line-actions{
  display:flex !important;
  justify-content:flex-end;
  gap:7px;
  margin-top:11px;
  padding-top:10px;
  border-top:1px solid #edf1f5;
}

/* Tablet / Mobile */
@media(max-width:700px){

  .products-v2 .product-line-v6{
    padding:13px 12px 12px !important;
    border-radius:18px !important;
  }

  .products-v2 .kh-product-identity{
    padding-left:27px;
  }

  .products-v2 .kh-product-name{
    font-size:14px;
  }

  .products-v2 .kh-product-price-grid{
    grid-template-columns:1fr;
  }

  .products-v2 .kh-product-meta-grid{
    grid-template-columns:1fr;
  }

  .products-v2 .kh-product-mini-card{
    min-height:54px;
  }

  .products-v2 .kh-product-price-items{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .products-v2 .kh-product-price-item{
    padding:7px 5px;
  }

  .products-v2 .kh-product-price-item strong{
    font-size:10px;
  }

  .products-v2 .product-line-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr;
  }

  .products-v2 .product-line-actions .btn{
    width:100%;
    justify-content:center;
  }
}


/* ========================================================
   KashfHesab — Product Sequence + Product Number V2
   ======================================================== */

.products-v2 .kh-product-identity-v2{
  display:grid !important;
  grid-template-columns:82px minmax(0,1fr) !important;
  align-items:stretch !important;
  gap:10px !important;
  margin-bottom:12px !important;
  padding-left:34px !important;
}

/* Sequence */
.products-v2 .kh-product-sequence-card{
  min-height:72px;
  padding:9px 8px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:15px;
  background:linear-gradient(145deg,#dcecff,#f5f9ff);
  border:1px solid #c6def9;
  box-shadow:
    0 6px 15px rgba(35,109,187,.11),
    inset 0 1px 0 rgba(255,255,255,.9);
}

.products-v2 .kh-product-sequence-card small{
  display:block;
  margin-bottom:4px;
  color:#6683a1;
  font-size:9px;
  font-weight:800;
}

.products-v2 .kh-product-sequence-card strong{
  display:block;
  color:#1767b4;
  font-size:24px;
  font-weight:900;
  line-height:1;
  direction:ltr;
}

/* Name + number container */
.products-v2 .kh-product-main-info{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 135px;
  gap:8px;
}

/* Product name */
.products-v2 .kh-product-name-row,
.products-v2 .kh-product-number-row{
  min-width:0;
  min-height:72px;
  padding:10px 12px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-radius:15px;
}

.products-v2 .kh-product-name-row{
  background:linear-gradient(145deg,#f5f8fc,#fff);
  border:1px solid #e1e9f1;
}

.products-v2 .kh-product-name-row small,
.products-v2 .kh-product-number-row small{
  display:block;
  margin-bottom:5px;
  color:#8593a4;
  font-size:9px;
  font-weight:800;
}

.products-v2 .kh-product-name-row strong{
  display:block;
  overflow:hidden;
  color:#15365d;
  font-size:15px;
  font-weight:900;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Product number */
.products-v2 .kh-product-number-row{
  background:linear-gradient(145deg,#eef3ff,#fafcff);
  border:1px solid #dce5f5;
  box-shadow:0 4px 11px rgba(45,81,137,.05);
}

.products-v2 .kh-product-number-row strong{
  display:block;
  color:#315d94;
  font-size:16px;
  font-weight:900;
  direction:ltr;
}

/* Mobile */
@media(max-width:700px){

  .products-v2 .kh-product-identity-v2{
    grid-template-columns:64px minmax(0,1fr) !important;
    gap:7px !important;
    padding-left:27px !important;
  }

  .products-v2 .kh-product-main-info{
    grid-template-columns:minmax(0,1fr) 90px;
    gap:6px;
  }

  .products-v2 .kh-product-sequence-card,
  .products-v2 .kh-product-name-row,
  .products-v2 .kh-product-number-row{
    min-height:65px;
    border-radius:13px;
  }

  .products-v2 .kh-product-sequence-card strong{
    font-size:20px;
  }

  .products-v2 .kh-product-name-row strong{
    font-size:12px;
  }

  .products-v2 .kh-product-number-row strong{
    font-size:13px;
  }
}

/* =========================================================
   KashfHesab — PRODUCT CARD FINAL VISUAL FORCE
   ========================================================= */

.products-v2 .product-line-v6{
    display:block !important;
    position:relative !important;
    padding:18px !important;
    margin:0 0 16px !important;
    background:#fff !important;
    border:1px solid #dce6f0 !important;
    border-radius:22px !important;
    box-shadow:
        0 10px 28px rgba(23,54,93,.09),
        0 2px 6px rgba(23,54,93,.04) !important;
}

.products-v2 .kh-product-card-body{
    display:block !important;
    width:100% !important;
}

/* ===== TOP INFORMATION ===== */

.products-v2 .kh-product-identity-v2{
    display:grid !important;
    grid-template-columns:90px minmax(0,1fr) !important;
    gap:12px !important;
    width:100% !important;
    margin:0 0 14px !important;
    padding:0 0 14px !important;
    border-bottom:1px solid #e9eef4 !important;
}

.products-v2 .kh-product-sequence-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:82px !important;
    padding:10px !important;

    background:
        linear-gradient(145deg,#d8eaff,#f1f7ff) !important;

    border:1px solid #bcd9fa !important;
    border-radius:17px !important;

    box-shadow:
        0 7px 17px rgba(35,108,188,.14),
        inset 0 1px 0 rgba(255,255,255,.9) !important;
}

.products-v2 .kh-product-sequence-card small{
    display:block !important;
    margin:0 0 6px !important;
    color:#55799e !important;
    font-size:10px !important;
    font-weight:800 !important;
}

.products-v2 .kh-product-sequence-card strong{
    display:block !important;
    color:#1269bb !important;
    font-size:27px !important;
    font-weight:900 !important;
    line-height:1 !important;
}

/* Name + number */

.products-v2 .kh-product-main-info{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 150px !important;
    gap:10px !important;
    min-width:0 !important;
}

.products-v2 .kh-product-name-row,
.products-v2 .kh-product-number-row{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    min-width:0 !important;
    min-height:82px !important;
    padding:12px 15px !important;
    border-radius:17px !important;
}

.products-v2 .kh-product-name-row{
    background:
        linear-gradient(145deg,#f5f8fc,#ffffff) !important;

    border:1px solid #dfe8f1 !important;

    box-shadow:
        0 5px 14px rgba(31,61,96,.055) !important;
}

.products-v2 .kh-product-number-row{
    background:
        linear-gradient(145deg,#e9e3ff,#f8f6ff) !important;

    border:1px solid #d6cafa !important;

    box-shadow:
        0 6px 15px rgba(99,76,170,.10) !important;
}

.products-v2 .kh-product-name-row small,
.products-v2 .kh-product-number-row small{
    display:block !important;
    margin:0 0 6px !important;
    color:#788a9e !important;
    font-size:10px !important;
    font-weight:800 !important;
}

.products-v2 .kh-product-name-row strong{
    display:block !important;
    overflow:hidden !important;
    color:#14395f !important;
    font-size:17px !important;
    font-weight:900 !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

.products-v2 .kh-product-number-row strong{
    display:block !important;
    color:#6549a5 !important;
    font-size:21px !important;
    font-weight:900 !important;
    direction:ltr !important;
}


/* ===== PRICE SECTION ===== */

.products-v2 .kh-product-price-grid{
    display:grid !important;
    grid-template-columns:minmax(0,2fr) minmax(220px,.75fr) !important;
    gap:12px !important;
    margin:0 0 12px !important;
}

.products-v2 .kh-product-sales-card{
    background:
        linear-gradient(145deg,#eaf6ff,#f9fcff) !important;

    border:1px solid #cee5f8 !important;
    border-radius:17px !important;

    box-shadow:
        0 6px 16px rgba(32,118,185,.08) !important;
}

.products-v2 .kh-product-purchase-card{
    background:
        linear-gradient(145deg,#fff0df,#fffaf4) !important;

    border:1px solid #f1d5b4 !important;
    border-radius:17px !important;

    box-shadow:
        0 6px 16px rgba(188,112,29,.08) !important;
}


/* ===== CODE / GROUP / STOCK ===== */

.products-v2 .kh-product-meta-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px !important;
    width:100% !important;
}

.products-v2 .kh-product-mini-card{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    min-width:0 !important;
    min-height:66px !important;
    padding:10px 12px !important;
    border-radius:15px !important;
}

.products-v2 .kh-product-code-card{
    background:
        linear-gradient(145deg,#edf2ff,#fafbff) !important;
    border:1px solid #dbe3f5 !important;
}

.products-v2 .kh-product-group-card{
    background:
        linear-gradient(145deg,#f1e8ff,#fbf8ff) !important;
    border:1px solid #e2d3f7 !important;
}

.products-v2 .kh-product-stock-card{
    background:
        linear-gradient(145deg,#e4f7ed,#f8fdfb) !important;
    border:1px solid #cbead9 !important;
}


/* ===== MOBILE ===== */

@media(max-width:700px){

    .products-v2 .product-line-v6{
        padding:13px !important;
        border-radius:19px !important;
    }

    .products-v2 .kh-product-identity-v2{
        grid-template-columns:68px minmax(0,1fr) !important;
        gap:8px !important;
    }

    .products-v2 .kh-product-main-info{
        grid-template-columns:minmax(0,1fr) 92px !important;
        gap:7px !important;
    }

    .products-v2 .kh-product-sequence-card,
    .products-v2 .kh-product-name-row,
    .products-v2 .kh-product-number-row{
        min-height:70px !important;
        border-radius:14px !important;
    }

    .products-v2 .kh-product-sequence-card{
        padding:7px !important;
    }

    .products-v2 .kh-product-sequence-card strong{
        font-size:22px !important;
    }

    .products-v2 .kh-product-name-row{
        padding:9px 10px !important;
    }

    .products-v2 .kh-product-name-row strong{
        font-size:13px !important;
    }

    .products-v2 .kh-product-number-row{
        padding:8px !important;
    }

    .products-v2 .kh-product-number-row strong{
        font-size:15px !important;
    }

    .products-v2 .kh-product-price-grid{
        grid-template-columns:1fr !important;
    }

    .products-v2 .kh-product-meta-grid{
        grid-template-columns:1fr !important;
    }
}



/* =========================================================
   KashfHesab — Add Product Modal Cards V2
   ========================================================= */

.kh-product-modal .kh-add-product-v2{
  display:flex;
  flex-direction:column;
  gap:11px;
}

.kh-product-modal .kh-add-product-auto-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}

.kh-product-modal .kh-add-auto-card{
  min-width:0;
  padding:11px 12px;
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:15px;
}

.kh-product-modal .kh-add-auto-card > span{
  width:36px;
  height:36px;
  min-width:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  background:rgba(255,255,255,.8);
  font-size:17px;
  box-shadow:0 3px 8px rgba(15,38,68,.07);
}

.kh-product-modal .kh-add-auto-card small,
.kh-product-modal .kh-add-auto-card strong,
.kh-product-modal .kh-add-auto-card em{
  display:block;
}

.kh-product-modal .kh-add-auto-card small{
  color:#788a9d;
  font-size:8px;
  font-weight:800;
}

.kh-product-modal .kh-add-auto-card strong{
  margin-top:2px;
  color:#244d78;
  font-size:12px;
  font-weight:900;
}

.kh-product-modal .kh-add-auto-card em{
  margin-top:2px;
  color:#98a4b1;
  font-size:7px;
  font-style:normal;
  font-weight:700;
}

.kh-product-modal .kh-add-auto-sequence{
  background:linear-gradient(145deg,#e2efff,#f7fbff);
  border:1px solid #cce1fa;
}

.kh-product-modal .kh-add-auto-number{
  background:linear-gradient(145deg,#eee7ff,#faf8ff);
  border:1px solid #ddd0fa;
}


/* Main section cards */

.kh-product-modal .kh-add-section{
  padding:12px;
  border-radius:17px;
}

.kh-product-modal .kh-add-section-head{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:10px;
}

.kh-product-modal .kh-add-section-head > span{
  width:30px;
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:rgba(255,255,255,.82);
  box-shadow:0 3px 8px rgba(15,38,68,.06);
}

.kh-product-modal .kh-add-section-head strong{
  color:#294968;
  font-size:11px;
  font-weight:900;
}

.kh-product-modal .kh-add-name-section{
  background:linear-gradient(145deg,#f5f8fc,#fff);
  border:1px solid #e1e8ef;
}

.kh-product-modal .kh-add-sales-section{
  background:linear-gradient(145deg,#eaf6ff,#f9fcff);
  border:1px solid #cee5f8;
  box-shadow:0 5px 14px rgba(32,118,185,.06);
}

.kh-product-modal .kh-add-purchase-section{
  background:linear-gradient(145deg,#fff0df,#fffaf4);
  border:1px solid #f1d5b4;
}

.kh-product-modal .kh-add-code-section{
  background:linear-gradient(145deg,#f0f4ff,#fbfcff);
  border:1px solid #dce4f5;
}

.kh-product-modal .kh-add-group-section{
  background:linear-gradient(145deg,#f2eaff,#fcf9ff);
  border:1px solid #e3d5f6;
}

.kh-product-modal .kh-add-stock-section{
  background:linear-gradient(145deg,#e5f7ee,#f8fdfb);
  border:1px solid #cce9da;
}


/* Inputs inside cards */

.kh-product-modal .kh-add-section .field{
  margin:0 !important;
}

.kh-product-modal .kh-add-section .field label{
  margin-bottom:6px;
}

.kh-product-modal .kh-add-section input,
.kh-product-modal .kh-add-section select{
  background:#fff !important;
}

.kh-product-modal .kh-add-price-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.kh-product-modal .kh-add-price-field{
  padding:9px !important;
  border-radius:12px;
  background:rgba(255,255,255,.64);
  border:1px solid rgba(208,227,242,.9);
}

.kh-product-modal .kh-add-price-field.is-main{
  background:#fff;
  box-shadow:0 3px 9px rgba(31,106,166,.06);
}

.kh-product-modal .kh-add-purchase-field{
  padding:9px !important;
  border-radius:12px;
  background:rgba(255,255,255,.7);
}

.kh-product-modal .kh-add-code-input-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
}

.kh-product-modal .kh-add-camera-btn{
  min-height:44px;
  white-space:nowrap;
}

.kh-product-modal .kh-add-stock-toggle{
  margin:0 !important;
  padding:10px !important;
  border-radius:12px;
  background:rgba(255,255,255,.68);
}

.kh-product-modal .kh-add-stock-toggle span{
  display:block;
}

.kh-product-modal .kh-add-stock-toggle strong{
  display:block;
  color:#275a43;
  font-size:10px;
  font-weight:900;
}

.kh-product-modal .kh-add-stock-toggle small{
  display:block;
  margin-top:3px;
  color:#789080;
  font-size:8px;
}


/* Mobile */

@media(max-width:600px){

  .kh-product-modal .kh-add-product-auto-row{
    grid-template-columns:1fr 1fr;
  }

  .kh-product-modal .kh-add-auto-card{
    padding:9px;
  }

  .kh-product-modal .kh-add-auto-card > span{
    width:31px;
    height:31px;
    min-width:31px;
    font-size:14px;
  }

  .kh-product-modal .kh-add-section{
    padding:10px;
    border-radius:15px;
  }

  .kh-product-modal .kh-add-price-grid{
    grid-template-columns:1fr;
  }

  .kh-product-modal .kh-add-code-input-row{
    grid-template-columns:1fr;
  }

  .kh-product-modal .kh-add-camera-btn{
    width:100%;
  }
}


/* =========================================================
   KashfHesab — Add Product / Inline New Group
   ========================================================= */

.kh-product-modal .kh-add-product-new-group{
  margin-top:10px;
  padding:11px;
  border:1px solid #d8c9f2;
  border-radius:13px;
  background:rgba(255,255,255,.76);
  box-shadow:0 4px 12px rgba(87,61,132,.05);
}

.kh-product-modal .kh-add-product-new-group[hidden]{
  display:none !important;
}

.kh-product-modal .kh-add-product-new-group label{
  display:block;
  margin-bottom:6px;
  color:#554176;
  font-size:10px;
  font-weight:900;
}

.kh-product-modal .kh-add-product-new-group input{
  width:100%;
  background:#fff !important;
}

.kh-product-modal .kh-add-product-new-group small{
  display:block;
  margin-top:6px;
  color:#87799a;
  font-size:8px;
  font-weight:700;
}


/* KashfHesab — Live Inline Product Group */
.kh-inline-group-actions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:9px;
  flex-wrap:wrap;
}

.kh-inline-group-actions .btn{
  width:auto;
  min-width:135px;
}

.kh-inline-product-group-status{
  font-size:10px;
  font-weight:800;
  color:#52705b;
}


/* =========================================================
   KashfHesab V68.6B — Add Product Compact Inline Prices
   السعر + حقل السعر في نفس السطر
   ========================================================= */

.kh-product-modal .kh-add-price-field,
.kh-product-modal .kh-add-purchase-field{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  gap:12px !important;
  margin:7px 0 !important;
}

.kh-product-modal .kh-add-price-field > label,
.kh-product-modal .kh-add-purchase-field > label{
  display:block !important;
  flex:0 0 125px !important;
  width:125px !important;
  min-width:125px !important;
  margin:0 !important;
  padding:0 !important;
  white-space:nowrap !important;
  line-height:1.3 !important;
}

.kh-product-modal .kh-add-price-field > input,
.kh-product-modal .kh-add-purchase-field > input{
  display:block !important;
  flex:1 1 0 !important;
  width:0 !important;
  min-width:0 !important;
  max-width:none !important;
  margin:0 !important;
}

/* السعر الأساسي يبقى مميزاً بتصميمه الحالي */
.kh-product-modal .kh-add-price-field.is-main{
  align-items:center !important;
}

/* الهاتف — نبقي السعر والحقل بنفس السطر */
@media(max-width:600px){

  .kh-product-modal .kh-add-price-field,
  .kh-product-modal .kh-add-purchase-field{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:8px !important;
    margin:5px 0 !important;
  }

  .kh-product-modal .kh-add-price-field > label,
  .kh-product-modal .kh-add-purchase-field > label{
    flex:0 0 108px !important;
    width:108px !important;
    min-width:108px !important;
    font-size:13px !important;
  }

  .kh-product-modal .kh-add-price-field > input,
  .kh-product-modal .kh-add-purchase-field > input{
    flex:1 1 0 !important;
    width:0 !important;
    min-width:0 !important;
  }
}


/* =========================================================
   KashfHesab V68.6B — Barcode Camera Above Add Product Modal
   ========================================================= */

/*
 * نافذة ماسح الباركود يجب أن تظهر فوق نافذة إضافة الصنف.
 * لا نغلق نموذج الصنف حتى تبقى جميع البيانات المدخلة محفوظة.
 */
#barcode-modal{
  z-index:2147483000 !important;
}

#barcode-modal .sheet{
  position:relative !important;
  z-index:2147483001 !important;
}

/* أثناء فتح الماسح نبقي الفيديو فوق جميع نوافذ المنتجات */
#barcode-modal video,
#barcode-modal #barcode-modal-video{
  position:relative;
  z-index:1;
}


/* =========================================================
   KashfHesab — Add Product Duplicate Warning
   ========================================================= */

.kh-product-duplicate-warning{
  margin:16px;
  padding:16px;
  border:1px solid #f6c453;
  border-radius:18px;
  background:#fffaf0;
  box-shadow:0 8px 24px rgba(15,23,42,.06);
}

.kh-product-duplicate-warning.is-hard{
  border-color:#f2a6a6;
  background:#fff5f5;
}

.kh-product-duplicate-warning-head{
  display:flex;
  align-items:flex-start;
  gap:10px;
}

.kh-product-duplicate-warning-icon{
  font-size:24px;
  line-height:1;
}

.kh-product-duplicate-warning-head strong{
  display:block;
  font-size:15px;
  margin-bottom:4px;
}

.kh-product-duplicate-warning-head p{
  margin:0;
  font-size:13px;
  color:#64748b;
}

.kh-product-duplicate-existing{
  margin-top:13px;
  padding:13px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:14px;
}

.kh-product-duplicate-name{
  font-weight:900;
  font-size:16px;
  margin-bottom:10px;
}

.kh-product-duplicate-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.kh-product-duplicate-grid > div{
  padding:9px 10px;
  border-radius:10px;
  background:#f8fafc;
}

.kh-product-duplicate-grid span{
  display:block;
  color:#64748b;
  font-size:11px;
  margin-bottom:3px;
}

.kh-product-duplicate-grid b{
  display:block;
  font-size:13px;
  overflow-wrap:anywhere;
}

.kh-product-duplicate-actions{
  display:flex;
  gap:8px;
  margin-top:13px;
}

.kh-product-duplicate-actions .btn{
  flex:1;
  justify-content:center;
}

.kh-product-duplicate-hard-note{
  margin-top:12px;
  font-weight:800;
  color:#b42318;
}

@media(max-width:600px){
  .kh-product-duplicate-warning{
    margin:12px;
    padding:13px;
  }

  .kh-product-duplicate-grid{
    grid-template-columns:1fr 1fr;
  }
}


/* =========================================================
   KashfHesab — Product Duplicate Center Screen Popup
   ========================================================= */

#kh-product-blur-warning.kh-product-duplicate-popup{
  position:fixed !important;
  top:50% !important;
  left:50% !important;
  right:auto !important;
  bottom:auto !important;

  transform:translate(-50%,-50%) !important;

  z-index:2147483200 !important;

  display:none;
  width:min(520px,calc(100vw - 28px)) !important;
  max-height:calc(100vh - 40px);
  overflow:auto;

  margin:0 !important;
  padding:20px !important;

  border-radius:22px !important;

  box-shadow:
    0 30px 90px rgba(15,23,42,.35),
    0 0 0 100vmax rgba(15,23,42,.46) !important;
}

#kh-product-blur-warning.kh-product-duplicate-popup.is-hard{
  border:1px solid #efaaaa !important;
}

.kh-product-duplicate-popup-x{
  position:absolute;
  top:10px;
  left:12px;

  width:34px;
  height:34px;

  display:flex;
  align-items:center;
  justify-content:center;

  padding:0;
  border:0;
  border-radius:50%;

  background:#fff;
  box-shadow:0 2px 9px rgba(15,23,42,.12);

  font-size:23px;
  line-height:1;
  cursor:pointer;
}

.kh-product-duplicate-popup-actions{
  display:flex;
  margin-top:15px;
}

.kh-product-duplicate-popup-actions .btn{
  width:100%;
  justify-content:center;
  min-height:44px;
}

@media(max-width:600px){

  #kh-product-blur-warning.kh-product-duplicate-popup{
    width:calc(100vw - 24px) !important;
    max-height:calc(100vh - 30px);
    padding:16px !important;
    border-radius:18px !important;
  }

}


/* =========================================================
   KashfHesab — Products Stats V2
   4 Professional Compact Cards / One Row
   ========================================================= */

.products-v2 .kh-products-real-stats,
.kh-products-real-stats{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:12px !important;
    width:100% !important;
    margin:14px 0 18px !important;
}

/* CARD */
.products-v2 .kh-products-real-stats .kh-real-stat,
.kh-products-real-stats .kh-real-stat{
    position:relative !important;
    display:grid !important;
    grid-template-columns:52px minmax(0,1fr) 22px !important;
    align-items:center !important;
    gap:11px !important;

    min-width:0 !important;
    min-height:100px !important;
    padding:14px !important;

    text-align:right !important;
    direction:rtl !important;

    border:1px solid #e6ebf2 !important;
    border-radius:18px !important;
    background:#fff !important;

    box-shadow:
        0 5px 18px rgba(15,23,42,.055),
        0 1px 2px rgba(15,23,42,.035) !important;

    overflow:hidden !important;
    cursor:pointer !important;

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease !important;
}

/* subtle top accent */
.kh-products-real-stats .kh-real-stat::before{
    content:"" !important;
    position:absolute !important;
    top:0 !important;
    right:18px !important;
    left:18px !important;
    height:3px !important;
    border-radius:0 0 8px 8px !important;
    background:#dbeafe !important;
}

/* ICON */
.kh-products-real-stats .product-stat-icon{
    width:52px !important;
    height:52px !important;
    min-width:52px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    margin:0 !important;
    border-radius:16px !important;

    font-size:24px !important;
    line-height:1 !important;

    background:#f1f5f9 !important;
    box-shadow:inset 0 0 0 1px rgba(15,23,42,.04) !important;
}

/* TEXT AREA */
.kh-products-real-stats .kh-real-stat > div{
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:2px !important;
}

/* TITLE */
.kh-products-real-stats .kh-real-stat small{
    display:block !important;
    margin:0 !important;
    color:#64748b !important;
    font-size:12px !important;
    font-weight:800 !important;
    line-height:1.25 !important;
    white-space:nowrap !important;
}

/* NUMBER */
.kh-products-real-stats .kh-real-stat strong{
    display:block !important;
    margin:1px 0 !important;
    color:#0f172a !important;
    font-size:25px !important;
    font-weight:900 !important;
    line-height:1.05 !important;
    letter-spacing:-.5px !important;
}

/* DESCRIPTION */
.kh-products-real-stats .kh-real-stat em{
    display:block !important;
    margin:0 !important;
    color:#94a3b8 !important;
    font-size:10px !important;
    font-weight:700 !important;
    font-style:normal !important;
    line-height:1.25 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    max-width:100% !important;
}

/* ARROW */
.kh-products-real-stats .kh-real-stat-arrow{
    width:22px !important;
    height:22px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:50% !important;
    background:#f8fafc !important;
    color:#94a3b8 !important;

    font-size:20px !important;
    font-weight:700 !important;
    line-height:1 !important;
}

/* =========================================================
   Individual visual identity
   ========================================================= */

/* All products */
.kh-products-real-stats .kh-real-stat-all::before{
    background:#3b82f6 !important;
}

.kh-products-real-stats .kh-real-stat-all .product-stat-icon{
    background:#eff6ff !important;
    color:#2563eb !important;
}

/* Groups */
.kh-products-real-stats .kh-real-stat-groups::before{
    background:#8b5cf6 !important;
}

.kh-products-real-stats .kh-real-stat-groups .product-stat-icon{
    background:#f5f3ff !important;
    color:#7c3aed !important;
}

/* Tracked */
.kh-products-real-stats .kh-real-stat-tracked::before{
    background:#10b981 !important;
}

.kh-products-real-stats .kh-real-stat-tracked .product-stat-icon{
    background:#ecfdf5 !important;
    color:#059669 !important;
}

/* Not tracked */
.kh-products-real-stats .kh-real-stat-disabled::before{
    background:#94a3b8 !important;
}

.kh-products-real-stats .kh-real-stat-disabled .product-stat-icon{
    background:#f1f5f9 !important;
    color:#64748b !important;
}

/* =========================================================
   Hover
   ========================================================= */

@media (hover:hover){
    .kh-products-real-stats .kh-real-stat:hover{
        transform:translateY(-3px) !important;
        border-color:#d7e0ec !important;
        box-shadow:
            0 13px 28px rgba(15,23,42,.10),
            0 2px 5px rgba(15,23,42,.04) !important;
    }

    .kh-products-real-stats .kh-real-stat:hover .kh-real-stat-arrow{
        background:#eef4fb !important;
        color:#334155 !important;
        transform:translateX(-2px) !important;
    }
}

/* =========================================================
   Selected / Active filter
   ========================================================= */

.kh-products-real-stats .kh-real-stat.is-selected{
    border-color:#93c5fd !important;
    background:
        linear-gradient(135deg,#ffffff 0%,#f8fbff 100%) !important;

    box-shadow:
        0 0 0 2px rgba(59,130,246,.08),
        0 10px 25px rgba(37,99,235,.10) !important;
}

.kh-products-real-stats .kh-real-stat.is-selected .kh-real-stat-arrow{
    background:#2563eb !important;
    color:#fff !important;
}

/* =========================================================
   MOBILE
   Keep ALL FOUR in one row
   ========================================================= */

@media(max-width:700px){

    .products-v2 .kh-products-real-stats,
    .kh-products-real-stats{
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
        gap:6px !important;
        margin:10px 0 14px !important;
    }

    .products-v2 .kh-products-real-stats .kh-real-stat,
    .kh-products-real-stats .kh-real-stat{
        display:flex !important;
        flex-direction:column !important;
        justify-content:center !important;
        align-items:center !important;

        min-height:96px !important;
        padding:9px 4px 7px !important;
        gap:4px !important;

        text-align:center !important;
        border-radius:14px !important;
    }

    .kh-products-real-stats .kh-real-stat::before{
        right:10px !important;
        left:10px !important;
        height:3px !important;
    }

    .kh-products-real-stats .product-stat-icon{
        width:34px !important;
        height:34px !important;
        min-width:34px !important;
        border-radius:11px !important;
        font-size:17px !important;
    }

    .kh-products-real-stats .kh-real-stat > div{
        width:100% !important;
        align-items:center !important;
        gap:1px !important;
    }

    .kh-products-real-stats .kh-real-stat small{
        width:100% !important;
        font-size:9px !important;
        line-height:1.15 !important;
        white-space:normal !important;
        text-align:center !important;
    }

    .kh-products-real-stats .kh-real-stat strong{
        font-size:19px !important;
        line-height:1 !important;
    }

    .kh-products-real-stats .kh-real-stat em,
    .kh-products-real-stats .kh-real-stat-arrow{
        display:none !important;
    }
}

@media(max-width:390px){

    .products-v2 .kh-products-real-stats,
    .kh-products-real-stats{
        gap:4px !important;
    }

    .products-v2 .kh-products-real-stats .kh-real-stat,
    .kh-products-real-stats .kh-real-stat{
        min-height:88px !important;
        padding:7px 2px 6px !important;
        border-radius:12px !important;
    }

    .kh-products-real-stats .product-stat-icon{
        width:30px !important;
        height:30px !important;
        min-width:30px !important;
        font-size:15px !important;
    }

    .kh-products-real-stats .kh-real-stat small{
        font-size:8px !important;
    }

    .kh-products-real-stats .kh-real-stat strong{
        font-size:17px !important;
    }
}


/* =========================================================
   KashfHesab — Product Groups Inline Edit
   ========================================================= */

.kh-product-group-edit-row{
    position:relative;
}

.kh-product-group-actions{
    display:flex !important;
    align-items:center;
    gap:7px;
}

.kh-product-group-actions form{
    margin:0 !important;
}

.kh-product-group-edit-form{
    grid-column:1 / -1;
    width:100%;
    margin-top:10px;
    padding:11px;
    border:1px solid #dbe5f0;
    border-radius:13px;
    background:#f8fafc;
}

.kh-product-group-edit-form[hidden]{
    display:none !important;
}

.kh-product-group-edit-form:not([hidden]){
    display:flex !important;
    align-items:center;
    gap:8px;
}

.kh-product-group-edit-form input[name="group_name"]{
    flex:1 1 auto;
    min-width:0;
    margin:0 !important;
}

.kh-product-group-edit-actions{
    display:flex;
    align-items:center;
    gap:6px;
    flex:0 0 auto;
}

@media(max-width:600px){

    .kh-product-group-actions{
        gap:4px;
    }

    .kh-product-group-edit-form:not([hidden]){
        flex-direction:column;
        align-items:stretch;
    }

    .kh-product-group-edit-actions{
        width:100%;
    }

    .kh-product-group-edit-actions .btn{
        flex:1;
        justify-content:center;
    }
}


/* =========================================================
   KashfHesab — Group Products Viewer
   ========================================================= */

.kh-group-products-btn{
    display:inline-flex !important;
    align-items:center;
    gap:6px;
}

.kh-group-products-count{
    min-width:21px;
    height:21px;
    padding:0 6px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#eaf2ff;
    color:#2563eb;
    font-size:11px;
    font-weight:800;
}

.kh-group-products-btn.is-open{
    background:#eff6ff !important;
    border-color:#bfdbfe !important;
    color:#1d4ed8 !important;
}

.kh-group-products-list{
    width:100%;
    margin-top:12px;
    padding:13px;
    border:1px solid #dce6f2;
    border-radius:15px;
    background:#f8fafc;
}

.kh-group-products-list[hidden]{
    display:none !important;
}

.kh-group-products-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding-bottom:10px;
    margin-bottom:8px;
    border-bottom:1px solid #e5eaf0;
    font-weight:800;
}

.kh-group-products-head strong{
    font-size:12px;
    padding:4px 9px;
    border-radius:999px;
    background:#eaf2ff;
    color:#2563eb;
}

.kh-group-products-items{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
}

.kh-group-product-item{
    min-width:0;
    display:flex;
    align-items:center;
    gap:8px;
    padding:9px 11px;
    background:#fff;
    border:1px solid #e5eaf0;
    border-radius:11px;
}

.kh-group-product-icon{
    flex:0 0 auto;
}

.kh-group-product-name{
    min-width:0;
    flex:1;
    font-weight:700;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.kh-group-product-item small{
    direction:ltr;
    color:#64748b;
    font-size:11px;
}

.kh-group-products-empty{
    padding:13px;
    text-align:center;
    color:#64748b;
}

@media(max-width:600px){

    .kh-group-products-items{
        grid-template-columns:1fr;
    }

    .kh-group-products-list{
        padding:10px;
    }

    .kh-group-products-btn{
        padding-inline:8px !important;
    }
}


/* =========================================================
   KashfHesab — Product Group Products Modal
   ========================================================= */

body.kh-group-products-modal-open{
    overflow:hidden !important;
}

.kh-group-products-modal{
    position:fixed;
    inset:0;
    z-index:2147482500;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
}

.kh-group-products-modal[hidden]{
    display:none !important;
}

.kh-group-products-backdrop{
    position:absolute;
    inset:0;
    background:rgba(15,23,42,.48);
    backdrop-filter:blur(2px);
}

.kh-group-products-dialog{
    position:relative;
    z-index:2;
    width:min(760px,100%);
    max-height:min(720px,calc(100vh - 40px));
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:22px;
    box-shadow:0 30px 90px rgba(15,23,42,.28);
}

.kh-group-products-modal-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:19px 20px 16px;
    border-bottom:1px solid #e8edf3;
}

.kh-group-products-modal-head h3{
    margin:0 0 5px;
    font-size:18px;
    color:#0f172a;
}

.kh-group-products-modal-head p{
    margin:0;
    font-size:13px;
    color:#64748b;
}

.kh-group-products-x{
    flex:0 0 38px;
    width:38px;
    height:38px;
    padding:0;
    border:1px solid #e2e8f0;
    border-radius:50%;
    background:#fff;
    color:#475569;
    font-size:25px;
    line-height:1;
    cursor:pointer;
}

.kh-group-products-modal-body{
    overflow:auto;
    padding:16px 20px;
}

.kh-group-products-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.kh-group-product-card{
    display:flex;
    align-items:center;
    gap:11px;
    min-width:0;
    padding:12px;
    border:1px solid #e3eaf2;
    border-radius:14px;
    background:#fff;
}

.kh-group-product-card-icon{
    flex:0 0 40px;
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:#eff6ff;
    font-size:19px;
}

.kh-group-product-card-main{
    min-width:0;
    flex:1;
}

.kh-group-product-card-main b{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:#0f172a;
}

.kh-group-product-card-main small{
    display:block;
    margin-top:3px;
    color:#64748b;
    font-size:11px;
}

.kh-group-product-price{
    flex:0 0 auto;
    color:#166534;
    font-size:13px;
}

.kh-group-products-empty{
    min-height:150px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:9px;
    color:#64748b;
}

.kh-group-products-empty span{
    font-size:35px;
}

.kh-group-products-modal-foot{
    display:flex;
    justify-content:flex-start;
    padding:13px 20px;
    border-top:1px solid #e8edf3;
    background:#f8fafc;
}

.kh-group-products-open{
    white-space:nowrap;
}

@media(max-width:600px){

    .kh-group-products-modal{
        padding:12px;
    }

    .kh-group-products-dialog{
        max-height:calc(100vh - 24px);
        border-radius:18px;
    }

    .kh-group-products-grid{
        grid-template-columns:1fr;
    }

    .kh-group-products-modal-head{
        padding:16px;
    }

    .kh-group-products-modal-body{
        padding:12px 16px;
    }

    .kh-group-products-modal-foot{
        padding:12px 16px;
    }
}


/* =========================================================
   Group Products — compact KH52 list
   ========================================================= */

.kh-group-products-title{
    display:flex !important;
    align-items:center;
    gap:9px;
    flex-wrap:wrap;
    margin:0 !important;
}

.kh-group-products-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:25px;
    padding:3px 9px;
    border-radius:999px;
    background:#eff6ff;
    color:#2563eb;
    font-size:11px;
    font-weight:800;
    white-space:nowrap;
}

.kh-group-products-list{
    width:100%;
}

.kh-group-product-row{
    cursor:pointer;
}

.kh-group-product-stock{
    display:flex !important;
    align-items:center;
    gap:6px;
    white-space:nowrap;
}

.kh-group-stock-label{
    font-size:11px;
    font-weight:600;
    color:#64748b;
}

.kh-group-product-stock strong{
    font-size:14px;
    font-weight:900;
    color:#166534;
}

.kh-group-stock-off{
    font-size:11px;
    font-weight:700;
    color:#94a3b8;
}

@media(max-width:600px){

    .kh-group-products-modal-body{
        padding:10px 12px !important;
    }

    .kh-group-product-row{
        grid-template-columns:38px minmax(0,1fr) auto !important;
        gap:8px !important;
        padding:9px 10px !important;
    }

    .kh-group-product-row .kh52-entry-icon{
        width:37px !important;
        height:37px !important;
    }

    .kh-group-products-title{
        gap:6px;
        font-size:15px !important;
    }
}


/* ============================================================
   GROUP PRODUCT ACTIONS V1
   ============================================================ */

.kh-group-product-main{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    min-width:0 !important;
}

.kh-group-product-name{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.kh-group-product-actions{
    display:flex;
    align-items:center;
    gap:6px;
    flex:0 0 auto;
}

.kh-group-product-actions .btn{
    width:auto !important;
    min-height:32px;
    margin:0 !important;
    padding:6px 10px !important;
    border-radius:9px !important;
    white-space:nowrap;
    font-size:12px !important;
    font-weight:700;
    text-decoration:none !important;
}

.kh-group-product-moves,
.kh-group-product-edit{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:4px;
}

@media(max-width:600px){

    .kh-group-product-main{
        align-items:flex-start !important;
        flex-direction:column !important;
        gap:7px !important;
    }

    .kh-group-product-actions{
        width:100%;
        gap:5px;
    }

    .kh-group-product-actions .btn{
        min-height:29px;
        padding:5px 8px !important;
        font-size:11px !important;
    }
}

/* ============================================================
   KH PRODUCT LIST — APPROVED KH52 EFFECTS
   ============================================================ */

.kh-product-list-item{
  position:relative;
  margin-bottom:9px;
}

.kh-product-kh52-row{
  width:100% !important;
  border:none;
  font-family:inherit;
  text-align:right;
  cursor:pointer;
}

.kh-product-kh52-row .kh52-entry-icon.product{
  background:#eef5ff !important;
}

.kh-product-kh52-name strong{
  font-size:13px !important;
}

.kh-product-kh52-values{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  direction:rtl;
}

.kh-product-kh52-value{
  min-width:88px;
  padding:5px 9px;
  border-radius:9px;
  background:#f7f9fc;
  text-align:center;
  white-space:nowrap;
}

.kh-product-kh52-value small{
  display:block;
  margin-bottom:2px;
  color:#8290a3;
  font-size:9px;
  font-weight:700;
}

.kh-product-kh52-value strong{
  display:block;
  color:#15365d;
  font-size:11px;
  font-weight:900;
  direction:ltr;
}

.kh-product-kh52-value strong em{
  margin-inline-start:2px;
  color:#8a98aa;
  font-size:8px;
  font-style:normal;
  font-weight:600;
}

.kh-product-kh52-stock strong{
  color:#166534;
}

.kh-product-list-check{
  position:absolute;
  z-index:5;
  top:50%;
  right:7px;
  transform:translateY(-50%);
}

.kh-product-list-item:has(.kh-product-list-check)
.kh-product-kh52-row{
  padding-right:42px !important;
}


/* ---------- FULL PRODUCT DETAILS ---------- */

body.kh-product-detail-modal-open{
  overflow:hidden !important;
}

.kh-product-detail-modal{
  position:fixed;
  inset:0;
  z-index:2147482600;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}

.kh-product-detail-modal[hidden]{
  display:none !important;
}

.kh-product-detail-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.48);
  backdrop-filter:blur(2px);
}

.kh-product-detail-dialog{
  position:relative;
  z-index:2;
  width:min(820px,100%);
  max-height:calc(100vh - 40px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:22px;
  box-shadow:0 30px 90px rgba(15,23,42,.28);
}

.kh-product-detail-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 20px;
  border-bottom:1px solid #e8edf3;
}

.kh-product-detail-modal-head small{
  color:#8290a3;
  font-size:10px;
  font-weight:700;
}

.kh-product-detail-modal-head h3{
  margin:3px 0 0;
  color:#122d4d;
  font-size:18px;
}

.kh-product-detail-x{
  width:38px;
  height:38px;
  flex:0 0 38px;
  padding:0;
  border:1px solid #e2e8f0;
  border-radius:50%;
  background:#fff;
  color:#475569;
  font-size:25px;
  cursor:pointer;
}

.kh-product-detail-modal-body{
  overflow:auto;
  padding:18px 20px;
}


/* mobile */
@media(max-width:600px){

  .kh-product-detail-modal{
    padding:12px;
  }

  .kh-product-detail-dialog{
    max-height:calc(100vh - 24px);
    border-radius:18px;
  }

  .kh-product-kh52-row{
    grid-template-columns:39px minmax(0,1fr) !important;
    align-items:start !important;
  }

  .kh-product-kh52-values{
    grid-column:1 / -1;
    width:100%;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:5px;
  }

  .kh-product-kh52-value{
    min-width:0;
    padding:5px 4px;
  }

  .kh-product-kh52-value small{
    font-size:8px;
  }

  .kh-product-kh52-value strong{
    font-size:10px;
  }
}


/* ============================================================
   PRODUCT MOVES SHORTCUT + SMART RETURN V1
   ============================================================ */

.kh-product-name-actions{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  min-width:0 !important;
}

.kh-product-name-actions > strong{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.kh-product-moves-shortcut{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  flex:0 0 auto !important;

  padding:3px 7px !important;

  border:1px solid #dce6f2 !important;
  border-radius:7px !important;

  background:#f6f9fd !important;

  color:#416487 !important;

  font-size:9px !important;
  font-weight:800 !important;
  line-height:1.2 !important;

  white-space:nowrap !important;

  cursor:pointer !important;

  transition:
    background .15s ease,
    border-color .15s ease,
    transform .15s ease !important;
}

.kh-product-moves-shortcut:hover{
  background:#edf5ff !important;
  border-color:#c9dbef !important;
  transform:translateY(-1px);
}

.kh-product-return-focus .kh-product-kh52-row{
  border-color:#9bbde4 !important;

  box-shadow:
    0 0 0 3px rgba(50,112,184,.10),
    0 7px 18px rgba(15,55,100,.085) !important;
}


/* Mobile */
@media(max-width:600px){

  .kh-product-name-actions{
    gap:5px !important;
  }

  .kh-product-moves-shortcut{
    padding:3px 5px !important;
    font-size:8px !important;
  }

}


/* ============================================================
   PRODUCT MOVES — FAR LEFT + HIGHLIGHT V2
   ============================================================ */

/* الاسم يمين — حركاته أقصى يسار */
.kh-product-name-actions{
  width:100% !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  min-width:0 !important;
}

.kh-product-name-actions > strong{
  flex:1 1 auto !important;
  min-width:0 !important;
  text-align:right !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}


/* زر حركاته البارز */
.kh-product-moves-shortcut{
  flex:0 0 auto !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;

  margin-inline-start:auto !important;

  padding:6px 11px !important;

  border:1px solid #b9d5f2 !important;
  border-radius:9px !important;

  background:linear-gradient(
    135deg,
    #f4f9ff 0%,
    #e8f3ff 100%
  ) !important;

  color:#1764ad !important;

  font-size:10px !important;
  font-weight:900 !important;
  line-height:1.2 !important;

  white-space:nowrap !important;

  box-shadow:
    0 3px 9px rgba(28,100,173,.12),
    inset 0 0 0 1px rgba(255,255,255,.7) !important;

  cursor:pointer !important;

  transition:
    transform .16s ease,
    box-shadow .16s ease,
    background .16s ease,
    border-color .16s ease !important;
}


/* Hover */
.kh-product-moves-shortcut:hover{
  color:#0d559c !important;

  background:linear-gradient(
    135deg,
    #eaf5ff 0%,
    #dceeff 100%
  ) !important;

  border-color:#82b8e8 !important;

  box-shadow:
    0 6px 15px rgba(28,100,173,.20),
    inset 0 0 0 1px rgba(255,255,255,.8) !important;

  transform:translateY(-2px) !important;
}


/* ضغط الزر */
.kh-product-moves-shortcut:active{
  transform:translateY(0) scale(.97) !important;
}


/* Keyboard focus */
.kh-product-moves-shortcut:focus-visible{
  outline:3px solid rgba(47,128,209,.18) !important;
  outline-offset:2px !important;
}


/* الهاتف */
@media(max-width:600px){

  .kh-product-name-actions{
    width:100% !important;
    gap:7px !important;
  }

  .kh-product-moves-shortcut{
    margin-inline-start:auto !important;
    padding:5px 8px !important;
    border-radius:8px !important;
    font-size:9px !important;
  }

}


/* ============================================================
   PRODUCT LIST — PREMIUM COLORED CARDS V1
   ============================================================ */

/*
 * الأساس الاحترافي لكل بطاقات الأصناف
 */
.kh-product-list-item .kh-product-kh52-row{
  position:relative !important;
  overflow:hidden !important;

  border:1px solid #d9e5f2 !important;
  border-inline-start:4px solid #4f8fd5 !important;

  border-radius:14px !important;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f5f9ff 100%
    ) !important;

  box-shadow:
    0 2px 4px rgba(15,55,100,.035),
    0 7px 18px rgba(15,55,100,.07) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background .18s ease !important;
}


/*
 * لمعة داخلية خفيفة جداً
 */
.kh-product-list-item .kh-product-kh52-row::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;

  background:
    linear-gradient(
      120deg,
      rgba(255,255,255,.34),
      transparent 35%,
      transparent 70%,
      rgba(255,255,255,.20)
    );

  opacity:.65;
}


/* المحتوى فوق التأثير */
.kh-product-list-item .kh-product-kh52-row > *{
  position:relative;
  z-index:1;
}


/* ============================================================
   CARD 1 — BLUE
   ============================================================ */

.kh-product-list-item:nth-of-type(4n + 1)
.kh-product-kh52-row{
  border-color:#cfdef0 !important;
  border-inline-start-color:#397fc7 !important;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f1f7ff 100%
    ) !important;

  box-shadow:
    0 3px 6px rgba(35,94,155,.04),
    0 8px 20px rgba(35,94,155,.085) !important;
}

.kh-product-list-item:nth-of-type(4n + 1)
.kh52-entry-icon{
  background:#e8f3ff !important;
  color:#276cad !important;

  box-shadow:
    inset 0 0 0 1px #d3e7fb,
    0 3px 8px rgba(39,108,173,.10) !important;
}


/* ============================================================
   CARD 2 — GREEN
   ============================================================ */

.kh-product-list-item:nth-of-type(4n + 2)
.kh-product-kh52-row{
  border-color:#d2e9df !important;
  border-inline-start-color:#32906e !important;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f1faf6 100%
    ) !important;

  box-shadow:
    0 3px 6px rgba(35,117,87,.04),
    0 8px 20px rgba(35,117,87,.075) !important;
}

.kh-product-list-item:nth-of-type(4n + 2)
.kh52-entry-icon{
  background:#e8f7f0 !important;
  color:#267a5d !important;

  box-shadow:
    inset 0 0 0 1px #d2eee2,
    0 3px 8px rgba(38,122,93,.10) !important;
}


/* ============================================================
   CARD 3 — PURPLE
   ============================================================ */

.kh-product-list-item:nth-of-type(4n + 3)
.kh-product-kh52-row{
  border-color:#e0daf1 !important;
  border-inline-start-color:#8067bc !important;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #f7f4fc 100%
    ) !important;

  box-shadow:
    0 3px 6px rgba(103,79,158,.04),
    0 8px 20px rgba(103,79,158,.075) !important;
}

.kh-product-list-item:nth-of-type(4n + 3)
.kh52-entry-icon{
  background:#f0ebfa !important;
  color:#7258ae !important;

  box-shadow:
    inset 0 0 0 1px #e3daf6,
    0 3px 8px rgba(114,88,174,.10) !important;
}


/* ============================================================
   CARD 4 — GOLD / AMBER
   ============================================================ */

.kh-product-list-item:nth-of-type(4n)
.kh-product-kh52-row{
  border-color:#eee1c6 !important;
  border-inline-start-color:#c58a2a !important;

  background:
    linear-gradient(
      135deg,
      #ffffff 0%,
      #fff9ee 100%
    ) !important;

  box-shadow:
    0 3px 6px rgba(157,105,27,.035),
    0 8px 20px rgba(157,105,27,.07) !important;
}

.kh-product-list-item:nth-of-type(4n)
.kh52-entry-icon{
  background:#fff4dd !important;
  color:#a86e17 !important;

  box-shadow:
    inset 0 0 0 1px #f4e3be,
    0 3px 8px rgba(168,110,23,.10) !important;
}


/* ============================================================
   HOVER — PROFESSIONAL LIFT
   ============================================================ */

.kh-product-list-item
.kh-product-kh52-row:hover{
  transform:translateY(-2px) !important;

  border-color:#aac8e7 !important;

  box-shadow:
    0 4px 8px rgba(15,55,100,.055),
    0 12px 27px rgba(15,55,100,.13) !important;
}


/*
 * اسم الصنف أوضح
 */
.kh-product-list-item
.kh-product-kh52-name strong{
  color:#102f50 !important;
  font-weight:900 !important;
}


/*
 * مربعات الكمية والأسعار
 */
.kh-product-list-item
.kh-product-kh52-value{
  border:1px solid rgba(195,210,226,.68) !important;

  background:
    rgba(255,255,255,.76) !important;

  box-shadow:
    0 2px 5px rgba(15,55,100,.035) !important;

  backdrop-filter:blur(2px);
}


/*
 * الكمية تمييز خفيف
 */
.kh-product-list-item
.kh-product-kh52-stock{
  background:
    rgba(244,249,255,.88) !important;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:600px){

  .kh-product-list-item
  .kh-product-kh52-row{
    border-radius:12px !important;

    border-inline-start-width:3px !important;

    box-shadow:
      0 2px 4px rgba(15,55,100,.035),
      0 5px 14px rgba(15,55,100,.07) !important;
  }

  .kh-product-list-item
  .kh-product-kh52-row:hover{
    transform:none !important;

    box-shadow:
      0 3px 6px rgba(15,55,100,.04),
      0 7px 17px rgba(15,55,100,.09) !important;
  }

}



/* KH_PRODUCT_IDENTITY_WIDTH_V1 */

/* Smaller sequence card, wider product information */
.products-v2 .kh-product-identity-v2 {
    display: grid;
    grid-template-columns: minmax(76px, 22%) minmax(0, 1fr);
    gap: 12px;
    align-items: stretch;
}

.products-v2 .kh-product-sequence-card {
    width: 100%;
    min-width: 0;
    max-width: none;
    box-sizing: border-box;
}

.products-v2 .kh-product-main-info {
    min-width: 0;
    width: 100%;
}

.products-v2 .kh-product-number-row {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.products-v2 .kh-product-number-row strong {
    overflow-wrap: anywhere;
}

@media (max-width: 600px) {
    .products-v2 .kh-product-identity-v2 {
        grid-template-columns: minmax(65px, 25%) minmax(0, 1fr);
        gap: 8px;
    }
}

/* KH_PRODUCT_CONFIRM_LAYER_V2171 */
#confirm-modal {
  position: fixed !important;
  z-index: 2147483000 !important;
}


/* KH_CONFIRM_DIALOG_V2174 */
dialog#confirm-modal {
  position:fixed !important;
  inset:0 !important;
  margin:auto !important;
  padding:16px !important;
  border:0 !important;
  background:transparent !important;
  max-width:460px !important;
  max-height:100dvh !important;
}
dialog#confirm-modal::backdrop {
  background:rgba(15,23,42,.65);
}
dialog#confirm-modal .sheet {
  width:100%;
  margin:auto;
}

/* KH_CONFIRM_DIALOG_FINAL_V2176 */
dialog#confirm-modal:not([open]) {
  display:none !important;
}
dialog#confirm-modal[open] {
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:fixed !important;
  inset:0 !important;
  margin:auto !important;
  width:min(460px,calc(100% - 24px)) !important;
  height:auto !important;
  max-height:calc(100dvh - 24px) !important;
  padding:0 !important;
  border:0 !important;
  border-radius:20px !important;
  background:transparent !important;
  overflow:visible !important;
}
dialog#confirm-modal .sheet {
  width:100% !important;
  max-width:420px !important;
  margin:0 !important;
}
dialog#confirm-modal::backdrop {
  background:rgba(15,23,42,.65) !important;
}

/* KH_PRODUCT_VISUAL_V220 */

/* Product name */
.products-v2 .kh-product-kh52-name strong {
  font-size:17px !important;
  font-weight:900 !important;
  line-height:1.55 !important;
  color:#102d50 !important;
  letter-spacing:-.25px;
  overflow-wrap:anywhere;
}

/* Quantity highlight */
.products-v2 .kh-product-kh52-stock {
  min-width:105px !important;
  padding:8px 12px !important;
  background:linear-gradient(135deg,#ecfdf5,#d1fae5) !important;
  border:1px solid #a7f3d0 !important;
  border-radius:12px !important;
  box-shadow:0 2px 7px rgba(22,101,52,.07);
}

.products-v2 .kh-product-kh52-stock small {
  color:#047857 !important;
  font-size:10px !important;
  font-weight:800 !important;
}

.products-v2 .kh-product-kh52-stock strong {
  color:#166534 !important;
  font-size:21px !important;
  font-weight:900 !important;
  line-height:1.35 !important;
  font-variant-numeric:tabular-nums;
}

/* Quantity unit */
.products-v2 .kh-product-kh52-stock strong em {
  color:#047857 !important;
  font-size:10px !important;
  font-weight:700 !important;
}

/* Preserve price hierarchy */
.products-v2 .kh-product-kh52-value:not(.kh-product-kh52-stock) strong {
  font-size:12px !important;
}

/* Mobile */
@media(max-width:600px) {
  .products-v2 .kh-product-kh52-name strong {
    font-size:16px !important;
  }

  .products-v2 .kh-product-kh52-stock {
    min-width:88px !important;
    padding:7px 9px !important;
  }

  .products-v2 .kh-product-kh52-stock strong {
    font-size:19px !important;
  }
}


/* KH_PRODUCTS_HIDE_DUPLICATE_GROUPS_V221 */
#add-product-group-panel.products-groups-panel {
  display:none !important;
}


/* KH_PRODUCT_LAYOUT_V223 */

.products-v2 .kh-product-name-actions {
  display:flex !important;
  align-items:center !important;
  flex-direction:row !important;
  justify-content:flex-start !important;
  gap:9px !important;
  width:100% !important;
  direction:rtl !important;
}

.products-v2 .kh-product-auto-sequence {
  order:1 !important;
  flex-shrink:0 !important;
}

.products-v2 .kh-product-name-actions > strong {
  order:2 !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  margin:0 !important;
}

.products-v2 .kh-product-name-actions > .kh-product-kh52-stock {
  order:3 !important;
  flex:0 0 auto !important;
  margin-inline-start:auto !important;
}

.products-v2 .kh-product-kh52-values > .kh-product-moves-shortcut {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-inline-start:0 !important;
  white-space:nowrap !important;
  cursor:pointer !important;
}

@media(max-width:600px) {
  .products-v2 .kh-product-name-actions {
    gap:5px !important;
  }

  .products-v2 .kh-product-name-actions > .kh-product-kh52-stock {
    min-width:75px !important;
  }
}


/* KH_PRODUCT_MOVES_SIZE_V224 */
.products-v2 .kh-product-kh52-values > .kh-product-moves-shortcut {
  box-sizing:border-box !important;
  min-width:88px !important;
  min-height:49px !important;
  padding:5px 9px !important;
  border-radius:9px !important;
  margin:0 !important;
  font-size:12px !important;
  font-weight:900 !important;
  line-height:1.4 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  align-self:stretch !important;
  text-align:center !important;
}



/* KH_PRODUCT_NAME_VISIBILITY_FIX_V2252 */

/* اسم الصنف والرقم والكمية في سطر واحد */
.products-v2 .kh-product-name-actions {
  display:flex !important;
  flex-direction:row !important;
  direction:rtl !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:6px !important;
  min-width:0 !important;
  width:100% !important;
}

/* رقم التسلسل */
.products-v2 .kh-product-name-actions > .kh-product-auto-sequence {
  order:1 !important;
  flex:0 0 auto !important;
}

/* إظهار اسم الصنف */
.products-v2 .kh-product-name-actions > strong {
  order:2 !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  flex:1 1 0 !important;
  min-width:0 !important;
  width:auto !important;
  max-width:none !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  text-align:right !important;
  font-size:16px !important;
  line-height:1.4 !important;
}

/* الكمية تبقى في أقصى اليسار */
.products-v2 .kh-product-name-actions > .kh-product-kh52-stock {
  order:3 !important;
  flex:0 0 auto !important;
  margin-inline-start:auto !important;
}

/* توفير مساحة الاسم على الهاتف */
@media(max-width:600px) {
  .products-v2 .kh-product-name-actions {
    gap:4px !important;
  }

  .products-v2 .kh-product-name-actions > strong {
    font-size:14px !important;
  }

  .products-v2 .kh-product-name-actions > .kh-product-kh52-stock {
    min-width:65px !important;
    padding:5px 6px !important;
  }
}


/* KH_PRODUCT_LAYOUT_REPAIR_V2253 */

/* البطاقة تأخذ العرض الكامل */
.products-v2 .kh-product-kh52-row {
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
}

/* منطقة الاسم تتمدد */
.products-v2 .kh-product-kh52-name {
  display:block !important;
  flex:1 1 auto !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
}

/* صف الاسم والكمية */
.products-v2 .kh-product-name-actions {
  display:grid !important;
  grid-template-columns:
    auto minmax(0,1fr) auto !important;
  align-items:center !important;
  justify-content:stretch !important;
  width:100% !important;
  min-width:0 !important;
  gap:8px !important;
  direction:rtl !important;
}

/* رقم التسلسل أقصى اليمين */
.products-v2 .kh-product-name-actions > .kh-product-auto-sequence {
  grid-column:1 !important;
  grid-row:1 !important;
  margin:0 !important;
  white-space:nowrap !important;
}

/* اسم الصنف ممتد أفقياً */
.products-v2 .kh-product-name-actions > strong {
  grid-column:2 !important;
  grid-row:1 !important;
  display:block !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  flex:none !important;
  white-space:normal !important;
  overflow-wrap:break-word !important;
  word-break:normal !important;
  text-align:right !important;
  font-size:16px !important;
  line-height:1.5 !important;
}

/* الكمية أقصى اليسار */
.products-v2 .kh-product-name-actions > .kh-product-kh52-stock {
  grid-column:3 !important;
  grid-row:1 !important;
  justify-self:end !important;
  align-self:center !important;
  margin:0 !important;
  flex:none !important;
  min-width:78px !important;
  width:auto !important;
}

/* الهاتف */
@media(max-width:600px) {
  .products-v2 .kh-product-name-actions {
    grid-template-columns:
      auto minmax(0,1fr) 78px !important;
    gap:6px !important;
  }

  .products-v2 .kh-product-name-actions > strong {
    font-size:15px !important;
  }

  .products-v2 .kh-product-name-actions > .kh-product-kh52-stock {
    min-width:78px !important;
    padding:6px 7px !important;
  }
}












/* KH_MOBILE_PRODUCTS_V234 */
@media screen and (max-width:767px) {

  /* Main card: full-width vertical structure */
  .products-v2 .kh-product-kh52-row {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    box-sizing:border-box !important;
  }

  /* Product name container */
  .products-v2 .kh-product-kh52-name {
    display:block !important;
    flex:none !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  /* One horizontal row */
  .products-v2 .kh-product-name-actions {
    display:flex !important;
    flex-direction:row !important;
    direction:rtl !important;
    align-items:center !important;
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    gap:8px !important;
  }

  /* Quantity on far right */
  .products-v2 .kh-product-name-actions
  > .kh-product-kh52-stock {
    order:0 !important;
    flex:0 0 90px !important;
    width:90px !important;
    min-width:90px !important;
    max-width:90px !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  /* Serial */
  .products-v2 .kh-product-name-actions
  > .kh-product-auto-sequence {
    order:1 !important;
    flex:0 0 auto !important;
    width:auto !important;
    white-space:nowrap !important;
    margin:0 !important;
  }

  /* Name */
  .products-v2 .kh-product-name-actions
  > strong {
    order:2 !important;
    display:block !important;
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    word-break:normal !important;
    writing-mode:horizontal-tb !important;
    text-align:right !important;
    font-size:15px !important;
    line-height:1.5 !important;
  }

  /* Prices remain in their own row */
  .products-v2 .kh-product-kh52-values {
    width:100% !important;
    min-width:0 !important;
    flex:none !important;
  }
}
/* END KH_MOBILE_PRODUCTS_V234 */


/* KH_MOBILE_QTY_LEFT_V235 */
@media screen and (max-width:767px) {

  /* Product name on the right */
  .products-v2 .kh-product-name-actions > strong {
    order:0 !important;
  }

  /* Sequence beside product name */
  .products-v2 .kh-product-name-actions
  > .kh-product-auto-sequence {
    order:1 !important;
  }

  /* Quantity at the far left */
  .products-v2 .kh-product-name-actions
  > .kh-product-kh52-stock {
    order:2 !important;
    margin-inline-start:auto !important;
  }

}
/* END KH_MOBILE_QTY_LEFT_V235 */


/* KH_MOBILE_SEQUENCE_RIGHT_V236 */
@media screen and (max-width:767px) {

  /* Sequence first on the right */
  .products-v2 .kh-product-name-actions
  > .kh-product-auto-sequence {
    order:0 !important;
    flex:0 0 auto !important;
    margin:0 !important;
    white-space:nowrap !important;
  }

  /* Product name immediately after sequence */
  .products-v2 .kh-product-name-actions
  > strong {
    order:1 !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    text-align:right !important;
  }

  /* Quantity remains on the far left */
  .products-v2 .kh-product-name-actions
  > .kh-product-kh52-stock {
    order:2 !important;
    margin-inline-start:auto !important;
  }

}
/* END KH_MOBILE_SEQUENCE_RIGHT_V236 */


/* KH_PRODUCT_STOCK_COLORS_V237 */
@media screen and (max-width:767px) {
.products-v2 .kh-product-kh52-stock {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  gap:3px !important;
}
.products-v2 .kh-product-kh52-stock small,
.products-v2 .kh-product-kh52-stock strong {
  display:block !important;
  width:100% !important;
  text-align:center !important;
  margin:0 !important;
}
.products-v2 .kh-stock-positive {
  background:#ecfdf5 !important;
  border-color:#86efac !important;
}
.products-v2 .kh-stock-positive small,
.products-v2 .kh-stock-positive strong {
  color:#15803d !important;
}
.products-v2 .kh-stock-negative {
  background:#fef2f2 !important;
  border-color:#fca5a5 !important;
}
.products-v2 .kh-stock-negative small,
.products-v2 .kh-stock-negative strong {
  color:#b91c1c !important;
}
.products-v2 .kh-stock-zero {
  background:#fffbeb !important;
  border-color:#fcd34d !important;
}
.products-v2 .kh-stock-zero small,
.products-v2 .kh-stock-zero strong {
  color:#b45309 !important;
}
.products-v2 .kh-stock-neutral {
  background:#f1f5f9 !important;
  border-color:#cbd5e1 !important;
}
.products-v2 .kh-stock-neutral small,
.products-v2 .kh-stock-neutral strong {
  color:#64748b !important;
}
}
/* END KH_PRODUCT_STOCK_COLORS_V237 */


/* KH_PRODUCT_MULTI_SELECT_V238 */
.products-v2 .kh238-toolbar {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}
.products-v2 .kh238-filter-wrap {
  position:relative;
}
.products-v2 .kh238-filter-toggle {
  white-space:nowrap;
}
.products-v2 .kh238-filter-menu {
  position:absolute;
  top:calc(100% + 6px);
  right:0;
  z-index:100;
  width:min(290px,85vw);
  padding:12px;
  background:#fff;
  color:#1e293b;
  border:1px solid #cbd5e1;
  border-radius:12px;
  box-shadow:0 12px 30px rgba(15,23,42,.14);
  direction:rtl;
}
.products-v2 .kh238-filter-menu[hidden] {
  display:none !important;
}
.products-v2 .kh238-filter-menu > label {
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px 3px;
  cursor:pointer;
  font-weight:500;
}
.products-v2 .kh238-filter-menu input {
  width:auto;
}
.products-v2 .kh238-disabled {
  opacity:.5;
  cursor:not-allowed !important;
}
.products-v2 .kh238-filter-actions {
  display:flex;
  gap:7px;
  margin-top:10px;
}
.products-v2 .kh238-filter-actions .btn {
  flex:1;
  font-size:12px;
}
/* END KH_PRODUCT_MULTI_SELECT_V238 */


/* KH_PRODUCT_GROUPS_VISIBILITY_V2391 */
/* Show the existing groups panel only when opened. */
#add-product-group-panel.products-groups-panel[open] {
    display: block !important;
}
#add-product-group-panel.products-groups-panel:not([open]) {
    display: none !important;
}
/* END KH_PRODUCT_GROUPS_VISIBILITY_V2391 */


/* KH_PRODUCT_ACCORDION_V240 */
.products-v2 .kh-product-list-item.kh240-ready {
  display:flex;
  flex-direction:column;
  gap:7px;
}

.products-v2 .kh240-ready > .kh240-summary {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-direction:row !important;
  direction:rtl;
  width:100% !important;
  min-width:0;
  gap:10px;
  padding:12px 14px !important;
  cursor:pointer;
  text-align:right;
}

.products-v2 .kh240-identity {
  display:flex;
  flex:1 1 auto;
  min-width:0;
  align-items:center;
  gap:8px;
  text-align:right;
}

.products-v2 .kh240-identity > strong {
  flex:1 1 auto;
  min-width:0;
  font-size:14px;
  overflow-wrap:anywhere;
}

.products-v2 .kh240-metrics {
  display:flex;
  align-items:center;
  flex:0 0 auto;
  gap:9px;
}

.products-v2 .kh240-metrics .kh-product-kh52-value {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:54px;
  width:auto !important;
  margin:0 !important;
  padding:5px 7px !important;
  gap:3px;
  text-align:center;
}

.products-v2 .kh240-metrics small {
  font-size:10px;
}

.products-v2 .kh240-metrics strong {
  font-size:12px;
  white-space:nowrap;
}

.products-v2 .kh240-arrow {
  font-size:20px;
  font-weight:800;
  transition:transform .2s ease;
}

.products-v2 .kh240-open .kh240-arrow {
  transform:rotate(180deg);
}

.products-v2 .kh240-ready > .kh240-expanded-content {
  display:none !important;
}

.products-v2 .kh240-ready.kh240-open > .kh240-expanded-content {
  display:flex !important;
  width:100% !important;
  box-sizing:border-box;
  animation:kh240Reveal .22s ease-out;
}

@keyframes kh240Reveal {
  from {opacity:0;transform:translateY(-5px)}
  to {opacity:1;transform:translateY(0)}
}

@media(max-width:767px) {
  .products-v2 .kh240-ready > .kh240-summary {
    gap:6px;
    padding:9px 8px !important;
  }
  .products-v2 .kh240-identity {
    gap:5px;
  }
  .products-v2 .kh240-identity > strong {
    font-size:12px;
  }
  .products-v2 .kh240-metrics {
    gap:4px;
  }
  .products-v2 .kh240-metrics .kh-product-kh52-value {
    min-width:46px;
    padding:4px !important;
  }
  .products-v2 .kh240-metrics strong {
    font-size:11px;
  }
}
/* END KH_PRODUCT_ACCORDION_V240 */


/* KH_PRODUCT_COMPACT_ORDER_V241 */

/* Preserve the original expanded card */
.products-v2 .kh-product-list-item.kh240-ready {
  position:relative !important;
}

/* Reserve a separate area for the checkbox */
.products-v2 .kh240-ready > .kh240-summary {
  box-sizing:border-box !important;
  padding-right:51px !important;
  direction:rtl !important;
}

/* Position checkbox independently */
.products-v2 .kh240-ready > .kh-product-list-check {
  position:absolute !important;
  right:12px !important;
  top:16px !important;
  z-index:5 !important;
  width:24px !important;
  height:24px !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.products-v2 .kh240-ready > .kh-product-list-check input {
  position:static !important;
  margin:0 !important;
  width:19px !important;
  height:19px !important;
}

/* Sequence first, immediately after checkbox */
.products-v2 .kh240-summary .kh240-identity {
  display:flex !important;
  flex-direction:row !important;
  direction:rtl !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:11px !important;
  min-width:0 !important;
}

.products-v2 .kh240-summary
.kh240-identity > .kh-product-auto-sequence {
  order:0 !important;
  flex:0 0 auto !important;
  margin:0 !important;
}

.products-v2 .kh240-summary
.kh240-identity > strong {
  order:1 !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  text-align:right !important;
  overflow-wrap:break-word !important;
}

@media(max-width:767px) {
  .products-v2 .kh240-ready > .kh240-summary {
    padding-right:49px !important;
    padding-left:8px !important;
  }

  .products-v2 .kh240-ready > .kh-product-list-check {
    right:12px !important;
    top:15px !important;
  }

  .products-v2 .kh240-summary .kh240-identity {
    gap:8px !important;
  }
}

/* END KH_PRODUCT_COMPACT_ORDER_V241 */


/* KH_PRODUCT_CHECKBOX_CENTER_V242 */

/* Center checkbox vertically on compact card */
.products-v2 .kh240-ready > .kh-product-list-check {
  top:34px !important;
  transform:translateY(-50%) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* Maintain vertical alignment across mobile sizes */
@media(max-width:767px) {
  .products-v2 .kh240-ready > .kh-product-list-check {
    top:50% !important;
    transform:translateY(-50%) !important;
  }
}

/* END KH_PRODUCT_CHECKBOX_CENTER_V242 */


/* KH_PRODUCT_NO_ROW_GAPS_V243 */

/* Remove spacing between consecutive product cards */
.products-v2 .kh-product-list-item.kh240-ready {
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* Remove external gaps without changing internal layout */
.products-v2 .kh-product-list-item.kh240-ready
+ .kh-product-list-item.kh240-ready {
  margin-top:0 !important;
}

/* Compact card edges */
.products-v2 .kh240-ready > .kh240-summary {
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* END KH_PRODUCT_NO_ROW_GAPS_V243 */


/* KH_PRODUCT_UNIFIED_CARD_V244 */

/* Remove spacing from the actual product-list container */
.products-v2 :is(div,section,ul)
:has(> .kh-product-list-item[data-product-row]) {
  row-gap:0 !important;
  gap:0 !important;
}

/* Consecutive products: no outside gaps */
.products-v2 .kh-product-list-item.kh240-ready {
  margin:0 !important;
  padding:0 !important;
  gap:0 !important;
  row-gap:0 !important;
  border-radius:0 !important;
  box-sizing:border-box !important;
}

/* Keep the compact row as the visible card header */
.products-v2 .kh240-ready > .kh240-summary {
  margin:0 !important;
  border-radius:0 !important;
  box-sizing:border-box !important;
}

/* Expanded content belongs to the same card */
.products-v2 .kh240-ready.kh240-open
> .kh240-expanded-content {
  display:flex !important;
  margin:0 !important;
  padding:8px 12px 12px !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  width:100% !important;
  box-sizing:border-box !important;
  animation:kh240Reveal .22s ease-out;
}

/* No second name/sequence/quantity header */
.products-v2 .kh240-ready.kh240-open
> .kh240-expanded-content
> .kh-product-kh52-name {
  display:none !important;
}

/* Existing details and movements stay available */
.products-v2 .kh240-ready.kh240-open
> .kh240-expanded-content
.kh-product-kh52-values {
  display:flex !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
}

/* One unified expanded card */
.products-v2 .kh240-ready.kh240-open {
  border-radius:10px !important;
  overflow:visible !important;
}

.products-v2 .kh240-ready.kh240-open
> .kh240-summary {
  border-radius:10px 10px 0 0 !important;
}

/* Keep checkbox aligned with compact header,
   even while the product is expanded */
.products-v2 .kh240-ready
> .kh-product-list-check {
  top:27px !important;
  transform:translateY(-50%) !important;
}

/* Avoid extra vertical spacing on phones */
@media(max-width:767px) {
  .products-v2 .kh240-ready.kh240-open
  > .kh240-expanded-content {
    padding:6px 8px 10px !important;
  }

  .products-v2 .kh240-ready
  > .kh-product-list-check {
    top:25px !important;
  }
}

/* END KH_PRODUCT_UNIFIED_CARD_V244 */


/* KH_PRODUCT_MOVES_AVAILABILITY_V248 */
.products-v2 .kh-product-moves-shortcut.kh248-moves-disabled {
  opacity:0.35 !important;
  filter:grayscale(1) !important;
  cursor:not-allowed !important;
  pointer-events:none !important;
  box-shadow:none !important;
  transform:none !important;
}
/* END KH_PRODUCT_MOVES_AVAILABILITY_V248 */


/* KH_PRODUCT_MOVES_DISABLED_ALL_V249 */
.products-v2 .kh-product-list-item
.kh-product-moves-shortcut.kh248-moves-disabled {
  opacity:0.3 !important;
  filter:grayscale(1) !important;
  pointer-events:none !important;
  cursor:not-allowed !important;
  box-shadow:none !important;
  transform:none !important;
}
/* END KH_PRODUCT_MOVES_DISABLED_ALL_V249 */


/* KH_PRODUCT_DETAIL_MOVES_DISABLED_V2410 */
.kh2410-moves-disabled {
  opacity:0.35 !important;
  filter:grayscale(1) !important;
  cursor:not-allowed !important;
  pointer-events:none !important;
  box-shadow:none !important;
}
/* END KH_PRODUCT_DETAIL_MOVES_DISABLED_V2410 */


/* KH_PAYMENT_DECISION_BUTTONS_V2413 */
.kh2413-decision-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 10px 18px !important;
  border: 1.5px solid #2563eb !important;
  border-radius: 12px !important;
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  box-shadow: 0 2px 7px rgba(37,99,235,.12) !important;
  cursor: pointer !important;
  transition: background .2s, box-shadow .2s;
}

.kh2413-decision-btn:hover,
.kh2413-decision-btn:focus-visible {
  background: #dbeafe !important;
  box-shadow: 0 3px 12px rgba(37,99,235,.2) !important;
}

@media (max-width: 768px) {
  .kh2413-decision-btn {
    min-height: 48px !important;
    font-size: 14px !important;
    padding: 12px 16px !important;
  }
}
/* END KH_PAYMENT_DECISION_BUTTONS_V2413 */


/* KH_PAYMENT_CARDS_V2414B */
.kh2414-payment-card {
  position: relative;
  margin: 12px 14px 18px !important;
  border: 1px solid #e2e8f0 !important;
  border-right: 4px solid #94a3b8 !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow:
    0 3px 10px rgba(15,23,42,.06),
    0 10px 25px rgba(15,23,42,.05) !important;
  overflow: visible;
  transition: box-shadow .2s ease;
}

.kh2414-payment-card:hover {
  box-shadow:
    0 6px 18px rgba(15,23,42,.09),
    0 12px 28px rgba(15,23,42,.06) !important;
}

.kh2414-status-pending {
  border-right-color: #d97706 !important;
  background: #fffcf6 !important;
}

.kh2414-status-approved {
  border-right-color: #16a34a !important;
  background: #f8fdf9 !important;
}

.kh2414-status-rejected {
  border-right-color: #dc2626 !important;
  background: #fffafa !important;
}

.kh2414-payment-card > .row.note {
  margin: 0 !important;
  border: 0 !important;
  border-radius: 15px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.kh2414-payment-card > .row.note > .bar {
  display: none !important;
}

.kh2414-payment-card > div[style*="display:flex"] {
  padding: 12px 14px 14px !important;
  border-top: 1px solid rgba(148,163,184,.18);
  flex-wrap: wrap;
}

.kh2414-payment-card > div[style*="display:flex"] .btn {
  min-height: 44px;
}

@media (max-width:768px) {
  .kh2414-payment-card {
    margin: 10px 10px 16px !important;
    border-radius: 14px !important;
  }

  .kh2414-payment-card > div[style*="display:flex"] {
    padding: 10px 12px 13px !important;
    gap: 9px !important;
  }
}

/* END KH_PAYMENT_CARDS_V2414B */

/* KH_RECENT_SERIAL_LAYOUT_V2416_32
   Preserve original KH52 card effects and restore compact layout.
*/
.kh52-recent-row:has(> .kh52-entry-serial) {
    grid-template-columns: auto minmax(0,1fr) auto !important;
    gap: 7px !important;
}

.kh52-recent-row > .kh52-entry-serial {
    min-width: 37px;
    box-sizing: border-box;
    white-space: nowrap;
}


/* KH_RECENT_COLORS_SCOPE_V2416_34A */
/* KH_RECENT_TYPE_COLORS_V2416_34 — recent movements only */

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice {
  background: #eff6ff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 3px 11px rgba(37,99,235,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice:hover {
  background: #eff6ff !important;
  border-color: #93c5fd !important;
  box-shadow: 0 9px 22px rgba(37,99,235,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice.kh581-expanded {
  background: #eff6ff !important;
  border-color: #93c5fd !important;
  box-shadow:
    0 13px 30px rgba(37,99,235,.24),
    0 2px 7px rgba(37,99,235,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice > .kh52-entry-serial {
  border-color: #93c5fd !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt {
  background: #ecfdf5 !important;
  border-color: #86efac !important;
  box-shadow: 0 3px 11px rgba(22,163,74,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt:hover {
  background: #ecfdf5 !important;
  border-color: #86efac !important;
  box-shadow: 0 9px 22px rgba(22,163,74,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt.kh581-expanded {
  background: #ecfdf5 !important;
  border-color: #86efac !important;
  box-shadow:
    0 13px 30px rgba(22,163,74,.24),
    0 2px 7px rgba(22,163,74,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt > .kh52-entry-serial {
  border-color: #86efac !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice {
  background: #fff7ed !important;
  border-color: #fdba74 !important;
  box-shadow: 0 3px 11px rgba(234,88,12,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice:hover {
  background: #fff7ed !important;
  border-color: #fdba74 !important;
  box-shadow: 0 9px 22px rgba(234,88,12,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice.kh581-expanded {
  background: #fff7ed !important;
  border-color: #fdba74 !important;
  box-shadow:
    0 13px 30px rgba(234,88,12,.24),
    0 2px 7px rgba(234,88,12,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice > .kh52-entry-serial {
  border-color: #fdba74 !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment {
  background: #fef2f2 !important;
  border-color: #fca5a5 !important;
  box-shadow: 0 3px 11px rgba(220,38,38,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment:hover {
  background: #fef2f2 !important;
  border-color: #fca5a5 !important;
  box-shadow: 0 9px 22px rgba(220,38,38,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment.kh581-expanded {
  background: #fef2f2 !important;
  border-color: #fca5a5 !important;
  box-shadow:
    0 13px 30px rgba(220,38,38,.24),
    0 2px 7px rgba(220,38,38,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment > .kh52-entry-serial {
  border-color: #fca5a5 !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-sales_return {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
  box-shadow: 0 3px 11px rgba(124,58,237,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-sales_return:hover {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
  box-shadow: 0 9px 22px rgba(124,58,237,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-sales_return.kh581-expanded {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
  box-shadow:
    0 13px 30px rgba(124,58,237,.24),
    0 2px 7px rgba(124,58,237,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-sales_return > .kh52-entry-serial {
  border-color: #c4b5fd !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_return {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
  box-shadow: 0 3px 11px rgba(124,58,237,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_return:hover {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
  box-shadow: 0 9px 22px rgba(124,58,237,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_return.kh581-expanded {
  background: #f5f3ff !important;
  border-color: #c4b5fd !important;
  box-shadow:
    0 13px 30px rgba(124,58,237,.24),
    0 2px 7px rgba(124,58,237,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_return > .kh52-entry-serial {
  border-color: #c4b5fd !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-discount_allowed {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 3px 11px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-discount_allowed:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 9px 22px rgba(71,85,105,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-discount_allowed.kh581-expanded {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow:
    0 13px 30px rgba(71,85,105,.24),
    0 2px 7px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-discount_allowed > .kh52-entry-serial {
  border-color: #cbd5e1 !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_debit {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 3px 11px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_debit:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 9px 22px rgba(71,85,105,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_debit.kh581-expanded {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow:
    0 13px 30px rgba(71,85,105,.24),
    0 2px 7px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_debit > .kh52-entry-serial {
  border-color: #cbd5e1 !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_credit {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 3px 11px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_credit:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 9px 22px rgba(71,85,105,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_credit.kh581-expanded {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow:
    0 13px 30px rgba(71,85,105,.24),
    0 2px 7px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-opening_credit > .kh52-entry-serial {
  border-color: #cbd5e1 !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-note {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 3px 11px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-note:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 9px 22px rgba(71,85,105,.22) !important;
  transform: translateY(-2px);
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-note.kh581-expanded {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  box-shadow:
    0 13px 30px rgba(71,85,105,.24),
    0 2px 7px rgba(71,85,105,.10) !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-note > .kh52-entry-serial {
  border-color: #cbd5e1 !important;
}

/* KH_RECENT_WHITE_BACKGROUND_V2416_35 */
.kh52-recent-row.kh-dashboard-recent[class*="kh-recent-type-"],
.kh52-recent-row.kh-dashboard-recent[class*="kh-recent-type-"]:hover,
.kh52-recent-row.kh-dashboard-recent[class*="kh-recent-type-"].kh581-expanded,
.kh52-recent-row.kh-dashboard-recent[class*="kh-recent-type-"].kh581-expanded:hover {
    background: #ffffff !important;
}

/* KH_RECENT_TEXT_COLORS_V2416_36 — Dashboard recent movements only */

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice .kh52-entry-main > strong,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice .kh52-entry-amount {
    color: #2563eb !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt .kh52-entry-main > strong,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt .kh52-entry-amount {
    color: #15803d !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice .kh52-entry-main > strong,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice .kh52-entry-amount {
    color: #c2410c !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment .kh52-entry-main > strong,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment .kh52-entry-amount {
    color: #dc2626 !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-sales_return .kh52-entry-main > strong,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-sales_return .kh52-entry-amount {
    color: #7c3aed !important;
}

.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_return .kh52-entry-main > strong,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_return .kh52-entry-amount {
    color: #7c3aed !important;
}

.kh52-recent-row.kh-dashboard-recent .kh52-entry-main > strong > small {
    color: #64748b !important;
}

.kh52-recent-row.kh-dashboard-recent .kh52-entry-amount > small {
    color: #64748b !important;
}

/* KH_RECENT_APPROVED_DESIGN_V2416_37 */

/* Only the approved dashboard recent-movements cards. */
.kh52-recent-row.kh-dashboard-recent {
    position: relative !important;
    overflow: visible !important;
    margin-top: 15px !important;
    background: #fff !important;
    border-style: solid !important;
    border-width: 1.5px !important;
    border-radius: 15px !important;
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease !important;
}

/* The date sits inside the upper border, like a legend. */
.kh52-recent-row.kh-dashboard-recent
> .kh-recent-border-date {
    position: absolute !important;
    top: 0 !important;
    right: 17px !important;
    left: auto !important;
    transform: translateY(-50%) !important;
    z-index: 3 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 9px !important;
    margin: 0 !important;

    width: max-content !important;
    max-width: calc(100% - 35px) !important;

    background: #fff !important;
    border: 0 !important;
    box-shadow: none !important;

    color: #334155 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 18px !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

/* Keep the date above the border while expanding. */
.kh52-recent-row.kh-dashboard-recent.kh581-expanded
> .kh-recent-border-date {
    z-index: 5 !important;
}

/* Compact serial badge; no transaction icon. */
.kh52-recent-row.kh-dashboard-recent
> .kh52-entry-serial {
    background: #f1f5f9 !important;
    color: #334155 !important;
    border-radius: 9px !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
}

/* Preserve the white background on hover and expansion. */
.kh52-recent-row.kh-dashboard-recent:hover,
.kh52-recent-row.kh-dashboard-recent.kh581-expanded,
.kh52-recent-row.kh-dashboard-recent.kh581-expanded:hover {
    background: #fff !important;
}

/* Sales invoice */
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice {
    border-color: #2563eb !important;
    box-shadow: 0 3px 12px rgba(37,99,235,.11) !important;
}

/* Receipt */
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt {
    border-color: #16a34a !important;
    box-shadow: 0 3px 12px rgba(22,163,74,.11) !important;
}

/* Purchase invoice */
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice {
    border-color: #ea580c !important;
    box-shadow: 0 3px 12px rgba(234,88,12,.11) !important;
}

/* Payment voucher */
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment {
    border-color: #dc2626 !important;
    box-shadow: 0 3px 12px rgba(220,38,38,.11) !important;
}

/* Keep the stronger existing hover/expanded shadows. */
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice:hover,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-invoice.kh581-expanded {
    box-shadow: 0 10px 25px rgba(37,99,235,.22) !important;
}
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt:hover,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-receipt.kh581-expanded {
    box-shadow: 0 10px 25px rgba(22,163,74,.22) !important;
}
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice:hover,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-purchase_invoice.kh581-expanded {
    box-shadow: 0 10px 25px rgba(234,88,12,.22) !important;
}
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment:hover,
.kh52-recent-row.kh-dashboard-recent.kh-recent-type-payment.kh581-expanded {
    box-shadow: 0 10px 25px rgba(220,38,38,.22) !important;
}

/* Leave accounting menu rows untouched. */


/* KH_ALL_FINANCIAL_EQUAL_MARGINS_V241655 */
@media (max-width:760px) {

  .kh-all-financial-page .kh52-recent-card {
    box-sizing:border-box !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .kh-all-financial-page .kh52-recent-list {
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  .kh-all-financial-page
  .kh52-recent-row.kh-dashboard-recent {
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
}


/* KH_ALL_FINANCIAL_HEADER_V241656 */
@media (max-width:760px) {

  body.kh-all-financial-header-page .topbar-brand {
    justify-content:center !important;
    text-align:center !important;
  }

  body.kh-all-financial-header-page .topbar-brand
  .brand-name {
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.kh-all-financial-header-page .topbar-in
  .topbar-title {
    display:none !important;
  }

}


/* KH_ALL_FINANCIAL_HEADER_CENTER_V241657 */
@media (max-width:760px) {

  body.kh-all-financial-header-page .topbar {
    position:relative !important;
  }

  body.kh-all-financial-header-page .topbar-brand {
    position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:max-content !important;
    max-width:65% !important;
    margin:0 !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand {
    text-align:center !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand h1 {
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand > span {
    display:none !important;
  }
}


/* KH_ALL_FINANCIAL_TOPBAR_V241658 */
@media (max-width:760px) {

  body.kh-all-financial-header-page .topbar {
    position:relative !important;
  }

  body.kh-all-financial-header-page .topbar-brand {
    position:relative !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
    margin:0 auto !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand {
    width:100% !important;
    text-align:center !important;
    margin:0 auto !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand h1 {
    width:100% !important;
    text-align:center !important;
    margin:0 auto !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand > span {
    display:none !important;
  }

}


/* KH_ALL_FINANCIAL_HIDE_TOP_CONTROLS_V241659 */
@media (max-width:760px) {

  /* Hide only the topbar navigation buttons */
  body.kh-all-financial-header-page
  .topbar > .topbar-backrow {
    display:none !important;
  }

  /* Hide the clock inside the topbar */
  body.kh-all-financial-header-page
  .topbar .live-clock {
    display:none !important;
  }

}


/* KH_ALL_FINANCIAL_COMPACT_HEADER_V241661 */
@media (max-width:760px) {

  body.kh-all-financial-header-page .topbar {
    position:relative !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin-bottom:0 !important;
    min-height:0 !important;
  }

  body.kh-all-financial-header-page .topbar-brand {
    width:auto !important;
    max-width:calc(100% - 65px) !important;
    margin:0 !important;
    padding:0 !important;
    justify-content:flex-start !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand {
    width:auto !important;
    margin:0 !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand h1 {
    width:auto !important;
    margin:0 !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand > span {
    display:none !important;
  }

  body.kh-all-financial-header-page .topbar-in {
    min-height:0 !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin:0 !important;
  }

  body.kh-all-financial-header-page
  .topbar .top-actions:empty {
    display:none !important;
  }

  body.kh-all-financial-header-page
  .topbar > .topbar-backrow {
    display:none !important;
  }

  body.kh-all-financial-header-page
  .topbar .live-clock {
    display:none !important;
  }
}


/* KH_ALL_FINANCIAL_SINGLE_ROW_V241662 */
@media (max-width:760px) {

  body.kh-all-financial-header-page .topbar {
    position:relative !important;
    min-height:0 !important;
    height:auto !important;
    padding:0 !important;
    margin:0 !important;
  }

  body.kh-all-financial-header-page
  .topbar > .topbar-in {
    display:none !important;
  }

  body.kh-all-financial-header-page
  .topbar > .topbar-backrow {
    display:none !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand {
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    min-height:64px !important;
    padding:10px 78px 10px 12px !important;
    margin:0 !important;
    border-bottom:0 !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:0 !important;
    direction:rtl !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand {
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand h1 {
    width:100% !important;
    margin:0 !important;
    text-align:right !important;
    line-height:1.5 !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand > span {
    display:none !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .topbar-logo,
  body.kh-all-financial-header-page
  .topbar-brand .mark {
    display:none !important;
  }
}


/* KH_ALL_FINANCIAL_HEADER_FIX_V241663 */
@media (max-width:760px) {

  body.kh-all-financial-header-page .topbar {
    display:block !important;
    position:relative !important;
    height:auto !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border-bottom:1px solid #e5e7eb !important;
  }

  body.kh-all-financial-header-page
  .topbar > .topbar-in,
  body.kh-all-financial-header-page
  .topbar > .topbar-backrow {
    display:none !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand {
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    min-height:64px !important;
    padding:10px 80px 10px 12px !important;
    margin:0 !important;
    border:0 !important;
    flex-wrap:nowrap !important;
    direction:rtl !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand {
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand h1 {
    width:auto !important;
    margin:0 !important;
    text-align:right !important;
    line-height:1.5 !important;
  }

  body.kh-all-financial-header-page
  .topbar-brand .brand > span,
  body.kh-all-financial-header-page
  .topbar-brand .topbar-logo,
  body.kh-all-financial-header-page
  .topbar-brand .mark {
    display:none !important;
  }

  body.kh-all-financial-header-page
  > .kh-sidebar-toggle {
    top:19px !important;
    right:22px !important;
  }

}


/* KH_ALL_FINANCIAL_REAL_HEADER_V241664 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header {
    box-sizing:border-box !important;
    width:100% !important;
    min-height:66px !important;
    margin:0 !important;
    padding:12px 82px 12px 16px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    background:#fff !important;
    border-bottom:1px solid #e5e7eb !important;
    direction:rtl !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header strong {
    font-size:14px !important;
    font-weight:700 !important;
    line-height:1.5 !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  > .kh-sidebar-toggle {
    position:fixed !important;
    top:19px !important;
    right:22px !important;
    z-index:1301 !important;
  }

}


/* KH_ALL_FINANCIAL_MENU_NEXT_TO_NAME_V241665 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header {
    display:flex !important;
    flex-direction:row !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:8px !important;
    padding:8px 14px !important;
    min-height:54px !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-sidebar-toggle.kh-all-financial-inline-menu {
    position:static !important;
    inset:auto !important;
    transform:none !important;
    flex:0 0 38px !important;
    width:38px !important;
    height:38px !important;
    margin:0 !important;
    display:grid !important;
    place-items:center !important;
    z-index:auto !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header strong {
    flex:0 1 auto !important;
    margin:0 !important;
    text-align:right !important;
  }
}


/* KH_ALL_FINANCIAL_MENU_RESTORE_V241666 */
@media (max-width:760px) {
  .kh-all-financial-custom-header {
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    padding:8px 14px !important;
    min-height:54px !important;
    direction:rtl !important;
  }

  .kh-all-financial-custom-header
  .kh-sidebar-toggle {
    display:grid !important;
    visibility:visible !important;
    opacity:1 !important;
    position:static !important;
    inset:auto !important;
    transform:none !important;
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    margin:0 !important;
    padding:0 !important;
    place-items:center !important;
    pointer-events:auto !important;
    z-index:2 !important;
  }
}


/* KH_ALL_FINANCIAL_FILTER_V241670 */
.kh-all-financial-page .kh-financial-toolbar {
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  flex-wrap:wrap !important;
  direction:rtl !important;
}

.kh-all-financial-page .kh-financial-back,
.kh-all-financial-page .kh-financial-filter-btn {
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  min-height:39px !important;
  padding:8px 13px !important;
  border-radius:11px !important;
  font-size:13px !important;
  font-weight:800 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  cursor:pointer !important;
  margin:0 !important;
}

.kh-all-financial-page .kh-financial-back {
  color:#1d4ed8 !important;
  background:#eff6ff !important;
  border:1px solid #bfdbfe !important;
  box-shadow:0 2px 6px rgba(37,99,235,.09) !important;
}

.kh-all-financial-page .kh-financial-filter-btn {
  color:#0f766e !important;
  background:#f0fdfa !important;
  border:1px solid #99f6e4 !important;
  box-shadow:0 2px 6px rgba(15,118,110,.08) !important;
}

.kh-all-financial-page .kh-financial-filter {
  position:relative !important;
}

.kh-all-financial-page .kh-financial-filter-panel {
  position:absolute !important;
  top:calc(100% + 8px) !important;
  right:0 !important;
  left:auto !important;
  z-index:1200 !important;
  width:min(290px, calc(100vw - 32px)) !important;
  box-sizing:border-box !important;
  padding:10px !important;
  background:#fff !important;
  border:1px solid #e2e8f0 !important;
  border-radius:14px !important;
  box-shadow:0 12px 32px rgba(15,23,42,.16) !important;
  direction:rtl !important;
}

.kh-all-financial-page .kh-financial-filter-panel[hidden] {
  display:none !important;
}

.kh-all-financial-page .kh-financial-filter-heading {
  font-size:13px;
  font-weight:800;
  padding:6px 7px 10px;
  color:#0f172a;
}

.kh-all-financial-page .kh-financial-filter-option {
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px 8px;
  border-radius:8px;
  font-size:13px;
  cursor:pointer;
  color:#334155;
}

.kh-all-financial-page .kh-financial-filter-option:hover {
  background:#f1f5f9;
}

.kh-all-financial-page .kh-financial-filter-option input {
  width:17px;
  height:17px;
  accent-color:#0f766e;
  flex:none;
}

.kh-all-financial-page .kh-financial-filter-option small {
  margin-right:auto;
  color:#64748b;
}

.kh-all-financial-page .kh-financial-all {
  font-weight:800;
  border-bottom:1px solid #e2e8f0;
  border-radius:0;
}

.kh-all-financial-page .kh-financial-filter-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  border-top:1px solid #e2e8f0;
  padding:11px 6px 2px;
  font-size:11px;
  color:#64748b;
}

.kh-all-financial-page .kh-financial-filter-footer button {
  border:0;
  border-radius:8px;
  background:#0f766e;
  color:white;
  padding:7px 13px;
  font-weight:800;
  cursor:pointer;
}

@media(max-width:760px) {
  .kh-all-financial-page .kh52-card-head {
    flex-wrap:wrap !important;
    gap:10px !important;
  }
  .kh-all-financial-page .kh-financial-toolbar {
    margin-inline-start:auto !important;
  }
}

/* KH_ALL_FINANCIAL_TOOLBAR_V241671 */

/* Keep Back and Filter together on one line */
.kh-all-financial-page .kh-financial-toolbar {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  width:max-content !important;
  max-width:100% !important;
  direction:rtl !important;
}

.kh-all-financial-page .kh-financial-back,
.kh-all-financial-page .kh-financial-filter {
  flex:0 0 auto !important;
  min-width:0 !important;
}

.kh-all-financial-page .kh-financial-back,
.kh-all-financial-page .kh-financial-filter-btn {
  white-space:nowrap !important;
}

@media (max-width:760px) {
  .kh-all-financial-page .kh52-recent-card > .kh52-card-head {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  .kh-all-financial-page .kh-financial-toolbar {
    align-self:flex-start !important;
    margin:0 !important;
  }

  .kh-all-financial-page .kh-financial-back,
  .kh-all-financial-page .kh-financial-filter-btn {
    min-height:38px !important;
    padding:8px 11px !important;
    font-size:12px !important;
  }
}

/* KH_ALL_FINANCIAL_ONE_ROW_V241672 */

/* Title + Back + Filter on ONE horizontal line */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:6px !important;
  min-width:0 !important;
}

.kh-all-financial-page
.kh52-recent-card > .kh52-card-head > div:first-child {
  flex:1 1 auto !important;
  min-width:0 !important;
}

.kh-all-financial-page
.kh52-recent-card > .kh52-card-head h2 {
  margin:0 !important;
  font-size:clamp(13px,3.4vw,19px) !important;
  white-space:nowrap !important;
}

.kh-all-financial-page
.kh52-recent-card > .kh52-card-head > div:first-child > span {
  display:none !important;
}

.kh-all-financial-page .kh-financial-toolbar {
  display:flex !important;
  flex:0 0 auto !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  gap:5px !important;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
}

.kh-all-financial-page .kh-financial-back,
.kh-all-financial-page .kh-financial-filter-btn {
  min-height:34px !important;
  padding:6px 8px !important;
  font-size:11px !important;
  gap:4px !important;
  white-space:nowrap !important;
}

@media(max-width:760px) {
  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head {
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:5px !important;
  }

  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head h2 {
    font-size:13px !important;
  }

  .kh-all-financial-page .kh-financial-toolbar {
    align-self:center !important;
    margin:0 !important;
  }

  .kh-all-financial-page .kh-financial-back,
  .kh-all-financial-page .kh-financial-filter-btn {
    padding:6px 7px !important;
    font-size:10px !important;
  }
}

/* KH_ALL_FINANCIAL_RESPONSIVE_SIZE_V241673 */

/* Use the available width while preserving one row */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:clamp(5px,1.3vw,14px) !important;
  min-width:0 !important;
}

.kh-all-financial-page
.kh52-recent-card > .kh52-card-head > div:first-child {
  flex:1 1 auto !important;
  min-width:0 !important;
}

.kh-all-financial-page
.kh52-recent-card > .kh52-card-head h2 {
  font-size:clamp(15px,3.7vw,23px) !important;
  font-weight:900 !important;
  line-height:1.35 !important;
  white-space:nowrap !important;
}

.kh-all-financial-page .kh-financial-toolbar {
  display:flex !important;
  flex:0 0 auto !important;
  flex-wrap:nowrap !important;
  gap:clamp(5px,1.2vw,12px) !important;
  width:auto !important;
  margin:0 !important;
}

.kh-all-financial-page .kh-financial-back,
.kh-all-financial-page .kh-financial-filter-btn {
  min-height:clamp(38px,4vw,45px) !important;
  padding:
    clamp(7px,1vw,11px)
    clamp(9px,1.5vw,16px) !important;
  font-size:clamp(12px,2.8vw,15px) !important;
  font-weight:850 !important;
  gap:clamp(4px,.7vw,8px) !important;
  white-space:nowrap !important;
}

@media(max-width:390px) {
  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head {
    gap:4px !important;
  }

  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head h2 {
    font-size:14px !important;
  }

  .kh-all-financial-page .kh-financial-toolbar {
    gap:4px !important;
  }

  .kh-all-financial-page .kh-financial-back,
  .kh-all-financial-page .kh-financial-filter-btn {
    font-size:11px !important;
    padding:7px 6px !important;
    min-height:37px !important;
    gap:3px !important;
  }
}

/* KH_ALL_FINANCIAL_FILTER_SCREEN_V241674 */

.kh-all-financial-page .kh-financial-filter-panel {
  box-sizing:border-box !important;
  z-index:9999 !important;
  padding:14px !important;
  border-radius:15px !important;
  box-shadow:0 14px 35px rgba(15,23,42,.18) !important;
  overscroll-behavior:contain !important;
}

.kh-all-financial-page .kh-financial-filter-option {
  padding:12px 10px !important;
  gap:11px !important;
  line-height:1.5 !important;
}

.kh-all-financial-page .kh-financial-filter-options {
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
}

.kh-all-financial-page .kh-financial-filter-heading {
  padding:5px 7px 12px !important;
}

.kh-all-financial-page .kh-financial-filter-footer {
  margin-top:8px !important;
  padding-top:12px !important;
}

/* KH_FILTER_LEFT_MARGIN_V241675 */
.kh-all-financial-page .kh-financial-filter-panel {
  right:auto !important;
  bottom:auto !important;
}

/* KH_FILTER_NEXT_TO_TITLE_V241676 */

.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-title-actions {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:9px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
}

.kh-all-financial-page
.kh-financial-title-actions h2 {
  flex:0 0 auto !important;
  margin:0 !important;
}

.kh-all-financial-page
.kh-financial-title-actions .kh-financial-filter {
  flex:0 0 auto !important;
  position:relative !important;
}

.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-toolbar {
  flex:0 0 auto !important;
  margin-inline-start:auto !important;
}

@media(max-width:760px) {
  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head
  .kh-financial-title-actions {
    gap:6px !important;
  }

  .kh-all-financial-page
  .kh-financial-title-actions h2 {
    font-size:clamp(13px,3.5vw,17px) !important;
  }
}

/* KH_ALL_FINANCIAL_FILTER_FIX_V241677 */

/* Hide only transactions excluded by the checkbox filter */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row.kh-financial-filter-hidden,
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row[hidden] {
  display:none !important;
}

/* KH_FILTER_PORTAL_FIX_V241678 */

body > .kh-financial-filter-portal {
  position:fixed !important;
  z-index:2147483000 !important;
  box-sizing:border-box !important;
  display:block;
  max-width:calc(100vw - 36px) !important;
  padding:14px !important;
  background:#ffffff !important;
  border:1px solid #e2e8f0 !important;
  border-radius:15px !important;
  box-shadow:0 14px 35px rgba(15,23,42,.18) !important;
  direction:rtl !important;
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
}

body > .kh-financial-filter-portal[hidden] {
  display:none !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-option {
  display:flex !important;
  align-items:center !important;
  gap:11px !important;
  padding:12px 10px !important;
  color:#334155 !important;
  font-size:13px !important;
  cursor:pointer !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-options {
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-option input {
  width:17px !important;
  height:17px !important;
  accent-color:#0f766e !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-heading {
  padding:6px 7px 12px !important;
  font-size:13px !important;
  font-weight:800 !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-footer {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
  border-top:1px solid #e2e8f0 !important;
  padding:12px 6px 2px !important;
  font-size:11px !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-footer button {
  border:0 !important;
  border-radius:8px !important;
  background:#0f766e !important;
  color:white !important;
  padding:7px 13px !important;
  font-weight:800 !important;
}

/* KH_FILTER_PREMIUM_CARD_V241681 */

/* Premium floating filter card */
body > .kh-financial-filter-portal {
  background:#ffffff !important;
  border:1px solid #dbe5f0 !important;
  border-radius:18px !important;
  box-shadow:
    0 22px 55px rgba(15,35,65,.20),
    0 5px 15px rgba(15,35,65,.09) !important;
  padding:0 !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  direction:rtl !important;
  color:#24364d !important;
}

/* Dark navy header */
body > .kh-financial-filter-portal
.kh-financial-filter-heading {
  background:linear-gradient(
    135deg,#102b50,#1d4d81
  ) !important;
  color:#ffffff !important;
  font-size:14px !important;
  font-weight:800 !important;
  padding:17px 16px !important;
  margin:0 0 9px !important;
  border-bottom:3px solid #28a7a0 !important;
}

/* Each selectable row */
body > .kh-financial-filter-portal
.kh-financial-filter-option {
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin:4px 10px !important;
  padding:12px 13px !important;
  min-height:46px !important;
  border:1px solid #edf1f6 !important;
  border-radius:11px !important;
  background:#ffffff !important;
  color:#34465e !important;
  font-size:13px !important;
  font-weight:650 !important;
  cursor:pointer !important;
  transition:
    background .15s ease,
    border-color .15s ease,
    box-shadow .15s ease !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-option:has(input:checked) {
  background:#f0f7ff !important;
  border-color:#c9dffb !important;
  box-shadow:inset -3px 0 #397cce !important;
}

body > .kh-financial-filter-portal
.kh-financial-all {
  background:#eaf3ff !important;
  border-color:#c4dbf7 !important;
  color:#153d71 !important;
  font-weight:800 !important;
  margin-bottom:10px !important;
}

/* Clear mobile-friendly checkboxes */
body > .kh-financial-filter-portal
.kh-financial-filter-option input {
  width:19px !important;
  height:19px !important;
  flex-shrink:0 !important;
  accent-color:#2377cc !important;
  cursor:pointer !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-option span {
  flex:1 !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-option small {
  background:#e9f0f9 !important;
  color:#315d91 !important;
  border-radius:7px !important;
  padding:3px 7px !important;
  font-size:11px !important;
  font-weight:750 !important;
}

/* Transaction-specific accents */
body > .kh-financial-filter-portal
.kh-financial-filter-options
.kh-financial-filter-option:nth-child(4n+1):has(input:checked) {
  box-shadow:inset -3px 0 #2875cc !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-options
.kh-financial-filter-option:nth-child(4n+2):has(input:checked) {
  box-shadow:inset -3px 0 #e79a31 !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-options
.kh-financial-filter-option:nth-child(4n+3):has(input:checked) {
  box-shadow:inset -3px 0 #20a16a !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-options
.kh-financial-filter-option:nth-child(4n+4):has(input:checked) {
  box-shadow:inset -3px 0 #d84d58 !important;
}

/* Footer */
body > .kh-financial-filter-portal
.kh-financial-filter-footer {
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:10px !important;
  padding:14px 15px !important;
  margin-top:9px !important;
  background:#f8fafc !important;
  border-top:1px solid #e5ebf3 !important;
  color:#64748b !important;
  font-size:11px !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-footer button {
  background:linear-gradient(
    135deg,#087e88,#159f92
  ) !important;
  color:#ffffff !important;
  border:0 !important;
  border-radius:10px !important;
  padding:10px 19px !important;
  font-size:12px !important;
  font-weight:800 !important;
  box-shadow:0 4px 11px rgba(8,126,136,.22) !important;
}

body > .kh-financial-filter-portal[hidden] {
  display:none !important;
}

/* KH_FINANCIAL_MAIN_TITLE_V241683 */

/* Main screen title: financial movements */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-title-actions > h2 {
  position:relative !important;
  display:inline-block !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 0 9px !important;
  color:#102f56 !important;
  font-size:clamp(17px,4.4vw,21px) !important;
  font-weight:900 !important;
  line-height:1.45 !important;
  letter-spacing:-.35px !important;
  text-shadow:0 1px 0 rgba(255,255,255,.85) !important;
}

/* Small green accent beneath the title */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-title-actions > h2::after {
  content:"" !important;
  position:absolute !important;
  right:0 !important;
  bottom:0 !important;
  width:46px !important;
  max-width:40% !important;
  height:3px !important;
  border-radius:10px !important;
  background:linear-gradient(
    90deg,#12a99a,#2080c4
  ) !important;
}

/* Preserve title/filter row layout */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-title-actions {
  min-width:0 !important;
}

/* Compact title on narrow phones */
@media (max-width:390px) {
  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head
  .kh-financial-title-actions > h2 {
    font-size:16px !important;
    letter-spacing:-.5px !important;
  }
}

/* KH_FINANCIAL_DOUBLE_LINE_V241684 */

/* Title with two straight parallel lines */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-title-actions > h2 {
  position:relative !important;
  padding-bottom:12px !important;
  margin-bottom:0 !important;
}

/* First line: navy */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-title-actions > h2::before {
  content:"" !important;
  position:absolute !important;
  right:0 !important;
  bottom:5px !important;
  width:100% !important;
  height:2px !important;
  border-radius:0 !important;
  background:#173c69 !important;
}

/* Second line: green */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head
.kh-financial-title-actions > h2::after {
  content:"" !important;
  position:absolute !important;
  right:0 !important;
  bottom:0 !important;
  width:100% !important;
  max-width:none !important;
  height:2px !important;
  border-radius:0 !important;
  background:#16a596 !important;
}

/* Reduce space before transaction cards */
.kh-all-financial-page
.kh52-recent-card > .kh52-card-head {
  margin-bottom:5px !important;
  padding-bottom:5px !important;
}

.kh-all-financial-page
.kh52-recent-card > .kh52-recent-list {
  margin-top:3px !important;
}

/* Maintain compact layout on mobile */
@media (max-width:600px) {
  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head {
    margin-bottom:3px !important;
    padding-bottom:4px !important;
  }

  .kh-all-financial-page
  .kh52-recent-card > .kh52-recent-list {
    margin-top:2px !important;
  }
}

/* KH_FILTER_ULTRA_COMPACT_V241685 */

/* Compact floating filter card */
body > .kh-financial-filter-portal
.kh-financial-filter-heading {
  padding:10px 12px !important;
  margin:0 0 3px !important;
  font-size:13px !important;
}

/* Remove spaces between options */
body > .kh-financial-filter-portal
.kh-financial-filter-options {
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  padding:0 !important;
  margin:0 !important;
}

/* Ultra compact rows */
body > .kh-financial-filter-portal
.kh-financial-filter-option {
  min-height:31px !important;
  padding:4px 8px !important;
  margin:1px 7px !important;
  gap:5px !important;
  border-radius:7px !important;
  font-size:12px !important;
  line-height:1.25 !important;
}

/* Compact select-all row */
body > .kh-financial-filter-portal
.kh-financial-all {
  min-height:33px !important;
  margin:2px 7px 4px !important;
  padding:5px 8px !important;
}

/* Smaller checkboxes */
body > .kh-financial-filter-portal
.kh-financial-filter-option input {
  width:15px !important;
  height:15px !important;
  margin:0 !important;
}

/* Keep labels and counts close together */
body > .kh-financial-filter-portal
.kh-financial-filter-option span {
  flex:0 1 auto !important;
  margin:0 !important;
  padding:0 !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-option small {
  margin:0 2px 0 0 !important;
  padding:1px 5px !important;
  min-width:0 !important;
  font-size:10px !important;
  line-height:1.2 !important;
}

/* Compact footer */
body > .kh-financial-filter-portal
.kh-financial-filter-footer {
  margin-top:4px !important;
  padding:7px 10px !important;
  gap:5px !important;
  font-size:10px !important;
}

body > .kh-financial-filter-portal
.kh-financial-filter-footer button {
  padding:6px 12px !important;
  border-radius:7px !important;
  font-size:11px !important;
}

/* Hide panel only when explicitly closed */
body > .kh-financial-filter-portal[hidden] {
  display:none !important;
}

/* KH_FILTER_LARGER_TEXT_V241686 */

/* Larger dropdown heading */
body > .kh-financial-filter-portal
.kh-financial-filter-heading {
  font-size:16px !important;
  font-weight:900 !important;
}

/* Larger transaction option labels */
body > .kh-financial-filter-portal
.kh-financial-filter-option {
  font-size:15px !important;
  font-weight:750 !important;
  line-height:1.25 !important;
}

/* Select all */
body > .kh-financial-filter-portal
.kh-financial-all {
  font-size:15px !important;
  font-weight:850 !important;
}

/* Larger transaction counts */
body > .kh-financial-filter-portal
.kh-financial-filter-option small {
  font-size:12px !important;
  font-weight:800 !important;
}

/* Footer text */
body > .kh-financial-filter-portal
.kh-financial-filter-footer {
  font-size:12px !important;
}

/* Done button */
body > .kh-financial-filter-portal
.kh-financial-filter-footer button {
  font-size:13px !important;
  font-weight:850 !important;
}

/* KH_FILTER_NARROW_LEFT_COUNTS_V241687 */

/* Narrower premium dropdown */
body > .kh-financial-filter-portal {
  width:250px !important;
  max-width:calc(100vw - 36px) !important;
}

/* Right-aligned option names, left-aligned counts */
body > .kh-financial-filter-portal
.kh-financial-filter-option {
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  direction:rtl !important;
  gap:5px !important;
}

/* Name remains on the right */
body > .kh-financial-filter-portal
.kh-financial-filter-option span {
  flex:1 1 auto !important;
  min-width:0 !important;
  text-align:right !important;
}

/* Count pushed to the far left */
body > .kh-financial-filter-portal
.kh-financial-filter-option small {
  flex:0 0 auto !important;
  margin-right:auto !important;
  margin-left:0 !important;
  text-align:center !important;
  min-width:23px !important;
}

/* Keep compact row spacing */
body > .kh-financial-filter-portal
.kh-financial-filter-options {
  gap:0 !important;
}

/* KH_FINANCIAL_DESKTOP_USE_ORIGINAL_20261019 */
@media (max-width:767px) {
/* KH_FINANCIAL_CARD_FONT_V241688 */

/*
 * Slightly larger text only in the
 * All Financial Movements screen.
 * Keep original card dimensions and design.
 */

/* Transaction title */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row .kh52-entry-main strong {
  font-size:14.5px !important;
  line-height:1.4 !important;
}

/* Customer and transaction details */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row .kh52-entry-meta {
  font-size:13px !important;
  line-height:1.4 !important;
}

/* Serial number */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row .kh52-entry-serial {
  font-size:12.5px !important;
}

/* Date and customer in the upper border */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row .kh-recent-border-date {
  font-size:12.5px !important;
  line-height:1.4 !important;
}

/* Transaction amount */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row .kh52-entry-amount {
  font-size:16px !important;
  line-height:1.35 !important;
}

/* Secondary amount information */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row .kh52-entry-amount small {
  font-size:11.5px !important;
}

/* Preserve approved card spacing and geometry */
.kh-all-financial-page
.kh52-recent-list
.kh52-recent-row {
  box-sizing:border-box !important;
}
}

/* KH_FINANCIAL_BUTTON_ROW_FIX_V241689B */

@media (max-width:767px) {

  /* Title above, both buttons together below */
  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:7px !important;
  }

  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head
  > div:first-child {
    width:100% !important;
    min-width:0 !important;
  }

  /* Right: Back / Left: Filter */
  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head
  > .kh-financial-toolbar {
    display:flex !important;
    flex-direction:row !important;
    direction:rtl !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    gap:8px !important;
    margin:0 !important;
    padding:0 !important;
  }

  .kh-all-financial-page
  .kh-financial-toolbar
  .kh-financial-back {
    position:static !important;
    transform:none !important;
    margin:0 !important;
    flex:0 0 auto !important;
  }

  .kh-all-financial-page
  .kh-financial-toolbar
  .kh-financial-filter {
    position:relative !important;
    margin:0 !important;
    flex:0 0 auto !important;
  }

  /* Hide empty title-actions container spacing */
  .kh-all-financial-page
  .kh-financial-title-actions {
    display:none !important;
  }
}

/* KH_FINANCIAL_TOOLBAR_LEFT_V241690 */

@media (max-width:767px) {

  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:7px !important;
  }

  .kh-all-financial-page
  .kh52-recent-card > .kh52-card-head
  > .kh-financial-toolbar {
    display:flex !important;
    flex-direction:row !important;
    direction:rtl !important;
    align-items:center !important;
    justify-content:space-between !important;
    width:100% !important;
    gap:8px !important;
    margin:0 !important;
    padding:0 !important;
  }

  .kh-all-financial-page
  .kh-financial-toolbar > .kh-financial-back {
    order:1 !important;
    margin:0 !important;
    position:static !important;
    transform:none !important;
  }

  .kh-all-financial-page
  .kh-financial-toolbar > .kh-financial-filter {
    order:2 !important;
    margin-right:auto !important;
    margin-left:0 !important;
    position:relative !important;
  }

}

/* KH_FINANCIAL_COMPANY_DETAILS_V241692 */

@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info {
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:2px !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-company-info > strong {
    display:block !important;
    margin:0 !important;
    line-height:1.35 !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-financial-company-phone {
    display:block !important;
    max-width:100% !important;
    font-size:11px !important;
    font-weight:400 !important;
    line-height:1.35 !important;
    opacity:.82 !important;
    overflow-wrap:anywhere !important;
  }
}

/* KH_FINANCIAL_COMPANY_SMALL_SHIFT_V241693 */

@media (max-width:760px) {

  /* Move company information slightly left of menu icon */
  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info {
    margin-right:8px !important;
    margin-left:0 !important;
    gap:1px !important;
    min-width:0 !important;
  }

  /* Smaller address and phone text */
  body.kh-all-financial-header-page
  .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-financial-company-phone {
    font-size:10px !important;
    font-weight:400 !important;
    line-height:1.3 !important;
    opacity:.8 !important;
  }

}

/* KH_COMPANY_ALIGNED_LINES_V241694 */

@media (max-width:760px) {

  /* Menu icon followed by one aligned text column */
  body.kh-all-financial-header-page
  .kh-all-financial-custom-header {
    display:flex !important;
    flex-direction:row !important;
    direction:rtl !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    direction:rtl !important;
    text-align:right !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    width:auto !important;
    margin:0 !important;
    padding:0 !important;
    gap:2px !important;
  }

  /* Company name */
  body.kh-all-financial-header-page
  .kh-financial-company-info > strong {
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
    align-self:stretch !important;
    line-height:1.35 !important;
  }

  /* Address and phone start at the same position */
  body.kh-all-financial-header-page
  .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-financial-company-phone {
    display:block !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
    align-self:stretch !important;
    font-size:10px !important;
    line-height:1.3 !important;
  }

}


/* KH_COMPANY_GRID_FIX_V241695 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header {
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    direction:rtl !important;
    gap:12px !important;
    height:auto !important;
    min-height:64px !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-sidebar-toggle.kh-all-financial-inline-menu {
    flex:0 0 38px !important;
    align-self:center !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-auto-flow:row !important;
    grid-auto-rows:auto !important;
    align-content:center !important;
    justify-items:start !important;
    position:static !important;
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    height:auto !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    gap:3px !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info > strong,
  body.kh-all-financial-header-page
  .kh-financial-company-info
  > .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-financial-company-info
  > .kh-financial-company-phone {
    display:block !important;
    position:static !important;
    float:none !important;
    clear:both !important;
    transform:none !important;
    flex:none !important;
    width:auto !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    line-height:1.4 !important;
    align-self:start !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-company-info > strong {
    font-weight:700 !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-company-info
  > .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-financial-company-info
  > .kh-financial-company-phone {
    font-size:10px !important;
    font-weight:400 !important;
    opacity:.8 !important;
  }
}


/* KH_HEADER_NO_OVERLAP_V241696 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header {
    display:grid !important;
    grid-template-columns:38px minmax(0,1fr) !important;
    grid-template-rows:auto !important;
    column-gap:12px !important;
    direction:rtl !important;
    align-items:center !important;
    justify-items:stretch !important;
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    min-height:72px !important;
    padding:12px 14px !important;
    overflow:visible !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-sidebar-toggle.kh-all-financial-inline-menu {
    grid-column:1 !important;
    grid-row:1 !important;
    position:static !important;
    inset:auto !important;
    transform:none !important;
    width:38px !important;
    height:38px !important;
    margin:0 !important;
    align-self:center !important;
    justify-self:center !important;
    z-index:2 !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    position:static !important;
    inset:auto !important;
    transform:none !important;
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    gap:3px !important;
    direction:rtl !important;
    text-align:right !important;
    overflow:visible !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info > strong,
  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info > span {
    display:block !important;
    position:static !important;
    inset:auto !important;
    transform:none !important;
    float:none !important;
    clear:both !important;
    flex:none !important;
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    text-align:right !important;
    direction:rtl !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    line-height:1.5 !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info > strong {
    font-size:15px !important;
    font-weight:700 !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info
  > .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info
  > .kh-financial-company-phone {
    font-size:10px !important;
    font-weight:400 !important;
    opacity:.8 !important;
  }
}


/* KH_COMPANY_NAME_ADDRESS_SEPARATION_V241698 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    gap:0 !important;
    height:auto !important;
    min-height:0 !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-info > strong {
    display:block !important;
    position:static !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 0 6px 0 !important;
    padding:0 !important;
    line-height:1.65 !important;
    white-space:normal !important;
    overflow:visible !important;
    overflow-wrap:anywhere !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-address {
    display:block !important;
    position:static !important;
    width:100% !important;
    height:auto !important;
    margin:0 0 3px 0 !important;
    padding:0 !important;
    line-height:1.5 !important;
    font-size:10px !important;
    clear:both !important;
  }

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header
  .kh-financial-company-phone {
    display:block !important;
    position:static !important;
    width:100% !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    line-height:1.5 !important;
    font-size:10px !important;
    clear:both !important;
  }
}


/* KH_HEADER_STRUCTURAL_REPAIR_V241699 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header.kh-financial-header-repaired {
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    grid-template-rows:auto !important;
    column-gap:12px !important;
    direction:rtl !important;
    align-items:center !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    padding:12px 14px !important;
    box-sizing:border-box !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-header-repaired
  > .kh-sidebar-toggle {
    grid-column:1 !important;
    grid-row:1 !important;
    position:static !important;
    inset:auto !important;
    transform:none !important;
    width:42px !important;
    height:42px !important;
    margin:0 !important;
    justify-self:center !important;
    align-self:center !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-header-repaired
  > .kh-financial-company-info {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    gap:5px !important;
    position:static !important;
    transform:none !important;
    float:none !important;
    min-width:0 !important;
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-header-repaired
  > .kh-financial-company-info > strong,
  body.kh-all-financial-header-page
  .kh-financial-header-repaired
  > .kh-financial-company-info > span {
    display:block !important;
    position:static !important;
    float:none !important;
    transform:none !important;
    box-sizing:border-box !important;
    flex:0 0 auto !important;
    align-self:stretch !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    white-space:normal !important;
    overflow:visible !important;
    overflow-wrap:anywhere !important;
    line-height:1.65 !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-header-repaired
  > .kh-financial-company-info > strong {
    font-size:14px !important;
    font-weight:700 !important;
  }

  body.kh-all-financial-header-page
  .kh-financial-header-repaired
  > .kh-financial-company-info
  > .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-financial-header-repaired
  > .kh-financial-company-info
  > .kh-financial-company-phone {
    font-size:10px !important;
    font-weight:400 !important;
    opacity:.8 !important;
  }
}

/* KH_DIRECT_COMPANY_HEADER_V241700 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header.kh-direct-company-header {
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    grid-template-rows:auto !important;
    direction:rtl !important;
    column-gap:12px !important;
    align-items:center !important;
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    min-height:72px !important;
    height:auto !important;
    padding:12px 14px !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-sidebar-toggle {
    grid-column:1 !important;
    grid-row:1 !important;
    position:static !important;
    inset:auto !important;
    transform:none !important;
    width:42px !important;
    height:42px !important;
    margin:0 !important;
    justify-self:center !important;
    align-self:center !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info {
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    position:static !important;
    transform:none !important;
    float:none !important;
    flex:none !important;
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    gap:5px !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info > strong,
  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info > span {
    display:block !important;
    position:static !important;
    float:none !important;
    clear:both !important;
    transform:none !important;
    flex:none !important;
    box-sizing:border-box !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    line-height:1.5 !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info > strong {
    font-size:14px !important;
    font-weight:700 !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info
  > .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info
  > .kh-financial-company-phone {
    font-size:10px !important;
    font-weight:400 !important;
    opacity:.8 !important;
  }
}


/* KH_HEADER_CLEAN_LAYOUT_V241702 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-all-financial-custom-header.kh-direct-company-header {
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    grid-template-rows:minmax(0,auto) !important;
    align-items:center !important;
    column-gap:12px !important;
    direction:rtl !important;
    width:100% !important;
    height:auto !important;
    min-height:80px !important;
    padding:12px 14px !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-sidebar-toggle {
    grid-column:1 !important;
    grid-row:1 !important;
    position:static !important;
    transform:none !important;
    width:42px !important;
    height:42px !important;
    margin:0 !important;
    align-self:center !important;
    justify-self:center !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info {
    grid-column:2 !important;
    grid-row:1 !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    grid-auto-flow:row !important;
    grid-auto-rows:max-content !important;
    align-content:center !important;
    row-gap:6px !important;
    position:static !important;
    transform:none !important;
    float:none !important;
    flex:none !important;
    width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info > strong,
  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info > span {
    display:block !important;
    grid-column:1 !important;
    grid-row:auto !important;
    position:static !important;
    float:none !important;
    clear:both !important;
    transform:none !important;
    flex:none !important;
    align-self:stretch !important;
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    line-height:1.65 !important;
    direction:rtl !important;
    unicode-bidi:isolate !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info > strong {
    font-size:14px !important;
    font-weight:700 !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info
  > .kh-financial-company-address,
  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info
  > .kh-financial-company-phone {
    font-size:10px !important;
    font-weight:400 !important;
    opacity:.85 !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-financial-company-info
  > .kh-financial-company-phone {
    direction:ltr !important;
    text-align:right !important;
  }
}

/* KH_HEADER_ROWS_V241703 */
@media (max-width:760px) {

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows {
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    gap:6px !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows
  > .kh-header-name-row,
  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows
  > .kh-header-address-row,
  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows
  > .kh-header-phone-row {
    display:block !important;
    position:static !important;
    float:none !important;
    flex:0 0 auto !important;
    align-self:stretch !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    line-height:1.7 !important;
    direction:rtl !important;
    text-align:right !important;
    box-sizing:border-box !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows
  > .kh-header-name-row > strong {
    display:block !important;
    position:static !important;
    float:none !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    line-height:1.7 !important;
    font-size:14px !important;
    font-weight:700 !important;
    direction:rtl !important;
    text-align:right !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows
  > .kh-header-address-row,
  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows
  > .kh-header-phone-row {
    font-size:10px !important;
    font-weight:400 !important;
    opacity:.85 !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header > .kh-header-rows
  > .kh-header-phone-row {
    unicode-bidi:isolate !important;
  }
}


/* KH_SORT_V24174_CSS */
.kh-all-financial-page .kh-financial-sort {
  position:relative !important;
  flex:0 0 auto !important;
}

.kh-all-financial-page .kh-financial-sort-btn {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  cursor:pointer;
}

body > .kh-financial-sort-panel {
  box-sizing:border-box !important;
}

body > .kh-financial-sort-panel[hidden] {
  display:none !important;
}

@media(max-width:767px) {
  .kh-all-financial-page
  .kh-financial-toolbar > .kh-financial-back {
    order:1 !important;
    margin:0 !important;
  }

  .kh-all-financial-page
  .kh-financial-toolbar > .kh-financial-sort {
    order:2 !important;
    margin:0 auto 0 0 !important;
  }

  .kh-all-financial-page
  .kh-financial-toolbar > .kh-financial-filter {
    order:3 !important;
    margin:0 !important;
  }

  .kh-all-financial-page .kh-financial-toolbar {
    gap:4px !important;
    justify-content:space-between !important;
  }

  .kh-all-financial-page .kh-financial-sort-btn {
    min-height:34px !important;
    padding:6px 7px !important;
    font-size:10px !important;
    white-space:nowrap !important;
  }
}


/* KH_SORT_FONT_V24175 */
@media (max-width:767px) {
  .kh-all-financial-page
  .kh-financial-toolbar
  .kh-financial-sort-btn {
    font-size:13px !important;
    font-weight:900 !important;
    padding:7px 8px !important;
  }
}


/* KH_BACK_FONT_V24176 */
@media (max-width:767px) {
  .kh-all-financial-page
  .kh-financial-toolbar > .kh-financial-back {
    font-size:14px !important;
    font-weight:900 !important;
  }
}


/* KH_HIDE_PHONE_V24177 */
body.kh-all-financial-header-page
.kh-all-financial-custom-header
.kh-header-phone-row {
  display:none !important;
}


/* KH_COMPANY_CARD_V24179 */

/* Company information card - all financial page only */
body.kh-all-financial-header-page
.kh-direct-company-header
.kh-financial-company-info.kh-header-rows {
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:center !important;
  gap:5px !important;

  flex:1 1 auto !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;

  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;

  padding:13px 15px !important;
  margin:4px 0 !important;

  background:linear-gradient(
    135deg,
    #123c70 0%,
    #17578b 56%,
    #167b83 100%
  ) !important;

  border:1px solid rgba(255,255,255,.22) !important;
  border-radius:15px !important;

  box-shadow:
    0 7px 18px rgba(12,45,88,.20),
    0 2px 5px rgba(12,45,88,.10),
    inset 0 1px 0 rgba(255,255,255,.20) !important;

  text-align:right !important;
  direction:rtl !important;
}

/* Subtle decorative accent */
body.kh-all-financial-header-page
.kh-direct-company-header
.kh-financial-company-info.kh-header-rows::before {
  content:"" !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:4px !important;
  background:linear-gradient(
    to bottom,#58d8b3,#2eaa9d
  ) !important;
  pointer-events:none !important;
}

/* Company name */
body.kh-all-financial-header-page
.kh-direct-company-header
.kh-header-name-row {
  display:block !important;
  position:static !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
}

body.kh-all-financial-header-page
.kh-direct-company-header
.kh-header-name-row > strong {
  display:block !important;
  position:static !important;
  width:100% !important;
  height:auto !important;
  color:#ffffff !important;
  font-size:14px !important;
  font-weight:900 !important;
  line-height:1.75 !important;
  letter-spacing:0 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  text-shadow:0 1px 2px rgba(0,0,0,.12) !important;
}

/* Company address */
body.kh-all-financial-header-page
.kh-direct-company-header
.kh-header-address-row {
  display:block !important;
  position:static !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  color:#d7f4f4 !important;
  font-size:11px !important;
  font-weight:650 !important;
  line-height:1.65 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}

/* Keep phone hidden */
body.kh-all-financial-header-page
.kh-direct-company-header
.kh-header-phone-row {
  display:none !important;
}

@media (max-width:767px) {
  body.kh-all-financial-header-page
  .kh-direct-company-header
  .kh-financial-company-info.kh-header-rows {
    padding:11px 12px !important;
    border-radius:13px !important;
    margin:3px 0 !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header
  .kh-header-name-row > strong {
    font-size:13px !important;
    line-height:1.7 !important;
  }

  body.kh-all-financial-header-page
  .kh-direct-company-header
  .kh-header-address-row {
    font-size:10px !important;
  }
}


/* KH_COMPANY_CARD_FIX_V241710 */

/* Exact financial-page company card */
body.kh-all-financial-header-page
header.kh-all-financial-custom-header
.kh-company-premium-card,
body.kh-all-financial-header-page
.kh-company-premium-card {
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:stretch !important;
    box-sizing:border-box !important;

    position:relative !important;
    isolation:isolate !important;
    overflow:hidden !important;

    width:auto !important;
    min-width:0 !important;
    max-width:100% !important;
    height:auto !important;

    margin:4px 0 !important;
    padding:13px 15px !important;
    gap:5px !important;

    background:#164b80 !important;
    background-image:linear-gradient(
      135deg,
      #102f5c 0%,
      #175a92 58%,
      #16817f 100%
    ) !important;

    border:1px solid #4a96aa !important;
    border-radius:15px !important;

    box-shadow:
      0 7px 18px rgba(9,39,80,.25),
      0 2px 5px rgba(9,39,80,.12) !important;

    direction:rtl !important;
    text-align:right !important;
}

body.kh-all-financial-header-page
.kh-company-premium-card::before {
    content:"" !important;
    position:absolute !important;
    top:0 !important;
    bottom:0 !important;
    left:0 !important;
    width:4px !important;
    background:#55dbb0 !important;
    pointer-events:none !important;
}

body.kh-all-financial-header-page
.kh-company-premium-card .kh-header-name-row,
body.kh-all-financial-header-page
.kh-company-premium-card .kh-header-address-row {
    position:relative !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}

body.kh-all-financial-header-page
.kh-company-premium-card .kh-header-name-row,
body.kh-all-financial-header-page
.kh-company-premium-card .kh-header-name-row * {
    color:#ffffff !important;
    font-size:14px !important;
    font-weight:900 !important;
    line-height:1.7 !important;
    text-shadow:0 1px 2px rgba(0,0,0,.12) !important;
}

body.kh-all-financial-header-page
.kh-company-premium-card .kh-header-address-row,
body.kh-all-financial-header-page
.kh-company-premium-card .kh-header-address-row * {
    color:#ddf7f5 !important;
    font-size:11px !important;
    line-height:1.65 !important;
}

body.kh-all-financial-header-page
.kh-company-premium-card .kh-header-phone-row {
    display:none !important;
}

@media(max-width:767px) {
    body.kh-all-financial-header-page
    .kh-company-premium-card {
        padding:11px 12px !important;
        border-radius:13px !important;
    }
}