/* ══════════════════════════════════════════════════════════════════
   Tableory · ลากแขกย้ายโต๊ะบนผัง
   ไฟล์แยกด้วยเหตุผลเดียวกับ css/layout.css — css/app.css มีเจ้าของอยู่
   ต้องโหลด "หลัง" app.css และหลัง layout.css เสมอ
   ทุกสีมาจากโทเคนของ app.css จึงตามธีมสว่าง/มืดเองโดยไม่ต้องประกาศซ้ำ

   ภาษาภาพยืมมาจากตัวเลือกโต๊ะโดยตั้งใจ (--pick-ok · --pick-sel):
   สองอย่างนี้คืองานเดียวกัน ("โต๊ะไหนรับกลุ่มนี้ได้") ต่างกันแค่ท่ามือ
   ถ้าใช้สีคนละชุด พนักงานจะต้องเรียนรู้สองภาษาสำหรับคำถามเดียว
   ══════════════════════════════════════════════════════════════════ */

/* กดค้างบนโต๊ะคือ "ท่า" ของเรา ไม่ใช่การเลือกข้อความหรือการเรียกเมนูของระบบ
   iOS ขึ้นแว่นขยาย/เมนูคัดลอกตอนกดค้าง ซึ่งทับผังพอดีในจังหวะที่ท่ากำลังเริ่ม */
.tbl {
  -webkit-touch-callout: none;
  user-select: none;
  -webkit-user-select: none;
}

/* ระหว่างยกแขก นิ้วเป็นของเราทั้งดุ้น
   (ค่านี้ถูกอ่านตอนนิ้วแตะจอ การตั้งกลางท่าจึงมีผลกับท่า "ถัดไป" ไม่ใช่ท่านี้ —
    ท่านี้ถูกกันด้วย preventDefault ที่ touchmove ใน js/ui/seatdrag.js) */
.floor-wrap.is-sdrag { touch-action: none; cursor: grabbing; }

/* ── ต้นทาง: อยู่กับที่ ── */
/* ห้ามย้ายตัวโต๊ะตามนิ้ว ผังคือสิ่งที่โฮสต์กวาดตาอ่านทั้งห้องในแวบเดียว
   ใบต้นทางจึงแค่จางลงพอให้รู้ว่า "ใบนี้กำลังถูกยก" แล้วยังอ่านชื่อแขกได้อยู่ */
.tbl.sdrag-src {
  opacity: .5;
  outline: 2px dashed var(--bronze);
  outline-offset: 2px;
}

/* ── ปลายทางที่รับได้ ── */
/* วงแหวนบาง ๆ เท่านั้น ไม่หรี่ใบอื่น (ต่างจาก .pk-no ของตัวเลือกโต๊ะที่หรี่ได้
   เพราะตอนนั้นทั้งหน้าจอมีงานเดียว ส่วนตอนลาก ผังยังต้องอ่านได้ตามปกติทั้งใบ) */
.tbl.sdrag-ok { box-shadow: 0 0 0 2px var(--pick-ok); }

/* ── ใบที่อยู่ใต้ปลายนิ้วตอนนี้ ── */
.tbl.sdrag-over {
  box-shadow: 0 0 0 3px var(--pick-sel);
  border-color: var(--pick-sel);
  z-index: 9;
}
/* วางไม่ได้ — ต้องรู้ "ก่อน" ปล่อยมือ ไม่ใช่หลัง
   (โต๊ะที่มีคนอยู่ยังอ่านชื่อแขกได้ตามปกติ วงแหวนเป็นคำตอบ ไม่ใช่ฉากบัง) */
.tbl.sdrag-no {
  box-shadow: 0 0 0 3px var(--st-overdue);
  z-index: 9;
}

/* มีคนอยู่ แต่เลือกทางได้ — ปล่อยแล้วขึ้นแผ่น "โต๊ะชนกัน" (22 ต.ค.)
   เส้นประสีบรอนซ์ ไม่ใช่สีสนิม: ไม่ใช่ "ห้าม" แต่เป็น "จะถามก่อน" — รูปร่างต่างจากวางไม่ได้ด้วย ไม่ใช่แค่สี */
.tbl.sdrag-ask {
  box-shadow: 0 0 0 3px var(--bronze);
  outline: 2px dashed var(--bronze);
  outline-offset: 4px;
  z-index: 9;
}

/* ── ป้ายที่ลอยตามนิ้ว ──
   เล็กที่สุดเท่าที่ยังอ่านออก และลอยเหนือจุดสัมผัส เพราะฝ่ามือบังทุกอย่างใต้นิ้วอยู่แล้ว
   ต่ำกว่า .toast (60) เพราะข้อความผลลัพธ์ต้องชนะเสมอ */
.sdrag-ghost {
  position: fixed; left: 0; top: 0;
  z-index: 55;
  pointer-events: none;
  max-width: 190px;
  padding: 5px 10px;
  border-radius: var(--r-sm);
  background: var(--surface-2);
  border: 1px solid var(--bronze);
  box-shadow: 0 8px 22px var(--shadow-2);
  will-change: transform;
}
.sdrag-ghost b {
  display: block;
  font-size: 12px; font-weight: 600; line-height: 1.25;
  max-width: 170px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sdrag-ghost span {
  display: block;
  font-size: 11px; line-height: 1.3; color: var(--ink-dim);
  white-space: nowrap;
}
.sdrag-ghost--no { border-color: var(--st-overdue); }
.sdrag-ghost--no span { color: var(--danger-text); }