/* MyTalentFunded Admin CRM - global layout and encoding presentation hotfix */
html,body{max-width:100%;overflow-x:hidden}
.main{min-width:0;width:100%;overflow:hidden}
.content{width:100%;max-width:1800px;min-width:0;padding:26px 28px 40px}
.page-head{min-width:0}
.card,.stat,.table-wrap,.detail,.drawer{min-width:0}
.table-wrap{width:100%;max-width:100%;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
table{width:100%;min-width:900px}
th,td{vertical-align:middle}
.sidebar .brand img{width:190px;max-width:100%}
.nav button{font-size:12px;line-height:1.25}
.topbar{min-width:0}
.top-actions{min-width:0}
.staff-name{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* User/KYC drawers are operational workspaces; give tables enough room. */
.drawer{width:min(1180px,92vw);max-width:92vw}
.drawer-head{padding:18px 22px;gap:16px}
.drawer-body{padding:20px 22px 32px}
.drawer .detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.drawer .table-wrap{margin-top:10px;border-radius:12px}
.drawer table{min-width:1080px}
.drawer th,.drawer td{padding:10px 11px;font-size:11px}
.drawer th{font-size:9px}
.drawer table[data-credentials-enhanced="1"] th:last-child,
.drawer table[data-credentials-enhanced="1"] td:last-child{position:sticky;right:0;z-index:3;background:#08110d;box-shadow:-12px 0 20px rgba(0,0,0,.28)}
.drawer table[data-credentials-enhanced="1"] th:last-child{z-index:4;background:#0a130f}
.drawer table[data-credentials-enhanced="1"] td:last-child{min-width:132px}
.drawer .credential-edit-btn{white-space:nowrap}

/* Dim the main CRM while a detail drawer is open. */
body.admin-drawer-open:before{content:"";position:fixed;inset:0;background:rgba(0,0,0,.38);z-index:44;pointer-events:none;backdrop-filter:blur(1px)}
.drawer{z-index:50}

/* Keep modal above drawer/backdrop. */
.modal-backdrop{z-index:70}
.toast{z-index:100}

/* Consistent responsive behavior across all admin modules. */
@media(max-width:1200px){
  .content{padding:22px 20px 34px}
  .drawer{width:96vw;max-width:96vw}
  .drawer .detail-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .content{padding:18px 13px 28px}
  .drawer{width:100vw;max-width:100vw}
  .drawer-head{padding:15px}
  .drawer-body{padding:15px 13px 24px}
  .drawer .detail-grid{grid-template-columns:1fr}
  .drawer table{min-width:980px}
  .sidebar .brand img{width:178px}
}
