/* ==========================================================
   ATOSY ERP
   INFORMATION WORKSPACE V1
   ========================================================== */

#information-full-page.hidden,
.information-detail-overlay.hidden,
#information-full-loading.hidden,
#information-full-table-wrapper.hidden {
  display: none !important;
}

body.atosy-view-information {
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(30, 112, 255, .35),
      transparent 35%
    ),
    #041f55;
}

.information-full-page {
  width: 100%;
  padding: 16px 28px 40px;
  box-sizing: border-box;
}

.information-full-hero {
  min-height: 130px;
  padding: 28px 34px;
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) 180px;
  gap: 22px;
  align-items: center;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 28px;
  color: #fff;
  background:
    linear-gradient(
      135deg,
      rgba(17,102,232,.92),
      rgba(9,55,133,.95)
    );
  box-shadow:
    0 16px 35px rgba(0,25,80,.28);
}

.information-full-back {
  width: 62px;
  height: 62px;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 30px;
  cursor: pointer;
}

.information-full-hero-copy {
  min-width: 0;
}

.information-full-eyebrow,
.information-classification-eyebrow {
  color: #b8d5ff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .18em;
}

.information-full-hero h1 {
  margin: 8px 0 5px;
  font-size: 38px;
  line-height: 1;
}

.information-full-hero h1 span {
  margin-left: 8px;
  color: #b7d2ff;
  font-size: 22px;
}

.information-full-hero p {
  margin: 0;
  color: #d5e5ff;
  font-size: 15px;
}

.information-full-total {
  padding: 18px 20px;
  text-align: center;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 21px;
  background: rgba(255,255,255,.10);
}

.information-full-total span {
  display: block;
  color: #d3e4ff;
  font-size: 12px;
}

.information-full-total strong {
  display: block;
  margin-top: 5px;
  font-size: 32px;
}

.information-full-toolbar {
  margin-top: 18px;
  padding: 14px;
  display: grid;
  grid-template-columns: minmax(300px, 1fr) auto auto;
  gap: 14px;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 25px;
  background: rgba(8,65,157,.88);
}

.information-full-search {
  min-height: 54px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 18px;
}

.information-full-search span {
  color: #fff;
}

.information-full-search input {
  width: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  color: #fff;
  font-size: 16px;
}

.information-full-search input::placeholder {
  color: #bcd3f6;
}

.information-full-refresh,
.information-full-add {
  padding: 0 22px;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 18px;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

.information-full-refresh {
  background: rgba(255,255,255,.08);
}

.information-full-add {
  background: #10b832;
  border-color: #10b832;
}

.information-full-layout {
  margin-top: 20px;
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    350px;
  gap: 20px;
  align-items: start;
}

.information-full-card {
  min-width: 0;
  overflow: hidden;
  border-radius: 28px;
  background: #fff;
  box-shadow:
    0 18px 38px rgba(0,24,72,.25);
}

.information-full-card-header {
  min-height: 74px;
  padding: 0 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #08418f;
  border-bottom: 1px solid #d8e6f7;
}

.information-full-card-header > strong {
  font-size: 22px;
}

.information-full-page-size {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #517093;
  font-size: 13px;
}

.information-full-page-size select {
  padding: 8px 12px;
  border: 1px solid #c9d9eb;
  border-radius: 10px;
  background: #fff;
}

.information-full-loading {
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: #4d6d90;
}

.information-full-spinner {
  width: 24px;
  height: 24px;
  border: 3px solid #d7e4f4;
  border-top-color: #1573e9;
  border-radius: 50%;
  animation:
    information-spin .8s linear infinite;
}

@keyframes information-spin {
  to {
    transform: rotate(360deg);
  }
}

.information-full-table-wrapper {
  width: 100%;
  overflow: auto;
}

.information-full-table {
  width: 100%;
  min-width: 1050px;
  border-collapse: collapse;
  table-layout: fixed;
}

.information-full-table th {
  padding: 16px 14px;
  text-align: left;
  color: #507091;
  background: #eaf4ff;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.information-full-table td {
  padding: 14px;
  border-bottom: 1px solid #edf2f7;
  color: #304d6d;
  vertical-align: middle;
}

.information-full-table tbody tr:hover {
  background: #f7fbff;
}

.information-full-table th:nth-child(1),
.information-full-table td:nth-child(1) {
  width: 130px;
}

.information-full-table th:nth-child(2),
.information-full-table td:nth-child(2) {
  width: 70px;
}

.information-full-table th:nth-child(3),
.information-full-table td:nth-child(3) {
  width: 220px;
}

.information-full-table th:nth-child(4),
.information-full-table td:nth-child(4) {
  width: 300px;
}

.information-full-table th:nth-child(5),
.information-full-table td:nth-child(5) {
  width: 180px;
}

.information-full-table th:nth-child(6),
.information-full-table td:nth-child(6) {
  width: 90px;
}

.information-full-table th:nth-child(7),
.information-full-table td:nth-child(7) {
  width: 55px;
}

.information-full-code {
  color: #0867d7;
}

.information-full-subject,
.information-full-content,
.information-full-category {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.information-full-category {
  padding: 6px 10px;
  border-radius: 999px;
  background: #eff5fb;
  color: #647d98;
  font-size: 12px;
}

.information-full-drive {
  color: #0867d7;
  text-decoration: none;
  font-weight: 700;
}

.information-full-drive-empty {
  color: #9aabbc;
}

.information-full-row-action {
  width: 34px;
  height: 34px;
  border: 1px solid #c8d9ec;
  border-radius: 11px;
  background: #fff;
  color: #116bd4;
  font-size: 22px;
  cursor: pointer;
}

.information-full-empty,
.information-full-error {
  padding: 60px !important;
  text-align: center !important;
}

.information-full-error {
  color: #b3261e !important;
}

.information-full-pagination {
  min-height: 68px;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
  color: #67809b;
  font-size: 13px;
}

.information-full-pagination > :last-child {
  text-align: right;
}

.information-full-pagination-control {
  display: flex;
  align-items: center;
  gap: 10px;
}

.information-full-pagination-control button {
  width: 36px;
  height: 36px;
  border: 1px solid #cad9ea;
  border-radius: 10px;
  background: #fff;
  color: #0c61c1;
  cursor: pointer;
}

.information-full-pagination-control button:disabled {
  opacity: .35;
  cursor: default;
}

.information-classification-panel {
  position: sticky;
  top: 96px;
  max-height: calc(100vh - 120px);
  padding: 24px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 28px;
  color: #fff;
  background:
    linear-gradient(
      160deg,
      #0a4ca3,
      #063370
    );
  box-shadow:
    0 18px 38px rgba(0,24,72,.25);
}

.information-classification-title-row {
  margin-top: 8px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.information-classification-title-row h2 {
  margin: 0;
  font-size: 23px;
}

.information-classification-title-row p {
  margin: 4px 0 0;
  color: #a9c9ee;
  font-size: 12px;
}

#information-category-reset {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 23px;
  cursor: pointer;
}

.information-category-all {
  width: 100%;
  margin-top: 18px;
  padding: 14px 16px;
  display: flex;
  justify-content: space-between;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 15px;
  background: transparent;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
}

.information-category-all.is-selected {
  background: rgba(255,255,255,.12);
}

.information-category-selected {
  margin-top: 12px;
  padding: 10px 12px;
  overflow: hidden;
  border-radius: 12px;
  color: #c8ddf5;
  background: rgba(0,0,0,.12);
  font-size: 11px;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.information-category-tree {
  margin-top: 14px;
  max-height: calc(100vh - 350px);
  overflow: auto;
  padding-right: 4px;
}

.information-category-node-row {
  min-height: 42px;
  display: flex;
  align-items: center;
  border-radius: 12px;
}

.information-category-node-row:hover,
.information-category-node-row.is-selected {
  background: rgba(255,255,255,.10);
}

.information-category-toggle,
.information-category-toggle-spacer {
  width: 28px;
  flex: 0 0 28px;
}

.information-category-toggle {
  border: 0;
  background: transparent;
  color: #9fc9ff;
  font-size: 20px;
  cursor: pointer;
}

.information-category-label {
  min-width: 0;
  flex: 1;
  padding: 8px 4px;
  overflow: hidden;
  border: 0;
  background: transparent;
  color: #fff;
  text-align: left;
  font-weight: 700;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
}

.information-category-children {
  margin-left: 15px;
  padding-left: 8px;
  border-left: 1px solid rgba(255,255,255,.15);
}

.information-category-node.level-2 .information-category-label,
.information-category-node.level-3 .information-category-label,
.information-category-node.level-4 .information-category-label,
.information-category-node.level-5 .information-category-label,
.information-category-node.level-6 .information-category-label,
.information-category-node.level-7 .information-category-label,
.information-category-node.level-8 .information-category-label {
  color: #d6e7fb;
  font-weight: 600;
  font-size: 13px;
}

.information-category-loading,
.information-category-empty,
.information-category-error {
  padding: 24px 10px;
  text-align: center;
  color: #b8d4f3;
}

.information-category-error {
  color: #ffd0cc;
}

.information-detail-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  justify-content: flex-end;
}

.information-detail-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,16,45,.55);
  backdrop-filter: blur(3px);
}

.information-detail-panel {
  position: relative;
  z-index: 1;
  width: min(620px, 94vw);
  height: 100%;
  overflow: auto;
  background: #f8fbff;
  box-shadow:
    -20px 0 50px rgba(0,20,55,.25);
}

.information-detail-header {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 22px 26px;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: #fff;
  background: #08489b;
}

.information-detail-header span {
  color: #b9d4f6;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .15em;
}

.information-detail-header h2 {
  margin: 4px 0 0;
}

.information-detail-header button {
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.30);
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 24px;
  cursor: pointer;
}

.information-detail-content {
  padding: 24px;
}

.information-detail-loading,
.information-detail-error {
  padding: 40px 10px;
  text-align: center;
  color: #577494;
}

.information-detail-error {
  color: #b3261e;
}

.information-detail-hero {
  padding: 18px;
  display: flex;
  gap: 14px;
  align-items: center;
  border-radius: 18px;
  background: #eaf4ff;
}

.information-detail-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: #ff7e49;
  font-size: 22px;
  font-weight: 900;
}

.information-detail-hero strong,
.information-detail-hero span {
  display: block;
}

.information-detail-hero strong {
  color: #103e75;
  font-size: 18px;
}

.information-detail-hero span {
  margin-top: 3px;
  color: #69819b;
}

.information-detail-grid {
  margin-top: 18px;
  display: grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.information-detail-field {
  padding: 14px;
  border: 1px solid #dbe7f3;
  border-radius: 14px;
  background: #fff;
}

.information-detail-field span,
.information-detail-field strong {
  display: block;
}

.information-detail-field span {
  color: #7890a8;
  font-size: 11px;
}

.information-detail-field strong {
  margin-top: 5px;
  color: #274b71;
  word-break: break-word;
}

.information-detail-section-title {
  margin-top: 22px;
  color: #0b478e;
  font-weight: 900;
}

.information-detail-content-box {
  margin-top: 8px;
  padding: 18px;
  border: 1px solid #dce7f2;
  border-radius: 14px;
  background: #fff;
  color: #344f6b;
  line-height: 1.55;
  white-space: pre-wrap;
}

.information-detail-drive {
  margin-top: 10px;
  display: inline-block;
  padding: 12px 16px;
  border-radius: 12px;
  color: #fff;
  background: #116bd4;
  text-decoration: none;
  font-weight: 800;
}

@media (max-width: 1100px) {

  .information-full-layout {
    grid-template-columns: 1fr;
  }

  .information-classification-panel {
    position: static;
    max-height: none;
  }

  .information-category-tree {
    max-height: 420px;
  }

}

@media (max-width: 760px) {

  .information-full-page {
    padding: 10px;
  }

  .information-full-hero {
    grid-template-columns: 48px 1fr;
    padding: 20px;
  }

  .information-full-total {
    grid-column: 1 / -1;
  }

  .information-full-toolbar {
    grid-template-columns: 1fr;
  }

  .information-full-refresh,
  .information-full-add {
    min-height: 50px;
  }

  .information-detail-grid {
    grid-template-columns: 1fr;
  }

}


/* ==========================================================
   ATOSY INFORMATION
   SUBJECT UI PARITY V2
   Mục tiêu:
   - Nhìn cùng một hệ UI với Hồ sơ Chủ thể
   - Sticky toolbar
   - Sticky table title
   - Sticky column header
   - Freeze 2 cột đầu
   - Click toàn row
   ========================================================== */


/* ==========================================================
   1. GLOBAL METRICS — MATCH SUBJECT
   ========================================================== */

#information-full-page {
  --atosy-information-toolbar-top: 108px;
  --atosy-information-sticky-top: 214px;
  --atosy-information-title-height: 76px;
  --atosy-information-header-height: 58px;

  font-family: inherit;
}

#information-full-page,
#information-full-page button,
#information-full-page input,
#information-full-page select,
#information-full-page table {
  font-family: inherit;
}


/* ==========================================================
   2. PAGE WIDTH / SPACING
   ========================================================== */

#information-full-page.information-full-page {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 16px 42px 48px;
  box-sizing: border-box;
}


/* ==========================================================
   3. HERO — SAME VISUAL WEIGHT AS SUBJECT
   ========================================================== */

#information-full-page .information-full-hero {
  min-height: 132px;
  padding: 28px 36px;

  grid-template-columns:
    64px
    minmax(0, 1fr)
    180px;

  border-radius: 28px;

  box-shadow:
    0 14px 34px
    rgba(0, 25, 80, .30);
}

#information-full-page .information-full-eyebrow {
  font-size: 11px;
  line-height: 1.2;
  font-weight: 800;

  letter-spacing: .18em;
}

#information-full-page .information-full-hero h1 {
  margin:
    8px
    0
    6px;

  font-size: 38px;
  line-height: 1.08;
  font-weight: 900;

  letter-spacing: -.025em;
}

#information-full-page .information-full-hero h1 span {
  margin-left: 8px;

  font-size: 22px;
  line-height: 1;

  font-weight: 800;
}

#information-full-page .information-full-hero p {
  font-size: 15px;
  line-height: 1.45;
  font-weight: 500;
}

#information-full-page .information-full-total span {
  font-size: 12px;
  font-weight: 700;
}

#information-full-page .information-full-total strong {
  font-size: 32px;
  line-height: 1.05;
  font-weight: 900;
}


/* ==========================================================
   4. TOOLBAR — SUBJECT STYLE + FREEZE
   ========================================================== */

#information-full-page .information-full-toolbar {
  position: sticky;
  top: var(
    --atosy-information-toolbar-top
  );

  z-index: 80;

  margin-top: 18px;

  min-height: 76px;

  padding:
    13px
    14px;

  grid-template-columns:
    minmax(320px, 1fr)
    auto
    auto;

  gap: 14px;

  border-radius: 25px;

  background:
    rgba(
      8,
      65,
      157,
      .97
    );

  box-shadow:
    0 10px 24px
    rgba(
      0,
      36,
      100,
      .18
    );

  backdrop-filter:
    blur(14px);

  -webkit-backdrop-filter:
    blur(14px);
}

#information-full-page .information-full-search {
  min-height: 54px;

  padding:
    0
    20px;

  border-radius: 18px;
}

#information-full-page .information-full-search span {
  font-size: 16px;
  font-weight: 800;
}

#information-full-page .information-full-search input {
  min-width: 0;

  font-size: 16px;
  line-height: 1.2;
  font-weight: 600;

  letter-spacing: -.01em;
}

#information-full-page .information-full-refresh,
#information-full-page .information-full-add {
  min-height: 54px;

  padding:
    0
    24px;

  border-radius: 18px;

  font-size: 15px;
  line-height: 1;
  font-weight: 800;

  white-space: nowrap;
}


/* ==========================================================
   5. MAIN GRID — SAME PROPORTION AS SUBJECT
   ========================================================== */

#information-full-page .information-full-layout {
  grid-template-columns:
    minmax(
      0,
      1fr
    )
    350px;

  gap: 28px;

  margin-top: 20px;

  align-items: start;
}


/* ==========================================================
   6. TABLE CARD
   ========================================================== */

#information-full-page .information-full-card {
  min-width: 0;

  overflow: visible;

  border-radius: 28px;

  background: #ffffff;

  box-shadow:
    0
    18px
    38px
    rgba(
      0,
      24,
      72,
      .25
    );
}


/* ==========================================================
   7. TABLE TITLE — STICKY
   ========================================================== */

#information-full-page .information-full-card-header {
  position: sticky;

  top:
    var(
      --atosy-information-sticky-top
    );

  z-index: 50;

  min-height:
    var(
      --atosy-information-title-height
    );

  height:
    var(
      --atosy-information-title-height
    );

  padding:
    0
    30px;

  border-bottom:
    1px
    solid
    #dce8f5;

  border-radius:
    28px
    28px
    0
    0;

  background:
    rgba(
      255,
      255,
      255,
      .985
    );

  box-shadow:
    0
    5px
    14px
    rgba(
      17,
      54,
      95,
      .06
    );

  backdrop-filter:
    blur(14px);

  -webkit-backdrop-filter:
    blur(14px);
}

#information-full-page
.information-full-card-header
> strong {

  color: #08418f;

  font-size: 28px;
  line-height: 1.1;
  font-weight: 900;

  letter-spacing:
    -.025em;
}

#information-full-page
.information-full-page-size {

  gap: 12px;

  font-size: 14px;
  line-height: 1;
  font-weight: 600;

  color: #617a96;
}

#information-full-page
.information-full-page-size
select {

  min-width: 64px;

  padding:
    9px
    12px;

  border-radius: 10px;

  font-size: 14px;
  font-weight: 700;
}


/* ==========================================================
   8. TABLE WRAPPER
   ========================================================== */

#information-full-page
.information-full-table-wrapper {

  width: 100%;

  overflow:
    auto
    visible;

  scrollbar-gutter:
    stable;
}


/* ==========================================================
   9. TABLE TYPOGRAPHY — MATCH SUBJECT
   ========================================================== */

#information-full-page
.information-full-table {

  width: 100%;

  min-width: 1180px;

  border-collapse:
    separate;

  border-spacing:
    0;

  table-layout:
    fixed;

  color: #163e6c;

  font-size: 15px;
  line-height: 1.35;
}


/* ==========================================================
   10. COLUMN HEADER — STICKY
   ========================================================== */

#information-full-page
.information-full-table
thead
th {

  position: sticky;

  top:
    calc(
      var(
        --atosy-information-sticky-top
      )
      +
      var(
        --atosy-information-title-height
      )
    );

  z-index: 40;

  height:
    var(
      --atosy-information-header-height
    );

  box-sizing:
    border-box;

  padding:
    0
    18px;

  vertical-align:
    middle;

  border-bottom:
    1px
    solid
    #d6e5f5;

  background:
    #e8f3ff;

  color:
    #527391;

  font-size:
    14px;

  line-height:
    1.2;

  font-weight:
    800;

  text-transform:
    uppercase;

  letter-spacing:
    .035em;

  white-space:
    nowrap;

  box-shadow:
    0
    2px
    0
    rgba(
      19,
      78,
      137,
      .03
    );
}


/* ==========================================================
   11. TABLE BODY — SUBJECT ROW SIZE
   ========================================================== */

#information-full-page
.information-full-table
tbody
tr {

  position: relative;

  height: 66px;

  cursor: pointer;

  outline: none;

  transition:
    background-color
    .14s
    ease,
    box-shadow
    .14s
    ease;
}

#information-full-page
.information-full-table
tbody
td {

  height: 66px;

  box-sizing: border-box;

  padding:
    14px
    18px;

  border-bottom:
    1px
    solid
    #e6eef7;

  vertical-align:
    middle;

  background:
    #ffffff;

  color:
    #163e6c;

  font-size:
    15px;

  line-height:
    1.35;

  font-weight:
    600;
}

#information-full-page
.information-full-table
tbody
tr:hover
td {

  background:
    #f4f9ff;
}

#information-full-page
.information-full-table
tbody
tr:focus-visible
td {

  background:
    #edf6ff;

  box-shadow:
    inset
    0
    0
    0
    2px
    rgba(
      22,
      108,
      220,
      .30
    );
}


/* ==========================================================
   12. COLUMN WIDTHS
   ========================================================== */

#information-full-page
.information-full-table
th:nth-child(1),

#information-full-page
.information-full-table
td:nth-child(1) {

  width: 150px;
  min-width: 150px;
  max-width: 150px;
}

#information-full-page
.information-full-table
th:nth-child(2),

#information-full-page
.information-full-table
td:nth-child(2) {

  width: 86px;
  min-width: 86px;
  max-width: 86px;
}

#information-full-page
.information-full-table
th:nth-child(3),

#information-full-page
.information-full-table
td:nth-child(3) {

  width: 255px;
}

#information-full-page
.information-full-table
th:nth-child(4),

#information-full-page
.information-full-table
td:nth-child(4) {

  width: 330px;
}

#information-full-page
.information-full-table
th:nth-child(5),

#information-full-page
.information-full-table
td:nth-child(5) {

  width: 210px;
}

#information-full-page
.information-full-table
th:nth-child(6),

#information-full-page
.information-full-table
td:nth-child(6) {

  width: 100px;
}


/* ==========================================================
   13. FREEZE COLUMN 1
   ========================================================== */

#information-full-page
.information-full-table
th:nth-child(1),

#information-full-page
.information-full-table
td:nth-child(1) {

  position: sticky;

  left: 0;
}

#information-full-page
.information-full-table
th:nth-child(1) {

  z-index: 47;

  background:
    #e8f3ff;
}

#information-full-page
.information-full-table
td:nth-child(1) {

  z-index: 7;

  background:
    #ffffff;

  box-shadow:
    1px
    0
    0
    #e6eef7;
}


/* ==========================================================
   14. FREEZE COLUMN 2
   ========================================================== */

#information-full-page
.information-full-table
th:nth-child(2),

#information-full-page
.information-full-table
td:nth-child(2) {

  position: sticky;

  left: 150px;
}

#information-full-page
.information-full-table
th:nth-child(2) {

  z-index: 46;

  background:
    #e8f3ff;
}

#information-full-page
.information-full-table
td:nth-child(2) {

  z-index: 6;

  background:
    #ffffff;

  box-shadow:
    2px
    0
    4px
    rgba(
      28,
      71,
      114,
      .06
    );
}

#information-full-page
.information-full-table
tbody
tr:hover
td:nth-child(1),

#information-full-page
.information-full-table
tbody
tr:hover
td:nth-child(2) {

  background:
    #f4f9ff;
}


/* ==========================================================
   15. CELL TYPOGRAPHY
   ========================================================== */

#information-full-page
.information-full-code {

  color:
    #0867d7;

  font-size:
    15px;

  line-height:
    1.2;

  font-weight:
    800;
}

#information-full-page
.information-full-subject {

  color:
    #173e6b;

  font-size:
    15px;

  line-height:
    1.35;

  font-weight:
    700;
}

#information-full-page
.information-full-content {

  color:
    #294d72;

  font-size:
    15px;

  line-height:
    1.35;

  font-weight:
    500;
}

#information-full-page
.information-full-category {

  display:
    inline-flex;

  max-width:
    100%;

  align-items:
    center;

  min-height:
    30px;

  padding:
    5px
    11px;

  border-radius:
    999px;

  background:
    #eaf1f8;

  color:
    #607894;

  font-size:
    12px;

  line-height:
    1.2;

  font-weight:
    700;
}

#information-full-page
.information-full-drive {

  font-size:
    13px;

  font-weight:
    800;
}


/* ==========================================================
   16. HIDE ACTION COLUMN
   CLICK CẢ ROW THAY THẾ HOÀN TOÀN
   ========================================================== */

#information-full-page
.information-full-table
th:nth-child(7),

#information-full-page
.information-full-table
td:nth-child(7) {

  display:
    none
    !important;
}

#information-full-page
.information-full-row-action {

  display:
    none
    !important;
}


/* ==========================================================
   17. PAGINATION — MATCH SUBJECT
   ========================================================== */

#information-full-page
.information-full-pagination {

  min-height:
    72px;

  padding:
    0
    28px;

  border-radius:
    0
    0
    28px
    28px;

  background:
    #ffffff;

  color:
    #647f9b;

  font-size:
    14px;

  line-height:
    1;

  font-weight:
    600;
}

#information-full-page
.information-full-pagination-control {

  gap:
    12px;
}

#information-full-page
.information-full-pagination-control
button {

  width:
    42px;

  height:
    42px;

  border-radius:
    12px;

  font-size:
    18px;

  font-weight:
    800;
}

#information-full-page
.information-full-page-number {

  min-width:
    54px;

  text-align:
    center;

  color:
    #526f90;

  font-weight:
    700;
}


/* ==========================================================
   18. CLASSIFICATION PANEL — SUBJECT PROPORTIONS
   ========================================================== */

#information-full-page
.information-classification-panel {

  position:
    sticky;

  top:
    var(
      --atosy-information-sticky-top
    );

  z-index:
    35;

  width:
    100%;

  min-width:
    0;

  max-height:
    calc(
      100vh
      -
      var(
        --atosy-information-sticky-top
      )
      -
      20px
    );

  box-sizing:
    border-box;

  padding:
    28px
    28px
    24px;

  overflow:
    hidden;

  border-radius:
    28px;

  box-shadow:
    0
    18px
    38px
    rgba(
      0,
      24,
      72,
      .25
    );
}

#information-full-page
.information-classification-eyebrow {

  font-size:
    11px;

  line-height:
    1;

  font-weight:
    900;

  letter-spacing:
    .18em;
}

#information-full-page
.information-classification-title-row {

  margin-top:
    10px;

  align-items:
    center;
}

#information-full-page
.information-classification-title-row
h2 {

  margin:
    0;

  font-size:
    24px;

  line-height:
    1.12;

  font-weight:
    900;

  letter-spacing:
    -.025em;
}


/* Subject không cần dòng phụ gây cảm giác khác module */
#information-full-page
.information-classification-title-row
p {

  display:
    none;
}

#information-full-page
#information-category-reset {

  width:
    48px;

  height:
    48px;

  flex:
    0
    0
    48px;

  font-size:
    24px;

  font-weight:
    700;
}

#information-full-page
.information-category-all {

  min-height:
    54px;

  margin-top:
    22px;

  padding:
    0
    18px;

  align-items:
    center;

  border-radius:
    15px;

  font-size:
    16px;

  line-height:
    1;

  font-weight:
    800;
}

#information-full-page
.information-category-all
strong {

  min-width:
    46px;

  padding:
    6px
    11px;

  border-radius:
    999px;

  background:
    rgba(
      255,
      255,
      255,
      .12
    );

  text-align:
    center;

  font-size:
    15px;

  font-weight:
    900;
}

#information-full-page
.information-category-selected {

  min-height:
    40px;

  box-sizing:
    border-box;

  margin-top:
    12px;

  padding:
    11px
    14px;

  border-radius:
    12px;

  font-size:
    12px;

  line-height:
    1.35;

  font-weight:
    600;
}

#information-full-page
.information-category-tree {

  margin-top:
    14px;

  max-height:
    calc(
      100vh
      -
      var(
        --atosy-information-sticky-top
      )
      -
      250px
    );

  overflow:
    auto;

  padding-right:
    5px;
}


/* ==========================================================
   19. CLASSIFICATION ROWS
   ========================================================== */

#information-full-page
.information-category-node-row {

  min-height:
    54px;

  margin-bottom:
    6px;

  border-radius:
    15px;
}

#information-full-page
.information-category-toggle,
#information-full-page
.information-category-toggle-spacer {

  width:
    34px;

  flex:
    0
    0
    34px;
}

#information-full-page
.information-category-toggle {

  font-size:
    19px;

  font-weight:
    800;
}

#information-full-page
.information-category-label {

  padding:
    10px
    7px;

  color:
    #ffffff;

  font-size:
    15px;

  line-height:
    1.25;

  font-weight:
    750;
}

#information-full-page
.information-category-node.level-1
.information-category-label {

  font-size:
    16px;

  font-weight:
    800;
}

#information-full-page
.information-category-node.level-2
.information-category-label {

  font-size:
    15px;

  font-weight:
    700;
}

#information-full-page
.information-category-node.level-3
.information-category-label,

#information-full-page
.information-category-node.level-4
.information-category-label,

#information-full-page
.information-category-node.level-5
.information-category-label,

#information-full-page
.information-category-node.level-6
.information-category-label,

#information-full-page
.information-category-node.level-7
.information-category-label,

#information-full-page
.information-category-node.level-8
.information-category-label {

  font-size:
    14px;

  font-weight:
    650;
}

#information-full-page
.information-category-node-row.is-selected {

  background:
    rgba(
      104,
      159,
      230,
      .46
    );
}

#information-full-page
.information-category-node-row:hover {

  background:
    rgba(
      255,
      255,
      255,
      .10
    );
}


/* ==========================================================
   20. DETAIL PANEL TYPOGRAPHY
   ========================================================== */

#information-full-page
.information-detail-header
h2 {

  font-size:
    23px;

  line-height:
    1.15;

  font-weight:
    900;
}

#information-full-page
.information-detail-field
span {

  font-size:
    12px;

  font-weight:
    600;
}

#information-full-page
.information-detail-field
strong {

  font-size:
    15px;

  line-height:
    1.4;

  font-weight:
    700;
}


/* ==========================================================
   21. RESPONSIVE
   ========================================================== */

@media (
  max-width:
  1100px
) {

  #information-full-page
  .information-full-layout {

    grid-template-columns:
      1fr;
  }


  #information-full-page
  .information-classification-panel {

    position:
      relative;

    top:
      auto;

    max-height:
      none;
  }


  #information-full-page
  .information-category-tree {

    max-height:
      460px;
  }

}


@media (
  max-width:
  760px
) {

  #information-full-page {

    --atosy-information-toolbar-top:
      92px;

    --atosy-information-sticky-top:
      190px;

    --atosy-information-title-height:
      70px;
  }


  #information-full-page.information-full-page {

    padding:
      10px;
  }


  #information-full-page
  .information-full-toolbar {

    grid-template-columns:
      1fr;

    position:
      relative;

    top:
      auto;
  }


  #information-full-page
  .information-full-card-header,

  #information-full-page
  .information-full-table
  thead
  th {

    position:
      static;
  }

}


/* ==========================================================
   ATOSY INFORMATION
   SINGLE VIEW FIX V3
   Information phải là workspace độc lập giống Subject.
   Không được render nối tiếp phía dưới Dashboard.
   ========================================================== */


/* ==========================================================
   1. INFORMATION PAGE PHẢI LÀ WORKSPACE CHÍNH
   ========================================================== */

body.atosy-view-information
#information-full-page {

  display:
    block
    !important;

  width:
    100%
    !important;

  min-height:
    calc(
      100vh
      -
      92px
    );

  margin:
    0
    !important;

  box-sizing:
    border-box;
}


/* ==========================================================
   2. ẨN DASHBOARD V2
   ========================================================== */

body.atosy-view-information
#atosy-dashboard-v2 {

  display:
    none
    !important;
}


/* ==========================================================
   3. ẨN MODULE GRID CŨ
   ========================================================== */

body.atosy-view-information
#module-grid {

  display:
    none
    !important;
}


/* ==========================================================
   4. ẨN CÁC DASHBOARD WORKSPACE CŨ
   Không đụng header / nav / sidebar.
   ========================================================== */

body.atosy-view-information
.dashboard-page,

body.atosy-view-information
.dashboard-v2,

body.atosy-view-information
.dashboard-content,

body.atosy-view-information
.dashboard-main,

body.atosy-view-information
.dashboard-workspace,

body.atosy-view-information
.dashboard-section,

body.atosy-view-information
.dashboard-grid {

  display:
    none
    !important;
}


/* ==========================================================
   5. ẨN SUBJECT / BPMN NẾU ĐÃ TỒN TẠI TRONG DOM
   ========================================================== */

body.atosy-view-information
#subject-full-page,

body.atosy-view-information
#bpmn-workspace,

body.atosy-view-information
.bpmn-workspace {

  display:
    none
    !important;
}


/* ==========================================================
   6. INFORMATION KHÔNG BỊ ĐẨY XUỐNG SAU DASHBOARD
   ========================================================== */

body.atosy-view-information
.app-main {

  min-height:
    calc(
      100vh
      -
      92px
    );

  padding-bottom:
    0
    !important;
}


/* ==========================================================
   7. FOOTER DASHBOARD KHÔNG ĐƯỢC NẰM TRƯỚC INFORMATION
   Chỉ target footer nằm trong vùng main.
   ========================================================== */

body.atosy-view-information
.app-main
> footer,

body.atosy-view-information
.app-main
.footer,

body.atosy-view-information
.app-main
.dashboard-footer,

body.atosy-view-information
.app-main
.atocy-footer,

body.atosy-view-information
.app-main
.atosy-footer {

  display:
    none
    !important;
}


/* ==========================================================
   8. INFORMATION LUÔN BẮT ĐẦU NGAY DƯỚI TOP NAV
   ========================================================== */

body.atosy-view-information
#information-full-page.information-full-page {

  position:
    relative;

  z-index:
    1;

  margin-top:
    0
    !important;
}


/* ==========================================================
   9. SAFETY:
   hidden vẫn phải thắng khi thực sự đóng workspace
   ========================================================== */

body.atosy-view-information
#information-full-page.hidden {

  display:
    none
    !important;
}

/* T28 TABLE HEADER ATTACH FIX START */
/*
  Mục tiêu:
  - header cột không lơ lửng giữa bảng
  - header dính sát phần đầu bảng
  - giữ freeze cột / sticky hiện có, chỉ override phần top
*/
body.atosy-view-information .information-full-table thead,
body.atosy-view-information .information-full-table thead tr {
  position: sticky !important;
  top: 0 !important;
  z-index: 28 !important;
  transform: none !important;
}

body.atosy-view-information .information-full-table thead th {
  position: sticky !important;
  top: 0 !important;
  z-index: 30 !important;
  transform: none !important;
  vertical-align: middle !important;
}

body.atosy-view-information .information-full-table thead th:nth-child(1),
body.atosy-view-information .information-full-table thead th:nth-child(2) {
  top: 0 !important;
  z-index: 34 !important;
}

body.atosy-view-information .information-full-table tbody tr {
  scroll-margin-top: 0 !important;
}
/* T28 TABLE HEADER ATTACH FIX END */