/* Scoped account management, leaving the application's theme unchanged. */
.accountListFilters, .accountSavedPresetBar { display:grid; grid-template-columns:2fr 1fr 1fr auto; gap:12px; align-items:end; margin:12px 0; }
.accountListFilters label, .accountSavedPresetBar label { display:grid; gap:6px; min-width:0; }
.accountListFilters input, .accountListFilters select, .accountSavedPresetBar input, .accountSavedPresetBar select { width:100%; min-width:0; min-height:44px; font:inherit; }
.accountSavedPresetBar { grid-template-columns:1fr 1fr auto; padding:12px; border:1px solid var(--line); border-radius:12px; }
.accountSavedPresetBar small { grid-column:1/-1; color:var(--muted); }
.accountTable td { text-align:left !important; padding:12px !important; vertical-align:middle; overflow-wrap:anywhere; }
.accountTable th { text-align:left !important; }
.accountTable td small { display:block; margin-top:4px; }
.accountTable .accountRole { font-weight:700; }
.accountTable .ghostBtn { min-height:44px; }
#accountDialog { width:min(880px,calc(100vw - 24px)) !important; padding:0 !important; }
#accountDialog form { height:auto !important; max-height:calc(100dvh - 24px) !important; min-height:0 !important; }
#accountDialog header, #accountDialog footer { gap:8px; }
#accountDialog footer button { min-height:44px; padding:10px 14px !important; }
#accountDialog .accountDialogGrid { grid-template-columns:1fr 1fr; }
#accountDialog .accountDialogGrid label:last-child { grid-column:1/-1; }
#accountDialog .accountDialogGrid input, #accountDialog .accountDialogGrid select { font-size:16px !important; min-height:44px; }
#accountDialog .accountPermissionChoices .permissionGroupGrid { grid-template-columns:repeat(2,minmax(0,1fr)); }
#accountDialog .permissionGroup { align-self:start; }
#accountDialog .permissionGroup > summary { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:12px; min-height:44px; cursor:pointer; font-weight:600; background:var(--panel,#f7f9fb); }
#accountDialog .permissionGroup > summary div { display:flex; align-items:center; gap:8px; }
#accountDialog .permissionChoice { padding:8px; }
#accountDialog .permissionChoice input { width:20px !important; height:20px !important; min-width:20px; flex:0 0 20px; }
#accountDialog .accountActiveToggle input { width:20px !important; height:20px !important; }
#accountDialog .accountActiveToggle { min-height:44px; align-items:center; }
#accountDialog .permissionChoice small { font-size:12px !important; line-height:1.45; }
#accountDialog .permissionChoice strong, #accountDialog .accountActiveToggle span { font-size:14px !important; }
#accountDialog .accountSavedPresetBar button { min-height:44px; }
.studentFlowUnknown { margin:12px 0; padding:12px; border:1px solid var(--line); border-radius:10px; }
.studentFlowUnknown summary { cursor:pointer; min-height:32px; }
.studentFlowFilters [data-flow-clear] { min-height:44px; align-self:end; }
@media(max-width:640px) {
  .accountListFilters { grid-template-columns:1fr 1fr; }
  .accountListFilters label:first-child { grid-column:1/-1; }
  .accountSavedPresetBar, #accountDialog .accountDialogGrid, #accountDialog .accountPermissionChoices .permissionGroupGrid { grid-template-columns:1fr; }
  .accountAdminHeader { align-items:start; flex-wrap:wrap; gap:12px; }
  .accountTableWrap { overflow-x:hidden !important; }
  .accountTable, .accountTable tbody { display:block; width:100% !important; min-width:0 !important; }
  .accountTable thead { display:none; }
  .accountTable tr { display:grid; grid-template-columns:1fr; margin:10px 0; border:1px solid var(--line); border-radius:12px; padding:8px; }
  .accountTable td { display:grid; grid-template-columns:88px minmax(0,1fr); gap:8px; border:0 !important; padding:6px !important; }
  .accountTable td::before { content:attr(data-label); color:var(--muted); font-size:13px; }
  .accountTable td small { grid-column:2; margin:0; }
  #accountDialog .accountDialogBody { padding:12px; }
  #accountDialog header { padding:12px; }
  #accountDialog footer { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); padding:12px; }
  #accountDialog footer button { min-width:0; white-space:normal; }
  #accountDialog footer .primaryBtn { grid-column:1/-1; }
  #accountDialog .accountHeaderActions { gap:6px; }
  #accountDialog .accountActiveToggle { display:none; } /* Explicit Tắt/Mở remains in footer. */
  #accountDialog .accountScopeHeader { flex-wrap:wrap; }
  #accountCreateDialog .accountCreateDialogBody { grid-template-columns:1fr; }
}
@media(max-width:360px) {
  #accountDialog footer button[name="disableAccount"], #accountDialog footer button[name="deleteAccount"] { grid-column:1/-1; }
}