/* ==========================================================
   ATOSY ERP
   EDIT SUBJECT SECTION COLORS V1
   Đồng bộ màu với Subject Profile view
   ========================================================== */

.atosy-subject-detail-v5-edit-section {
  overflow: hidden !important;

  border:
    1px solid
    rgba(87, 132, 185, .18) !important;

  border-radius:
    22px !important;

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

  box-shadow:
    0 8px 24px
    rgba(40, 74, 120, .055) !important;
}


/* ==========================================================
   HEADER CHUNG
   ========================================================== */

.atosy-subject-detail-v5-edit-section-head {
  position: relative;

  padding:
    14px 18px 13px 58px !important;

  min-height:
    56px;

  box-sizing:
    border-box;

  border-bottom:
    1px solid
    rgba(90, 130, 180, .12) !important;

  transition:
    background .18s ease;
}


.atosy-subject-detail-v5-edit-section-head::before {
  content:
    attr(data-section-icon);

  position:
    absolute;

  left:
    16px;

  top:
    50%;

  width:
    31px;

  height:
    31px;

  transform:
    translateY(-50%);

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  border-radius:
    10px;

  color:
    #ffffff;

  font-size:
    14px;

  font-weight:
    900;

  box-shadow:
    0 5px 12px
    rgba(31, 80, 140, .16);
}


.atosy-subject-detail-v5-edit-section-head strong {
  display:
    block;

  margin:
    0 !important;

  color:
    #153f70 !important;

  font-size:
    14px !important;

  line-height:
    1.2 !important;

  font-weight:
    800 !important;
}


.atosy-subject-detail-v5-edit-section-head span {
  display:
    block;

  margin-top:
    2px !important;

  color:
    #7890aa !important;

  font-size:
    10.5px !important;

  line-height:
    1.3 !important;

  font-weight:
    600 !important;
}


/* ==========================================================
   BLUE — THÔNG TIN CƠ BẢN
   ========================================================== */

.atosy-subject-detail-v5-edit-section[data-edit-tone="blue"]
.atosy-subject-detail-v5-edit-section-head {
  background:
    linear-gradient(
      90deg,
      rgba(235,245,255,.98),
      rgba(248,251,255,.96)
    ) !important;
}

.atosy-subject-detail-v5-edit-section[data-edit-tone="blue"]
.atosy-subject-detail-v5-edit-section-head::before {
  background:
    linear-gradient(
      145deg,
      #2381f3,
      #1765d8
    );
}


/* ==========================================================
   PURPLE — PHÂN LOẠI
   ========================================================== */

.atosy-subject-detail-v5-edit-section[data-edit-tone="purple"]
.atosy-subject-detail-v5-edit-section-head {
  background:
    linear-gradient(
      90deg,
      rgba(246,239,255,.98),
      rgba(252,249,255,.96)
    ) !important;
}

.atosy-subject-detail-v5-edit-section[data-edit-tone="purple"]
.atosy-subject-detail-v5-edit-section-head::before {
  background:
    linear-gradient(
      145deg,
      #9366ef,
      #7449db
    );
}


/* ==========================================================
   CYAN — TIÊU CHÍ ĐÁNH GIÁ
   ========================================================== */

.atosy-subject-detail-v5-edit-section[data-edit-tone="cyan"]
.atosy-subject-detail-v5-edit-section-head {
  background:
    linear-gradient(
      90deg,
      rgba(234,250,254,.98),
      rgba(248,253,255,.96)
    ) !important;
}

.atosy-subject-detail-v5-edit-section[data-edit-tone="cyan"]
.atosy-subject-detail-v5-edit-section-head::before {
  background:
    linear-gradient(
      145deg,
      #29b9db,
      #1597bd
    );
}


/* ==========================================================
   GREEN — PHƯƠNG THỨC LIÊN LẠC
   ========================================================== */

.atosy-subject-detail-v5-edit-section[data-edit-tone="green"]
.atosy-subject-detail-v5-edit-section-head {
  background:
    linear-gradient(
      90deg,
      rgba(235,252,247,.98),
      rgba(249,255,253,.96)
    ) !important;
}

.atosy-subject-detail-v5-edit-section[data-edit-tone="green"]
.atosy-subject-detail-v5-edit-section-head::before {
  background:
    linear-gradient(
      145deg,
      #1bc690,
      #0ca975
    );
}


/* ==========================================================
   ORANGE — GHI CHÚ
   ========================================================== */

.atosy-subject-detail-v5-edit-section[data-edit-tone="orange"]
.atosy-subject-detail-v5-edit-section-head {
  background:
    linear-gradient(
      90deg,
      rgba(255,247,232,.98),
      rgba(255,252,246,.96)
    ) !important;
}

.atosy-subject-detail-v5-edit-section[data-edit-tone="orange"]
.atosy-subject-detail-v5-edit-section-head::before {
  background:
    linear-gradient(
      145deg,
      #f6ad45,
      #e68a22
    );
}


/* ==========================================================
   SLATE — THÔNG TIN KHÁC
   ========================================================== */

.atosy-subject-detail-v5-edit-section[data-edit-tone="slate"]
.atosy-subject-detail-v5-edit-section-head {
  background:
    linear-gradient(
      90deg,
      rgba(241,246,251,.98),
      rgba(250,252,254,.96)
    ) !important;
}

.atosy-subject-detail-v5-edit-section[data-edit-tone="slate"]
.atosy-subject-detail-v5-edit-section-head::before {
  background:
    linear-gradient(
      145deg,
      #718ba8,
      #536f90
    );
}


/* ==========================================================
   BODY / GRID
   ========================================================== */

.atosy-subject-detail-v5-edit-grid {
  padding:
    16px 18px 18px !important;
}


/* Address nested card giữ nhẹ hơn section cha */
.atosy-subject-detail-v5-edit-section[data-edit-tone="green"]
.atosy-address-enum-v1 {
  border-color:
    rgba(24, 177, 128, .19) !important;

  background:
    linear-gradient(
      145deg,
      rgba(249,255,253,.98),
      rgba(242,251,248,.97)
    ) !important;
}


/* ==========================================================
   HOVER RẤT NHẸ
   ========================================================== */

.atosy-subject-detail-v5-edit-section:hover {
  border-color:
    rgba(64, 128, 205, .25) !important;
}