/* UTU Engine — Settings, Users, Analytics and compact Kubernetes form polish.
   Loaded last to take precedence over legacy theme and Network Tool styles. */

/* Compact left-aligned checkboxes across forms, without oversized icons. */
#app-shell input[type="checkbox"],
#application-tool-modal input[type="checkbox"],
#user-modal-backdrop input[type="checkbox"]{
  appearance:auto!important;-webkit-appearance:checkbox!important;
  display:inline-block!important;width:16px!important;height:16px!important;
  min-width:16px!important;max-width:16px!important;
  min-height:16px!important;max-height:16px!important;
  flex:0 0 16px!important;position:static!important;
  margin:0 8px 0 0!important;padding:0!important;
  vertical-align:middle!important;transform:none!important;
  box-shadow:none!important;border-radius:3px!important;
  accent-color:#00bdd3;
}
#app-shell label.switch,
#application-tool-modal label.switch,
#user-modal-backdrop label.switch{
  display:flex!important;flex-direction:row!important;
  align-items:center!important;justify-content:flex-start!important;
  gap:5px!important;min-height:22px!important;
  text-align:left!important;
}
#app-shell label.switch .field-help,
#application-tool-modal label.switch .field-help{
  font-weight:400;font-size:11px;line-height:1.5;
  margin-left:3px;
}
#application-tool-modal .utu-tool-substep-fields label:has([data-field="generic_read_enabled"]){
  grid-column:1 / -1!important;align-items:center!important;
  display:flex!important;flex-direction:row!important;
  gap:7px!important;justify-content:flex-start!important;
  white-space:normal;min-height:28px;
}
#application-tool-modal .utu-tool-substep-fields label:has([data-field="generic_read_enabled"]) .field-help{
  margin:0 0 0 6px;display:inline;font-weight:400!important;max-width:85ch;
}

/* Network Diagnostics: three compact sequential sections, never tall columns. */
#application-tool-modal .network-diagnostics-editor .net-wizard-steps{
  display:flex!important;flex-direction:column!important;
  gap:10px!important;align-items:stretch!important;
  grid-template-columns:none!important;
}
#application-tool-modal .network-diagnostics-editor .net-wizard-steps[hidden]{display:none!important;}
#application-tool-modal .network-diagnostics-editor .net-step-card{
  min-height:0!important;height:auto!important;
  max-height:none!important;display:block!important;
  padding:14px 16px!important;overflow:visible!important;
}
#application-tool-modal .network-diagnostics-editor .net-step-card>.net-step-head{
  min-height:0!important;align-items:center!important;
  margin:0 0 12px!important;gap:11px!important;
}
#application-tool-modal .network-diagnostics-editor .net-sync-controls,
#application-tool-modal .network-diagnostics-editor .net-timeout,
#application-tool-modal .network-diagnostics-editor .net-deep-fields{
  width:min(100%,580px)!important;max-width:580px!important;
  margin-bottom:9px!important;
}
#application-tool-modal .network-diagnostics-editor .net-sync-status,
#application-tool-modal .network-diagnostics-editor .net-access-status,
#application-tool-modal .network-diagnostics-editor .net-deep-status{
  min-height:0!important;height:auto!important;
  max-height:none!important;display:block!important;
  flex:none!important;width:100%!important;
  padding:9px 12px!important;margin-top:9px!important;
}
#application-tool-modal .network-diagnostics-editor .net-deep-expanded[hidden]{display:none!important;}
#application-tool-modal .network-diagnostics-editor .net-deep-expanded{
  display:flex!important;flex-direction:column!important;
  align-items:stretch!important;gap:8px!important;
}
#application-tool-modal .network-diagnostics-editor .net-deep-toggle .network-compact-check{
  width:auto!important;max-width:100%!important;
  display:flex!important;align-items:center!important;
}
#application-tool-modal .network-diagnostics-editor .net-action-row{
  justify-content:flex-start!important;margin-top:6px!important;
}

/* Settings: consistent top-aligned Home-style panels. */
#settings-view .settings-layout{align-items:start!important;}
#settings-view .settings-nav-card{
  margin:0!important;align-self:start!important;
  border-radius:18px!important;
}
#settings-view .settings-content{
  min-width:0;width:100%;margin:0!important;
  display:grid;align-content:start;grid-auto-rows:max-content;gap:12px;
}
#settings-view .settings-content>.panel,
#settings-view .settings-content .general-settings-card{
  margin:0!important;padding:22px 24px!important;
  border-radius:20px!important;
  border:1px solid var(--utu-stroke,#34536b)!important;
  background:var(--utu-panel,#152d40)!important;
  box-shadow:none!important;
}
#settings-view .settings-content h2{font-size:21px;margin:5px 0 8px;}
#settings-view .settings-content label{min-width:0;}
#settings-view #analytics-settings-pane{
  display:block;min-width:0;width:100%;
}
#settings-view #analytics-settings-pane.hidden{display:none!important;}
#settings-view .analytics-settings-layout{
  display:grid;grid-template-columns:minmax(0,1fr);gap:12px;
  align-items:start;
}
#settings-view .analytics-pricing-form,
#settings-view .analytics-pricing-list-panel{
  width:100%;margin:0!important;padding:22px 24px!important;
  background:var(--utu-panel,#152d40)!important;
  border:1px solid var(--utu-stroke,#34536b)!important;
  border-radius:20px!important;
}
#settings-view #analytics-settings-pane :is(input,select){min-width:0;max-width:100%;}
#settings-view .pricing-table{overflow-x:auto;}

/* User list: 10 per page and real-time search. */
#users-view .utu-users-search-bar{
  display:flex;align-items:center;
  width:min(100%,450px);margin:0 0 16px;
  position:relative;
}
#users-view .utu-users-search-bar svg{
  width:17px;height:17px;position:absolute;left:13px;
  stroke:var(--utu-subtext,#99afc0);fill:none;
  stroke-width:2;pointer-events:none;
}
#users-view #utu-users-search{
  width:100%;height:39px;border-radius:11px;
  border:1px solid var(--utu-stroke,#32546a)!important;
  background:var(--utu-panel-soft,#203b50)!important;
  color:var(--utu-text,#f1f7fc)!important;
  padding:8px 13px 8px 40px;
  font-size:12px;
}
#users-view #utu-users-search:focus{outline:2px solid rgba(0,195,215,.4);}

/* User Create / Edit are separate modal overlays, not embedded below the table. */
.user-modal-backdrop{
  position:fixed;inset:0;z-index:2250;
  display:grid;place-items:center;
  padding:22px;background:rgba(5,13,26,.74);
  backdrop-filter:blur(14px);
  overflow-y:auto;
}
.user-modal-backdrop.hidden{display:none!important;}
#user-modal-backdrop .user-editor-modal{
  display:block;position:relative;
  width:min(800px,100%);max-width:100%;
  max-height:calc(100dvh - 44px);overflow:auto;
  margin:auto!important;padding:24px!important;
  border-radius:20px;
  background:var(--utu-panel,#142c40)!important;
  border:1px solid var(--utu-stroke,#355a70)!important;
  color:var(--utu-text,#eaf5fc)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.45)!important;
}
#user-modal-backdrop .utu-user-editor-head{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:12px;margin-bottom:17px;
}
#user-modal-backdrop .utu-user-editor-head h2{font-size:24px;margin:0 0 6px;}
#user-modal-backdrop .utu-user-editor-head p{color:var(--utu-subtext);font-size:12px;margin:0;}
#user-modal-backdrop .utu-user-editor-close{
  width:33px;height:33px;flex:0 0 33px;
  padding:3px;border-radius:11px;
  background:var(--utu-panel-soft);border:1px solid var(--utu-stroke);
  color:var(--utu-text);font-size:21px;
}
#user-modal-backdrop .user-editor-modal>.grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px 16px;align-items:end;
}
#user-modal-backdrop .user-editor-modal>.grid>label{min-width:0;max-width:100%;}
#user-modal-backdrop .user-editor-modal input:not([type="checkbox"]),
#user-modal-backdrop .user-editor-modal select{
  max-width:100%;width:100%;min-width:0;
}
#user-modal-backdrop #user-application-scope{
  padding:16px 18px;margin-top:16px;
  border:1px solid var(--utu-stroke,#345b70)!important;
  border-radius:14px!important;background:var(--utu-panel-soft,#1e374d);
}
#user-modal-backdrop .utu-user-app-picker{
  display:flex;gap:8px;align-items:end;margin:12px 0;
}
#user-modal-backdrop .utu-user-app-picker>label{flex:1;min-width:0;}
#user-modal-backdrop .utu-user-app-picker>button{
  height:38px;flex-shrink:0;
}
#user-modal-backdrop .utu-user-app-chips{
  display:flex;flex-wrap:wrap;gap:8px;min-height:34px;
  margin:12px 0 4px;
}
#user-modal-backdrop .utu-user-app-chip{
  display:inline-flex;align-items:center;gap:7px;
  padding:6px 9px;border-radius:999px;
  border:1px solid var(--utu-stroke,#305168);
  background:var(--utu-panel,#173246);
  color:var(--utu-text);font-size:11px;
}
#user-modal-backdrop .utu-user-app-chip button{
  border:0;background:transparent;color:inherit;
  padding:0 2px;font-size:15px;line-height:1;box-shadow:none;
}
#user-modal-backdrop .user-editor-modal>.actions{
  display:flex;justify-content:flex-end;gap:10px;
  margin-top:20px;align-items:center;
}
#user-modal-backdrop #delete-user{margin-right:auto;}
@media(max-width:700px){
 #user-modal-backdrop .user-editor-modal{padding:16px!important;}
 #user-modal-backdrop .user-editor-modal>.grid{grid-template-columns:1fr;}
 #settings-view .settings-content>.panel{padding:16px!important;}
}

/* Analytics: KPI captions, numbers and supporting text centered. */
#analytics-view .analytics-kpi{
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;min-height:110px;
}
#analytics-view .analytics-kpi :is(span,strong,small){
  text-align:center;max-width:100%;overflow-wrap:anywhere;
}
