/* ==========================================================
   ATOSY ERP
   CONTACT CARDS V2
   ========================================================== */


/* ==========================================================
   CARD CONTAINER
   ========================================================== */

.atosy-contact-cards-v2 {

  display:
    grid !important;

  grid-template-columns:
    1fr !important;

  gap:
    12px !important;

  margin-bottom:
    14px !important;

}


/* ==========================================================
   EMAIL / PHONE CARD
   giống hierarchy của Website
   ========================================================== */

.atosy-contact-card-v2 {

  padding:
    12px 14px 14px !important;

  border:
    1px solid
    rgba(37, 158, 125, .22) !important;

  border-radius:
    14px !important;

  background:
    linear-gradient(
      135deg,
      rgba(242, 253, 249, .94),
      rgba(249, 255, 253, .98)
    ) !important;

  box-shadow:
    0 4px 14px
    rgba(31, 117, 92, .035) !important;

}


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

.atosy-contact-card-v2-head {

  min-height:
    27px !important;

  margin-bottom:
    9px !important;

  display:
    flex !important;

  align-items:
    center !important;

  justify-content:
    space-between !important;

  gap:
    16px !important;

}


.atosy-contact-card-v2-heading {

  min-width:
    0 !important;

}


.atosy-contact-card-v2-heading strong {

  display:
    block !important;

  color:
    #17624f !important;

  font-size:
    11px !important;

  font-weight:
    750 !important;

  line-height:
    1.2 !important;

}


.atosy-contact-card-v2-heading span {

  display:
    block !important;

  margin-top:
    2px !important;

  color:
    #78938b !important;

  font-size:
    9px !important;

  font-weight:
    550 !important;

  line-height:
    1.25 !important;

}


/* ==========================================================
   +
   ========================================================== */

.atosy-contact-card-v2-add {

  width:
    25px !important;

  height:
    25px !important;

  min-width:
    25px !important;

  min-height:
    25px !important;

  flex:
    0 0 25px !important;

  padding:
    0 !important;

  display:
    inline-flex !important;

  align-items:
    center !important;

  justify-content:
    center !important;

  border:
    1px solid
    rgba(35, 132, 105, .32) !important;

  border-radius:
    8px !important;

  background:
    rgba(235, 251, 246, .96) !important;

  color:
    #1f9678 !important;

  -webkit-text-fill-color:
    #1f9678 !important;

  font-family:
    inherit !important;

  font-size:
    17px !important;

  font-weight:
    500 !important;

  line-height:
    1 !important;

  cursor:
    pointer !important;

  transition:
    .15s ease !important;

  pointer-events:
    auto !important;

}


.atosy-contact-card-v2-add:hover {

  border-color:
    #1d9d7b !important;

  background:
    #e1f8f0 !important;

}


/* ==========================================================
   FIELDS
   ========================================================== */

.atosy-contact-card-v2-fields {

  display:
    grid !important;

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

  gap:
    12px !important;

}


/*
 * Field đầu tiên chiếm toàn hàng,
 * giống Website.
 */

.atosy-contact-card-v2-base {

  grid-column:
    1 / -1 !important;

}


/* Label trong card */

.atosy-contact-card-v2
.atosy-subject-detail-v5-edit-field label {

  font-size:
    9.5px !important;

  font-weight:
    650 !important;

  margin-bottom:
    6px !important;

}


/* Input */

.atosy-contact-card-v2
.atosy-subject-detail-v5-edit-field input {

  min-height:
    41px !important;

  height:
    41px !important;

  font-size:
    11px !important;

  font-weight:
    550 !important;

  pointer-events:
    auto !important;

  cursor:
    text !important;

}


/* Hidden extra */

.atosy-contact-card-v2
.atosy-subject-detail-v5-edit-field[hidden] {

  display:
    none !important;

}


@media (max-width: 760px) {

  .atosy-contact-card-v2-fields {

    grid-template-columns:
      1fr !important;

  }

}