
/* P582 — responsive/protection presentation only. No auth/API/timezone behavior. */
html,body{max-width:100%;overflow-x:hidden}
#root,.amf-partner-shell,.amf-partner-shell-native,.amf-dashboard-shell,
.amf-dashboard-main,.amf-main-content,.main-content,.content-wrapper{
  min-width:0!important;max-width:100%!important;box-sizing:border-box
}
.amf-partner-shell *,.amf-partner-shell-native *{box-sizing:border-box}
.amf-partner-shell img,.amf-partner-shell-native img{max-width:100%;height:auto}

/* Security/protection status must remain visible and must not be clipped by responsive rules. */
[data-amf-security],[data-amf-protection],.amf-security-status,.amf-protection-status,
.security-status,.protection-status,.security-badge,.protection-badge{
  display:flex!important;visibility:visible!important;opacity:1!important;
  max-width:100%!important;min-width:0!important
}

/* Keep wide data surfaces contained instead of widening the whole page. */
.amf-partner-shell table,.amf-partner-shell-native table{max-width:100%}
.amf-table-wrap,.table-responsive,.amf-grid-wrap,.amf-records-wrap{
  max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch
}
.amf-partner-shell input,.amf-partner-shell select,.amf-partner-shell textarea,
.amf-partner-shell-native input,.amf-partner-shell-native select,.amf-partner-shell-native textarea{
  max-width:100%!important
}

@media (max-width:1100px){
  .amf-partner-shell main,.amf-partner-shell-native main,
  .amf-dashboard-main,.amf-main-content,.main-content{
    width:100%!important;min-width:0!important;max-width:100%!important
  }
  .amf-stats-grid,.stats-grid,.dashboard-grid,.amf-dashboard-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important
  }
}

@media (max-width:760px){
  .amf-partner-shell,.amf-partner-shell-native{width:100%!important;min-width:0!important}
  .amf-stats-grid,.stats-grid,.dashboard-grid,.amf-dashboard-grid{
    grid-template-columns:minmax(0,1fr)!important
  }
  .amf-dashboard-header,.dashboard-header,.page-header,.amf-page-header{
    flex-wrap:wrap!important;gap:8px!important;min-width:0!important
  }
  .amf-dashboard-header>* ,.dashboard-header>* ,.page-header>* ,.amf-page-header>*{
    min-width:0!important;max-width:100%!important
  }
  .amf-modal,.modal-dialog,.amf-dialog{
    width:min(94vw,560px)!important;max-width:94vw!important;margin-left:auto!important;margin-right:auto!important
  }
}

@media (max-width:520px){
  .amf-stats-grid,.stats-grid,.dashboard-grid,.amf-dashboard-grid{
    display:grid!important;grid-template-columns:1fr!important
  }
  .amf-action-row,.action-row,.header-actions,.amf-header-actions{
    display:flex!important;flex-wrap:wrap!important;max-width:100%!important
  }
}

/* FIX49D — Reseller page + Partner Activity true edge-to-edge authority.
   The previous FIX49C only enlarged the record inside the admin content box.
   The admin shell itself still had Tailwind p-6 (24px left/right), so on a phone
   the visible gap stayed large. This pass removes that shell side padding ONLY
   while Kelola Reseller is mounted, keeps the approved current UI, and preserves
   a single real horizontally-scrollable record table. */

.amf-admin-reseller-native{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

.amf-admin-reseller-native .amf-p137-record{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}

.amf-admin-reseller-native .amf-p137-record-scroll{
  display:block!important;
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:scroll!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-x pan-y!important;
  overscroll-behavior-x:contain!important;
  scrollbar-width:thin!important;
  scrollbar-gutter:stable!important;
}

.amf-admin-reseller-native .amf-p137-record-scroll table{
  display:table!important;
  width:100%!important;
  min-width:980px!important;
  max-width:none!important;
  table-layout:auto!important;
  border-collapse:collapse!important;
  overflow:visible!important;
}
.amf-admin-reseller-native .amf-p137-record-scroll thead{display:table-header-group!important}
.amf-admin-reseller-native .amf-p137-record-scroll tbody{display:table-row-group!important}
.amf-admin-reseller-native .amf-p137-record-scroll tr{display:table-row!important}
.amf-admin-reseller-native .amf-p137-record-scroll th,
.amf-admin-reseller-native .amf-p137-record-scroll td{
  display:table-cell!important;
  width:auto!important;
  max-width:none!important;
  white-space:nowrap!important;
  overflow-wrap:normal!important;
}

.amf-admin-reseller-native .amf-p137-record-scroll::-webkit-scrollbar{
  display:block!important;
  height:8px!important;
}
.amf-admin-reseller-native .amf-p137-record-scroll::-webkit-scrollbar-track{
  background:#edf2f7!important;
}
.amf-admin-reseller-native .amf-p137-record-scroll::-webkit-scrollbar-thumb{
  background:#94a3b8!important;
  border-radius:999px!important;
  border:1px solid #edf2f7!important;
}

@media (max-width:1024px){
  /* Real cause of the remaining gap: .amf-shell-content-v65 carries p-6 = 24px.
     Override it only on the reseller page. 2px is intentionally retained so the
     page does not collide with the physical viewport edge. */
  #root .amf-admin-shell-native .amf-shell-content-v65:has(.amf-admin-reseller-native){
    padding-left:2px!important;
    padding-right:2px!important;
  }
  #root .amf-admin-reseller-native{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record{
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    border-radius:12px!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record-head{
    padding-left:12px!important;
    padding-right:12px!important;
  }
}

@media (max-width:767px){
  #root .amf-admin-reseller-native .amf-p137-record-head{
    flex-wrap:wrap!important;
    gap:8px!important;
    padding:13px 10px!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record-head>div{
    min-width:0!important;
    flex:1 1 220px!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record-head p{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}

@media (max-width:520px){
  #root .amf-admin-shell-native .amf-shell-content-v65:has(.amf-admin-reseller-native){
    padding-left:2px!important;
    padding-right:2px!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record{
    border-radius:10px!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record-head{
    padding:11px 9px!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record-head>span{
    flex:0 0 auto!important;
  }
  #root .amf-admin-reseller-native .amf-p137-record-scroll::-webkit-scrollbar{
    height:7px!important;
  }
}

/* FIX49H — Kelola Pengguna true edge-to-edge authority.
   FIX49G widened the cards but the admin shell still retained desktop p-6,
   leaving the entire Manage Users block inset from the left/right edges.
   Keep one existing UI; only remove the shell side gutter while this route is mounted. */
#root .amf-admin-shell-native .amf-shell-content-v65:has(.amf-admin-users-native){
  padding-left:2px!important;
  padding-right:2px!important;
}
#root .amf-admin-users-native{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}
#root .amf-admin-users-native .amf-admin-users-paragraph-v342{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-x:contain!important;
  scrollbar-width:auto!important;
}
#root .amf-admin-users-native .amf-admin-user-card-v342{
  width:100%!important;
  max-width:none!important;
  min-width:1430px!important;
  box-sizing:border-box!important;
}
#root .amf-admin-users-native .amf-admin-users-paragraph-v342::-webkit-scrollbar{
  display:block!important;
  height:10px!important;
}
#root .amf-admin-users-native .amf-admin-users-paragraph-v342::-webkit-scrollbar-track{
  background:#e8eef5!important;
}
#root .amf-admin-users-native .amf-admin-users-paragraph-v342::-webkit-scrollbar-thumb{
  background:#7890aa!important;
  border:2px solid #e8eef5!important;
  border-radius:999px!important;
}
@media(max-width:767px){
  #root .amf-admin-shell-native .amf-shell-content-v65:has(.amf-admin-users-native){
    padding-left:2px!important;
    padding-right:2px!important;
  }
  #root .amf-admin-users-native{
    width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}

/* =========================================================
   FIX37 ADMIN DELETE ALIGN - 20260905
   Keep FIX37 foundation. Only align Manage Users role menu and Hapus
   button in Tindakan Admin on one horizontal row.
   ========================================================= */
#root .amf-admin-users-native .amf-admin-user-card-v342 > .amf-admin-actions-v342{
  display:grid!important;
  grid-template-columns:minmax(130px,170px) max-content!important;
  grid-template-rows:auto auto!important;
  column-gap:10px!important;
  row-gap:8px!important;
  align-items:center!important;
  align-content:center!important;
  justify-content:flex-start!important;
  flex-direction:initial!important;
}
#root .amf-admin-users-native .amf-admin-user-card-v342 > .amf-admin-actions-v342::before{
  grid-column:1 / -1!important;
  grid-row:1!important;
  margin:0 0 1px!important;
}
#root .amf-admin-users-native .amf-admin-user-card-v342 > .amf-admin-actions-v342 .amf-role-select-v342{
  grid-column:1!important;
  grid-row:2!important;
  width:170px!important;
  max-width:170px!important;
  min-height:34px!important;
  align-self:center!important;
  margin:0!important;
}
#root .amf-admin-users-native .amf-admin-user-card-v342 > .amf-admin-actions-v342 .amf-btn-delete-v342{
  grid-column:2!important;
  grid-row:2!important;
  min-height:34px!important;
  align-self:center!important;
  justify-self:start!important;
  margin:0!important;
  white-space:nowrap!important;
}
