/* ========================================================================
   MO_POS_42_PATCHED_v6 - v6.7.13: Theme sync override
   File này load SAU các file CSS gốc để override màu/bo góc/hiệu ứng.
   KHÔNG đụng class name, KHÔNG đụng layout, CHỈ thay màu sắc + hiệu ứng.
   ======================================================================== */

/* ============================================================
   PHẦN 1: PC DESKTOP (index.html inline + public/styles.css override)
   - index.html dùng inline <style> với --brand, --brand2, --soft
   - public/styles.css dùng --blue, --green
   - Đồng bộ tất cả về --pos-primary
   ============================================================ */

:root {
  /* Vars cho public/styles.css */
  --blue: var(--pos-primary) !important;
  --green: var(--pos-success) !important;
  --orange: var(--pos-warning) !important;
  --red: var(--pos-danger) !important;
  --bg: var(--pos-bg) !important;
  --card: var(--pos-card) !important;
  --line: var(--pos-border) !important;
  --text: var(--pos-text) !important;
  --muted: var(--pos-text-muted) !important;

  /* Vars cho index.html inline style */
  --brand: var(--pos-primary) !important;          /* #0877a6 → #0784c3 */
  --brand2: var(--pos-success) !important;         /* #0f9f8f → #059669 đồng bộ green */
  --soft: var(--pos-primary-light) !important;     /* #e8f6fb → #f0f9ff */
  --ok: var(--pos-success) !important;
  --warn: var(--pos-warning) !important;
  --danger: var(--pos-danger) !important;
  --panel: var(--pos-card) !important;
}

/* Bàn ở PC: serving = xanh nhạt (đồng bộ), paying = cam nhạt */
.table.serving {
  background: var(--pos-primary-light) !important;
  border-color: var(--pos-primary-border) !important;
}
.table.paying {
  background: var(--pos-warning-light) !important;
  border-color: var(--pos-warning-border) !important;
}
.table.selected {
  outline-color: var(--pos-primary) !important;
}

/* Card có hiệu ứng hover (nếu có onclick) - cho BUG54 và Tổng quan
   v6.7.14: bỏ box-shadow hover (gây repaint layout). Chỉ đổi background. */
#todayBox .card[data-bug54-clickable="1"]:hover {
  background: var(--pos-primary-light) !important;
  border-color: var(--pos-primary-border) !important;
}
#todayBox .card[data-bug54-clickable="1"] .grand {
  color: var(--pos-primary) !important;
}

/* Card chung KHÔNG có shadow tự động (v6.7.14: bỏ vì gây thêm GPU layer) */

/* ============================================================
   PHẦN 2: SPLIT WORKFLOW (public/desktop/split_workflow.css override)
   - File gốc hardcode #0784c3 - thực tế đúng màu, nhưng đảm bảo
   ============================================================ */

.splitWorkflowTitleBar {
  background: var(--pos-primary) !important;
}

/* ============================================================
   PHẦN 3: MOBILE COMMON (seafood.css + mobile_common.css override)
   - Top bar đen #111827 → xanh chủ đạo
   - Nút .btn xanh #2563eb → xanh chủ đạo
   ============================================================ */

/* Top bar đồng bộ xanh */
.top {
  background: var(--pos-primary) !important;
}

/* Nút primary trong seafood.css đang là #2563eb → đổi sang #0784c3 */
.btn {
  background: var(--pos-primary) !important;
  border-radius: var(--pos-radius-md);
}

/* Nút secondary giữ xám */
.btn.secondary {
  background: var(--pos-neutral) !important;
}

/* Nút xanh lá GIỮ NGUYÊN (gửi bếp, in phiếu, đồng ý) */
.btn.green {
  background: var(--pos-success) !important;
}

/* Nút đỏ GIỮ NGUYÊN (hủy) */
.btn.red,
.mini.red {
  background: var(--pos-danger) !important;
}

/* Card mobile bo góc - v6.7.14: KHÔNG override box-shadow (giữ shadow gốc của seafood.css) */
.seafood-order-only .card,
.service-only .card {
  border-radius: var(--pos-radius-lg);
}

/* ============================================================
   PHẦN 4: TICKET TAB (mobile order) - tab active dùng màu primary
   ============================================================ */

.tab.active {
  background: var(--pos-primary-light) !important;
  border-color: var(--pos-primary) !important;
  color: var(--pos-primary-text) !important;
}

.table-chip.active {
  background: var(--pos-primary-light) !important;
  border-color: var(--pos-primary) !important;
}

.table-chip.busy {
  background: var(--pos-warning-light) !important;
  border-color: var(--pos-warning-border) !important;
}

/* ============================================================
   PHẦN 5: MENU CARD STRONG (mobile order) - tên món xanh chủ đạo
   File gốc dùng #0f6bdc, đồng bộ về #0784c3
   ============================================================ */

.menu-card strong {
  color: var(--pos-primary) !important;
}

/* ============================================================
   PHẦN 6: LANG MENU active (mobile order)
   ============================================================ */

.lang-option.active {
  background: var(--pos-primary-light) !important;
  border-color: var(--pos-primary) !important;
}

/* ============================================================
   PHẦN 7: PILL info color (mobile)
   ============================================================ */

.pill {
  background: var(--pos-primary-light) !important;
  color: var(--pos-primary-text) !important;
}

/* ============================================================
   PHẦN 8: Quick chip (mobile order)
   ============================================================ */

.quick-chip.active {
  background: var(--pos-primary-light) !important;
  border-color: var(--pos-primary) !important;
}

/* ============================================================
   PHẦN 9: PC desktop - bàn phục vụ / tạm tính / paid đồng bộ tone
   File gốc dùng #edf8ff cho serving, đồng bộ về primary-light
   ============================================================ */

.table-card.serving {
  background: var(--pos-primary-light) !important;
  border-color: var(--pos-primary-border) !important;
}

.table-card.paid {
  background: var(--pos-success-light) !important;
  border-color: var(--pos-success-border) !important;
}

/* Bàn "unsent" (chưa gửi bếp) dùng warning tone */
.table-card.unsent {
  background: var(--pos-warning-light) !important;
  border-color: var(--pos-warning-border) !important;
}

/* ============================================================
   PHẦN 10: Money/total dùng tone xanh primary cho consistent
   ============================================================ */

.money {
  color: var(--pos-primary);
}

/* ============================================================
   PHẦN 11: Tabs top (PC desktop) - tab active dùng primary
   ============================================================ */

.tabs button.active,
.btn.active {
  background: var(--pos-primary) !important;
  border-color: var(--pos-primary) !important;
}

/* ============================================================
   PHẦN 12: Input focus - viền primary khi focus
   v6.7.14: dùng outline (cheap) thay vì box-shadow ring (cần GPU layer)
   ============================================================ */

input:focus,
select:focus,
textarea:focus {
  outline: 2px solid var(--pos-primary);
  outline-offset: -1px;
  border-color: var(--pos-primary) !important;
}

/* ============================================================
   PHẦN 13: BUG54 popup - đã hardcode #2563eb, override về primary
   ============================================================ */

.bug54ZoneTitle {
  border-left-color: var(--pos-primary) !important;
}

#todayBox .card[data-bug54-clickable="1"] .grand {
  color: var(--pos-primary) !important;
}

/* ============================================================
   PHẦN 14: pcShortcutHint <b> - file gốc hardcode #0f7bd7
   ============================================================ */

.pcShortcutHint b {
  color: var(--pos-primary) !important;
}