/* ============================================================
   clinic-ui-4.css — ส่วนเสริมที่ไม่มีในแพ็กดีไซน์
   โหลดก่อน clinic-ui-5.css (ของดีไซเนอร์) เพื่อให้ไฟล์ 5 ทับได้
   เหลือไว้เฉพาะสิ่งที่ระบบต้องใช้แต่ดีไซน์ยังไม่ได้ออกแบบมา
   ============================================================ */

/* ---------- 1. เกณฑ์ขนาดขั้นต่ำเพิ่มเติม (ดีไซน์ครอบแค่บางคลาส) ---------- */
@media screen {
  .pipe-card .sub, .short-flag .t, .short-flag .d, .short-flag .n,
  .usage-grid label, .msg .who, .msg .time, .chat-day, .chat-head .s,
  .vx-step .dt, .vx-step .lbl, .login-side .foot, .login-card .hint,
  .be-cal-dow span { font-size: 12px; }
  .label-preview, .state .d, .modal.v2 .m-head .s { font-size: 13px; }
  .btn-sm, a.btn-sm, button.btn-sm { min-height: 36px; }
}

/* ---------- 2. ตัวเลขงานค้างบนแท็บนำทาง ---------- */
nav a.tab { display: inline-flex; align-items: center; gap: 6px; }
nav a.tab .tab-n {
  background: rgba(255,255,255,.22); color: #fff; border-radius: 99px;
  padding: 0 7px; font-size: 11.5px; font-weight: 700; font-variant-numeric: tabular-nums;
}
nav a.tab.active .tab-n { background: rgba(255,255,255,.32); }

/* ---------- 3. ล็อต/วันหมดอายุ และสต๊อกไม่พอ ในแถวรายการยา ---------- */
tr.row-short td { background: var(--danger-soft); }
.short-warn { font-size: 12px; color: var(--danger-ink); font-weight: 600; display: block; margin-top: 2px; }
.lot-info { font-size: 12px; color: var(--muted); display: block; margin-top: 2px; }
.lot-info.soon { color: var(--amber-ink); font-weight: 600; }
.lot-info.expired { color: var(--danger-ink); font-weight: 700; }

/* ---------- 4. กันแชทลอยทับแถบปุ่มล่างบนมือถือ ---------- */
@media (max-width: 720px) {
  body.has-bottombar .chat-fab { bottom: 84px; }
  body.has-bottombar .chat-panel { bottom: 148px; height: calc(52vh / var(--zf, 1)); }
}