/* Grafana Application Tool six-step wizard.
 * The reusable Connection is configured elsewhere. No light inset backgrounds.
 */
#application-tool-modal .utu-unified-tool-dialog.utu-gw-open{
  width:min(920px,calc(100vw - 32px))!important;
  background:#0b1e2e!important;
  color:#eaf5ff!important;
}
#application-tool-modal .utu-gw-hide{display:none!important;}
#application-tool-modal .utu-gw-open .utu-tool-step-connection{
  background:transparent!important;border:1px solid #274358!important;
  margin:12px 0 0;padding:19px!important;box-shadow:none!important;
}
#application-tool-modal .utu-grafana-wizard{
  display:flex;flex-direction:column;min-width:0;
  color:#e8f4ff;min-height:0;
}
#application-tool-modal .utu-gw-title{margin:4px 0 13px;}
#application-tool-modal .utu-gw-title h2{
  margin:3px 0 7px;font-size:20px;letter-spacing:-.018em;
  color:#f2f8ff;line-height:1.3;
}
#application-tool-modal .utu-gw-title p{
  margin:0;color:#9bb6c9;font-size:12px;
}
#application-tool-modal .utu-gw-progress{
  display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 18px;
  border-bottom:1px solid #214259;padding-bottom:13px;
}
#application-tool-modal .utu-gw-progress span{
  padding:7px 8px;border-radius:8px;font-weight:600;
  background:#0e273b;color:#94aabc;font-size:10.5px;
  border:1px solid #29495f;
}
#application-tool-modal .utu-gw-progress .active{
  background:#0b4982;border-color:#1597ff;color:#fff;
}
#application-tool-modal .utu-gw-progress .done{
  background:#102d3b;border-color:#20878d;color:#b7eae5;
}
#application-tool-modal .utu-gw-stage{
  padding:18px 20px;margin:0 0 16px;min-height:230px;
  border:1px solid #2a4a60;border-radius:14px;
  background:transparent!important;
  display:flex;flex-direction:column;gap:13px;
}
#application-tool-modal .utu-gw-note,
#application-tool-modal .utu-gw-info,
#application-tool-modal .utu-gw-summary{
  border-left:2px solid #119bf4;padding:9px 13px;
  background:transparent!important;color:#afc9dd;font-size:12px;
  line-height:1.5;
}
#application-tool-modal .utu-gw-summary{
  border:1px solid #2a667b;border-radius:9px;
}
#application-tool-modal .utu-gw-summary span{display:block;color:#9bb4c7;margin-top:5px;}
#application-tool-modal .utu-gw-success{color:#42d5a3;font-weight:700;}
#application-tool-modal .utu-gw-error{
  background:transparent;border:1px solid #de6d75;color:#ffb7bd;
  border-radius:10px;padding:10px 13px;margin:0 0 12px;
  font-size:12px;
}
#application-tool-modal .utu-gw-stage label{
  color:#ddecf6;font-size:12px;font-weight:650;min-width:0;
  display:block;
}
#application-tool-modal .utu-gw-stage :is(input:not([type=checkbox]):not([type=radio]),select,textarea){
  background:#102d41!important;color:#e7f6ff!important;
  border:1px solid #305872!important;border-radius:9px!important;
  width:100%;max-width:100%;box-sizing:border-box;min-height:39px;
  margin:5px 0 0;padding:9px 11px;font-size:12.5px;
}
#application-tool-modal .utu-gw-stage :is(input,select,textarea):focus-visible{
  outline:2px solid #258ff2;outline-offset:1px;
}
#application-tool-modal .utu-gw-stage :is(input[type=radio],input[type=checkbox]){
  accent-color:#168df5;min-width:15px;min-height:15px;
}
#application-tool-modal .utu-gw-stage button,
#application-tool-modal .utu-gw-footer button{
  min-height:36px;padding:8px 13px;border:1px solid #2c5976;
  background:#12344b;color:#dceffe;border-radius:8px;
  font-size:12px;cursor:pointer;
}
#application-tool-modal .utu-gw-stage button.primary,
#application-tool-modal .utu-gw-footer button.primary{
  background:#0879eb;border-color:#168ff7;color:white;
}
#application-tool-modal .utu-gw-stage button:disabled,
#application-tool-modal .utu-gw-footer button:disabled{
  cursor:not-allowed;opacity:.55;
}
#application-tool-modal .utu-gw-footer{
  position:sticky;bottom:0;z-index:2;
  display:flex;gap:10px;padding:14px 3px 17px;
  background:#0b1e2e;border-top:1px solid #24445c;
}
#application-tool-modal .utu-gw-footer :is([data-gw-next],[data-stw-next]){margin-left:auto;}
#application-tool-modal .utu-gw-inline{
  display:flex;gap:10px;align-items:end;flex-wrap:wrap;
}
#application-tool-modal .utu-gw-inline input{flex:1 1 240px;}
#application-tool-modal .utu-gw-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:13px;
}
#application-tool-modal .utu-gw-source-tools{
  display:flex;gap:9px;flex-wrap:wrap;align-items:end;
  border-bottom:1px solid #284e63;padding-bottom:12px;
}
#application-tool-modal .utu-gw-source-tools label{flex:1 1 220px;}
#application-tool-modal .utu-gw-pickers{
  display:grid;grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);
  gap:11px;align-items:start;
}
#application-tool-modal .utu-gw-choices{
  padding:9px 11px;border:1px solid #2c536a;border-radius:9px;
  min-height:178px;max-height:255px;overflow-y:auto;
  background:transparent!important;
}
#application-tool-modal .utu-gw-choices .utu-gw-check{
  display:flex;align-items:center;gap:9px;padding:5px 2px;
  font-weight:450;word-break:break-word;
}
#application-tool-modal .utu-gw-choices .utu-gw-check input{
  flex:0 0 15px;margin:0;
}
#application-tool-modal .utu-gw-move{
  display:flex;flex-direction:column;gap:10px;padding-top:65px;
}
#application-tool-modal .utu-gw-move button{width:100%;min-width:0;}
#application-tool-modal .utu-gw-maprow{
  display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);
  align-items:center;gap:10px;
  padding:13px 0;border-bottom:1px solid #2b495e;
}
#application-tool-modal .utu-gw-maprow p{font-size:11px;color:#9cb8c9;}
#application-tool-modal .utu-gw-maprow label{
  display:flex;align-items:center;gap:7px;font-size:11.5px;
}
#application-tool-modal .utu-gw-maprow > input,
#application-tool-modal .utu-gw-maprow > select{grid-column:2/-1;}
#application-tool-modal .utu-gw-extras{min-height:220px;max-height:310px;}
#application-tool-modal .utu-gw-filter{
  display:grid;grid-template-columns:1fr 130px 1fr auto;
  align-items:end;gap:9px;margin:10px 0;
}
#application-tool-modal .utu-gw-advanced{
  border:1px solid #31526b;border-radius:10px;
  padding:13px;background:transparent!important;color:#bcd2df;font-size:12px;
}
#application-tool-modal .utu-gw-advanced summary{cursor:pointer;color:#cfeaff;font-weight:700;}
#application-tool-modal .utu-gw-stage .hint{
  color:#a2bccf;font-size:11px;font-weight:450;line-height:1.45;
}
@media(max-width:720px){
  #application-tool-modal .utu-gw-maprow,
  #application-tool-modal .utu-gw-grid,
  #application-tool-modal .utu-gw-pickers,
  #application-tool-modal .utu-gw-filter{
    grid-template-columns:minmax(0,1fr);
  }
  #application-tool-modal .utu-gw-move{flex-direction:row;padding:0;}
  #application-tool-modal .utu-gw-move button{max-width:60px;}
  #application-tool-modal .utu-gw-maprow > input,
  #application-tool-modal .utu-gw-maprow > select{grid-column:auto;}
  #application-tool-modal .utu-gw-title h2{font-size:18px;}
}

#application-tool-modal .utu-gw-extra-matcher{
  display:grid;grid-template-columns:1fr 1fr 38px;gap:8px;margin:8px 0;
}
@media(max-width:550px){
  #application-tool-modal .utu-gw-extra-matcher{grid-template-columns:1fr;}
}

#application-tool-modal .utu-gw-trace-source{
  padding:12px 0;margin:10px 0;border-top:1px solid #2b4d60;
}
#application-tool-modal .utu-gw-trace-source .utu-gw-inline > input{
  flex:1 1 180px;min-width:0;
}
#application-tool-modal [data-gw-source-predicates]{
  display:flex;flex-direction:column;gap:8px;
}

/* Single-stage design: native Connection step, then only the active step title. */
#application-tool-modal .utu-gw-open .utu-tool-modal-header{
  display:flex!important;justify-content:flex-end!important;
  padding:6px 7px 0!important;margin:0!important;
}
#application-tool-modal .utu-gw-open .utu-tool-modal-header > div{display:none!important;}
#application-tool-modal .utu-gw-open .utu-tool-modal-header .modal-close{
  position:relative!important;top:auto!important;right:auto!important;
}
#application-tool-modal .utu-gw-open .utu-tool-step-connection{
  padding:18px 20px!important;margin:0 0 12px!important;
  background:transparent!important;border:1px solid #29465c!important;
  box-shadow:none!important;
}
#application-tool-modal .utu-gw-open .tool-modal-core{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px 20px!important;align-items:start!important;
}
#application-tool-modal .utu-gw-open .tool-modal-core>label{
  width:100%!important;min-width:0!important;max-width:none!important;
  display:flex!important;flex-direction:column!important;align-items:stretch!important;
  gap:5px!important;
}
#application-tool-modal .utu-gw-open .tool-modal-core>label.switch{
  grid-column:1/-1!important;flex-direction:row!important;
  align-items:center!important;gap:10px!important;
  padding:10px 0 0!important;margin:0!important;
  border-top:1px solid #274358!important;
}
#application-tool-modal .utu-gw-open .tool-modal-core>label.switch input{
  margin:0!important;flex:0 0 16px!important;
}
#application-tool-modal .utu-gw-open .tool-modal-core :is(select,input:not([type="checkbox"])){
  width:100%!important;min-width:0!important;max-width:none!important;
  min-height:40px!important;border-radius:8px!important;
  font-size:13px!important;
}
#application-tool-modal .utu-gw-open .tool-modal-core .field-help{
  font-size:11px!important;color:#98b1c2!important;line-height:1.4!important;
}
#application-tool-modal .utu-gw-title{margin:0 0 13px!important;}
#application-tool-modal .utu-gw-step-meta{
  display:inline-block;margin-bottom:6px;color:#51badb;
  font-size:10px;font-weight:800;letter-spacing:.09em;
}
#application-tool-modal .utu-gw-current-title{margin:0 0 5px!important;}
#application-tool-modal .utu-gw-stage{min-height:0!important;padding:18px 19px!important;}
#application-tool-modal .utu-gw-stage.hidden{display:none!important;}
#application-tool-modal .utu-gw-open .utu-gw-choices{
  height:280px;min-height:180px;max-height:300px;
  overflow-y:auto!important;padding:6px!important;
  border:1px solid #31546a;background:transparent!important;
}
#application-tool-modal .utu-gw-pickers{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:18px!important;align-items:stretch!important;
}
#application-tool-modal .utu-gw-column{min-width:0;display:flex;flex-direction:column;gap:7px;}
#application-tool-modal .utu-gw-list-head{
  display:flex;justify-content:space-between;align-items:center;
  min-height:28px;color:#e7f4ff;font-size:12px;font-weight:750;
}
#application-tool-modal .utu-gw-list-head span{
  font-size:10px;padding:3px 7px;border-radius:12px;
  background:#143248;color:#aed3e7;
}
#application-tool-modal .utu-gw-choice{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:13px!important;min-height:40px!important;margin:0!important;
  width:100%!important;padding:9px 11px!important;text-align:left!important;
  background:transparent!important;border:0!important;border-radius:7px!important;
  color:#d7eafa!important;font-size:12px!important;font-weight:550!important;
  overflow-wrap:anywhere;
}
#application-tool-modal .utu-gw-choice:hover,
#application-tool-modal .utu-gw-choice:focus-visible{
  background:#17374d!important;outline:1px solid #347397!important;
}
#application-tool-modal .utu-gw-choice.selected{
  color:#bdeee3!important;background:#10323d!important;
}
#application-tool-modal .utu-gw-choice-action{
  flex:none;color:#5dc6ec;font-size:10px;font-weight:700;
  opacity:.8;
}
#application-tool-modal .utu-gw-choice.selected .utu-gw-choice-action{color:#9dcfc6;}
#application-tool-modal .utu-gw-choice small{
  display:block;color:#93aec1;font-size:10px;font-weight:400;margin-top:3px;
}
#application-tool-modal .utu-gw-empty{
  color:#98b3c7;font-size:11px;padding:15px 10px;
}
#application-tool-modal .utu-gw-attributes .utu-gw-choices{height:330px;max-height:330px;}
#application-tool-modal .utu-gw-stage .utu-gw-inline-error{
  color:#ffb0b5;border:1px solid #b85c68;border-radius:9px;
  background:transparent!important;padding:10px 12px;font-size:12px;
}
@media(max-width:720px){
  #application-tool-modal .utu-gw-pickers,
  #application-tool-modal .utu-gw-open .tool-modal-core{
    grid-template-columns:minmax(0,1fr)!important;
  }
}


/* Shared create/edit Application Tool controls: consistent full-width dropdowns. */
#application-tool-modal .utu-tool-step-configuration :is(select,input:not([type="checkbox"]):not([type="radio"]),textarea),
#application-tool-modal .utu-gw-stage :is(select,input:not([type="checkbox"]):not([type="radio"]),textarea){
  width:100%!important;min-width:0!important;max-width:100%!important;
  box-sizing:border-box!important;
  background:#102d41!important;color:#e7f6ff!important;border:1px solid #305872!important;
  border-radius:8px!important;
}
#application-tool-modal :is(.utu-gw-stage,.utu-tool-step-configuration) select option{
  background:#102d41!important;color:#e7f6ff!important;
}
#application-tool-modal .utu-gw-maprow{
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)!important;
  gap:12px!important;align-items:center!important;
}
#application-tool-modal .utu-gw-maprow > :is(strong,div:first-child){
  grid-column:1;min-width:0;
}
#application-tool-modal .utu-gw-maprow label{
  display:inline-flex!important;flex-direction:row!important;
  align-items:center!important;justify-content:flex-start!important;
  gap:8px!important;margin:0!important;min-height:36px;
  text-align:left!important;white-space:normal!important;
}
#application-tool-modal .utu-gw-maprow label input[type=radio]{
  width:16px!important;height:16px!important;min-width:16px!important;
  margin:0!important;flex:0 0 16px!important;vertical-align:middle!important;
}
#application-tool-modal .utu-gw-maprow > :is(select,input:not([type="radio"])){
  grid-column:2/-1!important;margin:0!important;
}
#application-tool-modal .utu-gw-inline{
  align-items:center!important;gap:10px!important;
}
#application-tool-modal .utu-gw-inline > button{
  white-space:nowrap;flex:0 0 auto;
}
#application-tool-modal .utu-gw-inline > :is(.hint,small,span){
  flex:1 1 180px;line-height:1.5;
}
#application-tool-modal .utu-gw-pickers .utu-gw-column{
  min-width:0;display:flex;flex-direction:column;gap:8px;
}
#application-tool-modal .utu-gw-pickers .utu-gw-picker-spacer{
  min-height:39px;flex:0 0 39px;visibility:hidden;
}
#application-tool-modal .utu-gw-pickers .utu-gw-column > :is(input,.utu-gw-picker-spacer){
  margin:0!important;height:39px!important;
}
#application-tool-modal .utu-gw-pickers .utu-gw-choices{
  flex:1 1 auto;min-height:250px!important;
}
#application-tool-modal .utu-gw-source-tools :is(select,input){
  width:100%!important;min-width:0!important;
}
@media(max-width:720px){
  #application-tool-modal .utu-gw-maprow{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #application-tool-modal .utu-gw-maprow > :is(strong,div:first-child),
  #application-tool-modal .utu-gw-maprow > :is(select,input:not([type="radio"])){
    grid-column:1/-1!important;
  }
  #application-tool-modal .utu-gw-pickers .utu-gw-picker-spacer{display:none;}
}


/* Field-first Loki Application/Service boundary: two visually coherent steps. */
#application-tool-modal .utu-gw-boundary-block{
  display:flex;flex-direction:column;gap:12px;min-width:0;
  padding:0 0 16px;margin:0 0 4px;
  border-bottom:1px solid #29495f;
}
#application-tool-modal .utu-gw-boundary-block:last-child{
  padding-bottom:0;margin-bottom:0;border-bottom:0;
}
#application-tool-modal .utu-gw-boundary-block h3{
  margin:0;color:#dff1ff;font-size:13px;font-weight:750;
}
#application-tool-modal .utu-gw-boundary-block > p.hint{
  margin:-5px 0 2px;line-height:1.5;
}
#application-tool-modal .utu-gw-boundary-block .utu-gw-inline{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px;
}
#application-tool-modal .utu-gw-boundary-block .utu-gw-inline > button{
  min-width:160px;min-height:38px;
}
#application-tool-modal .utu-gw-boundary-block .utu-gw-inline .hint{
  flex:1 1 180px;text-align:left;
}
#application-tool-modal .utu-gw-maprow :is(select,input:not([type="radio"])):disabled{
  opacity:.7!important;cursor:not-allowed;
}

/* Pixel-aligned Loki service columns: reserve the same three grid rows. */
#application-tool-modal .utu-gw-pickers:has(.utu-gw-picker-spacer) .utu-gw-column{
  display:grid!important;grid-template-rows:28px 39px minmax(250px,1fr)!important;
  align-content:start!important;align-items:stretch!important;gap:8px!important;
}
#application-tool-modal .utu-gw-pickers:has(.utu-gw-picker-spacer) .utu-gw-column > :is(input,.utu-gw-picker-spacer){
  box-sizing:border-box!important;min-height:39px!important;max-height:39px!important;
  height:39px!important;margin:0!important;padding-top:0!important;padding-bottom:0!important;
}
#application-tool-modal .utu-gw-pickers:has(.utu-gw-picker-spacer) .utu-gw-choices{
  box-sizing:border-box!important;margin:0!important;min-height:250px!important;
}
@media(max-width:720px){
  #application-tool-modal .utu-gw-pickers:has(.utu-gw-picker-spacer) .utu-gw-column{
    display:flex!important;flex-direction:column!important;
  }
}

/* Tempo Status field: single Error value picker; observed non-errors are informational. */
#application-tool-modal [data-gw-tempo-error-picker] .utu-gw-choices{min-height:116px!important;max-height:180px!important;}
#application-tool-modal [data-gw-tempo-error-picker] .utu-gw-choice:disabled{
  opacity:.62!important;cursor:not-allowed!important;outline:none!important;
}
#application-tool-modal [data-gw-tempo-error-picker] .utu-gw-choice:disabled:hover{
  background:transparent!important;outline:none!important;
}
#application-tool-modal [data-gw-tempo-error-picker] .utu-gw-choice.selected:disabled:hover{
  background:#10323d!important;
}
