/* Ứng dụng bộ 3 (doc/dev/bo-giao-dien.html mục 4.3): cùng tên lớp với frontend-1/css/app.css (nội dung màn hình nhúng
   từ frontend-1/app.html), trình bày theo kiểu bộ 3 — dùng chung biến màu của dashboard.css */
html, body { font-family: "Be Vietnam Pro", system-ui, sans-serif; }

/* Ô nhập, nhãn */
.inp { width: 100%; font: inherit; font-size: .9rem; color: var(--muc); background: #fff; border: 1px solid var(--vien); border-radius: 10px; padding: .55rem .75rem; }
.inp:focus { outline: none; border-color: #93b4ef; box-shadow: 0 0 0 3px #dbe7fb; }
.inp:disabled, .inp[readonly] { background: #f4f6fa; color: var(--nhat); }
.lbl { display: block; font-size: .8rem; font-weight: 700; color: var(--muc-2); margin-bottom: .3rem; }
.req::after { content: ' *'; color: var(--chua); }

/* Nút */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; border-radius: 10px; padding: .55rem 1rem; font-weight: 700; font-size: .875rem; border: 1px solid transparent; transition: background .15s, border-color .15s, color .15s, box-shadow .15s; white-space: nowrap; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-primary { background: var(--xanh); color: #fff; box-shadow: 0 8px 16px -12px var(--xanh); }
.btn-primary:hover:not(:disabled) { background: #1a53b8; }
.btn-success { background: var(--la); color: #fff; box-shadow: 0 8px 16px -12px var(--la); }
.btn-success:hover:not(:disabled) { background: #15803d; }
.btn-danger { background: var(--chua); color: #fff; box-shadow: 0 8px 16px -12px var(--chua); }
.btn-danger:hover:not(:disabled) { background: #d23c41; }
.btn-light { background: #fff; color: var(--muc-2); border-color: var(--vien); }
.btn-light:hover:not(:disabled) { border-color: var(--xanh); color: var(--xanh); }
.btn-sm { padding: .36rem .7rem; font-size: .78rem; border-radius: 9px; }

/* Thẻ, bảng, nhãn */
.card { background: var(--the); border: 1px solid var(--vien); border-radius: 18px; box-shadow: 0 6px 24px -14px rgb(15 42 95 / .25); }
.tbl { width: 100%; font-size: .86rem; }
.tbl th { text-align: left; font-size: .74rem; font-weight: 700; color: var(--muc-2); background: #f6f9fe; padding: .7rem .8rem; border-bottom: 1px solid var(--vien); white-space: nowrap; }
.tbl td { padding: .65rem .8rem; border-bottom: 1px solid #eef2f8; vertical-align: top; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl tr:hover td { background: #fafcff; }
.badge { display: inline-block; border-radius: 8px; padding: .12rem .55rem; font-size: .72rem; font-weight: 700; white-space: nowrap; }

/* Khung: nút tròn ở thanh trên, số chờ */
.nut-tron { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 12px; border: 1px solid var(--vien); background: #fff; color: var(--muc-2); }
.nut-tron:hover { border-color: var(--xanh); color: var(--xanh); }
.cham-so { position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: var(--chua); color: #fff; font-size: .65rem; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.so-cho { font-size: .7rem; font-weight: 800; border-radius: 8px; padding: .05rem .45rem; background: var(--vang); color: #3d2c00; }
.menu a[aria-current] .so-cho { background: #fff; color: var(--xanh); }

/* Nội dung màn hình (từ bộ 1): tiêu đề, thẻ chuyển (tab), màu xanh thống nhất theo bộ 3 */
.noi-dung-app h1 { color: var(--muc); font-weight: 800; letter-spacing: -.01em; }
.noi-dung-app h1 > i:first-child { color: var(--xanh); }
.noi-dung-app h2.font-semibold { font-weight: 800; color: var(--muc); }
.noi-dung-app .text-slate-500 { color: var(--nhat); }
.noi-dung-app .text-blue-700 { color: var(--xanh); }
.noi-dung-app .border-blue-700 { border-color: var(--xanh); }
.noi-dung-app .bg-blue-600 { background-color: var(--series-1); }
.noi-dung-app .border-b-2 { font-weight: 700; }
/* hộp thoại: bo tròn như thẻ */
.noi-dung-app .shadow-xl.bg-white { box-shadow: 0 24px 60px -20px rgb(15 42 95 / .45); }
.noi-dung-app .bg-black\/40 { background-color: rgb(15 42 95 / .35); }