/* auth-gate.css — kiểu dùng chung cho khoá/làm mờ nội dung khi chưa đăng nhập.
   Nạp SAU auth.css, TRƯỚC theme-dark.css (theme-dark.css sẽ ghi đè phần tối ở cuối). */

/* QUAN TRỌNG: mọi lớp overlay bên dưới đều tự đặt sẵn "display" (flex) để có bố cục ngay
   cả khi KHÔNG có thuộc tính hidden — nhưng thuộc tính HTML `hidden` mặc định chỉ có hiệu
   lực nhờ quy tắc UA-stylesheet `[hidden]{display:none}` với độ đặc hiệu NGANG với 1 class
   selector; class riêng của element (đặt display:flex, nạp SAU trong cascade) sẽ THẮNG, khiến
   `el.hidden = true` KHÔNG thực sự ẩn được overlay trên trình duyệt thật (đã tái hiện bằng
   Playwright: JS xác nhận đã set hidden=true nhưng ảnh chụp màn hình overlay vẫn hiện — lỗi
   này ẩn toàn bộ, không riêng 1 khoá nào). Khai báo tường minh dưới đây, dùng !important để
   chắc chắn thắng bất kể thứ tự nạp.
*/
.fsi-gate-overlay[hidden],
.fsi-gate-tail[hidden] {
  display: none !important;
}

/* ---- 1) Khoá cả khối (gate) — overlay lớn ở giữa, kiểu "card" ---- */
.fsi-gate-target { position: relative; }
.fsi-gate-target.fsi-gate-blurred > *:not(.fsi-gate-overlay):not(.fsi-gate-path):not(.fsi-gate-keep):not(.fsi-gate-target),
.fsi-gate-target.fsi-gate-blurred .fsi-gate-path > *:not(.fsi-gate-overlay):not(.fsi-gate-path):not(.fsi-gate-keep):not(.fsi-gate-target) {
  filter: blur(6px);
  pointer-events: none;
  user-select: none;
}
.fsi-gate-overlay {
  position: absolute; inset: 0; z-index: 30;
  display: flex; align-items: center; justify-content: center;
  background: rgba(246, 249, 247, .55);
  cursor: pointer;
}
.fsi-gate-card {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  max-width: 280px; padding: 18px 22px; text-align: center;
  background: #fff; border: 1px solid #cde6e6; border-radius: 14px;
  box-shadow: 0 10px 28px rgba(4, 42, 45, .14);
}
.fsi-gate-card .fsi-gate-lock { font-size: 20px; }
.fsi-gate-card p { margin: 0; font: 600 12.5px/1.5 Manrope; color: #223a44; }
.fsi-gate-overlay.fsi-gate-multi { background: transparent; }
.fsi-gate-mini .fsi-gate-card p, .fsi-gate-mini .fsi-gate-card .fsi-gate-cta { display: none; }
.fsi-gate-mini .fsi-gate-card { padding: 3px 10px; }
.fsi-gate-short .fsi-gate-card { flex-direction: row; max-width: none; padding: 8px 14px; gap: 10px; }
.fsi-gate-short .fsi-gate-card p { font-size: 12px; }
.fsi-gate-short .fsi-gate-card .fsi-gate-lock { font-size: 16px; }
.fsi-gate-cta {
  margin-top: 2px; border: 0; border-radius: 8px; padding: 9px 18px;
  background: #017884; color: #fff; font: 800 12px Manrope; cursor: pointer;
}
.fsi-gate-cta:hover { background: #01666f; }

/* Biến thể "compact" — chỉ 1 icon khoá nhỏ, dùng cho ô số liệu nhỏ trong dải thống kê */
.fsi-gate-overlay-compact {
  background: rgba(246, 249, 247, .6);
  border-radius: 8px;
}
.fsi-gate-overlay-compact .fsi-gate-lock { font-size: 15px; }

/* ---- 2) Khoá "N phiên gần nhất" trên biểu đồ (phủ phần bên phải) ---- */
.fsi-gate-tail {
  position: absolute; top: 0; bottom: 0; right: 0; z-index: 15;
  background: linear-gradient(90deg, rgba(246, 249, 247, 0) 0%, rgba(246, 249, 247, .82) 22%, rgba(246, 249, 247, .94) 100%);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.fsi-gate-tail-inner {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  max-width: 88%; padding: 10px 14px; text-align: center;
  background: #fff; border: 1px solid #cde6e6; border-radius: 12px;
  box-shadow: 0 8px 20px rgba(4, 42, 45, .12);
  font: 600 11px/1.4 Manrope; color: #223a44;
}
.fsi-gate-tail-inner .fsi-gate-lock { font-size: 16px; }
.fsi-gate-tail-inner .fsi-gate-cta { margin-top: 2px; }

/* ---- 3) Khoá theo dòng trong bảng ---- */
tr.fsi-row-blur > td { filter: blur(4px); user-select: none; pointer-events: none; }
tr.fsi-lock-banner > td { padding: 0 !important; border: 0 !important; }
.fsi-lock-banner-inner {
  display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 12px; background: #f6f9f7; border-top: 1px dashed #b8dce0; border-bottom: 1px dashed #b8dce0;
  font: 600 10.5px Manrope; color: #223a44; text-align: center;
}

/* ---- 4) Khoá nút/tab đơn lẻ (year toggle, tab bảng...) ---- */
.fsi-control-locked { position: relative; opacity: .62; cursor: pointer; }
.fsi-gate-badge {
  font-style: normal; font-size: 9px; margin-left: 4px;
}

/* ---- Bảng phân quyền (26/09/2026) ---- */
/* "Ẩn hẳn" thay vì làm mờ (chọn trên Dashboard Agent) */
.fsi-gate-target.fsi-gate-hidden { display: none !important; }
/* Khoá cả 1 trang (vd Phái sinh): thẻ khoá bám đầu màn hình */
.fsi-gate-overlay-page { align-items: flex-start; padding-top: 90px; }
.fsi-gate-overlay-page .fsi-gate-card { position: sticky; top: 110px; }

@media (max-width: 520px) {
  .fsi-gate-card { max-width: 220px; padding: 14px 16px; }
  .fsi-gate-tail-inner { font-size: 10px; padding: 8px 10px; }
}