/* KADESHWAR FINANCIAL SERVICES PRIVATE LIMITED - smooth animations + popup theme */
:root{--zx-ease:cubic-bezier(.2,.7,.2,1);--zx-ind:#F97316;--zx-vio:#EA6A0A;}

/* ---------- page enter / leave ---------- */
@keyframes zxFade{from{opacity:0}to{opacity:1}}
@keyframes zxUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes zxPopIn{0%{opacity:0;transform:scale(.86) translateY(14px)}60%{opacity:1;transform:scale(1.03)}100%{opacity:1;transform:scale(1)}}
@keyframes zxPopOut{to{opacity:0;transform:scale(.92) translateY(8px)}}
body{animation:zxFade .35s ease-out both;}
html.zx-leave body{opacity:0;transition:opacity .18s ease-in;}
.zf-card{animation:zxUp .55s var(--zx-ease) both;}
.zp-live,.zp-tabs,.zp-panel,.zp-card,.page-title,.zp-sub,.zp-section{animation:zxUp .5s var(--zx-ease) both;}
.zp-card:nth-child(2){animation-delay:.05s}.zp-card:nth-child(3){animation-delay:.1s}
.zp-card:nth-child(4){animation-delay:.15s}.zp-card:nth-child(5){animation-delay:.2s}.zp-card:nth-child(6){animation-delay:.25s}
.zp-live{animation-delay:.05s}.zp-tabs{animation-delay:.1s}

/* ---------- tap / focus feel ---------- */
button,.btn,.zf-btn,a.zp-btn,.zp-tab,.sidebar .nav .nav-item a{transition:transform .15s ease,box-shadow .2s ease,background .2s ease,color .2s ease,border-color .2s ease;}
button:active:not(:disabled),.btn:active,.zf-btn:active{transform:scale(.97);}
input,select,textarea,.form-control{transition:border-color .2s ease,box-shadow .25s ease,background .2s ease;}

/* ---------- drawer overlay + dropdown + bootstrap modal ---------- */
.nav_open .main-panel::after{animation:zxFade .25s ease-out both;}
.dropdown-menu.show{animation:zxUp .22s var(--zx-ease) both;}
.modal.fade .modal-dialog{transform:translateY(26px) scale(.96);opacity:0;transition:transform .32s var(--zx-ease),opacity .25s ease;}
.modal.show .modal-dialog{transform:none;opacity:1;}

/* ---------- SweetAlert popup (video style) ---------- */
.swal2-container{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);}
.swal2-popup.zx-swal{border-radius:26px;padding:26px 22px 24px;width:min(88vw,340px);font-family:'DM Sans','Nunito',sans-serif;box-shadow:0 30px 70px rgba(23,23,23,.28);}
.swal2-popup.zx-pop-in{animation:zxPopIn .38s var(--zx-ease) both;}
.swal2-popup.zx-pop-out{animation:zxPopOut .2s ease-in both;}
.zx-swal .swal2-icon{margin:4px auto 14px;transform:scale(.92);position:relative;z-index:1;}
/* success icon ke white mask pieces chip ke upar na aayen */
.zx-swal .swal2-icon.swal2-success [class^=swal2-success-circular-line],
.zx-swal .swal2-icon.swal2-success .swal2-success-fix{z-index:0;}
.zx-swal .swal2-icon.swal2-success{overflow:hidden;}
.zx-swal .zx-chip{position:relative;z-index:5;display:inline-block;margin:6px auto 12px;line-height:1.3;padding:5px 14px;border-radius:999px;background:#FFF4E8;color:var(--zx-ind);font-weight:800;font-size:.8rem;letter-spacing:.06em;}
.zx-swal .swal2-title{font-size:1.3rem;font-weight:800;color:#171717;padding:0;margin:0 0 6px;}
.zx-swal .swal2-html-container{font-size:.9rem;color:#6B6B66;margin:0 0 4px;line-height:1.5;}
.zx-swal .swal2-actions{margin-top:16px;gap:10px;}
.zx-swal .swal2-confirm{background:linear-gradient(135deg,var(--zx-ind),var(--zx-vio)) !important;border-radius:999px !important;min-width:110px;padding:11px 28px !important;font-weight:700;font-size:.95rem;box-shadow:0 10px 22px rgba(249,115,22,.35) !important;}
.zx-swal .swal2-cancel{background:#F4F4EF !important;color:#475569 !important;border-radius:999px !important;padding:11px 24px !important;font-weight:600;}
.zx-swal .swal2-deny{border-radius:999px !important;}
.zx-swal .swal2-confirm:focus,.zx-swal .swal2-cancel:focus{box-shadow:0 0 0 3px rgba(249,115,22,.25) !important;}
.zx-swal .swal2-timer-progress-bar{background:var(--zx-ind);}

@media (prefers-reduced-motion:reduce){
  body,.zf-card,.zp-live,.zp-tabs,.zp-panel,.zp-card,.page-title,.zp-sub,.zp-section,.dropdown-menu.show,.swal2-popup.zx-pop-in,.swal2-popup.zx-pop-out{animation:none !important;}
  html.zx-leave body{transition:none;}
}

/* ---------- drawer (menu) animation, video style ---------- */
@keyframes zxSlideIn{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:none}}
@keyframes zxBrandIn{from{opacity:0;transform:translateY(-10px) scale(.96)}to{opacity:1;transform:none}}
:root{--zx-drawer:cubic-bezier(.22,.9,.3,1);}
html body .sidebar{transition:transform .46s var(--zx-drawer) !important;will-change:transform;}
html body .main-panel,html body .main-header{transition:transform .46s var(--zx-drawer) !important;will-change:transform;}
html.nav_open body .sidebar .zp-brand{animation:zxBrandIn .5s var(--zx-ease) .1s both;}
html.nav_open body .sidebar .nav .nav-item{animation:zxSlideIn .48s var(--zx-ease) both;}
html.nav_open body .sidebar .nav .nav-item:nth-child(1){animation-delay:.14s}
html.nav_open body .sidebar .nav .nav-item:nth-child(2){animation-delay:.18s}
html.nav_open body .sidebar .nav .nav-item:nth-child(3){animation-delay:.22s}
html.nav_open body .sidebar .nav .nav-item:nth-child(4){animation-delay:.26s}
html.nav_open body .sidebar .nav .nav-item:nth-child(5){animation-delay:.30s}
html.nav_open body .sidebar .nav .nav-item:nth-child(6){animation-delay:.34s}
html.nav_open body .sidebar .nav .nav-item:nth-child(7){animation-delay:.38s}
html.nav_open body .sidebar .nav .nav-item:nth-child(8){animation-delay:.42s}
html.nav_open body .sidebar .nav .nav-item:nth-child(n+9){animation-delay:.46s}
.nav_open .main-panel::after{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:zxFade .4s ease-out both;cursor:pointer;}

/* ---------- baaki har jagah: rows / form / cards ek ke baad ek ---------- */
.card,.table tbody tr,.form-group,.alert,.list-group-item,.zp-txn{animation:zxUp .5s var(--zx-ease) both;}
.table tbody tr:nth-child(1){animation-delay:.04s}.table tbody tr:nth-child(2){animation-delay:.08s}.table tbody tr:nth-child(3){animation-delay:.12s}
.table tbody tr:nth-child(4){animation-delay:.16s}.table tbody tr:nth-child(5){animation-delay:.2s}.table tbody tr:nth-child(6){animation-delay:.24s}
.table tbody tr:nth-child(n+7){animation-delay:.28s}
.form-group:nth-child(2){animation-delay:.05s}.form-group:nth-child(3){animation-delay:.1s}.form-group:nth-child(4){animation-delay:.15s}
.form-group:nth-child(5){animation-delay:.2s}.form-group:nth-child(n+6){animation-delay:.25s}
.card:nth-child(2){animation-delay:.06s}.card:nth-child(3){animation-delay:.12s}
.modal.show .modal-content{animation:zxPopIn .38s var(--zx-ease) both;}
.dropdown-menu.show{animation:zxUp .24s var(--zx-ease) both;}
.badge,.btn{transition:transform .15s ease,box-shadow .2s ease,background .2s ease,color .2s ease;}
@media (prefers-reduced-motion:reduce){
  html.nav_open body .sidebar .zp-brand,html.nav_open body .sidebar .nav .nav-item,.card,.table tbody tr,.form-group,.alert,.list-group-item,.zp-txn,.modal.show .modal-content{animation:none !important;}
  html body .sidebar,html body .main-panel,html body .main-header{transition-duration:.01ms !important;}
}

/* =====================================================================
   v3 - SMOOTH + LIGHT: sirf transform/opacity (GPU), koi heavy effect nahi
   ===================================================================== */

/* 1) chhoti aur halki entrance motion (12px, .4s) */
@keyframes zxUp{from{opacity:0;transform:translate3d(0,12px,0)}to{opacity:1;transform:none}}
@keyframes zxPopIn{0%{opacity:0;transform:scale(.9) translate3d(0,10px,0)}65%{opacity:1;transform:scale(1.02)}100%{opacity:1;transform:none}}

/* 2) animation ke baad GPU layer chhod do (fill=backwards): memory + scroll lag kam */
body,.zf-card,.zp-live,.zp-tabs,.zp-panel,.zp-card,.page-title,.zp-sub,.zp-section,
.card,.form-group,.alert,.list-group-item,.zp-txn,
html.nav_open body .sidebar .zp-brand,html.nav_open body .sidebar .nav .nav-item,
.nav_open .main-panel::after,.modal.show .modal-content{animation-fill-mode:backwards !important;}
body{animation-duration:.28s;}
.zf-card,.zp-live,.zp-tabs,.zp-panel,.zp-card,.page-title,.zp-sub,.zp-section,.card,.form-group,.alert,.list-group-item,.zp-txn{animation-duration:.4s;}

/* 3) blur hata diya (phone me sabse zyada lag ye deta hai) - halka dim kaafi hai */
.swal2-container,.nav_open .main-panel::after{backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
.swal2-container.swal2-backdrop-show,.swal2-container{background:rgba(23,23,23,.45);}
.nav_open .main-panel::after{background:rgba(2,18,48,.5);}

/* 4) drawer: thoda tez (.46s -> .36s) aur will-change sirf khulte waqt */
html body .sidebar,html body .main-panel,html body .main-header{will-change:auto;transition-duration:.36s !important;}
html.nav_open body .sidebar,html.nav_open body .main-panel,html.nav_open body .main-header{will-change:transform;}
html.nav_open body .sidebar .nav .nav-item{animation-duration:.36s;}

/* 5) tables: DataTables ki rows kabhi animate nahi (search/sort par flicker+lag hota tha);
      baaki tables me sirf halka fade */
.table tbody tr{animation:none;}
.table:not(.dataTable) tbody tr{animation:zxFade .28s ease-out backwards;}
.table:not(.dataTable) tbody tr:nth-child(n+9){animation:none;}

/* 6) Cashier page: card -> item ek ke baad ek */
.zc-card{animation:zxUp .4s var(--zx-ease) backwards;}
.zc-card.zc-list{animation-delay:.07s;}
.zc-item{animation:zxUp .4s var(--zx-ease) backwards;}
.zc-item:nth-child(2){animation-delay:.14s}.zc-item:nth-child(3){animation-delay:.2s}
.zc-item:nth-child(4){animation-delay:.26s}.zc-item:nth-child(5){animation-delay:.32s}
.zc-item:nth-child(n+6){animation-delay:.36s}
.zc-pill{animation:zxPopIn .45s var(--zx-ease) .18s backwards;}
.zc-card,.zc-btn,.zc-mini,.zc-item{transition:transform .18s ease,box-shadow .2s ease,background .2s ease;}
.zc-mini:active,.zc-btn:active{transform:scale(.97);}

/* 7) hover lift sirf un devices par jahan mouse hai (touch par bekaar repaint nahi) */
@media (hover:hover) and (pointer:fine){
  .zp-card:hover,.zc-item:hover{transform:translate3d(0,-2px,0);box-shadow:0 10px 26px rgba(23,23,23,.12);}
  .zc-btn:hover,.zx-swal .swal2-confirm:hover{transform:translate3d(0,-1px,0);}
}

/* 8) touch par tap delay/hilna nahi */
a,button,input,select,label,.zp-tab{touch-action:manipulation;}

/* 9) saari animation band: user ne "reduce motion" ya data-saver rakha ho */
@media (prefers-reduced-motion:reduce){
  .zc-card,.zc-item,.zc-pill,.table tbody tr,.form-group,.card,.alert,.list-group-item,.zp-txn{animation:none !important;}
  html body .sidebar,html body .main-panel,html body .main-header{transition:none !important;}
}