/*
 * InventyHub v6.6.7
 * Fix layout Persetujuan Akun + Selfie
 * CSS-only patch. Tidak mengubah JS/API/database.
 */

/* Selfie v6.6.6 lebih lebar dari kolom avatar lama (58px).
   Beri area foto yang nyata agar identitas tidak bertumpuk. */
.account-approval-card.registration-with-selfie{
  grid-template-columns:112px minmax(0,1fr) !important;
  column-gap:18px !important;
  align-items:start !important;
}

.registration-with-selfie .registration-selfie-column{
  width:112px !important;
  min-width:112px !important;
  max-width:112px !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  justify-items:center !important;
  align-content:start !important;
  gap:7px !important;
}

.registration-with-selfie .registration-selfie-avatar{
  width:88px !important;
  height:88px !important;
  margin:0 !important;
}

.registration-with-selfie .registration-selfie-label{
  width:100%;
  padding:0 2px;
  line-height:1.35;
  overflow-wrap:anywhere;
}

.registration-with-selfie .account-approval-copy{
  min-width:0 !important;
  width:100% !important;
}

.registration-with-selfie .account-approval-title{
  min-width:0;
}

.registration-with-selfie .account-approval-title>div{
  min-width:0;
}

.registration-with-selfie .account-approval-title h4,
.registration-with-selfie .account-approval-title>div>span{
  overflow-wrap:anywhere;
}

/* Empat informasi utama tetap sejajar pada desktop. */
.registration-with-selfie .account-meta-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}

@media(max-width:1150px){
  .registration-with-selfie .account-meta-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:700px){
  .account-approval-card.registration-with-selfie{
    grid-template-columns:1fr !important;
    row-gap:14px !important;
  }

  .registration-with-selfie .registration-selfie-column{
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    grid-template-columns:88px minmax(0,1fr) !important;
    justify-items:start !important;
    align-items:center !important;
  }

  .registration-with-selfie .registration-selfie-label{
    width:auto;
    text-align:left;
  }

  .registration-with-selfie .account-meta-grid{
    grid-template-columns:1fr;
  }
}