/* ==========================================================
   ATOSY INFORMATION EDIT V2
   Canonical Subject-style UI
   ========================================================== */

#information-detail-overlay
.information-edit-v2 {

  display:
    grid;

  gap:
    16px;

}


#information-detail-overlay
.information-edit-v2-intro {

  padding:
    16px 20px;

  border:
    1px solid
    rgba(255,255,255,.7);

  border-radius:
    18px;

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

  box-shadow:
    0 10px 28px
    rgba(28,68,120,.06);

  backdrop-filter:
    blur(18px);

}


#information-detail-overlay
.information-edit-v2-intro strong {

  display:
    block;

  color:
    #123d75;

  font-size:
    16px;

  font-weight:
    800;

}


#information-detail-overlay
.information-edit-v2-intro span {

  display:
    block;

  margin-top:
    3px;

  color:
    #7890aa;

  font-size:
    12px;

  font-weight:
    600;

}


#information-detail-overlay
.information-edit-v2-message {

  display:
    none;

  padding:
    10px 14px;

  border-radius:
    12px;

  font-size:
    12px;

  font-weight:
    750;

}


#information-detail-overlay
.information-edit-v2-message:not(:empty) {

  display:
    block;

  color:
    #1f6f50;

  background:
    #e9fbf3;

  border:
    1px solid
    #bdebd8;

}


#information-detail-overlay
.information-edit-v2-message.is-error {

  color:
    #b8352e;

  background:
    #fff0ed;

  border-color:
    #ffc8c1;

}


#information-detail-overlay
.information-edit-v2-card {

  overflow:
    hidden;

  border:
    1px solid
    rgba(255,255,255,.84);

  border-radius:
    20px;

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

  box-shadow:
    0 12px 34px
    rgba(18,61,117,.06);

  backdrop-filter:
    blur(20px);

}


#information-detail-overlay
.information-edit-v2-card-head {

  display:
    flex;

  align-items:
    center;

  gap:
    12px;

  padding:
    14px 18px;

  border-bottom:
    1px solid
    rgba(55,98,145,.10);

}


#information-detail-overlay
.information-edit-v2-card-icon {

  width:
    38px;

  height:
    38px;

  flex:
    0 0 38px;

  display:
    grid;

  place-items:
    center;

  border-radius:
    11px;

  color:
    #fff;

  font-size:
    15px;

  font-weight:
    850;

  box-shadow:
    0 7px 16px
    rgba(26,84,170,.18);

}


#information-detail-overlay
.information-edit-v2-card-head strong {

  display:
    block;

  color:
    #153c70;

  font-size:
    15px;

  font-weight:
    800;

}


#information-detail-overlay
.information-edit-v2-card-head span {

  display:
    block;

  margin-top:
    2px;

  color:
    #8196ae;

  font-size:
    11px;

  font-weight:
    600;

}


#information-detail-overlay
.information-edit-v2-card-body {

  padding:
    16px 18px 18px;

}


#information-detail-overlay
.information-edit-v2-grid {

  display:
    grid;

  grid-template-columns:
    repeat(2, minmax(0,1fr));

  gap:
    14px;

}


#information-detail-overlay
.information-edit-v2-field {

  min-width:
    0;

  display:
    grid;

  gap:
    6px;

}


#information-detail-overlay
.information-edit-v2-field.is-full {

  grid-column:
    1 / -1;

}


#information-detail-overlay
.information-edit-v2-label {

  color:
    #7087a2;

  font-size:
    11px;

  font-weight:
    750;

}


#information-detail-overlay
.information-edit-v2-field input,

#information-detail-overlay
.information-edit-v2-field textarea {

  width:
    100%;

  box-sizing:
    border-box;

  padding:
    12px 14px;

  border:
    1px solid
    #c9daee;

  border-radius:
    13px;

  outline:
    none;

  color:
    #123d75;

  background:
    rgba(248,251,255,.92);

  font:
    inherit;

  font-size:
    13px;

  font-weight:
    650;

  transition:
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease;

}


#information-detail-overlay
.information-edit-v2-field textarea {

  resize:
    vertical;

  line-height:
    1.55;

}


#information-detail-overlay
.information-edit-v2-field input:focus,

#information-detail-overlay
.information-edit-v2-field textarea:focus {

  border-color:
    #5c9fff;

  background:
    #fff;

  box-shadow:
    0 0 0 4px
    rgba(44,125,240,.10);

}


#information-detail-overlay
.information-edit-v2-field input[readonly] {

  color:
    #7890aa;

  background:
    #edf3fa;

  cursor:
    default;

}


#information-detail-overlay
.information-edit-v2-card.tone-blue
.information-edit-v2-card-icon {

  background:
    #287eea;

}


#information-detail-overlay
.information-edit-v2-card.tone-green
.information-edit-v2-card-icon {

  background:
    #12ad83;

}


#information-detail-overlay
.information-edit-v2-card.tone-purple
.information-edit-v2-card-icon {

  background:
    #8054e8;

}


#information-detail-overlay
.information-edit-v2-card.tone-orange
.information-edit-v2-card-icon {

  background:
    #ed8540;

}


#information-detail-overlay
.information-edit-v2-card.tone-cyan
.information-edit-v2-card-icon {

  background:
    #1896b8;

}


/* ----------------------------------------------------------
   HERO ACTIONS — DIRECT, NO MOVING DOM
   ---------------------------------------------------------- */

#information-detail-overlay
.information-edit-v2-cancel,

#information-detail-overlay
.information-edit-v2-save {

  height:
    38px;

  min-height:
    38px;

  padding:
    0 14px;

  border-radius:
    999px;

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  font-family:
    inherit;

  font-size:
    12px;

  line-height:
    1;

  font-weight:
    750;

  white-space:
    nowrap;

  cursor:
    pointer;

}


#information-detail-overlay
.information-edit-v2-cancel {

  color:
    #fff;

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

  border:
    1px solid
    rgba(255,255,255,.28);

}


#information-detail-overlay
.information-edit-v2-save {

  color:
    #fff;

  background:
    #19b978;

  border:
    1px solid
    rgba(255,255,255,.36);

  box-shadow:
    0 6px 16px
    rgba(0,100,60,.20);

}


#information-detail-overlay
.information-edit-v2-save:disabled {

  opacity:
    .72;

  cursor:
    wait;

}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

  #information-detail-overlay
  .information-edit-v2-grid {

    grid-template-columns:
      1fr;

  }


  #information-detail-overlay
  .information-edit-v2-field.is-full {

    grid-column:
      auto;

  }

}


/* ==========================================================
   T145 — INFORMATION EDIT V2 / SUBJECT UI PARITY
   ========================================================== */


/* ----------------------------------------------------------
   HERO EDIT STATE
   ---------------------------------------------------------- */

#information-detail-overlay.information-edit-v2-active
.information-detail-header {

  position:
    relative !important;

  min-height:
    156px !important;

  padding:
    22px 250px 20px 24px !important;

  box-sizing:
    border-box !important;

  overflow:
    hidden !important;

}


/*
 * Chỉ hero Subject-style circle lớn phía phải.
 * Tuyệt đối không tạo avatar A trong action cluster.
 */

#information-detail-overlay
.information-detail-header-actions::before,

#information-detail-overlay
.information-detail-header-actions::after {

  content:
    none !important;

  display:
    none !important;

}


/* ----------------------------------------------------------
   ACTION CLUSTER = HỦY | LƯU | X
   ---------------------------------------------------------- */

#information-detail-overlay
.information-detail-header-actions {

  position:
    absolute !important;

  top:
    22px !important;

  right:
    24px !important;

  left:
    auto !important;

  bottom:
    auto !important;

  width:
    auto !important;

  height:
    auto !important;

  min-width:
    0 !important;

  min-height:
    0 !important;

  margin:
    0 !important;

  padding:
    0 !important;

  display:
    flex !important;

  flex-direction:
    row !important;

  flex-wrap:
    nowrap !important;

  align-items:
    center !important;

  justify-content:
    flex-end !important;

  gap:
    8px !important;

  background:
    transparent !important;

  border:
    0 !important;

  box-shadow:
    none !important;

  transform:
    none !important;

  z-index:
    20 !important;

}


/* ----------------------------------------------------------
   HỦY + LƯU
   ---------------------------------------------------------- */

#information-detail-overlay
.information-edit-v2-cancel,

#information-detail-overlay
.information-edit-v2-save {

  position:
    static !important;

  inset:
    auto !important;

  width:
    auto !important;

  min-width:
    64px !important;

  max-width:
    none !important;

  height:
    44px !important;

  min-height:
    44px !important;

  max-height:
    44px !important;

  margin:
    0 !important;

  padding:
    0 16px !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  gap:
    6px !important;

  border-radius:
    15px !important;

  font-family:
    inherit !important;

  font-size:
    13px !important;

  line-height:
    1 !important;

  font-weight:
    750 !important;

  letter-spacing:
    0 !important;

  white-space:
    nowrap !important;

  text-transform:
    none !important;

  transform:
    none !important;

  cursor:
    pointer !important;

  transition:
    transform .14s ease,
    background .14s ease,
    border-color .14s ease,
    box-shadow .14s ease !important;

}


#information-detail-overlay
.information-edit-v2-cancel {

  color:
    rgba(255,255,255,.96) !important;

  background:
    rgba(255,255,255,.10) !important;

  border:
    1px solid
    rgba(255,255,255,.30) !important;

  box-shadow:
    inset 0 1px 0
    rgba(255,255,255,.08) !important;

}


#information-detail-overlay
.information-edit-v2-cancel:hover {

  background:
    rgba(255,255,255,.17) !important;

  border-color:
    rgba(255,255,255,.42) !important;

}


#information-detail-overlay
.information-edit-v2-save {

  min-width:
    76px !important;

  color:
    #fff !important;

  background:
    linear-gradient(
      180deg,
      #26c883 0%,
      #12ad70 100%
    ) !important;

  border:
    1px solid
    rgba(255,255,255,.38) !important;

  box-shadow:
    0 8px 18px
    rgba(0,102,67,.24),
    inset 0 1px 0
    rgba(255,255,255,.20) !important;

}


#information-detail-overlay
.information-edit-v2-save:hover {

  transform:
    translateY(-1px) !important;

  box-shadow:
    0 10px 22px
    rgba(0,102,67,.30),
    inset 0 1px 0
    rgba(255,255,255,.22) !important;

}


#information-detail-overlay
.information-edit-v2-cancel:active,

#information-detail-overlay
.information-edit-v2-save:active {

  transform:
    scale(.97) !important;

}


/* ----------------------------------------------------------
   CLOSE X — SAME SIZE / SAME ROW
   ---------------------------------------------------------- */

#information-detail-overlay
.information-detail-header-actions
.information-detail-close-btn,

#information-detail-overlay
.information-detail-header-actions
[data-information-detail-close] {

  position:
    static !important;

  inset:
    auto !important;

  width:
    44px !important;

  min-width:
    44px !important;

  max-width:
    44px !important;

  height:
    44px !important;

  min-height:
    44px !important;

  max-height:
    44px !important;

  margin:
    0 !important;

  padding:
    0 !important;

  display:
    inline-grid !important;

  place-items:
    center !important;

  border-radius:
    50% !important;

  color:
    #fff !important;

  background:
    rgba(255,255,255,.10) !important;

  border:
    1px solid
    rgba(255,255,255,.30) !important;

  box-shadow:
    inset 0 1px 0
    rgba(255,255,255,.08) !important;

  font-family:
    inherit !important;

  font-size:
    28px !important;

  line-height:
    1 !important;

  font-weight:
    300 !important;

  transform:
    none !important;

  cursor:
    pointer !important;

}


#information-detail-overlay
.information-detail-header-actions
.information-detail-close-btn:hover {

  background:
    rgba(255,255,255,.18) !important;

}


/* ----------------------------------------------------------
   HERO TITLE AREA — GIỮ GIỐNG VIEW
   ---------------------------------------------------------- */

#information-detail-overlay.information-edit-v2-active
.information-detail-title {

  max-width:
    min(620px, calc(100% - 250px)) !important;

}


#information-detail-overlay.information-edit-v2-active
.information-detail-meta {

  max-width:
    min(620px, calc(100% - 250px)) !important;

}


/* ----------------------------------------------------------
   EDIT BODY
   ---------------------------------------------------------- */

#information-detail-overlay.information-edit-v2-active
.information-detail-content {

  padding:
    26px !important;

  background:
    linear-gradient(
      180deg,
      #eef5fc 0%,
      #edf4fb 100%
    ) !important;

}


#information-detail-overlay
.information-edit-v2 {

  max-width:
    100% !important;

  display:
    grid !important;

  gap:
    16px !important;

}


/* Intro giống Subject edit note */

#information-detail-overlay
.information-edit-v2-intro {

  min-height:
    62px !important;

  box-sizing:
    border-box !important;

  padding:
    14px 18px !important;

  border-radius:
    15px !important;

  border:
    1px solid
    #d8e8f8 !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.94),
      rgba(247,251,255,.90)
    ) !important;

  box-shadow:
    0 8px 22px
    rgba(25,70,120,.05) !important;

}


#information-detail-overlay
.information-edit-v2-intro strong {

  font-size:
    15px !important;

  line-height:
    1.25 !important;

  color:
    #173f71 !important;

}


#information-detail-overlay
.information-edit-v2-intro span {

  margin-top:
    4px !important;

  font-size:
    11.5px !important;

  line-height:
    1.35 !important;

  color:
    #7f94ac !important;

}


/* ----------------------------------------------------------
   CARDS
   ---------------------------------------------------------- */

#information-detail-overlay
.information-edit-v2-card {

  border:
    1px solid
    #d9e6f4 !important;

  border-radius:
    20px !important;

  background:
    rgba(255,255,255,.92) !important;

  box-shadow:
    0 10px 28px
    rgba(28,66,112,.055) !important;

}


#information-detail-overlay
.information-edit-v2-card-head {

  min-height:
    64px !important;

  box-sizing:
    border-box !important;

  padding:
    12px 18px !important;

  gap:
    12px !important;

}


#information-detail-overlay
.information-edit-v2-card-head strong {

  font-size:
    14px !important;

  line-height:
    1.25 !important;

}


#information-detail-overlay
.information-edit-v2-card-head span {

  margin-top:
    2px !important;

  font-size:
    11px !important;

  line-height:
    1.25 !important;

}


#information-detail-overlay
.information-edit-v2-card-icon {

  width:
    38px !important;

  min-width:
    38px !important;

  height:
    38px !important;

  border-radius:
    11px !important;

}


/* tone nhẹ giống Subject edit sections */

#information-detail-overlay
.information-edit-v2-card.tone-blue
.information-edit-v2-card-head {

  background:
    linear-gradient(
      90deg,
      rgba(39,126,234,.055),
      rgba(255,255,255,.55)
    ) !important;

}


#information-detail-overlay
.information-edit-v2-card.tone-green
.information-edit-v2-card-head {

  background:
    linear-gradient(
      90deg,
      rgba(18,173,131,.06),
      rgba(255,255,255,.55)
    ) !important;

}


#information-detail-overlay
.information-edit-v2-card.tone-purple
.information-edit-v2-card-head {

  background:
    linear-gradient(
      90deg,
      rgba(128,84,232,.06),
      rgba(255,255,255,.55)
    ) !important;

}


#information-detail-overlay
.information-edit-v2-card.tone-orange
.information-edit-v2-card-head {

  background:
    linear-gradient(
      90deg,
      rgba(237,133,64,.06),
      rgba(255,255,255,.55)
    ) !important;

}


#information-detail-overlay
.information-edit-v2-card.tone-cyan
.information-edit-v2-card-head {

  background:
    linear-gradient(
      90deg,
      rgba(24,150,184,.06),
      rgba(255,255,255,.55)
    ) !important;

}


/* ----------------------------------------------------------
   FIELDS
   ---------------------------------------------------------- */

#information-detail-overlay
.information-edit-v2-card-body {

  padding:
    16px 18px 18px !important;

}


#information-detail-overlay
.information-edit-v2-grid {

  gap:
    14px !important;

}


#information-detail-overlay
.information-edit-v2-label {

  margin-left:
    2px !important;

  color:
    #7087a2 !important;

  font-size:
    10.5px !important;

  line-height:
    1.2 !important;

  font-weight:
    750 !important;

}


#information-detail-overlay
.information-edit-v2-field input,

#information-detail-overlay
.information-edit-v2-field textarea {

  min-height:
    46px !important;

  padding:
    11px 14px !important;

  border:
    1px solid
    #c9d9eb !important;

  border-radius:
    13px !important;

  background:
    #f8fbff !important;

  color:
    #123d75 !important;

  font-family:
    inherit !important;

  font-size:
    13px !important;

  line-height:
    1.35 !important;

  font-weight:
    650 !important;

  box-shadow:
    inset 0 1px 1px
    rgba(25,65,110,.02) !important;

}


#information-detail-overlay
.information-edit-v2-field input:hover,

#information-detail-overlay
.information-edit-v2-field textarea:hover {

  border-color:
    #a9c8eb !important;

  background:
    #fbfdff !important;

}


#information-detail-overlay
.information-edit-v2-field input:focus,

#information-detail-overlay
.information-edit-v2-field textarea:focus {

  border-color:
    #4c91e8 !important;

  background:
    #fff !important;

  box-shadow:
    0 0 0 4px
    rgba(43,126,226,.10) !important;

}


#information-detail-overlay
.information-edit-v2-field input[readonly] {

  color:
    #7d91aa !important;

  background:
    #edf3f9 !important;

  border-color:
    #d4e0ed !important;

}


/* ----------------------------------------------------------
   ERROR / SAVE STATUS
   ---------------------------------------------------------- */

#information-detail-overlay
.information-edit-v2-message:not(:empty) {

  margin:
    -2px 0 0 !important;

  padding:
    11px 14px !important;

  border-radius:
    12px !important;

  font-size:
    12px !important;

  line-height:
    1.35 !important;

}


#information-detail-overlay
.information-edit-v2-message.is-error {

  color:
    #c33a32 !important;

  background:
    #fff1ef !important;

  border:
    1px solid
    #f3c3bd !important;

}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

  #information-detail-overlay.information-edit-v2-active
  .information-detail-header {

    padding:
      82px 18px 20px !important;

  }


  #information-detail-overlay
  .information-detail-header-actions {

    top:
      18px !important;

    right:
      18px !important;

  }


  #information-detail-overlay.information-edit-v2-active
  .information-detail-title,

  #information-detail-overlay.information-edit-v2-active
  .information-detail-meta {

    max-width:
      100% !important;

  }


  #information-detail-overlay.information-edit-v2-active
  .information-detail-content {

    padding:
      16px !important;

  }

}


/* T145 END */


/* ==========================================================
   T152 — INFORMATION EDIT V2 SCROLL PERFORMANCE
   ========================================================== */


/*
 * Intro + card Liquid:
 * giữ màu / border / gradient,
 * bỏ blur realtime bên trong vùng scroll.
 */

#information-detail-overlay
.information-edit-v2-intro,

#information-detail-overlay
.information-edit-v2-card {

  -webkit-backdrop-filter:
    none !important;

  backdrop-filter:
    none !important;

}


/*
 * Background gần như không đổi về cảm giác,
 * nhưng dùng surface đã rasterized thay vì glass blur.
 */

#information-detail-overlay
.information-edit-v2-intro {

  background:
    rgba(250,253,255,.96)
    !important;

}


#information-detail-overlay
.information-edit-v2-card {

  background:
    rgba(255,255,255,.965)
    !important;

  box-shadow:
    0 6px 18px
    rgba(18,61,117,.05)
    !important;

  contain:
    layout paint style;

}


/*
 * Long Edit form:
 * card ngoài viewport được trì hoãn paint.
 */

@supports (content-visibility: auto) {

  #information-detail-overlay
  .information-edit-v2-card {

    content-visibility:
      auto;

    contain-intrinsic-size:
      220px;

  }

}


/*
 * Inputs không cần transition box-shadow dài khi scroll.
 */

#information-detail-overlay
.information-edit-v2-field input,

#information-detail-overlay
.information-edit-v2-field textarea {

  transition:
    border-color 120ms ease,
    background 120ms ease,
    box-shadow 120ms ease
    !important;

}


/*
 * Không promote từng card riêng lẻ.
 * Chỉ scroll container được composited.
 */

#information-detail-overlay
.information-edit-v2-card,

#information-detail-overlay
.information-edit-v2-intro {

  transform:
    none !important;

  will-change:
    auto !important;

}


/* T152 EDIT END */


/* ==========================================================
   T153 — INFORMATION EDIT V2 SCROLL = SUBJECT EDIT
   ========================================================== */


/*
 * Copy đúng mô hình
 * .atosy-subject-detail-v5-edit-body
 */

#information-detail-overlay.information-edit-v2-active
.information-detail-content {

  flex:
    1 1 auto !important;

  min-height:
    0 !important;

  overflow-y:
    auto !important;

  overflow-x:
    hidden !important;

  padding:
    18px 20px 30px !important;

  background:
    #f5f9ff !important;

  scrollbar-width:
    thin !important;

  scrollbar-color:
    #aac5ec transparent !important;

  contain:
    none !important;

  content-visibility:
    visible !important;

  transform:
    none !important;

  will-change:
    auto !important;

  scroll-behavior:
    auto !important;

  overscroll-behavior:
    auto !important;

}


#information-detail-overlay.information-edit-v2-active
.information-detail-content::-webkit-scrollbar {

  width:
    8px !important;

}


#information-detail-overlay.information-edit-v2-active
.information-detail-content::-webkit-scrollbar-track {

  background:
    transparent !important;

}


#information-detail-overlay.information-edit-v2-active
.information-detail-content::-webkit-scrollbar-thumb {

  background:
    #aac5ec !important;

  border-radius:
    999px !important;

  border:
    2px solid transparent !important;

  background-clip:
    padding-box !important;

}


/*
 * Gỡ các optimization T152 trên Edit cards.
 */

#information-detail-overlay
.information-edit-v2-card,

#information-detail-overlay
.information-edit-v2-intro {

  contain:
    none !important;

  content-visibility:
    visible !important;

  transform:
    none !important;

  will-change:
    auto !important;

}


/*
 * Giữ card giống Subject:
 * surface tĩnh + shadow nhẹ.
 */

#information-detail-overlay
.information-edit-v2-card {

  -webkit-backdrop-filter:
    none !important;

  backdrop-filter:
    none !important;

  background:
    #fff !important;

  box-shadow:
    0 7px 18px
    rgba(45,82,135,.06)
    !important;

}


#information-detail-overlay
.information-edit-v2-intro {

  -webkit-backdrop-filter:
    none !important;

  backdrop-filter:
    none !important;

}


/* T153 EDIT END */


/* ==========================================================
   T158 — CANONICAL INFORMATION HERO ACTION BAR
   ========================================================== */


/* ----------------------------------------------------------
   HERO ACTION ROW
   ---------------------------------------------------------- */

#information-detail-overlay
.information-detail-header-actions {

  position:
    absolute !important;

  top:
    22px !important;

  right:
    22px !important;

  left:
    auto !important;

  bottom:
    auto !important;

  display:
    flex !important;

  flex-direction:
    row !important;

  flex-wrap:
    nowrap !important;

  align-items:
    center !important;

  justify-content:
    flex-end !important;

  gap:
    8px !important;

  width:
    auto !important;

  height:
    44px !important;

  min-height:
    44px !important;

  margin:
    0 !important;

  padding:
    0 !important;

  transform:
    none !important;

  z-index:
    80 !important;

}


/* ----------------------------------------------------------
   COMMON BUTTON
   ---------------------------------------------------------- */

#information-detail-overlay
.information-detail-header-actions
.information-action-t158 {

  position:
    static !important;

  inset:
    auto !important;

  flex:
    0 0 auto !important;

  height:
    44px !important;

  min-height:
    44px !important;

  margin:
    0 !important;

  font-family:
    inherit !important;

  font-size:
    13px !important;

  line-height:
    1 !important;

  font-weight:
    750 !important;

  white-space:
    nowrap !important;

  cursor:
    pointer !important;

  transition:
    transform 150ms ease,
    opacity 150ms ease,
    background 170ms ease,
    box-shadow 170ms ease !important;

}


/* Edit */

#information-detail-overlay
[data-information-t158-edit] {

  min-width:
    78px !important;

  padding:
    0 15px !important;

  border-radius:
    15px !important;

}


/* Hủy */

#information-detail-overlay
[data-information-t158-cancel] {

  min-width:
    64px !important;

  padding:
    0 15px !important;

  border-radius:
    15px !important;

  color:
    #fff !important;

  background:
    rgba(255,255,255,.11) !important;

  border:
    1px solid
    rgba(255,255,255,.30) !important;

}


/* Save */

#information-detail-overlay
[data-information-t158-save] {

  min-width:
    118px !important;

  padding:
    0 17px !important;

  border-radius:
    15px !important;

  color:
    #fff !important;

  background:
    linear-gradient(
      180deg,
      #26c883 0%,
      #12ad70 100%
    ) !important;

  border:
    1px solid
    rgba(255,255,255,.38) !important;

  box-shadow:
    0 8px 18px
    rgba(0,102,67,.22)
    !important;

}


/* X */

#information-detail-overlay
[data-information-t158-close] {

  width:
    44px !important;

  min-width:
    44px !important;

  max-width:
    44px !important;

  padding:
    0 !important;

  border-radius:
    50% !important;

}


/* ----------------------------------------------------------
   BODY EDIT ACTIONS
   Không còn nút Hủy/Lưu thứ hai trong card.
   ---------------------------------------------------------- */

#information-detail-overlay
.information-edit-toolbar-actions-v108 {

  display:
    none !important;

}


#information-detail-overlay
.information-edit-toolbar-v108 {

  grid-template-columns:
    minmax(0, 1fr) !important;

}


/* ----------------------------------------------------------
   HERO CONTENT RESERVE
   ---------------------------------------------------------- */

#information-detail-overlay
.information-detail-header.information-edit-mode-t158 {

  padding-right:
    290px !important;

}


/* ----------------------------------------------------------
   SMOOTH VIEW <-> EDIT
   ---------------------------------------------------------- */

#information-detail-overlay
.information-detail-content {

  transition:
    opacity 140ms ease,
    transform 140ms ease !important;

}


#information-detail-overlay.information-mode-switching-t158
.information-detail-content {

  opacity:
    .82 !important;

  transform:
    translateY(2px) !important;

}


#information-detail-overlay
.information-detail-header-actions {

  transition:
    opacity 140ms ease,
    transform 140ms ease !important;

}


#information-detail-overlay.information-mode-switching-t158
.information-detail-header-actions {

  opacity:
    .88 !important;

}


/* save loading */

#information-detail-overlay
[data-information-t158-save].is-saving-t158 {

  opacity:
    .76 !important;

  cursor:
    wait !important;

}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

  #information-detail-overlay
  .information-detail-header-actions {

    top:
      18px !important;

    right:
      18px !important;

    gap:
      6px !important;

  }


  #information-detail-overlay
  .information-detail-header.information-edit-mode-t158 {

    padding-right:
      18px !important;

    padding-top:
      82px !important;

  }


  #information-detail-overlay
  [data-information-t158-save] {

    min-width:
      96px !important;

    padding:
      0 12px !important;

    font-size:
      12px !important;

  }

}


/* T158 END */

/* ==================================================
   T164 — POLISH INFORMATION EDIT HEADER ACTIONS
   Fix Lưu thay đổi button alignment / width / icon balance
   ================================================== */

#information-detail-overlay .information-detail-header-actions,
#information-detail-overlay .information-detail-hero-actions,
#information-detail-overlay .information-edit-top-actions {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
}

#information-detail-overlay [data-information-edit-cancel],
#information-detail-overlay [data-information-edit-save] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 50px !important;
  padding: 0 18px !important;
  border-radius: 16px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
  box-sizing: border-box !important;
  font-weight: 800 !important;
}

#information-detail-overlay [data-information-edit-cancel] {
  min-width: 78px !important;
}

#information-detail-overlay [data-information-edit-save] {
  min-width: 138px !important;
  padding-left: 16px !important;
  padding-right: 18px !important;
}

#information-detail-overlay [data-information-edit-save] > *,
#information-detail-overlay [data-information-edit-cancel] > * {
  line-height: 1 !important;
  vertical-align: middle !important;
}

#information-detail-overlay [data-information-edit-save] svg,
#information-detail-overlay [data-information-edit-save] i,
#information-detail-overlay [data-information-edit-save] .icon,
#information-detail-overlay [data-information-edit-cancel] svg,
#information-detail-overlay [data-information-edit-cancel] i,
#information-detail-overlay [data-information-edit-cancel] .icon {
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  display: inline-block !important;
}

/* nếu text save hơi lệch do font rendering */
#information-detail-overlay [data-information-edit-save] {
  letter-spacing: -0.01em !important;
}

/* T164 END */


/* ==========================================================
   T166 — INFORMATION SAVE TOAST
   ========================================================== */

#information-detail-overlay
.information-detail-panel {

  position:
    relative !important;

}


.information-toast-host-t166 {

  position:
    absolute;

  top:
    76px;

  right:
    24px;

  z-index:
    200;

  display:
    flex;

  flex-direction:
    column;

  align-items:
    flex-end;

  pointer-events:
    none;

}


.information-toast-t166 {

  display:
    inline-flex;

  align-items:
    center;

  gap:
    10px;

  min-height:
    44px;

  max-width:
    320px;

  padding:
    10px 15px;

  border-radius:
    16px;

  color:
    #fff;

  font-size:
    13px;

  font-weight:
    750;

  line-height:
    1.3;

  opacity:
    0;

  transform:
    translateY(-8px)
    scale(.98);

  transition:
    opacity 180ms ease,
    transform 180ms ease;

  box-shadow:
    0 14px 34px
    rgba(4,37,85,.20);

  -webkit-backdrop-filter:
    blur(16px);

  backdrop-filter:
    blur(16px);

}


.information-toast-t166.is-visible {

  opacity:
    1;

  transform:
    translateY(0)
    scale(1);

}


.information-toast-t166.is-success {

  background:
    linear-gradient(
      135deg,
      rgba(14,176,111,.94),
      rgba(14,143,98,.92)
    );

  border:
    1px solid
    rgba(255,255,255,.30);

}


.information-toast-t166.is-error {

  background:
    linear-gradient(
      135deg,
      rgba(224,76,61,.95),
      rgba(188,48,48,.94)
    );

  border:
    1px solid
    rgba(255,255,255,.26);

}


.information-toast-icon-t166 {

  display:
    inline-flex;

  align-items:
    center;

  justify-content:
    center;

  flex:
    0 0 22px;

  width:
    22px;

  height:
    22px;

  border-radius:
    50%;

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

  font-size:
    13px;

  font-weight:
    900;

}


.information-toast-copy-t166 {

  white-space:
    nowrap;

}


@media (max-width: 760px) {

  .information-toast-host-t166 {

    top:
      72px;

    left:
      14px;

    right:
      14px;

    align-items:
      stretch;

  }


  .information-toast-t166 {

    max-width:
      none;

    width:
      100%;

    box-sizing:
      border-box;

  }

}


/* T166 END */