/* TRỢ GIÚP THEO MÀN (trogiup.js · trogiup-tour.js) — 12/10/2026. Chép khuôn COS (cos_huong_dan.css): chữ lớn, nút ≥ 40px,
   không dựa vào màu một mình. Màu lấy theo biến của quanly.html / hocsinh.html (--muc-*, --n-*). Mọi nút ở đây khai
   width/margin tường minh: hocsinh.html đặt `button{width:100%;margin-bottom}` toàn cục. */
.tg-hang{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 var(--k4,16px)}
.tg-hang button,.tg-hop button,.tg-bang button{width:auto;margin:0;min-height:40px;font-size:15px;line-height:1.2;padding:8px 14px;
  border-radius:8px;cursor:pointer;font-family:inherit;font-weight:600;box-shadow:none}
.tg-hang button{background:var(--trang,#fff);color:var(--muc-700,#155741);border:1px solid var(--muc-400,#5aa387)}
.tg-hang button:hover{background:var(--muc-50,#f0f7f3)}
.tg-hang button[aria-pressed="true"]{background:var(--muc-600,#1a6b52);color:#fff}
.tg-tt{font-size:13px;color:var(--n-600,#4e5c56);margin:-8px 0 12px}
/* Nút nổi 💬 — đứng TRÊN nút Báo lỗi (bao-loi.js: right 18, bottom 18; điện thoại 10/10) */
#tg-nut{position:fixed;right:18px;bottom:72px;z-index:2147482900;display:inline-flex;align-items:center;gap:7px;width:max-content;
  white-space:nowrap;margin:0;border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:10px 16px;font-size:14px;font-weight:600;
  cursor:pointer;line-height:1.2;max-height:40px;background:var(--muc-600,#1a6b52);color:#fff;box-shadow:0 6px 20px rgba(13,43,33,.26);font-family:inherit}
#tg-nut:hover{background:var(--muc-700,#155741)}
#tg-nut:focus-visible{outline:2px solid var(--muc-400,#5aa387);outline-offset:2px}
@media(max-width:520px){#tg-nut{right:10px;bottom:62px;padding:10px 14px;font-size:13.5px}}
/* Hộp hỏi hoặc tour đang mở thì giấu nút nổi: nó đè lên ô nhập ở 390px (đo 12/10) và lúc đó cũng vô dụng */
body.tg-hop-mo #tg-nut,body.tg-dang-chi #tg-nut{display:none}
/* Hộp hỏi: tấm dưới trên điện thoại, hộp giữa trên máy bàn */
#tg-nen{position:fixed;inset:0;z-index:2147482950;background:rgba(10,20,16,.55);display:flex;align-items:flex-end;justify-content:center;padding:0}
@media(min-width:600px){#tg-nen{align-items:center;padding:20px}}
.tg-hop{background:#fff;width:100%;max-width:600px;max-height:92vh;overflow:auto;border-radius:16px 16px 0 0;padding:16px 18px 18px;
  color:var(--n-900,#131a17);font-size:15px;line-height:1.5;box-sizing:border-box;font-family:inherit}
@media(min-width:600px){.tg-hop{border-radius:16px}}
@media(max-width:599px){.tg-hop{padding-bottom:64px}}   /* chừa chỗ cho nút Báo lỗi nổi ở góc dưới, không đè lên dòng chữ cuối */
.tg-dau{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.tg-dau h3{margin:0;font-size:18px;color:var(--muc-900,#0d2b21)}
.tg-dong{width:36px !important;height:36px;min-height:36px !important;padding:0 !important;border-radius:50% !important;border:none;background:var(--n-100,#eef3f0);color:var(--n-700,#384540);font-size:16px}
.tg-phu{color:var(--n-600,#4e5c56);font-size:13px;margin:0 0 10px}
.tg-viec{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 12px}
.tg-viec button{background:var(--muc-50,#f0f7f3);color:var(--muc-800,#12402f);border:1px solid var(--muc-100,#d9ede3);font-weight:500;font-size:14px}
.tg-viec button:hover{background:var(--muc-100,#d9ede3)}
.tg-khung{display:flex;flex-direction:column;gap:8px;max-height:44vh;overflow-y:auto;margin:0 0 10px;padding:2px}
.tg-b{padding:10px 13px;border-radius:12px;max-width:92%;font-size:15px;line-height:1.5;white-space:pre-wrap}
.tg-b.hs{background:var(--muc-600,#1a6b52);color:#fff;align-self:flex-end}
.tg-b.ai{background:var(--n-100,#eef3f0);align-self:flex-start}
.tg-b.loi{background:var(--nguy-nen,#fbe7e3);color:var(--nguy,#a8321f);align-self:flex-start}
.tg-b-nut{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tg-b-nut button{min-height:34px;font-size:13.5px;padding:6px 11px;background:#fff;color:var(--muc-700,#155741);border:1px solid var(--muc-400,#5aa387);font-weight:600}
.tg-b-nut button.tg-chi{background:var(--muc-600,#1a6b52);color:#fff;border-color:transparent}
.tg-b-nut button:disabled{opacity:.55;cursor:default}
.tg-b-nut .tg-da{font-size:13px;color:var(--n-600,#4e5c56);align-self:center}
.tg-nhap{display:flex;gap:8px;align-items:flex-end}
.tg-nhap textarea{flex:1;width:auto;min-height:48px;max-height:140px;resize:vertical;margin:0;font-size:16px;padding:10px;border:1px solid var(--n-300,#c2cfc9);border-radius:10px;font-family:inherit}
.tg-nhap button{background:var(--muc-600,#1a6b52);color:#fff;border:1px solid transparent}
.tg-nhap button:disabled{background:var(--n-200,#dde5e0);color:var(--n-500,#64736c);cursor:wait}
.tg-ghi{font-size:12.5px;color:var(--n-500,#64736c);margin:8px 0 0}
/* Chỉ từng bước: lớp tối KHÔNG chặn chuột (pointer-events:none), nút sáng bấm xuyên được. Dưới nút Báo lỗi (z 2147483000) một bậc. */
.tg-tour{display:none}
.tg-tour.mo{display:block}
.tg-lo{position:fixed;z-index:2147482800;border:3px solid #f2c14e;border-radius:12px;pointer-events:none;
  box-shadow:0 0 0 9999px rgba(0,0,0,.62),0 0 16px 4px rgba(242,193,78,.7);transition:left .2s,top .2s,width .2s,height .2s}
.tg-lo[hidden]{display:none}
.tg-bang{position:fixed;z-index:2147482810;left:50%;bottom:16px;transform:translateX(-50%);width:min(560px,calc(100vw - 32px));
  padding:14px 16px;border:1px solid #f2c14e;border-radius:14px;background:#fff;color:var(--n-900,#131a17);box-shadow:0 8px 32px rgba(0,0,0,.5);font-family:inherit}
.tg-bang.tren{bottom:auto;top:16px}
.tg-b-dau{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px}
.tg-b-nhan{font-size:.95rem;color:var(--muc-700,#155741)}
.tg-b-dem{font-size:13px;color:var(--n-600,#4e5c56)}
.tg-b-chu{font-size:1.1rem;line-height:1.55;margin:4px 0 12px;font-weight:600}
.tg-bang .tg-b-nut{margin-top:0}
.tg-bang .tg-b-nut button{min-height:40px;font-size:15px;padding:8px 14px}
.tg-bang .tg-b-nut button.tg-tiep{background:var(--muc-600,#1a6b52);color:#fff;border-color:transparent}
.tg-an{display:none !important}
/* ── Khung giới thiệu đầu màn (trogiup-gioithieu.js, 18/10/2026) ── chữ ≥ 15px, nút ≥ 40px, không dựa vào màu một mình */
.view.co-gt > p.huong-dan.gt-cu{display:none}
.gt-khung{border:1px solid var(--muc-200,#cfe5da);background:var(--muc-50,#f0f7f3);border-radius:var(--r-vua,12px);
  padding:16px;margin:0 0 var(--k5,24px);color:var(--n-800,#25302b);font-size:15px;line-height:1.55}
.gt-dau{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 8px}
.gt-nhan{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--muc-700,#155741)}
.gt-khung button.gt-gon{width:auto;margin:0;min-height:40px;padding:8px 14px;border-radius:8px;cursor:pointer;
  font-family:inherit;font-size:14px;font-weight:600;line-height:1.2;box-shadow:none;
  background:var(--trang,#fff);color:var(--muc-700,#155741);border:1px solid var(--muc-400,#5aa387)}
.gt-khung button.gt-gon:hover{background:var(--muc-100,#e0efe7)}
.gt-muc{margin:16px 0 4px;font-weight:700;color:var(--n-900,#17201c)}
.gt-than > .gt-muc:first-child{margin-top:0}
.gt-la-gi{margin:0}
.gt-ai{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0 0}
.gt-ai-nhan{font-weight:600;color:var(--n-700,#36423d)}
.gt-the{display:inline-block;padding:2px 10px;border-radius:999px;background:var(--trang,#fff);border:1px solid var(--muc-200,#cfe5da);
  color:var(--muc-800,#11463a);font-size:14px}
.gt-buoc{margin:0;padding-left:24px}
.gt-buoc li{margin:0 0 4px}
.gt-co-gi{margin:16px 0 0}
.gt-co-gi summary{cursor:pointer;font-weight:600;color:var(--muc-700,#155741);padding:4px 0;line-height:1.5}
.gt-co-gi p{margin:8px 0 0}
.gt-luu-y{margin:16px 0 0;padding:8px 12px;border-left:4px solid var(--luu-vien,#e0b04a);background:var(--luu-nen,#fdf6e3);border-radius:4px}
.gt-tom{display:none;margin:0}
.gt-nut .tg-hang{margin:16px 0 0}
.gt-khung.gon .gt-than{display:none}
.gt-khung.gon .gt-tom{display:block}
.gt-khung.gon .gt-nut .tg-hang{margin-top:8px}
@media(max-width:520px){.gt-khung{padding:12px}.gt-dau{flex-wrap:wrap}}
