

/* ============================================================
   numpad-sheet.css — دیالوگ کیبورد عددی (Navy / Teal)
   v74.2 — fix: actions همیشه در کادر دید موبایل
   ============================================================ */

.numpad-sheet{position:fixed;inset:0;z-index:500;display:none;align-items:flex-end;justify-content:center}
.numpad-sheet.open{display:flex}

.numpad-sheet-backdrop{
  position:absolute;inset:0;
  background:rgba(10,37,64,.48);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  animation:nsFade .2s var(--ease);
}
@keyframes nsFade{from{opacity:0}to{opacity:1}}

.numpad-sheet-panel{
  position:relative;width:min(440px,100%);
  /* v74.2 — dvh برای موبایل‌هایی که نوار آدرس دارند */
  max-height:94vh;        /* fallback برای مرورگرهای قدیمی */
  max-height:96dvh;       /* viewport داینامیک */
  background:rgba(255,255,255,.99);
  border-radius:var(--r-2xl) var(--r-2xl) 0 0;
  box-shadow:0 -20px 60px -12px rgba(10,37,64,.35);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  display:flex;flex-direction:column;
  animation:nsUp .3s var(--ease-spring);overflow:hidden;
}
@keyframes nsUp{from{transform:translateY(40px);opacity:.5}to{transform:none;opacity:1}}

@media(min-width:700px){
  .numpad-sheet{align-items:center}
  .numpad-sheet-panel{width:min(400px,92vw);border-radius:var(--r-2xl);max-height:90vh;max-height:90dvh}
}

.numpad-sheet-head{
  display:flex;align-items:center;gap:8px;
  padding:10px 12px 8px;border-bottom:1px solid var(--line);flex:0 0 auto;
}
.numpad-sheet-head h3{
  flex:1;margin:0;font-size:13px;font-weight:800;
  text-align:center;color:var(--txt);
}
.ns-close{
  width:32px;height:32px;border:0;border-radius:50%;
  background:var(--s2);color:var(--txt);font-size:13px;font-family:inherit;
  cursor:pointer;display:grid;place-items:center;
  transition:background var(--t) var(--ease), color var(--t) var(--ease), transform var(--t-fast) var(--ease);
}
.ns-close:hover{background:var(--errc);color:var(--err)}
.ns-close:active{transform:scale(.9)}

.numpad-sheet-display{
  padding:12px 14px 10px;text-align:center;
  background:linear-gradient(180deg,#F0F7FD,#FAFCFF);
  border-bottom:1px solid var(--line);flex:0 0 auto;
}
.ns-value{
  font-size:26px;font-weight:800;color:var(--p);
  direction:ltr;font-variant-numeric:tabular-nums;
  letter-spacing:.5px;line-height:1.2;min-height:30px;word-break:break-all;
}
.ns-value.placeholder{color:#C0CBD9}
.ns-hint{
  font-size:10.5px;color:var(--muted);margin-top:4px;min-height:12px;
  transition:color var(--t) var(--ease);font-weight:500;
}
.ns-hint.err{color:var(--err);font-weight:700}

.numpad-sheet-suggest{
  display:grid;grid-template-columns:repeat(4,1fr);gap:6px;
  padding:10px 12px 2px;flex:0 0 auto;
}
.numpad-sheet-suggest:empty{display:none}
.numpad-sheet-suggest button{
  font-family:inherit;font-size:11px;font-weight:700;
  padding:7px 3px;border-radius:10px;
  border:1.5px solid #BAE0F7;
  background:linear-gradient(135deg,#F0F7FD,#E0F2FE);
  color:#075985;cursor:pointer;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t) var(--ease), background var(--t) var(--ease);
  font-variant-numeric:tabular-nums;
}
.numpad-sheet-suggest button:hover{box-shadow:0 4px 10px -4px rgba(20,184,166,.5)}
.numpad-sheet-suggest button:active{transform:scale(.94);background:linear-gradient(135deg,#BAE0F7,#7DD3FC)}

.numpad-sheet-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:6px;
  padding:8px 12px 2px;
  flex:1 1 auto;
  min-height:0;            /* v74.2 — اجازه shrink */
  overflow-y:auto;         /* v74.2 — اگر جا کم بود، داخلی اسکرول */
}
.numpad-sheet-grid button{
  font-family:inherit;font-size:17px;font-weight:600;
  height:46px;border-radius:12px;
  border:1.5px solid var(--line);
  background:#fff;color:var(--txt);cursor:pointer;
  transition:transform var(--t-fast) var(--ease), background var(--t) var(--ease), border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
  font-variant-numeric:tabular-nums;user-select:none;
  -webkit-tap-highlight-color:transparent;padding:0;
  box-shadow:var(--sh-xs);
}
.numpad-sheet-grid button:hover{border-color:var(--teal);background:#FDFFFE;box-shadow:var(--sh-sm)}
.numpad-sheet-grid button:active{transform:scale(.94);background:var(--tealc);border-color:var(--teal)}
.numpad-sheet-grid button[data-k="back"]{
  background:linear-gradient(135deg,#FEF2F2,#FEE2E2);
  border-color:#FECACA;color:#DC2626;font-size:17px;
}
.numpad-sheet-grid button[data-k="back"]:active{background:#FECACA}
.numpad-sheet-grid button[data-k="000"]{
  background:linear-gradient(135deg,#F0F7FD,#E0F2FE);
  border-color:#BAE0F7;color:#075985;
  font-size:13px;font-weight:700;
}
.numpad-sheet-grid button[data-k="000"]:active{background:#BAE0F7}

/* ── v74.2 — actions همیشه در پایین، جدا از محتوا ── */
.numpad-sheet-actions{
  display:grid;grid-template-columns:1fr 2fr;gap:8px;
  padding:8px 12px max(12px, env(safe-area-inset-bottom));
  flex:0 0 auto;
  background:#fffbfe;
  border-top:1px solid var(--line);
  box-shadow:0 -6px 16px -10px rgba(10,37,64,.18);
  position:relative;
  z-index:2;
}
.numpad-sheet-actions button{
  font-family:inherit;font-size:13px;font-weight:700;
  height:46px;border-radius:12px;cursor:pointer;
  transition:transform var(--t-fast) var(--ease), box-shadow var(--t) var(--ease), filter var(--t) var(--ease);
}
.ns-clear{border:1.5px solid #FECACA;background:#fff;color:#DC2626}
.ns-clear:hover{background:#FEF2F2}
.ns-clear:active{transform:scale(.97)}
.ns-done{
  border:0;
  background:linear-gradient(135deg, var(--teal-600), var(--teal));
  color:#fff;
  box-shadow:var(--sh-teal);
}
.ns-done:hover{filter:brightness(1.06)}
.ns-done:active{transform:scale(.97)}

@media(max-height:640px){
  .numpad-sheet-display{padding:6px 12px 6px}
  .ns-value{font-size:22px;min-height:26px}
  .numpad-sheet-grid button{height:40px;font-size:16px}
  .numpad-sheet-suggest button{padding:6px 3px;font-size:10px}
  .numpad-sheet-actions button{height:40px;font-size:12px}
  .numpad-sheet-head{padding:6px 12px 4px}
  .numpad-sheet-head h3{font-size:12px}
}

.numpad-trigger{cursor:pointer;transition:border-color var(--t) var(--ease), transform var(--t-fast) var(--ease);position:relative;pointer-events:auto}
.numpad-trigger::after{
  content:'⌨';position:absolute;inset-inline-end:12px;top:50%;
  transform:translateY(-50%);font-size:16px;opacity:.4;pointer-events:none;
}
.numpad-trigger:hover{border-color:var(--teal)}
.numpad-trigger:active{transform:scale(.99)}
