/* Approved UTU Engine Notifications + Triggers UI.
 * Application and Status align at precisely 46% / 68% in both peer tables:
 * Channels and Accounts/Sources: Name 32 + Type 14 + Application 22 + Status 12 + Actions 20.
 * Rules: Name 46 + Application 22 + Status 12 + Actions 20.
 */
#notifications-view #notification-settings,
#triggers-view #trigger-settings{
  display:flex;flex-direction:column;
  align-items:stretch;
  width:100%;min-width:0;gap:13px;
  padding:0!important;border:0!important;
  background:transparent!important;box-shadow:none!important;
}
#notifications-view #notification-settings .panel,
#triggers-view #trigger-settings .panel{
  margin:0!important;
  background:var(--utu-panel,#142d41)!important;
  border:1px solid var(--utu-stroke,#2b516a)!important;
  border-radius:17px!important;
  padding:17px 19px!important;
  box-shadow:none!important;
}
#notifications-view .utu-operations-title,
#triggers-view .utu-operations-title{
  padding:0 2px 3px;
}
#notifications-view .utu-operations-title .eyebrow,
#triggers-view .utu-operations-title .eyebrow{
  margin:0 0 6px;
  color:var(--utu-highlight,#10cbe0);
  font-size:10.5px;letter-spacing:.13em;
  font-weight:800;text-transform:uppercase;
}
#notifications-view .utu-operations-title h1,
#triggers-view .utu-operations-title h1{
  margin:0 0 5px;
  color:var(--utu-text,#eef9ff);
  font-size:27px;letter-spacing:-.04em;
}
#notifications-view .utu-operations-title p,
#triggers-view .utu-operations-title p{
  margin:0;color:var(--utu-subtext,#a7bdcc);
  font-size:11.5px;line-height:1.55;
}
.utu-operations-panel-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;margin-bottom:13px;
}
.utu-operation-heading{
  display:flex;align-items:center;gap:12px;min-width:0;
}
.utu-operation-step{
  display:grid;place-items:center;
  width:33px;height:33px;flex:0 0 33px;
  border-radius:10px;
  background:#0d698d;
  border:1px solid #168daf;
  color:#ddfaff;
  font-size:16px;font-weight:850;
}
.utu-operation-heading .eyebrow{
  margin:0 0 3px!important;
  color:var(--utu-highlight,#27d0df);
  letter-spacing:.12em;text-transform:uppercase;
  font-size:10px;font-weight:800;
}
.utu-operation-heading h2{
  margin:0 0 4px!important;
  color:var(--utu-text,#f1f8fd);
  font-size:17px!important;font-weight:800;
}
.utu-operation-heading p{
  margin:0!important;
  color:var(--utu-subtext,#adbfcc)!important;
  font-size:11px!important;line-height:1.4;
}
.utu-operations-head-actions{
  display:flex;align-items:center;
  flex-wrap:wrap;justify-content:flex-end;gap:9px;
  flex:0 0 auto;
}
.utu-operations-head-actions button{
  min-height:36px!important;
  padding:8px 13px!important;
  border-radius:9px!important;
  font-size:11px!important;
  font-weight:750;white-space:nowrap;
}
.utu-operations-search{
  display:flex;align-items:center;gap:5px;
  min-width:185px;width:220px;
  max-width:100%;
  border:1px solid var(--utu-stroke,#365771);
  background:var(--utu-panel-soft,#1d394e);
  border-radius:9px;padding:0 9px;
  color:var(--utu-subtext,#99bccf);
}
.utu-operations-search span{font-size:20px;line-height:1;}
.utu-operations-search input{
  width:100%;min-width:0;
  min-height:35px!important;height:35px!important;
  padding:5px 3px!important;margin:0!important;
  background:transparent!important;border:0!important;
  box-shadow:none!important;outline:0!important;
  color:var(--utu-text,#eaf7fb)!important;
  font-size:11px;font-weight:500;
}
.utu-operations-search:focus-within{
  outline:2px solid var(--utu-highlight,#0bc8df);
  outline-offset:2px;
}
.utu-operations-table-wrap{
  width:100%;max-width:100%;min-width:0;
  overflow-x:auto;
  border:1px solid var(--utu-stroke-soft,#2b4e63);
  border-radius:11px;
}
.utu-operations-table{
  width:100%;
  min-width:930px;
  border-collapse:collapse;
  table-layout:fixed;
  color:var(--utu-text,#eaf6fc);
  font-size:11px;
}
.utu-operations-history-table{min-width:950px;table-layout:auto;}
.utu-operations-table thead th{
  background:var(--utu-panel-hover,#1b3d53)!important;
  color:var(--utu-subtext,#b0c9d8)!important;
  border-bottom:1px solid var(--utu-stroke-soft,#345670);
  font-size:9.5px;font-weight:820;
  letter-spacing:.085em;text-transform:uppercase;
  text-align:left;
  padding:10px 13px!important;
  white-space:nowrap;
}
.utu-operations-table td{
  padding:10px 13px!important;
  background:transparent!important;
  border-bottom:1px solid var(--utu-stroke-soft,#294e66)!important;
  color:var(--utu-text,#e6f4fb)!important;
  font-size:11px;line-height:1.4;
  vertical-align:middle;
  overflow-wrap:anywhere;
}
.utu-operations-table tbody tr:last-child td{border-bottom:0!important;}
.utu-operations-table tbody tr:hover td{
  background:var(--utu-panel-hover,#1a3c52)!important;
}
.utu-operations-table td strong{
  color:var(--utu-text,#f0faff)!important;
  font-size:11.5px;font-weight:790;
}
.utu-operations-table td .meta{
  font-size:10px;color:var(--utu-subtext,#aabcca);
}
.utu-operations-status{
  display:inline-flex;align-items:center;gap:6px;
  min-height:24px;padding:4px 10px;
  border-radius:999px;font-size:10px;
  font-weight:740;white-space:nowrap;
  border:1px solid transparent;
}
.utu-operations-status i{
  width:8px;height:8px;flex:0 0 8px;
  border-radius:50%;background:currentColor;
}
.utu-operations-status.enabled{
  color:#63e5b7;background:rgba(16,145,100,.24);
  border-color:rgba(30,174,122,.23);
}
.utu-operations-status.disabled{
  color:#a8c0d2;background:rgba(103,123,154,.17);
  border-color:rgba(126,150,171,.18);
}
.utu-operations-status.failed{
  color:#ffa2a9;background:rgba(173,45,65,.24);
  border-color:rgba(221,65,80,.24);
}
.utu-operations-actions{
  display:flex;align-items:center;
  gap:6px;justify-content:flex-start;flex-wrap:wrap;
}
.utu-operations-actions button,
.utu-operations-history-table button{
  min-height:30px;padding:6px 11px;
  border-radius:8px!important;
  background:var(--utu-panel-hover,#1d4157)!important;
  border:1px solid var(--utu-stroke,#345870)!important;
  color:var(--utu-text,#eff7fc)!important;
  font-size:10.5px;font-weight:700;white-space:nowrap;
}
.utu-operations-actions .danger{
  background:#be3544!important;
  border-color:#cf5360!important;
  color:#fff!important;
}
.utu-operation-empty{
  min-height:55px;text-align:center!important;
  color:var(--utu-subtext,#b1c8d5)!important;
  padding:23px!important;
}
.utu-operations-pager{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:8px;
  margin-top:11px;
  font-size:10.5px;
  color:var(--utu-subtext,#adc1cf);
}
.utu-operations-pager nav{
  display:flex;align-items:center;gap:5px;flex-wrap:wrap;
}
.utu-operations-pager button{
  width:30px;min-height:29px;padding:4px!important;
  border:1px solid var(--utu-stroke,#30586d)!important;
  background:var(--utu-panel-soft,#1e3c51)!important;
  color:var(--utu-text,#eef8fd)!important;
  font-size:11px;font-weight:800;
  border-radius:8px!important;
}
.utu-operations-pager button[aria-current="page"]{
  background:#087e9b!important;
  border-color:#0ed0dc!important;
  color:#fff!important;
}
.utu-operations-pager button:disabled{opacity:.37;cursor:not-allowed;}
.utu-operation-page-gap{color:var(--utu-subtext,#a4b8c6);padding:0 5px;}
/* Shared Notifications/Triggers modal forms. Preserve every provider field. */
.notification-modal .utu-operations-editor{
  display:block;
  width:min(820px,calc(100vw - 44px))!important;
  max-width:none!important;min-width:0!important;
  max-height:calc(100dvh - 42px)!important;
  overflow:auto!important;
  margin:auto!important;
  padding:22px 24px 0!important;
  border-radius:20px!important;
  border:1px solid var(--utu-stroke,#33576e)!important;
  background:var(--utu-panel,#152f43)!important;
  color:var(--utu-text,#eef7fc)!important;
  box-shadow:0 25px 75px rgba(0,0,0,.42)!important;
}
.notification-modal .utu-operations-editor-rule,
.notification-modal .utu-operations-editor-source{
  width:min(990px,calc(100vw - 44px))!important;
}
.notification-modal .utu-operations-editor-account{
  width:min(710px,calc(100vw - 44px))!important;
}
.notification-modal .utu-operations-editor-header{
  display:flex;justify-content:space-between;gap:14px;
  align-items:flex-start;margin:0 0 15px;
}
.notification-modal .utu-operations-editor-header .eyebrow{
  color:var(--utu-highlight,#05cadb);
  letter-spacing:.13em;text-transform:uppercase;
  font-size:10.5px;font-weight:850;margin:0 0 7px!important;
}
.notification-modal .utu-operations-editor-header h2{
  font-size:23px!important;font-weight:810;
  color:var(--utu-text,#eef9fd)!important;
  margin:0 0 6px;
}
.notification-modal .utu-operations-editor-header p{
  font-size:12px;line-height:1.48;
  color:var(--utu-subtext,#b2c5d1)!important;
  max-width:82ch;margin:0;
}
.notification-modal .utu-operations-editor .modal-close{
  flex:0 0 36px;width:36px;height:36px;
  font-size:24px;
  border-radius:10px!important;
  color:var(--utu-text,#edf9fd);
  background:var(--utu-panel-soft,#1b3b50);
  border:1px solid var(--utu-stroke,#335971);
}
.notification-modal .utu-operations-editor-group-label{
  display:flex;align-items:center;gap:9px;
  margin:15px 0 10px;
  font-size:12px;font-weight:780;
  color:var(--utu-text,#eef7fc);
}
.notification-modal .utu-operations-editor-group-label span{
  display:grid;place-items:center;
  width:25px;height:25px;flex:0 0 25px;
  border-radius:8px;background:#087a9e;
  border:1px solid #159fc1;color:#fff;
  font-size:12px;font-weight:810;
}
.notification-modal .utu-operations-editor :is(label,small){
  color:var(--utu-text,#eef8fd);
}
.notification-modal .utu-operations-editor label{
  font-size:11px!important;font-weight:740;
}
.notification-modal .utu-operations-editor :is(input:not([type="checkbox"]),select,textarea){
  border-radius:9px!important;
  border:1px solid var(--utu-stroke,#365a73)!important;
  background:var(--utu-panel-soft,#1e3c51)!important;
  color:var(--utu-text,#f1f9ff)!important;
  font-size:11.5px!important;
  max-width:100%;
}
.notification-modal .utu-operations-editor input[type=checkbox]{
  appearance:auto!important;
  width:15px!important;height:15px!important;
  min-height:15px!important;
  margin:0 6px 0 0!important;
  accent-color:#0bb9d0;
  flex:0 0 15px;
}
.notification-modal .utu-operations-editor .notification-check,
.notification-modal .utu-operations-editor .trigger-small-check{
  display:flex;align-items:center;gap:5px;
  min-height:24px;
  padding:2px 4px!important;
  font-size:10.5px!important;line-height:1.4;
}
.notification-modal .utu-operations-editor .notification-check-list{
  gap:3px!important;
}
.notification-modal .utu-operations-editor :is(.notification-rule-editor-grid>section,.notification-content-section,.trigger-editor-section){
  border:1px solid var(--utu-stroke-soft,#2e5065)!important;
  border-radius:12px!important;
  background:var(--utu-panel-soft,#1b394d)!important;
  padding:12px!important;
  min-width:0;
}
.notification-modal .utu-operations-editor .security-invariant-note{
  border-radius:10px!important;
  padding:10px 11px!important;
  background:var(--utu-panel-soft,#1d3d53)!important;
  color:var(--utu-subtext,#adc7d6)!important;
  font-size:10.5px!important;line-height:1.48;
}
.notification-modal .utu-operations-editor-footer{
  position:sticky;bottom:0;z-index:2;
  margin:18px -24px 0!important;
  padding:13px 24px!important;
  border-top:1px solid var(--utu-stroke-soft,#2e556c);
  background:var(--utu-panel,#152e43)!important;
  display:flex;align-items:center;justify-content:flex-end;
  gap:8px;
}
.notification-modal .utu-operations-editor-footer button{
  min-height:35px!important;padding:7px 12px!important;
  font-size:11px;font-weight:750;
  border-radius:9px!important;
}
#settings-view #investigation-trigger-settings.settings-content{
  display:grid;align-content:start;
  margin:0!important;padding:0!important;
  border:0!important;background:transparent!important;
}
#settings-view #investigation-trigger-settings.settings-content.hidden{
  display:none!important;
}
#settings-view #investigation-trigger-settings .utu-settings-general-card{
  width:100%;max-width:none!important;
  border-radius:17px!important;
  padding:23px 25px!important;
  background:var(--utu-panel,#132b3f)!important;
  border:1px solid var(--utu-stroke,#30536b)!important;
  margin:0!important;
}
#settings-view #investigation-trigger-settings .eyebrow{
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  font-weight:820;color:var(--utu-highlight,#12d0dc)!important;margin:0 0 8px;
}
#settings-view #investigation-trigger-settings h2{
  font-size:19px!important;color:var(--utu-text,#eaf7fc)!important;
  margin:0 0 8px!important;
}
#settings-view #investigation-trigger-settings .utu-general-description{
  font-size:12.5px;color:var(--utu-subtext,#adc2d0)!important;
  margin:0 0 19px!important;
}
#settings-view #investigation-trigger-settings .utu-settings-list{
  border:1px solid var(--utu-stroke-soft,#28495e);
  border-radius:13px;overflow:hidden;
  display:flex;flex-direction:column;
}
#settings-view #investigation-trigger-settings .utu-settings-row{
  display:grid;align-items:center;
  grid-template-columns:minmax(0,1fr) minmax(245px,37%);
  gap:22px;padding:16px 19px;
  border-bottom:1px solid var(--utu-stroke-soft,#28495e);
  background:var(--utu-panel-soft,#1a384c);
}
#settings-view #investigation-trigger-settings .utu-settings-row:last-child{border-bottom:0;}
#settings-view #investigation-trigger-settings .utu-settings-row-copy label{
  display:block;margin:0 0 5px;font-size:13px;font-weight:780;
  color:var(--utu-text,#ecf7fb)!important;
}
#settings-view #investigation-trigger-settings .utu-settings-row-copy p{
  margin:0!important;font-size:11.5px;line-height:1.5;
  color:var(--utu-subtext,#a8c1d0)!important;
}
#settings-view #investigation-trigger-settings .utu-settings-row-control input{
  width:100%!important;min-height:40px!important;
  padding:8px 12px!important;
  font-size:12px!important;font-weight:660!important;line-height:1.4!important;
  border-radius:9px!important;
  border:1px solid var(--utu-stroke,#375b70)!important;
  color:var(--utu-text,#f1f9fc)!important;
  background:var(--utu-panel,#172f43)!important;
}
#settings-view #investigation-trigger-settings .utu-trigger-correlation-hint{
  margin:13px 0;color:var(--utu-subtext,#adc3d0);
  font-size:11px;line-height:1.5;
}
#settings-view #investigation-trigger-settings .utu-settings-general-footer{
  display:flex;justify-content:flex-end;
  margin:0!important;padding:0!important;
}
#settings-view #investigation-trigger-settings #save-trigger-global{
  border-radius:9px;min-height:39px;padding:8px 16px;
}
:root[data-theme="light"] :is(#notifications-view,#triggers-view) .utu-operations-panel{
  background:#f7fbfe!important;border-color:#c9dce7!important;
}
:root[data-theme="light"] .utu-operations-table thead th{
  color:#49697a!important;background:#e7f2f8!important;
}
:root[data-theme="light"] .utu-operations-table td,
:root[data-theme="light"] .utu-operations-table td strong{
  color:#24475a!important;border-color:#dbe9f1!important;
}
:root[data-theme="light"] .utu-operations-status.enabled{
  background:#e0f5e9;color:#226f57;border-color:#c6e7d4;
}
:root[data-theme="light"] .utu-operations-status.disabled{
  background:#e8f0f8;color:#536e7c;border-color:#d2e3ef;
}
:root[data-theme="light"] .utu-operations-status.failed{
  background:#fbe5e7;color:#ac4655;border-color:#f1cbd0;
}
:root[data-theme="light"] #investigation-trigger-settings .utu-settings-row{
  background:#eff7fb!important;border-color:#d6e6f0!important;
}
:root[data-theme="light"] #investigation-trigger-settings .utu-settings-row-control input{
  background:#fff!important;color:#284b5e!important;border-color:#c3d9e7!important;
}
@media(max-width:1050px){
  .utu-operations-panel-head{align-items:stretch;flex-direction:column;}
  .utu-operations-head-actions{justify-content:flex-start;}
  .utu-operations-search{width:100%;max-width:330px;}
}
@media(max-width:780px){
  #settings-view #investigation-trigger-settings .utu-settings-row{
    grid-template-columns:1fr;gap:10px;
  }
  .notification-modal .utu-operations-editor{padding:17px 17px 0!important;}
  .notification-modal .utu-operations-editor-footer{
    margin:16px -17px 0!important;padding:12px 17px!important;
  }
}


/* All five action-bearing Notifications/Triggers tables keep Actions flush right.
 * Inbound History ends in Investigation, not Actions, and is intentionally unchanged. */
.utu-operations-table.utu-operations-has-actions th:last-child,
.utu-operations-table.utu-operations-has-actions td:last-child {
  text-align:right!important;
  padding-right:9px!important;
}
.utu-operations-table.utu-operations-has-actions .utu-operations-actions {
  justify-content:flex-end;
  flex-wrap:wrap;
}


/* LIGHT: equal-width/height form controls across all four operation editors.
   Keep routing rule rows and the existing checked/disabled behavior unchanged. */
.notification-modal .utu-operations-editor :is(.utu-operations-editor-basics, #notification-channel-fields,
  .trigger-specific-grid, .trigger-policy-defaults, .notification-rule-editor-grid) label{
  min-width:0;
}
.notification-modal .utu-operations-editor label > :is(select,input:not([type="checkbox"]):not([type="hidden"])){
  display:block;
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:42px!important;
  min-height:42px!important;
  margin:0!important;
  padding:8px 12px!important;
  font-size:12px!important;
  line-height:1.4!important;
}
.notification-modal .utu-operations-editor label > select{
  appearance:auto;
  -webkit-appearance:menulist;
  text-overflow:ellipsis;
}

/* Enabled always lives in its own full-width last row of General information.
   Trigger Source already has its own options row beneath the same grid. */
.notification-modal .utu-operations-editor-basics > label:has(input[id$="-enabled"]){
  grid-column:1 / -1!important;
  justify-self:start;
  margin-top:2px!important;
}
.notification-modal .utu-operations-editor .trigger-inline-options:has(#trigger-source-enabled){
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px!important;
  margin:12px 0 4px!important;
}
.notification-modal .utu-operations-editor :is(
  .utu-operations-editor-basics > label:has(input[id$="-enabled"]),
  .trigger-inline-options:has(#trigger-source-enabled) > label
){
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  width:max-content;
  max-width:100%;
  min-height:38px!important;
  padding:8px 12px!important;
  margin-bottom:0!important;
  border:1px solid var(--utu-stroke-soft,#2d5368)!important;
  border-radius:10px!important;
  background:var(--utu-panel-soft,#1d394d)!important;
  color:var(--utu-text,#eaf7fd)!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.4!important;
  cursor:pointer;
}
.notification-modal .utu-operations-editor .utu-operations-editor-basics > label.switch > span{
  display:flex;
  align-items:center;
  gap:7px;
}
.notification-modal .utu-operations-editor :is(
  .utu-operations-editor-basics > label:has(input[id$="-enabled"]),
  .trigger-inline-options:has(#trigger-source-enabled) > label
) input[type="checkbox"]{
  margin:0!important;
}

/* Long Trigger Source dialog: safe top alignment prevents the header and ×
   from ending up above the viewport. Scroll inside the dialog, not off-screen. */
.notification-modal.trigger-modal{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  box-sizing:border-box;
}
.notification-modal.trigger-modal .utu-operations-editor{
  flex:0 1 auto;
  margin:auto!important;
  max-height:calc(100dvh - 48px)!important;
  overflow-y:auto!important;
}
.notification-modal.trigger-modal .utu-operations-editor-source > .utu-operations-editor-header{
  position:sticky;
  top:-22px;
  z-index:3;
  margin:-22px -24px 15px!important;
  padding:22px 24px 12px!important;
  border-bottom:1px solid var(--utu-stroke-soft,#2e536a);
  background:var(--utu-panel,#152f43)!important;
}
@media(max-width:780px){
  .notification-modal.trigger-modal .utu-operations-editor-source > .utu-operations-editor-header{
    top:-17px;
    margin:-17px -17px 15px!important;
    padding:17px 17px 12px!important;
  }
  .notification-modal .utu-operations-editor .trigger-inline-options:has(#trigger-source-enabled){
    gap:8px!important;
  }
}


/* LIGHT V2: keep all four Operations dialog headers below the fixed top bar.
 * Centering a nearly full-height modal with auto margins could clip its title
 * and close button; pin the viewport overlay at a safe top inset instead. */
.notification-modal:has(> .utu-operations-editor){
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  height:100dvh!important;
  max-height:100dvh!important;
  padding:84px 22px 20px!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
}
.notification-modal .utu-operations-editor,
.notification-modal.trigger-modal .utu-operations-editor{
  position:relative;
  flex:0 1 auto!important;
  height:auto!important;
  margin:0 auto!important;
  max-height:calc(100dvh - 112px)!important;
  overflow-y:auto!important;
}
/* Sticky header contains both the title and the close (×) button. */
.notification-modal .utu-operations-editor > .utu-operations-editor-header,
.notification-modal.trigger-modal .utu-operations-editor-source > .utu-operations-editor-header{
  position:sticky!important;
  top:0!important;
  z-index:4!important;
  /* The sticky header is pulled upward; reserve space so step 1 cannot slide under it. */
  margin:-22px -24px 44px!important;
  padding:22px 24px 13px!important;
  border-bottom:1px solid var(--utu-stroke-soft,#2e536a)!important;
  background:var(--utu-panel,#152f43)!important;
}
.notification-modal .utu-operations-editor-header > div{
  min-width:0;
}
.notification-modal .utu-operations-editor-header .modal-close{
  display:grid!important;
  place-items:center!important;
  flex:0 0 36px!important;
  width:36px!important;
  height:36px!important;
  min-height:36px!important;
}
@media(max-width:780px){
  .notification-modal:has(> .utu-operations-editor){
    padding:104px 12px 14px!important;
  }
  .notification-modal .utu-operations-editor,
  .notification-modal.trigger-modal .utu-operations-editor{
    max-height:calc(100dvh - 126px)!important;
  }
  .notification-modal .utu-operations-editor > .utu-operations-editor-header,
  .notification-modal.trigger-modal .utu-operations-editor-source > .utu-operations-editor-header{
    margin:-17px -17px 40px!important;
    padding:17px 17px 12px!important;
  }
}
