/* Login (/login) — presentation overlay.
   Handlers, ids, validation, OTP/captcha/SSO flow stay in Login.js. */

/* Full-viewport cover: beat body #f1f2f3 / pickels #f3f2f1 / CssBaseline side gutters.
   App.js wraps routes in Bootstrap `.container` (max ~1170px) — that caused white L/R gutters. */
html.login-page,
html.login-page body,
html.login-page #react,
html.login-page #app,
html.login-page .securends,
html.login-page .securends .wrapperContainer,
html.login-page .securends .wrapperContainer > .container,
html.login-page .securends .wrapperContainer > .container > .col-12,
html.login-page .securends .wrapperContainer > .container > .col-12 > .row,
.securends .row.pickles-login,
.securends .row.pickles-login-okta,
.securends .row.pickles-login-oktaData,
.securends .row.pickles-login.hybrid-login {
  background-color: var(--se-page) !important;
  background-image:
    radial-gradient(
      1200px 640px at 18% -8%,
      var(--se-brand-tint) 0%,
      var(--se-page) 55%
    ) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  font-family: var(--se-sans);
  color: var(--se-ink);
  min-height: 100vh;
  min-width: 100%;
  width: 100%;
  max-width: none;
  margin: 0;
  box-sizing: border-box;
}

/* Kill Bootstrap .container max-width gutters on login only */
html.login-page .securends .wrapperContainer,
html.login-page .securends .wrapperContainer > .container,
html.login-page .securends .wrapperContainer > .container > .col-12,
html.login-page .securends .wrapperContainer > .container > .col-12 > .row {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  float: none !important;
}

/* Dark login — solid app canvas (no light gutters from CssBaseline / critical CSS) */
html.login-page[data-se-mode="dark"],
html.login-page.dark,
html.login-page[data-theme="dark"],
html.login-page[data-se-mode="dark"] body,
html.login-page.dark body,
html.login-page[data-theme="dark"] body,
html.login-page[data-se-mode="dark"] #react,
html.login-page[data-se-mode="dark"] #app,
html.login-page.dark #react,
html.login-page.dark #app,
html.login-page[data-se-mode="dark"] .securends,
html.login-page[data-se-mode="dark"] .securends .wrapperContainer,
html.login-page[data-se-mode="dark"] .securends .wrapperContainer > .container,
html.login-page[data-se-mode="dark"] .securends .wrapperContainer > .container > .col-12,
html.login-page[data-se-mode="dark"] .securends .wrapperContainer > .container > .col-12 > .row,
html.login-page[data-se-mode="dark"] .securends .row.pickles-login,
html.login-page[data-se-mode="dark"] .securends .row.pickles-login-okta,
html.login-page[data-se-mode="dark"] .securends .row.pickles-login-oktaData,
html[data-se-mode="dark"] .securends .row.pickles-login,
html[data-se-mode="dark"] .securends .row.pickles-login-okta,
html[data-se-mode="dark"] .securends .row.pickles-login-oktaData {
  background-color: var(--bg-app, #0b1220) !important;
  background-image:
    radial-gradient(
      1200px 640px at 18% -8%,
      var(--bg-surface-secondary, #151e2e) 0%,
      var(--bg-app, #0b1220) 55%
    ) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  color: var(--text-primary, #e5e7eb) !important;
}

html.login-page,
html.login-page body {
  height: 100%;
  overflow-x: hidden !important;
}

html.login-page #react,
html.login-page #app,
html.login-page .securends {
  min-height: 100vh !important;
  width: 100% !important;
  max-width: none !important;
}

/* A full reload of /login leaves html.login-page in place. Once the dashboard
   is mounted, the public-route row must collapse so it does not sit as a
   viewport-tall gap under the fixed header. */
html.login-page .securends .wrapperContainer:has(.new-dashboard) > .container,
html.login-page .securends .wrapperContainer:has(.new-dashboard) > .container > .col-12,
html.login-page .securends .wrapperContainer:has(.new-dashboard) > .container > .col-12 > .row {
  min-height: 0 !important;
  height: auto !important;
  background: transparent !important;
  background-image: none !important;
}

.securends .row.pickles-login,
.securends .row.pickles-login-okta,
.securends .row.pickles-login-oktaData {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 100vh !important;
  left: 0 !important;
  right: 0 !important;
}

.securends .row.pickles-login .col-md-12,
.securends .loginOffset {
  background: transparent !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.securends .login-main {
  height: auto !important;
  min-height: 100vh !important;
  overflow: visible !important;
}

.securends .login-wrapper {
  padding-top: 24px !important;
  padding-bottom: 56px !important; /* room above fixed footer */
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-height: 100vh !important;
  overflow: auto !important;
  width: 100%;
  box-sizing: border-box;
}

.securends .sign-on-section {
  width: 400px !important;
  max-width: calc(100% - 32px) !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-modal) !important;
  box-shadow: var(--se-shadow-lg);
  overflow: hidden;
  background: var(--se-card) !important;
  height: auto !important;
  min-height: 0 !important;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.securends .login-wrapper .header-logo,
.securends .sign-on-section .header-logo,
.securends .header-logo {
  background: var(--se-card) !important;
  border-bottom: 1px solid var(--se-line-soft) !important;
  padding: 20px 24px 14px !important; /* beat pickels 5px 90px 33px */
  text-align: center !important;
  flex: 0 0 auto;
  width: 100% !important;
  box-sizing: border-box;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.securends .header-logo img,
.securends .sign-on-section .header-logo img,
.securends .login-wrapper .header-logo img {
  display: block !important;
  margin: 0 auto !important;
  max-height: 28px !important;
  height: 28px !important;
  width: auto !important;
  max-width: 148px !important;
  object-fit: contain !important;
  object-position: center center !important;
}

.securends .header-logo:has(img[src*="Full-Logo"]),
.securends .sign-on-section .header-logo:has(img[src*="Full-Logo"]),
.securends .login-wrapper .header-logo:has(img[src*="Full-Logo"]) {
  background: var(--se-card) !important;
  border-bottom-color: var(--se-line-soft) !important;
}

.securends .header-logo img[src*="Full-Logo"],
.securends .sign-on-section .header-logo img[src*="Full-Logo"],
.securends .login-wrapper .header-logo img[src*="Full-Logo"] {
  max-height: 36px !important;
  height: auto !important;
  max-width: 220px !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

.se-full-logo-plate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  padding: 0;
  border-radius: 0;
}

.se-full-logo-plate img {
  filter: none !important;
  object-fit: contain;
}

.securends .login-form-section,
.securends .sign-on-section .login-form-section {
  padding: 20px 32px 24px !important;
  background: var(--se-card) !important;
  flex: 0 0 auto;
  width: 100% !important;
  box-sizing: border-box;
  text-align: left;
}

.securends .sign-in-text,
.securends .login-form-section .sign-in-text,
.securends .login100-form-title {
  display: block !important;
  width: 100% !important;
  color: var(--se-ink) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  font-family: var(--se-sans) !important;
  text-align: center !important;
  float: none !important;
}

.securends .loginWithEmail .ui-body,
.securends .para_grp {
  color: var(--se-ink-2) !important;
  font-size: 13px !important;
  line-height: 1.5;
  margin-bottom: 16px;
}

.securends .login-section {
  width: 100%;
}

.securends .login-section label,
.securends .sign-on-section .login-section label {
  color: var(--se-ink-2) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin: 0 0 6px !important;
  display: block !important;
  text-align: left !important;
  float: none !important;
  cursor: default;
}

.securends .login-wrapper .login-section input,
.securends .loginmodal-container input[type="email"],
.securends .loginmodal-container input[type="password"],
.securends #loginemail,
.securends #loginpassword,
.securends #loginWithEmail,
.securends #user_captcha_input2,
.securends #user_captcha_input,
.securends #otpmessage,
.securends .login-form-control.login_inp,
.securends .row.pickles-login input[type="email"],
.securends .row.pickles-login input[type="password"],
.securends .sign-on-section input[type="email"],
.securends .sign-on-section input[type="password"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 40px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  padding: 0 12px !important;
  color: var(--se-ink) !important;
  background: var(--se-card) !important;
  margin: 0 0 16px !important; /* even gap between fields; beat pickels 33px */
  font-size: 14px !important;
  font-family: var(--se-sans) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  float: none !important;
}

.securends .sign-on-section #loginpassword {
  margin-bottom: 16px !important;
}

.securends #loginemail:focus-visible,
.securends #loginpassword:focus-visible,
.securends #loginWithEmail:focus-visible,
.securends #user_captcha_input2:focus-visible,
.securends #user_captcha_input:focus-visible,
.securends #otpmessage:focus-visible,
.securends .login-form-control.login_inp:focus-visible {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint) !important;
  outline: 2px solid var(--se-brand);
  outline-offset: 1px;
}

.securends .loginmodal-submit,
.securends button.login.loginmodal-submit,
.securends .sign-on-section .loginmodal-submit,
.securends .se-login-panel .loginmodal-submit {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100% !important;
  background: var(--se-btn-bg, var(--se-brand)) !important;
  background-color: var(--se-btn-bg, var(--se-brand)) !important;
  border: none !important;
  border-radius: var(--se-r) !important;
  height: 40px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  margin: 24px 0 0 !important; /* space between last input and Login */
  padding: 0 16px !important;
  box-sizing: border-box;
  position: relative;
}

.securends .loginmodal-submit:hover,
.securends button.login.loginmodal-submit:hover,
.securends .se-login-panel .loginmodal-submit:hover {
  background: var(--se-btn-bg-hover, var(--se-brand-hover)) !important;
  background-color: var(--se-btn-bg-hover, var(--se-brand-hover)) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

.securends .loginmodal-submit:disabled {
  opacity: 0.65;
}

.securends .sign-on-section .loginmodal-submit .fa-spinner-icon,
.securends .loginmodal-submit .fa-spinner-icon,
.securends .se-login-panel .loginmodal-submit .fa-spinner-icon {
  position: static !important;
  color: var(--se-btn-fg, #fff) !important;
  margin: 0 !important;
  float: none !important;
}

.securends .sign-on-section .loginmodal-submit .fa-spinner-icon .fa-spinner,
.securends .loginmodal-submit .fa-spinner-icon .fa-spinner,
.securends .se-login-panel .loginmodal-submit .fa-spinner-icon .fa-spinner {
  position: static !important;
  right: auto !important;
  top: auto !important;
  font-size: 14px !important;
  color: var(--se-btn-fg, #fff) !important;
}

.securends .needHelp-container,
.securends .row.pickles-login .needHelp-container {
  top: 20px !important;
  right: 24px !important;
}

.securends .needHelp-submit,
.securends button.login.needHelp-submit {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-pill) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  height: auto !important;
  box-shadow: var(--se-shadow);
  float: none !important;
}

.securends .needHelp-submit:hover,
.securends button.login.needHelp-submit:hover {
  border-color: var(--se-brand) !important;
  color: var(--se-brand) !important;
}

/* Remember Me — aligned checkbox + label */
.securends .sign-on-section .se-login-remember,
.securends .sign-on-section .RememberCreds,
.securends .se-login-remember {
  display: flex !important;
  align-items: center;
  gap: 8px;
  margin: 14px 0 0 !important;
  padding: 0 !important;
  clear: both;
  float: none !important;
  position: relative;
  min-height: 20px;
}

.securends .se-login-remember-input,
.securends .sign-on-section .se-login-remember-input {
  position: static !important;
  z-index: 1 !important;
  opacity: 1 !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0;
  accent-color: var(--se-brand);
  cursor: pointer;
  float: none !important;
}

.securends .se-login-remember-label,
.securends .sign-on-section .se-login-remember-label,
.securends .sign-on-section .remember {
  position: static !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--se-ink-2) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  cursor: pointer;
  float: none !important;
}

.securends .sign-on-section .focus-input100,
.securends .login-form-section .focus-input100 {
  display: none !important;
}

.securends .forgot-pass,
.securends .sign-on-section .forgot-pass {
  display: flex !important;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 10px;
  text-align: center !important;
  margin: 16px 0 0 !important;
  padding: 0 !important;
  color: var(--se-ink-3) !important;
  font-size: 13px;
  float: none !important;
  clear: both;
}

.securends .forgot-pass .se-login-link-sep {
  color: var(--se-ink-3);
  font-weight: 400;
  user-select: none;
}

.securends .forgot-pass .reset,
.securends .forgot-pass a.reset {
  color: var(--se-brand) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  font-size: 13px !important;
  opacity: 1 !important;
}

.securends .forgot-pass .reset:hover {
  text-decoration: underline !important;
}

/* Inline Forgot Password / New User panels (same card as login) */
.securends .sign-on-section .se-login-panel {
  position: relative;
}

.securends .se-login-panel-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 14px !important;
}

.securends .se-login-panel-title,
.securends .sign-on-section .se-login-panel-title {
  text-align: left !important;
  margin: 0 !important;
  flex: 1 1 auto;
}

.securends .se-login-panel-close {
  flex-shrink: 0;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink-2) !important;
  border-radius: var(--se-r-pill) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  font-family: var(--se-sans) !important;
  padding: 6px 12px !important;
  height: auto !important;
  line-height: 1.2;
  cursor: pointer;
}

.securends .se-login-panel-close:hover {
  border-color: var(--se-brand) !important;
  color: var(--se-brand) !important;
}

.securends .se-login-panel-body,
.securends .se-login-help {
  width: 100%;
}

.securends .se-login-panel .para_grp {
  margin: 0 0 14px !important;
  text-align: left;
}

.securends .se-login-panel label {
  display: block !important;
  color: var(--se-ink-2) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin: 0 0 6px !important;
  text-align: left !important;
}

.securends .se-login-panel .se-login-panel-field,
.securends .se-login-panel .form-group {
  margin: 0 0 12px !important;
  width: 100% !important;
  float: none !important;
}

.securends .se-login-panel .login-form-control.login_inp,
.securends .se-login-panel input[type="email"],
.securends .se-login-panel input[type="text"],
.securends .se-login-panel #user_captcha_input {
  width: 100% !important;
  max-width: 100% !important;
  height: 40px !important;
  margin: 0 0 12px !important;
  float: none !important;
}

.securends .se-login-panel-captcha {
  margin: 0 0 12px !important;
}

.securends .se-login-panel .pwdCaptchaInput {
  width: 100%;
  margin-top: 8px;
}

.securends .se-login-help {
  text-align: center;
  padding-top: 4px;
}

.securends .se-login-help .help_sec {
  color: var(--se-ink) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  margin: 0 0 10px !important;
}

.securends .se-login-help .content_sec {
  color: var(--se-ink-2) !important;
  font-size: 13px !important;
  line-height: 1.5;
  margin: 0 0 18px !important;
  text-align: left;
}

.securends .se-login-panel .loginmodal-submit {
  margin-top: 16px !important;
}

.securends .login-footer {
  margin-top: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  height: auto !important;
  min-height: 34px;
}

.securends .login-footer-container {
  padding: 8px 20px !important;
}

.securends .login-footer,
.securends .login-copyright,
.securends .login-copyright a {
  color: var(--se-ink-3) !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  text-align: center;
}

.securends .login-copyright a:hover {
  color: var(--se-brand) !important;
}

.securends #errmsggg {
  color: var(--se-risk) !important;
  font-size: 12px;
  margin: 0 0 10px;
  text-align: left !important;
}

.securends .row.pickles-login .alert-danger,
.securends .row.pickles-login .alert-warning,
.securends .login-form-section .alert,
.securends .loginmodal-container .alert-danger {
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  font-size: 13px;
  margin-top: 12px;
}

.securends .row.pickles-login .alert-danger {
  background: var(--se-risk-tint) !important;
  color: var(--se-risk) !important;
}

.securends .QR_Authenticate {
  color: var(--se-brand) !important;
  background: none !important;
  border: none !important;
  text-decoration: underline;
  font-weight: 500;
  padding: 0;
}

.securends .QR_Authenticate:disabled {
  color: var(--se-ink-3) !important;
  text-decoration: none;
}

.securends .captchaContent {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 0 8px;
  margin: 0 0 8px;
  overflow: visible;
}

.securends .captchaInput,
.securends .pwdCaptchaInput {
  float: none;
  width: auto;
  flex: 1;
}

.securends a#reload_href {
  color: var(--se-brand) !important;
  font-weight: 500;
}

.securends .button.button-primary.blue.submit-button {
  background: var(--se-brand) !important;
  border: none !important;
  border-radius: var(--se-r) !important;
  color: #fff !important;
  padding: 8px 18px;
  font-weight: 600;
  height: 42px;
}

.securends .loginWithEmail .loginmodal-container {
  width: 400px;
  max-width: calc(100% - 32px);
  margin: 0 auto;
  background: var(--se-card);
  border: 1px solid var(--se-line);
  border-radius: var(--se-r-modal);
  box-shadow: var(--se-shadow-lg);
  padding: 24px 32px 20px;
  box-sizing: border-box;
}

.securends .custom-dialog .modal-content,
.securends .loginModal .modal-content,
.securends .redirectModal .modal-content {
  border-radius: var(--se-r-modal) !important;
  border: 1px solid var(--se-line) !important;
  box-shadow: var(--se-shadow-lg);
}

.securends .custom-dialog .modal-header,
.securends .custom-dialog .modelheader {
  border-bottom: 1px solid var(--se-line-soft) !important;
  color: var(--se-ink);
}

.securends .oktaLoginMsg h3 {
  color: var(--se-ink) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.securends .seModalLogo {
  text-align: center;
  margin-bottom: 16px;
}

.securends .seModalLogo:has(img[src*="Full-Logo"]) {
  display: inline-block;
  background: transparent;
  padding: 0;
  border-radius: 0;
}

@media (max-width: 560px) {
  .securends .sign-on-section,
  .securends .loginWithEmail .loginmodal-container {
    width: calc(100% - 32px) !important;
    min-width: 0 !important;
  }

  .securends .login-wrapper .header-logo,
  .securends .sign-on-section .header-logo {
    padding: 16px 18px 12px !important;
  }

  .securends .header-logo img,
  .securends .sign-on-section .header-logo img {
    max-height: 24px !important;
    height: 24px !important;
    max-width: 132px !important;
  }

  .securends .login-form-section,
  .securends .sign-on-section .login-form-section,
  .securends .loginWithEmail .loginmodal-container {
    padding: 16px 18px 18px !important;
  }

  .securends .needHelp-container,
  .securends .row.pickles-login .needHelp-container {
    right: 12px !important;
    top: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .securends .loginmodal-submit,
  .securends .needHelp-submit,
  .securends .forgot-pass .reset {
    transition: none !important;
  }
}

/* Logged-in shell — dark navy sidebar + light header (mockup-aligned). */

.securends .wrapper,
.securends .se-main-panel,
.securends [class*="mainPanel"],
.securends [class*="content"] {
  background: var(--se-page) !important;
}

/* Kill material-dashboard JSS wrapper padding (8px) — it left white gutters
   beside the floating header / hnav (body #fff showed through). Intentional
   side gaps come only from --se-header-inset-x. */
.securends .wrapper {
  padding-left: 0 !important;
  padding-right: 0 !important;
  min-height: 100vh;
  box-sizing: border-box;
}

/* --------------------------------------------------------------------------
   Sidebar drawer
   -------------------------------------------------------------------------- */
/* Beat pickels-v3 `div.leftNavCustomScroll { background: #1a2238 }` */
div.leftNavCustomScroll,
.securends div.leftNavCustomScroll,
.se-sidenav,
.securends .se-sidenav,
.leftNavDrawer .MuiPaper-root,
.leftNavDrawer .MuiDrawer-paper,
.securends .MuiDrawer-paper {
  background: var(--se-navy) !important;
  background-color: var(--se-navy) !important;
  background-image: none !important;
}

.se-sidenav .MuiList-root,
.se-sidenav .MuiCollapse-wrapper,
.se-sidenav .MuiListItem-root {
  background-color: transparent !important;
}

.securends .MuiDrawer-paper,
.securends .MuiDrawer-paperAnchorLeft,
.securends .leftNavDrawer .MuiDrawer-paper {
  color: var(--se-nav-text) !important;
  border-right: var(--se-nav-edge) !important;
  box-shadow: none !important;
  width: 230px !important;
}

.securends .MuiDrawer-paper:before,
.securends .MuiDrawer-paper:after {
  display: none !important;
}

.securends .leftNavCustomScroll,
.securends div.leftNavCustomScroll {
  width: 230px !important;
  padding-bottom: 24px !important;
  scrollbar-width: thin;
  scrollbar-color: var(--se-nav-scroll-thumb) var(--se-navy);
}

div.leftNavCustomScroll::-webkit-scrollbar,
.se-sidenav::-webkit-scrollbar,
.leftNavDrawer .MuiDrawer-paper::-webkit-scrollbar {
  width: 8px !important;
}

div.leftNavCustomScroll::-webkit-scrollbar-track,
.se-sidenav::-webkit-scrollbar-track,
.leftNavDrawer .MuiDrawer-paper::-webkit-scrollbar-track,
.leftNavCustomScroll::-webkit-scrollbar-track {
  background: var(--se-navy) !important;
  background-color: var(--se-navy) !important;
}

div.leftNavCustomScroll::-webkit-scrollbar-thumb,
.se-sidenav::-webkit-scrollbar-thumb,
.leftNavDrawer .MuiDrawer-paper::-webkit-scrollbar-thumb,
.leftNavCustomScroll::-webkit-scrollbar-thumb {
  background: var(--se-nav-scroll-thumb) !important;
  background-color: var(--se-nav-scroll-thumb) !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  height: auto !important;
}

div.leftNavCustomScroll::-webkit-scrollbar-corner,
.leftNavCustomScroll::-webkit-scrollbar-corner {
  background: var(--se-navy) !important;
}

/* Logo strip — themed via --se-logo-bg; left nav stays on --se-navy */
.securends .logoMobile {
  height: 56px !important;
  background: var(--se-logo-bg) !important;
  background-color: var(--se-logo-bg) !important;
  border-bottom: 1px solid var(--se-nav-border);
  position: relative;
  z-index: 5;
  isolation: isolate;
  overflow: visible !important;
}

.securends .logoMobile > div,
.securends .logoMobile [class*="logo"] {
  background: var(--se-logo-bg) !important;
  background-color: var(--se-logo-bg) !important;
  height: 56px !important;
  min-height: 56px !important;
  display: flex !important;
  align-items: center;
  border-bottom: none !important;
  overflow: visible !important;
}

.securends .logoMobile [class*="logo"]:before,
.securends .logoMobile [class*="logo"]:after {
  display: none !important;
  content: none !important;
  background: none !important;
}

.securends .logoMobile a {
  padding-left: 40px !important;
  padding-right: 8px !important;
  padding-top: 0 !important;
  display: flex;
  align-items: center;
  height: 56px;
  overflow: visible !important;
  min-width: 0;
}

.securends .logoMobile img {
  width: auto !important;
  max-width: 170px !important;
  max-height: 34px !important;
  height: auto !important;
  display: block !important;
  object-fit: contain;
  opacity: 1 !important;
  visibility: visible !important;
  filter: var(--se-nav-logo-filter);
}

/* Official Full-Logo lockups — never invert (that made black/white boxes) */
.securends .logoMobile img.se-brand-logo,
.securends img.se-brand-logo,
.securends .logoMobile img[src*="SecurEnds-Full-Logo"],
.securends .logoMobile img[src*="Full-Logo"] {
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
  max-width: 170px !important;
  max-height: 34px !important;
}

/* Colored tenant / legacy SecurEnds assets (skip official Full-Logo + White PNGs) */
.securends .logoMobile img[src*="SecurEnds"]:not([src*="White"]):not([src*="white"]):not([src*="Full-Logo"]):not(.se-brand-logo) {
  filter: var(--se-nav-logo-filter);
}

/* White theme: legacy marks on the white strip — not official lockups */
html[data-se-theme="white"] .securends .logoMobile img:not(.se-brand-logo):not([src*="Full-Logo"]) {
  filter: brightness(0) !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Unauthenticated header wordmark — Full-Logo sits on the white header */
.securends .mobileTitle,
.securends .LandScapeTitle {
  display: inline-flex;
  align-items: center;
  background: transparent;
  padding: 0;
  border-radius: 0;
}

.securends .mobileTitle img,
.securends .LandScapeTitle img {
  display: block;
  max-height: 28px;
  width: auto;
  object-fit: contain;
  filter: var(--se-nav-logo-filter);
  mix-blend-mode: normal !important;
}

.securends .mobileTitle img.se-brand-logo,
.securends .LandScapeTitle img.se-brand-logo,
html[data-se-mode="dark"] .securends .mobileTitle img,
html[data-se-mode="dark"] .securends .LandScapeTitle img {
  filter: none !important;
}

/* Apps grid launcher on logo strip — left-aligned in vertical nav */
html:not([data-se-nav="horizontal"]) .securends .prod-popup-sidebar {
  position: fixed !important;
  top: 16px !important;
  left: 8px !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}

.securends .prod-popup-sidebar,
.securends .prod-popup-sidebar .material-icons {
  color: #ffffff !important;
}

.securends .prod-popup-sidebar .material-icons {
  font-size: 24px !important;
  width: 22px;
  height: 22px;
  line-height: 15px !important;
}

html[data-se-theme="white"] .securends .prod-popup-sidebar,
html[data-se-theme="white"] .securends .prod-popup-sidebar .material-icons,
html[data-se-theme="teal"] .securends .prod-popup-sidebar,
html[data-se-theme="teal"] .securends .prod-popup-sidebar .material-icons {
  color: var(--se-ink) !important;
}

/* Nav links — mockup: 20px inset, 10px icon gap, one icon column */
.securends .MuiDrawer-paper .MuiList-root,
.securends .MuiDrawer-paper .MuiList-padding {
  padding: 0 !important;
}

/* Base nav type — children stay on --se-nav-text / --se-nav-muted */
.securends .MuiDrawer-paper a,
.securends .MuiDrawer-paper span,
.securends .MuiDrawer-paper p,
.securends .MuiDrawer-paper [class*="itemText"],
.securends .MuiDrawer-paper [class*="itemCollapseLink"],
.securends .MuiDrawer-paper [class*="collapseItemText"] {
  color: var(--se-nav-text) !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 400;
}

/*
  Parent / top-level labels — darker via --se-nav-parent (theme + color-mode).
  Covers section headers (itemCollapseLink) and top-level leaves (Home).
*/
.securends .MuiDrawer-paper [class*="itemCollapseLink"],
.securends .MuiDrawer-paper [class*="itemCollapseLink"] [class*="itemText"],
.securends .MuiDrawer-paper [class*="itemCollapseLink"] > span,
.securends .MuiDrawer-paper .MuiList-root > a > [class*="itemLink"] [class*="itemText"],
.securends .MuiDrawer-paper .MuiList-root > a > [class*="itemLink"] > span:not(.material-icons):not(.label-new) {
  color: var(--se-nav-parent) !important;
  font-weight: 600 !important;
}

.securends .MuiDrawer-paper [class*="itemCollapseLink"] .material-icons,
.securends .MuiDrawer-paper [class*="itemCollapseLink"] .MuiSvgIcon-root,
.securends .MuiDrawer-paper [class*="itemCollapseLink"] [class*="itemIcon"],
.securends .MuiDrawer-paper [class*="itemCollapseLink"] [class*="itemIcon1"],
.securends .MuiDrawer-paper .MuiList-root > a > [class*="itemLink"] .material-icons,
.securends .MuiDrawer-paper .MuiList-root > a > [class*="itemLink"] .MuiSvgIcon-root,
.securends .MuiDrawer-paper .MuiList-root > a > [class*="itemLink"] [class*="itemIcon"] {
  color: var(--se-nav-parent) !important;
  fill: var(--se-nav-parent) !important;
}

/*
  Nested child links — lighter than parents (must beat top-level > a rules).
*/
.securends .MuiDrawer-paper .MuiCollapse-container .MuiList-root > a > [class*="itemLink"] [class*="itemText"],
.securends .MuiDrawer-paper .MuiCollapse-container .MuiList-root > a > [class*="itemLink"] > span:not(.material-icons):not(.label-new),
.securends .MuiDrawer-paper .MuiCollapse-container [class*="itemLink"] [class*="itemText"],
.securends .MuiDrawer-paper .MuiCollapse-container [class*="itemLink"] span:not(.material-icons):not(.label-new),
.securends .MuiDrawer-paper .MuiCollapse-container [class*="collapseItemText"],
.securends .MuiDrawer-paper .MuiCollapse-container [class*="collapseItemLink"],
.securends .MuiDrawer-paper .MuiCollapse-container [class*="collapseItemText"] span {
  color: var(--se-nav-muted) !important;
  font-weight: 400 !important;
}

.securends .MuiDrawer-paper .MuiCollapse-container [class*="itemLink"] .material-icons,
.securends .MuiDrawer-paper .MuiCollapse-container [class*="itemLink"] .MuiSvgIcon-root,
.securends .MuiDrawer-paper .MuiCollapse-container [class*="itemLink"] [class*="itemIcon"] {
  color: var(--se-nav-muted) !important;
  fill: var(--se-nav-muted) !important;
}

.securends .MuiDrawer-paper .MuiListItem-root,
.securends .MuiDrawer-paper [class*="itemLink"],
.securends .MuiDrawer-paper [class*="itemCollapseLink"],
.securends .MuiDrawer-paper [class*="collapseItemLink"] {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px;
  margin: 0 !important;
  padding: 7px 18px 7px 20px !important;
  border-radius: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
  border-left: 2px solid transparent !important;
}

.leftNavDrawer .material-icons,
.se-sidenav .material-icons,
.MuiDrawer-paper .material-icons,
.MuiDrawer-paper [class*="itemIcon"],
.MuiDrawer-paper [class*="itemIcon1"],
.MuiDrawer-paper .MuiListItemIcon-root,
.MuiDrawer-paper .MuiSvgIcon-root,
.leftNavCustomScroll .material-icons {
  color: var(--se-nav-icon) !important;
  fill: var(--se-nav-icon) !important;
  opacity: 1 !important;
}

.securends .MuiDrawer-paper .MuiListItemIcon-root,
.securends .MuiDrawer-paper [class*="itemIcon"],
.securends .MuiDrawer-paper [class*="itemIcon1"] {
  min-width: 20px !important;
  width: 20px !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0;
}

.securends .MuiDrawer-paper .material-icons,
.securends .leftNavCustomScroll .material-icons,
.securends .MuiDrawer-paper .MuiListItemIcon-root .material-icons,
.securends .MuiDrawer-paper .MuiListItemIcon-root .MuiSvgIcon-root {
  font-size: 17px !important;
  width: 17px !important;
  height: 17px !important;
  line-height: 17px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.securends .MuiDrawer-paper [class*="itemText"],
.securends .MuiDrawer-paper [class*="collapseItemText"],
.securends .MuiDrawer-paper .MuiListItemText-root {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.35 !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  flex: 1 1 auto;
  min-width: 0;
  transform: none !important;
  float: none !important;
  display: block !important;
  height: auto !important;
}

/* Re-assert parent/top-level weight after the itemText 400 reset (deploy/specificity). */
.securends .MuiDrawer-paper [class*="itemCollapseLink"],
.securends .MuiDrawer-paper [class*="itemCollapseLink"] [class*="itemText"],
.securends .MuiDrawer-paper [class*="itemCollapseLink"] > span,
.securends .MuiDrawer-paper .MuiList-root > a > [class*="itemLink"] [class*="itemText"],
.securends .MuiDrawer-paper .MuiList-root > a > [class*="itemLink"] > span:not(.material-icons):not(.label-new) {
  font-weight: 600 !important;
}

/* Nested links (no icon): line up with parent label, not the icon column */
.securends .MuiDrawer-paper .MuiCollapse-container [class*="itemLink"],
.securends .MuiDrawer-paper .MuiList-root .MuiList-root [class*="itemLink"] {
  padding-left: 50px !important;
}

.securends .MuiDrawer-paper .MuiListItem-root > .MuiSvgIcon-root {
  margin-left: auto !important;
  flex-shrink: 0;
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
  opacity: 0.7;
}

.securends .MuiDrawer-paper a:hover [class*="itemLink"],
.securends .MuiDrawer-paper [class*="itemLink"]:hover,
.securends .MuiDrawer-paper [class*="collapseItemLink"]:hover,
.securends .MuiDrawer-paper [class*="itemCollapseLink"]:hover {
  background: var(--se-navy-2) !important;
}

/* Active route — full-width tint like the mockup */
.securends .MuiDrawer-paper a.active [class*="itemLink"],
.securends .MuiDrawer-paper a.active [class*="collapseItemLink"],
.securends .MuiDrawer-paper a.active [class*="itemCollapseLink"],
.securends .MuiDrawer-paper [class*="itemLink"].active,
.securends .MuiDrawer-paper a.active li,
.securends .MuiDrawer-paper a.active {
  background: var(--se-nav-active-bg) !important;
  border-radius: 0 !important;
  border-left: 2px solid var(--se-brand) !important;
}

.securends .MuiDrawer-paper a.active span,
.securends .MuiDrawer-paper a.active .material-icons,
.securends .MuiDrawer-paper a.active [class*="itemText"],
.securends .MuiDrawer-paper a.active [class*="itemIcon"],
.securends .MuiDrawer-paper a.active [class*="collapseItemText"],
.securends .MuiDrawer-paper a.active .MuiSvgIcon-root {
  color: var(--se-nav-active-text) !important;
  fill: var(--se-nav-active-text) !important;
  font-weight: 500;
}

/* Section group headers (parents) — weight comes from --se-nav-parent rules */
.securends .MuiDrawer-paper [class*="itemCollapseLink"] {
  letter-spacing: 0.01em;
}

/* --------------------------------------------------------------------------
   Top header — floating card with equal left/right gaps (reference chrome)
   Outer inset matches .main-content padding so the bar aligns with page cards.
   Inner pad keeps hamburger / profile off the bar edges. Height stays 60px.
   -------------------------------------------------------------------------- */
.securends .MuiAppBar-root,
.securends header.MuiAppBar-root {
  background: var(--bg-header) !important;
  background-color: var(--bg-header) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  box-shadow: var(--se-shadow) !important;
  height: var(--se-app-header) !important;
  min-height: var(--se-app-header) !important;
  top: 0 !important;
  right: var(--se-header-inset-x) !important;
  left: auto !important;
  width: calc(100% - var(--se-sidebar-w) - (2 * var(--se-header-inset-x))) !important;
  padding: 0 !important;
  border-radius: var(--se-r-card) !important;
  overflow: visible !important;
  z-index: var(--se-z-header);
}

.securends .MuiAppBar-root .MuiToolbar-root {
  background: var(--bg-header) !important;
  background-color: var(--bg-header) !important;
  color: var(--se-ink) !important;
  min-height: var(--se-app-header) !important;
  height: var(--se-app-header) !important;
  padding: 0 var(--se-header-pad-x) !important;
  box-shadow: none !important;
  border-radius: var(--se-r-card);
  overflow: visible !important;
}

.securends .MuiAppBar-root [class*="sidebarMinimize"],
.securends .MuiAppBar-root [class*="mbSidebarWrapper"] {
  margin-left: 0;
}

.securends .MuiAppBar-root [class*="sidebarMinimize"] button,
.securends .MuiAppBar-root button.prod-popup {
  margin-left: 0 !important;
}

.securends .MuiAppBar-root .makeBrand,
.securends .MuiAppBar-root .makeBrand span,
.securends .MuiAppBar-root #tabFocusData,
.securends .MuiAppBar-root [class*="title"] {
  color: var(--se-ink) !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}

.securends .MuiAppBar-root .MuiTypography-root,
.securends .MuiAppBar-root .MuiIcon-root,
.securends .MuiAppBar-root .MuiSvgIcon-root,
.securends .MuiAppBar-root button .MuiIcon-root,
.securends .MuiAppBar-root button.prod-popup .MuiIcon-root,
.securends .MuiAppBar-root [class*="sidebarMinimize"] .MuiIcon-root {
  color: var(--se-ink) !important;
}

/* Header right — user profile, service desk, notifications */
.securends .MuiAppBar-root .SidebarMobile,
.securends header .SidebarMobile {
  background: transparent !important;
}

.securends .MuiAppBar-root .UserNameIconWrapper,
.securends .MuiAppBar-root .UserNameContent,
.securends .MuiAppBar-root .loggedUser,
.securends .MuiAppBar-root .UserSet,
.securends .MuiAppBar-root .UserSet i,
.securends .MuiAppBar-root .fa-user,
.securends .MuiAppBar-root .fa-caret-down,
.securends .MuiAppBar-root .SidebarMobile a {
  color: var(--se-ink) !important;
}

.securends .MuiAppBar-root .UserNameIconWrapper {
  cursor: pointer;
  border-radius: 8px;
  padding: 2px 4px 2px 8px !important;
  margin-left: 8px;
  display: inline-flex !important;
  align-items: center;
  position: relative;
  overflow: visible !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-shrink: 0;
  width: max-content !important;
  top: auto !important;
}

.securends .MuiAppBar-root .UserNameIconWrapper:hover {
  background: var(--bg-navigation-active, var(--se-page));
}

.securends .MuiAppBar-root .UserNameIconWrapper button,
.securends .MuiAppBar-root .UserNameIconWrapper [class*="UserIconLink"],
.securends .MuiAppBar-root .UserNameIconWrapper .se-profile-chip {
  width: max-content !important;
  min-width: 0 !important;
  height: 36px !important;
  margin: 0 !important;
  overflow: visible !important;
}

.securends .MuiAppBar-root .UserSet {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin: 0 !important;
}

.securends .MuiAppBar-root .loggedUser {
  position: static !important;
  right: auto !important;
  font-size: 14px !important;
  font-weight: 500;
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
}

.securends .MuiAppBar-root .se-user-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--se-btn-bg, var(--se-brand));
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.securends .MuiAppBar-root .se-user-avatar .fa-user {
  font-size: 12px !important;
  margin: 0 !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

.securends .MuiAppBar-root .se-header-actions,
.securends .MuiAppBar-root [class*="manager"] {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-left: auto;
  margin-right: 0;
  position: relative;
}

.securends .MuiAppBar-root .se-header-actions > .UserNameIconWrapper,
.securends .MuiAppBar-root .se-header-actions > .se-profile-trigger,
.securends .MuiAppBar-root [class*="manager"] > .UserNameIconWrapper,
.securends .MuiAppBar-root [class*="manager"] > .se-profile-trigger {
  top: auto !important;
}

.securends .MuiAppBar-root .se-header-actions-wrap,
.securends .MuiAppBar-root [class*="mbSidebarWrapper"] {
  display: flex;
  align-items: center;
}

.securends .se-header-icon-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  color: var(--se-ink-2) !important;
  text-decoration: none !important;
  flex-shrink: 0;
  transition: background var(--se-ease), color var(--se-ease);
}

.securends .se-header-icon-btn:hover,
.securends .se-header-icon-btn:focus-visible {
  background: var(--se-raise) !important;
  color: var(--se-brand) !important;
}

.securends .se-header-icon-btn .fa {
  font-size: 16px;
  line-height: 1;
}

/* Service Desk — 24×24 glyph tinted to palette (--se-brand) */
.securends .se-header-icon-btn .se-header-service-desk-mark {
  display: block;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  color: var(--se-brand);
  transition: color var(--se-ease);
}

.securends .se-header-icon-btn:hover .se-header-service-desk-mark,
.securends .se-header-icon-btn:focus-visible .se-header-service-desk-mark {
  color: var(--se-brand-hover);
}

.securends .se-header-icon-btn .se-header-service-desk-svg {
  display: block;
  width: 24px;
  height: 24px;
}

.securends .se-header-icon-btn .se-header-service-desk-svg feFlood {
  flood-color: var(--se-brand);
}

.securends .se-header-icon-btn:hover .se-header-service-desk-svg feFlood,
.securends .se-header-icon-btn:focus-visible .se-header-service-desk-svg feFlood {
  flood-color: var(--se-brand-hover);
}

.securends .se-mode-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 36px;
  padding: 0;
  margin: 0 4px 0 0;
  border: none;
  background: transparent;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

.securends .se-mode-switch-track {
  position: relative;
  display: block;
  width: 44px;
  height: 24px;
  border-radius: 999px;
  background: var(--se-raise);
  border: 1px solid var(--se-line);
  box-sizing: border-box;
  transition: background var(--se-ease), border-color var(--se-ease);
}

.securends .se-mode-switch.is-dark .se-mode-switch-track {
  background: var(--se-brand-tint);
  border-color: var(--se-brand-line);
}

.securends .se-mode-switch-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--se-card);
  color: var(--se-warn);
  box-shadow: var(--se-shadow);
  transition: left var(--se-ease), background var(--se-ease), color var(--se-ease);
}

.securends .se-mode-switch.is-dark .se-mode-switch-thumb {
  left: 22px;
  background: var(--se-brand);
  color: #fff;
}

.securends .se-mode-switch:focus-visible .se-mode-switch-track {
  outline: 2px solid var(--se-brand);
  outline-offset: 2px;
}

/* Content offset below header */
.securends .main-content {
  margin-top: 60px !important;
}

.securends .jss3,
.securends [class*="WithTheme-WithWidth"] {
  margin-top: 60px !important;
}

.securends .footer,
.securends .footer-main {
  color: var(--se-ink-3);
  border-top: 1px solid var(--se-line-soft);
  background: transparent;
}

@media (max-width: 960px) {
  .securends .MuiAppBar-root {
    width: calc(100% - (2 * var(--se-header-inset-x))) !important;
    right: var(--se-header-inset-x) !important;
  }
}

/* --------------------------------------------------------------------------
   Horizontal nav (profile Settings → Left Nav → Horizontal).
   Hide the docked left drawer and render links in the header instead.
   Vertical left-nav rules above are unchanged. Main content chrome is unchanged
   except width so the vacated sidebar slot does not leave a blank column.
   Mobile temporary drawer stays a side sheet.
   -------------------------------------------------------------------------- */
html[data-se-nav="horizontal"],
.securends[data-se-nav="horizontal"] {
  --se-sidebar-w: 0px;
}

html[data-se-nav="horizontal"] .securends .MuiDrawer-docked,
html[data-se-nav="horizontal"] .securends .MuiDrawer-paperAnchorDockedLeft {
  display: none !important;
}

html[data-se-nav="horizontal"] .securends .se-main-panel,
html[data-se-nav="horizontal"] .securends [class*="mainPanel"] {
  width: 100% !important;
  float: none !important;
}

html[data-se-nav="horizontal"] .securends .se-sidebar-min-toggle,
html[data-se-nav="horizontal"] .securends .se-sidebar-min-toggle *,
html[data-se-nav="horizontal"] .securends [class*="sidebarMinimize"],
html[data-se-nav="horizontal"] .securends .MuiAppBar-root button.prod-popup,
html[data-se-nav="horizontal"] .securends header button.prod-popup,
html[data-se-nav="horizontal"] .securends .MuiToolbar-root > [class*="Hidden"] button.prod-popup,
html[data-se-nav="horizontal"] .securends .MuiAppBar-root [class*="FormatToggleIcon"] {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

html[data-se-nav="horizontal"] .securends .MuiAppBar-root .MuiToolbar-root {
  display: flex !important;
  align-items: center !important;
}

html[data-se-nav="horizontal"] .securends #brandContent {
  display: flex !important;
  align-items: center;
  align-self: center;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  height: auto;
  margin: 0 16px;
  padding: 0;
  visibility: visible !important;
  opacity: 1 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0;
  box-shadow: none !important;
}

html[data-se-nav="horizontal"] .securends .se-hnav-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  color: var(--se-ink);
}

html[data-se-nav="horizontal"] .securends .se-hnav-title-icon .fa {
  font-size: 14px;
  line-height: 1;
}

html[data-se-nav="horizontal"] .securends .makeBrand,
html[data-se-nav="horizontal"] .securends .makeBrand span,
html[data-se-nav="horizontal"] .securends #tabFocusData {
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: nowrap;
  overflow: visible !important;
  width: auto !important;
  max-width: none !important;
  text-transform: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

html[data-se-nav="horizontal"] .securends .prod-popup-sidebar {
  color: var(--se-ink) !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 28px !important;
  height: 28px !important;
  margin: 0;
  padding: 0;
  line-height: 1;
}

html[data-se-nav="horizontal"] .securends .prod-popup-sidebar:not(.se-hnav-apps-placed) {
  visibility: hidden !important;
  pointer-events: none !important;
}

html[data-se-nav="horizontal"] .securends .prod-popup-sidebar .material-icons {
  color: var(--se-ink) !important;
  font-size: 22px !important;
  width: 22px;
  height: 22px;
  line-height: 22px !important;
}

html[data-se-nav="horizontal"] .securends .MuiAppBar-root nav[role="navigation"] {
  flex: 0 0 auto;
  margin-left: auto;
}

html[data-se-nav="horizontal"] .securends .MuiAppBar-root,
html[data-se-nav="horizontal"] .securends header.MuiAppBar-root {
  /* Same box model as .se-hnav-bar (left + width) so dark gutters stay even. */
  left: var(--se-header-inset-x) !important;
  right: auto !important;
  width: calc(100% - (2 * var(--se-header-inset-x))) !important;
  border-radius: var(--se-r-card) var(--se-r-card) 0 0 !important;
  z-index: 1200;
}

/* Dark + horizontal: flush chrome (no light side gutters). */
html[data-se-mode="dark"][data-se-nav="horizontal"],
html.dark[data-se-nav="horizontal"],
html[data-theme="dark"][data-se-nav="horizontal"] {
  --se-header-inset-x: 0px;
}

html[data-se-mode="dark"][data-se-nav="horizontal"] .securends .MuiAppBar-root,
html[data-se-mode="dark"][data-se-nav="horizontal"] .securends header.MuiAppBar-root,
html[data-se-mode="dark"][data-se-nav="horizontal"] .se-hnav-bar,
html[data-se-mode="dark"][data-se-nav="horizontal"] .securends .se-breadcrumb {
  border-radius: 0 !important;
  border-left: none !important;
  border-right: none !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
}

html[data-se-mode="dark"][data-se-nav="horizontal"] .se-hnav-bar {
  border-top: 1px solid var(--border-default, var(--se-line)) !important;
}

html[data-se-nav="horizontal"] .securends .se-profile-popper {
  position: fixed !important;
  top: var(--se-hnav-profile-top, calc(var(--se-app-header) + var(--se-hnav-bar-h) + 8px)) !important;
  right: var(--se-hnav-profile-right, calc(var(--se-header-inset-x) + 16px)) !important;
  left: auto !important;
  z-index: 1300 !important;
  transform: none !important;
}

html[data-se-nav="horizontal"] .securends .se-hnav-bar {
  z-index: 1100;
}

html[data-se-nav="horizontal"] .securends .se-hnav-brand {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  min-width: 0;
  height: 100%;
  gap: 10px;
  padding-right: 16px;
  border-right: 1px solid var(--se-line);
}

.se-hnav-brand {
  display: none;
}

.se-hnav-title-icon,
.se-hnav-apps-slot {
  display: none;
}

html[data-se-nav="horizontal"] .securends .se-hnav-apps-slot {
  display: inline-block;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
}

.se-hnav-logo {
  display: inline-flex;
  align-items: center;
  margin-right: 12px;
  flex: 0 0 auto;
  background: transparent;
  padding: 0;
  border-radius: 0;
}

.se-hnav-logo img,
.se-hnav-logo img.se-brand-logo {
  display: block;
  height: 32px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
  filter: none !important;
  mix-blend-mode: normal !important;
}

.se-hnav,
.se-hnav-bar {
  display: none;
}

html[data-se-nav="horizontal"] .se-hnav-bar {
  display: flex;
  align-items: center;
  position: fixed;
  top: var(--se-app-header);
  left: var(--se-header-inset-x);
  width: calc(100% - (2 * var(--se-header-inset-x)));
  z-index: 1100;
  box-sizing: border-box;
  min-height: var(--se-hnav-bar-h);
  height: var(--se-hnav-bar-h);
  padding: 0 12px;
  background: var(--bg-header);
  color: var(--text-primary);
  border: 1px solid var(--border-default);
  border-top: 1px solid var(--border-default);
  border-radius: 0 0 var(--se-r-card) var(--se-r-card);
  box-shadow: var(--se-shadow);
  overflow: visible;
}

html[data-se-nav="horizontal"].se-hnav-has-bar .securends .main-content {
  margin-top: calc(var(--se-app-header) + var(--se-hnav-bar-h)) !important;
}

html[data-se-nav="horizontal"] .securends .ReactTable .rt-thead,
html[data-se-nav="horizontal"] .securends .ReactTable .rt-thead.-header,
html[data-se-nav="horizontal"] .securends .ReactTable .rt-thead.-filters,
html[data-se-nav="horizontal"] .securends .ReactTable .rt-th,
html[data-se-nav="horizontal"] .securends .ReactTable .rt-td,
html[data-se-nav="horizontal"] .securends .ReactTable .rt-resizable-header-content,
html[data-se-nav="horizontal"] .securends .ReactTable .rt-resizable-header-content > div {
  margin-top: 0 !important;
}

.se-hnav-arrow {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  margin: 0 4px;
  padding: 0;
  border: 1px solid var(--se-line);
  border-radius: 8px;
  background: var(--se-card);
  color: var(--se-ink-2);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background var(--se-ease), color var(--se-ease), border-color var(--se-ease);
}

.se-hnav-arrow .fa {
  font-size: 11px;
}

.se-hnav-arrow:hover:not(:disabled) {
  background: var(--se-brand-tint);
  color: var(--se-brand);
  border-color: var(--se-brand-line);
}

.se-hnav-arrow:disabled {
  opacity: 0.35;
  cursor: default;
}

.se-hnav-scroller {
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.se-hnav-scroller::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.se-hnav-list {
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
  width: max-content;
  min-width: 0;
  margin: 0;
  padding: 0 4px;
  gap: 2px;
  list-style: none;
  overflow: visible;
}

.se-hnav-item {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}

/* Theme-based top links — icon + label; active uses brand (no left-nav impact). */
.se-hnav-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding: 0 12px;
  border: 0;
  background: transparent;
  color: var(--se-ink) !important;
  font-family: var(--se-sans);
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none !important;
  border-radius: 8px;
  cursor: pointer;
  transition: color var(--se-ease), background var(--se-ease);
}

.se-hnav-ico {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 16px;
  min-width: 16px;
  font-size: 14px !important;
  line-height: 1 !important;
  color: var(--se-ink-2);
  flex-shrink: 0;
}

.se-hnav-label {
  display: inline-block;
  min-width: 0;
}

.se-hnav-caret {
  margin-left: 2px;
  font-size: 9px !important;
  color: var(--se-ink-3);
  flex-shrink: 0;
}

.se-hnav-link:hover {
  background: var(--se-page);
  color: var(--se-brand) !important;
}

.se-hnav-link:hover .se-hnav-ico,
.se-hnav-link:hover .se-hnav-caret {
  color: var(--se-brand);
}

.se-hnav-item.is-open > .se-hnav-link,
.se-hnav-item.is-active > .se-hnav-link {
  background: transparent;
  color: var(--se-brand) !important;
  box-shadow: none;
  font-weight: 600;
}

.se-hnav-item.is-open > .se-hnav-link .se-hnav-ico,
.se-hnav-item.is-active > .se-hnav-link .se-hnav-ico,
.se-hnav-item.is-open > .se-hnav-link .se-hnav-caret,
.se-hnav-item.is-active > .se-hnav-link .se-hnav-caret {
  color: var(--se-brand);
}

/* Dropdown card — section head + icon rows; brand tint active. */
html[data-se-nav="horizontal"] .se-hnav-sub {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  position: fixed;
  top: auto;
  left: auto;
  z-index: 1110;
  min-width: 220px;
  width: max-content;
  max-width: 320px;
  margin: 0;
  padding: 8px;
  background: var(--se-card);
  border: 1px solid var(--se-line);
  border-radius: 12px;
  box-shadow: var(--se-shadow-lg);
  overflow: visible;
}

.se-hnav-sub-head {
  padding: 6px 12px 10px;
  margin: 0 0 2px;
  font-family: var(--se-sans);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--se-ink-3);
  line-height: 1.2;
  border-bottom: 1px solid var(--se-line-soft);
}

.se-hnav-child {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 36px;
  padding: 8px 12px;
  margin: 1px 0;
  border-radius: 8px;
  border-left: 3px solid transparent;
  color: var(--se-ink) !important;
  font-family: var(--se-sans);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.25;
  white-space: nowrap;
  text-decoration: none !important;
  box-sizing: border-box;
  transition: background var(--se-ease), color var(--se-ease), border-color var(--se-ease);
}

.se-hnav-child .se-hnav-ico {
  color: var(--se-ink-2);
}

.se-hnav-child:hover {
  background: var(--se-page);
  color: var(--se-ink) !important;
}

.se-hnav-child:hover .se-hnav-ico {
  color: var(--se-brand);
}

.se-hnav-child.is-active {
  background: var(--se-brand-tint);
  color: var(--se-brand) !important;
  border-left-color: var(--se-brand);
  font-weight: 600;
}

.se-hnav-child.is-active .se-hnav-ico {
  color: var(--se-brand);
}

@media (max-width: 959px) {
  html[data-se-nav="horizontal"] .securends .se-hnav-brand,
  html[data-se-nav="horizontal"] .se-hnav-bar,
  html[data-se-nav="horizontal"] .se-hnav-sub {
    display: none !important;
  }

  html[data-se-nav="horizontal"] .securends #brandContent,
  html[data-se-nav="horizontal"] .securends .makeBrand {
    display: block !important;
  }

  html[data-se-nav="horizontal"] .securends .MuiDrawer-paperAnchorRight {
    display: block !important;
    width: 230px !important;
    height: 100% !important;
    flex-direction: column !important;
  }

  html[data-se-nav="horizontal"] .securends .prod-popup-sidebar {
    top: 13px !important;
    left: 13px !important;
  }

  html[data-se-nav="horizontal"].se-hnav-has-bar .securends .main-content {
    margin-top: var(--se-app-header) !important;
  }
}

/* Minimized left-nav rail + hover flyout (Keka-style layout, theme tokens only).
   Scoped to data-se-nav-mini so the expanded 230px nav is unchanged. */

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]),
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends {
  --se-sidebar-w: var(--se-sidebar-mini-w);
}

/* --------------------------------------------------------------------------
   Rail width
   -------------------------------------------------------------------------- */
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paperAnchorLeft,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .leftNavDrawer .MuiDrawer-paper,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper[class*="drawerPaperMini"] {
  width: var(--se-sidebar-mini-w) !important;
  max-width: var(--se-sidebar-mini-w) !important;
  overflow: visible !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .leftNavCustomScroll,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends div.leftNavCustomScroll,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .SidebarMobile,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="sidebarWrapper"] {
  width: var(--se-sidebar-mini-w) !important;
  max-width: var(--se-sidebar-mini-w) !important;
  overflow: visible !important;
}

/* Header profile cluster uses SidebarMobile / sidebarWrapper class names — do not rail-width it. */
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .SidebarMobile,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root [class*="sidebarWrapper"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .se-header-actions-wrap,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .se-header-actions {
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .UserNameIconWrapper,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .UserNameContent,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .UserSet,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .loggedUser,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiAppBar-root .caretDown {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  max-width: none !important;
  overflow: visible !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .leftNavDrawer,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-docked {
  width: var(--se-sidebar-mini-w) !important;
  overflow: visible !important;
}

/* --------------------------------------------------------------------------
   Logo: Securens-S mark, waffle hidden so it does not cover the S
   -------------------------------------------------------------------------- */
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .prod-popup-sidebar {
  display: none !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile > div,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile [class*="logo"] {
  width: var(--se-sidebar-mini-w) !important;
  justify-content: center !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile a.se-brand-mini {
  padding: 0 !important;
  margin: 0 !important;
  width: 100%;
  justify-content: center !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile .se-brand-mark,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile a.se-brand-mini .se-brand-mark {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile img.se-brand-logo--mark,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .logoMobile .se-brand-mark img {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  filter: none !important;
  -webkit-filter: none !important;
}

/* --------------------------------------------------------------------------
   Tight icon rail — hide labels / chevrons / badges
   -------------------------------------------------------------------------- */
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="item"]:first-child {
  padding-top: 0 !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .SidebarMobile > .MuiList-root > [class*="item"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group {
  margin: 0 !important;
  padding: 0 !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group > [class*="itemCollapseLink"] [class*="itemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group > a [class*="itemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .SidebarMobile > .MuiList-root > a [class*="itemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .SidebarMobile > .MuiList-root > div > a [class*="itemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group > [class*="itemCollapseLink"] .MuiListItemText-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .DashboardItem,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .HelpItem,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group > [class*="itemCollapseLink"] .label-new,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group > a .label-new,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .MuiListItemSecondaryAction-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="itemCollapseLink"] > .MuiSvgIcon-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .SidebarMobile > .MuiList-root > a [class*="itemLink"] > .MuiSvgIcon-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .spinner-wrap {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .SidebarMobile li,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .SidebarMobile div[role="button"] {
  margin: 0 !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group {
  position: relative;
  overflow: visible !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .MuiListItem-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="itemLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="itemCollapseLink"] {
  justify-content: center !important;
  align-items: center !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 10px 0 !important;
  min-height: 40px !important;
  height: 40px !important;
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  border-left: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .MuiListItemIcon-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="itemIcon"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="itemIcon1"] {
  display: inline-flex !important;
  min-width: 22px !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--se-nav-icon) !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .MuiListItemIcon-root .material-icons,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .MuiListItemIcon-root .MuiSvgIcon-root {
  color: var(--se-nav-icon) !important;
  fill: currentColor !important;
  background: transparent !important;
  background-color: transparent !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: 20px !important;
  width: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="itemCollapseLink"]:hover,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper [class*="itemLink"]:hover,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group:hover > [class*="itemCollapseLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group:hover > a [class*="itemCollapseLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper a.active [class*="itemLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper a.active [class*="itemCollapseLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper a.active {
  background: transparent !important;
  background-color: transparent !important;
  border-left: none !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper a.active .MuiListItemIcon-root .material-icons,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper a.active .MuiListItemIcon-root .MuiSvgIcon-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group-active > [class*="itemCollapseLink"] .MuiListItemIcon-root .material-icons,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group-active > [class*="itemCollapseLink"] .MuiListItemIcon-root .MuiSvgIcon-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group-active > a [class*="itemCollapseLink"] .MuiListItemIcon-root .material-icons,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .se-nav-group-active > a [class*="itemCollapseLink"] .MuiListItemIcon-root .MuiSvgIcon-root {
  color: var(--se-brand) !important;
  fill: currentColor !important;
}

/* --------------------------------------------------------------------------
   Flyout — parked off-canvas, shown on group hover. Text-only, theme surfaces.
   -------------------------------------------------------------------------- */
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiCollapse-container.se-nav-flyout,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .MuiDrawer-paper .MuiCollapse-container {
  display: none !important;
  position: absolute !important;
  top: 0 !important;
  left: 100% !important;
  width: 220px !important;
  min-width: 200px !important;
  max-width: 260px !important;
  max-height: min(360px, calc(100vh - var(--se-flyout-top, 72px) - 8px)) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 6px 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  z-index: 1400;
  background: var(--se-card) !important;
  color: var(--se-nav-text) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: 0 var(--se-r) var(--se-r) 0 !important;
  box-shadow: var(--se-shadow-md) !important;
}

/* Invisible bridge over the icon row so hover is not lost between icon and menu. */
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout::before {
  content: "";
  position: absolute;
  top: -8px;
  bottom: -8px;
  right: 100%;
  width: 100%;
  min-width: var(--se-sidebar-mini-w);
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout .MuiCollapse-wrapper,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout .MuiCollapse-wrapperInner {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group:hover > .se-nav-flyout,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group:focus-within > .se-nav-flyout,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group:hover > .MuiCollapse-container,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group:focus-within > .MuiCollapse-container {
  display: block !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  pointer-events: auto !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group:hover > .se-nav-flyout:not(:has(a)),
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group:focus-within > .se-nav-flyout:not(:has(a)),
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group.se-nav-flyout-off > .se-nav-flyout,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group.se-nav-flyout-off > .MuiCollapse-container,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group.se-nav-flyout-off:hover > .se-nav-flyout,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group.se-nav-flyout-off:hover > .MuiCollapse-container,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group.se-nav-flyout-off:focus-within > .se-nav-flyout,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-group.se-nav-flyout-off:focus-within > .MuiCollapse-container {
  display: none !important;
  pointer-events: none !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout .MuiList-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="item"] {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout .MuiListItem-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="itemLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="collapseItemLink"] {
  justify-content: flex-start !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 8px 16px !important;
  min-height: 36px !important;
  height: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  border-left: 2px solid transparent !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="itemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="collapseItemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="itemTextMini"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="collapseItemTextMini"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout .MuiListItemText-root {
  display: block !important;
  width: auto !important;
  height: auto !important;
  overflow: hidden !important;
  opacity: 1 !important;
  transform: none !important;
  flex: 1 1 auto;
  color: var(--se-nav-text) !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout .MuiListItemIcon-root,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="itemIcon"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="itemIcon1"] {
  display: none !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout a:hover [class*="itemLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="itemLink"]:hover,
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout [class*="collapseItemLink"]:hover {
  background: var(--se-navy-2) !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout a.active [class*="itemLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout a.active [class*="collapseItemLink"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout a.active {
  background: var(--se-nav-active-bg) !important;
  border-left-color: var(--se-brand) !important;
}

html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout a.active [class*="itemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout a.active [class*="collapseItemText"],
html[data-se-nav-mini="true"]:not([data-se-nav="horizontal"]) .securends .se-nav-flyout a.active span {
  color: var(--se-nav-active-text) !important;
  font-weight: 500 !important;
}

/* App-wide modal overlay.
   Libraries: react-bootstrap-modal (Modal.Header/Body/Footer/Dismiss),
   Bootstrap 3/5 (.modal.in / .modal.show), MUI Dialog.
   Do NOT change show/onHide/backdrop, dialogClassName, ids, or button handlers.
   Right/left drawers share Campaign Info width (55%). Do not invent per-screen drawer widths.
   Backdrop and some dialogs render on body — style both .securends and html[data-se-theme]. */

/* --------------------------------------------------------------------------
   Backdrop
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal-backdrop,
.securends .modal-backdrop,
.modal-backdrop {
  background-color: var(--se-navy) !important;
  z-index: calc(var(--se-z-modal) - 10) !important;
}

html[data-se-theme] .modal-backdrop.in,
html[data-se-theme] .modal-backdrop.show,
.securends .modal-backdrop.in,
.securends .modal-backdrop.show,
.modal-backdrop.in,
.modal-backdrop.show {
  opacity: 0.45 !important;
}

html[data-se-theme] .modal,
.securends .modal,
.modal {
  z-index: var(--se-z-modal) !important;
  font-family: var(--se-sans);
}

/* --------------------------------------------------------------------------
   Centered dialog card
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal:not(.right):not(.left) .modal-dialog:not(.products-menu-modal),
.securends .modal:not(.right):not(.left) .modal-dialog:not(.products-menu-modal) {
  margin: 48px auto 24px !important;
}

html[data-se-theme] .modal-content,
.securends .modal-content,
.modal-content {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-modal) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

/* Right / left drawers: keep full-height + existing width; round the inner edge only. */
html[data-se-theme] .modal.right .modal-content,
html[data-se-theme] .modal.left .modal-content,
.securends .modal.right .modal-content,
.securends .modal.left .modal-content,
.modal.right .modal-content,
.modal.left .modal-content {
  border-radius: var(--se-r-modal) 0 0 var(--se-r-modal) !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .modal.left .modal-content,
.securends .modal.left .modal-content,
.modal.left .modal-content,
html[data-se-theme] .products-menu-modal .modal-content,
.products-menu-modal .modal-content {
  border-radius: 0 var(--se-r-modal) var(--se-r-modal) 0 !important;
}

html[data-se-theme] .sidebar-modal .modal-content,
.securends .sidebar-modal .modal-content {
  border-radius: var(--se-r-modal) 0 0 var(--se-r-modal) !important;
  border: 1px solid var(--se-line) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .products-menu-modal .modal-content,
.products-menu-modal.sidebar-modal .modal-content,
.products-menu-modal .modal-content {
  border-radius: 0 var(--se-r-modal) var(--se-r-modal) 0 !important;
}

/* --------------------------------------------------------------------------
   Header — beat pickels #f1f1f1, #0078d4 (sidebar-modal), #193d5b (election)
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal-header,
html[data-se-theme] .modelheader,
html[data-se-theme] .sidebar-modal .modelheader,
html[data-se-theme] .sidebar-modal .modal-header,
html[data-se-theme] #electionModal .modal-header,
html[data-se-theme] #electionLoaderModal .modal-header,
html[data-se-theme] .campaignAssignments .modal-header,
.securends .modal-header,
.securends .modelheader,
.securends .sidebar-modal .modelheader,
.securends .sidebar-modal .modal-header,
.modal-header,
.modelheader {
  display: flex !important;
  align-items: center;
  gap: 12px;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border-bottom: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-modal) var(--se-r-modal) 0 0 !important;
  padding: 14px 20px !important;
  min-height: 52px;
}

html[data-se-theme] .modal.right .modal-header,
html[data-se-theme] .modal.right .modelheader,
html[data-se-theme] .sidebar-modal .modelheader,
html[data-se-theme] .sidebar-modal .modal-header,
.securends .modal.right .modal-header,
.securends .sidebar-modal .modelheader {
  border-radius: var(--se-r-modal) 0 0 0 !important;
}

html[data-se-theme] .sidebar-modal .modelheader,
.securends .sidebar-modal .modelheader,
html[data-se-theme] .campaign-delete-template-modal .modelheader,
html[data-se-theme] .campaign-delete-template-modal .modal-header,
.securends .campaign-delete-template-modal .modelheader,
.securends .campaign-delete-template-modal .modal-header {
  /* Beat pickels-v2 `.sidebar-modal .modelheader` #0078d4 and campaign-delete-template-modal. */
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  position: relative !important;
}

html[data-se-theme] .modal-header .modal-title,
html[data-se-theme] .modal-header h4,
html[data-se-theme] .modelheader .modal-title,
html[data-se-theme] .modelheader h4,
html[data-se-theme] .sidebar-modal .modal-header h4,
html[data-se-theme] #electionModal .modal-header h4,
.securends .modal-header .modal-title,
.securends .modal-header h4,
.securends .modelheader .modal-title,
.modal-header h4,
.modal-title {
  font-family: var(--se-sans) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: var(--se-ink) !important;
  margin: 0 !important;
  flex: 1 1 auto;
}

html[data-se-theme] .campaign-delete-template-modal .modal-header .close span,
html[data-se-theme] .campaign-delete-template-modal .modelheader .close span,
.securends .campaign-delete-template-modal .modal-header .close span,
.campaign-delete-template-modal .modelheader .close span {
  color: var(--se-ink-2) !important;
}

html[data-se-theme] .modal-header .close,
html[data-se-theme] .modal-header button.close,
html[data-se-theme] .modal-header .btn-close,
html[data-se-theme] .modelheader .close,
html[data-se-theme] .modelheader .btn-close,
html[data-se-theme] .sidebar-modal .modal-header .close span,
html[data-se-theme] #electionModal .modal-header .close span,
.securends .modal-header .close,
.securends .modal-header button.close,
.securends .modal-header .btn-close,
.securends .modelheader .close,
.modal-header .close,
.modal-header button.close,
.modal-header .btn-close,
.modelheader .btn-close {
  width: 32px !important;
  height: 32px !important;
  margin: 0 0 0 8px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  border: none !important;
  background: transparent !important;
  color: var(--se-ink-2) !important;
  opacity: 1 !important;
  text-shadow: none !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  line-height: 32px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  float: none !important;
  order: 2;
}

html[data-se-theme] .modal-header .close span,
html[data-se-theme] .sidebar-modal .modal-header .close span,
html[data-se-theme] #electionModal .modal-header .close span,
.securends .modal-header .close span,
.modal-header .close span {
  color: var(--se-ink-2) !important;
}

html[data-se-theme] .modal-header .close:hover,
html[data-se-theme] .modal-header .btn-close:hover,
.securends .modal-header .close:hover,
.modal-header .close:hover,
.modal-header .btn-close:hover {
  background: var(--se-page) !important;
  color: var(--se-ink) !important;
}

/* --------------------------------------------------------------------------
   Body
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal-body,
.securends .modal-body,
.modal-body {
  color: var(--se-ink) !important;
  font-size: var(--se-t-body) !important;
  font-weight: 400 !important;
  padding: 16px 20px 20px !important;
  background: var(--se-card) !important;
}

html[data-se-theme] .modal.right .modal-body,
html[data-se-theme] .modal.left .modal-body,
.securends .modal.right .modal-body,
.modal.right .modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  padding: 16px 20px 24px !important;
}

html[data-se-theme] .modal-body p,
.securends .modal-body p {
  color: var(--se-ink-2);
  font-size: 14px;
  line-height: 1.5;
}

html[data-se-theme] .modal-body p b,
html[data-se-theme] .modal-body p strong,
.securends .modal-body p b {
  color: var(--se-ink);
  font-weight: 600;
}

/* --------------------------------------------------------------------------
   Body copy — beat pickels #091432 !important (Delete Person .entCredsData,
   confirmations, labels). Portaled drawers often sit outside .securends.
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal-body .entCredsData,
html[data-se-theme] .modal-body .entCredsData span,
html[data-se-theme] .modal-body .entCredsData b,
html[data-se-theme] .modal-body .entCredsData strong,
html[data-se-theme] .modal-body .EntitlementCreds,
html[data-se-theme] .modal .entCredsData,
html[data-se-theme] .modal .entCredsData span,
html[data-se-theme] .modal .entCredsData b,
html[data-se-theme] .modal .entCredsData strong,
html[data-se-theme] .modal .EntitlementCreds,
.modal-body .entCredsData,
.modal-body .entCredsData span,
.modal-body .entCredsData b,
.modal-body .entCredsData strong,
.modal-body .EntitlementCreds,
.modal .entCredsData span,
.modal .EntitlementCreds {
  color: var(--se-ink) !important;
}

html[data-se-theme] .modal-body :is(p, span, b, strong, li, label, h1, h2, h3, h4, h5, h6, td, th, small, em),
html[data-se-theme] .MuiDialogContent-root :is(p, span, b, strong, li, label, h1, h2, h3, h4, h5, h6, td, th, small, em),
.modal-body :is(p, span, b, strong, li, label, h1, h2, h3, h4, h5, h6, td, th, small, em),
.MuiDialogContent-root :is(p, span, b, strong, li, label, h1, h2, h3, h4, h5, h6, td, th, small, em) {
  color: var(--se-ink) !important;
}

/* Action chips that are <span> (e.g. #add_button.custom__pg):
   Do NOT set color on the chip itself (would beat dark ice+fg pairs via inherit).
   Only neutralize nested label/icon spans after the body ink sweep. */
html[data-se-theme] .modal-body :is(#add_button, .custom__pg, .custom__lg, .custom_danger, .custom_secondary, .AddAppBtn) :is(span, b, strong, i, em, small),
.modal-body :is(#add_button, .custom__pg, .custom__lg, .custom_danger, .custom_secondary, .AddAppBtn) :is(span, b, strong, i, em, small) {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

/* App-wide modal action buttons — light + dark readable pairs */
html[data-se-theme] .modal-body .custom__pg:not(.custom_danger):not(.btn-danger),
html[data-se-theme] .modal-body button.custom__pg:not(.custom_danger),
html[data-se-theme] .modal-body #create_button,
html[data-se-theme] .modal .se-create-app-actions #create_button,
html[data-se-theme] .modal .se-add-person-actions #create_button {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html[data-se-theme] .modal-body #add_button,
html[data-se-theme] .modal-body span#add_button.custom__pg,
html[data-se-theme] .modal .se-create-app-actions #add_button,
html[data-se-theme] .modal .se-add-person-actions #add_button {
  background: var(--se-card) !important;
  border: 1.5px solid var(--se-brand) !important;
  color: var(--se-brand) !important;
  -webkit-text-fill-color: var(--se-brand) !important;
}

html[data-se-mode="dark"] .modal-body .custom__pg:not(.custom_danger):not(.btn-danger),
html[data-se-mode="dark"] .modal-body button.custom__pg:not(.custom_danger),
html[data-se-mode="dark"] .modal-body #create_button,
html[data-se-mode="dark"] .modal-body #add_button,
html[data-se-mode="dark"] .modal-body span#add_button,
html[data-se-mode="dark"] .modal-body span.custom__pg,
html[data-se-mode="dark"] .modal .se-create-app-actions #create_button,
html[data-se-mode="dark"] .modal .se-create-app-actions #add_button,
html[data-se-mode="dark"] .modal .se-add-person-actions #create_button,
html[data-se-mode="dark"] .modal .se-add-person-actions #add_button,
html[data-se-mode="dark"] .modal form#iamUserForm #create_button,
html[data-se-mode="dark"] .modal form#iamUserForm #add_button,
html[data-theme="dark"] .modal-body #add_button,
html[data-theme="dark"] .modal-body #create_button,
html.dark .modal-body #add_button,
html.dark .modal-body #create_button {
  background: var(--se-btn-bg, #dbeafe) !important;
  background-color: var(--se-btn-bg, #dbeafe) !important;
  border: 1px solid var(--se-btn-bg, #dbeafe) !important;
  border-color: var(--se-btn-bg, #dbeafe) !important;
  color: var(--se-btn-fg, #333333) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #333333) !important;
  box-shadow: none !important;
}

html[data-se-mode="dark"] .modal-body #add_button > span,
html[data-se-mode="dark"] .modal-body span#add_button > span,
html[data-se-mode="dark"] .modal-body .custom__pg > span,
html[data-theme="dark"] .modal-body #add_button > span,
html.dark .modal-body #add_button > span {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
  background: transparent !important;
}

html[data-se-mode="dark"] .modal-body .custom__lg,
html[data-se-mode="dark"] .modal-body .custom_secondary,
html[data-se-mode="dark"] .modal-body .cancelBtn,
html[data-theme="dark"] .modal-body .custom__lg,
html.dark .modal-body .custom__lg {
  background: var(--se-raise, #151e2e) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  -webkit-text-fill-color: var(--se-ink) !important;
}

html[data-se-mode="dark"] .modal-body .custom_danger,
html[data-se-mode="dark"] .modal-body button.custom_danger,
html[data-theme="dark"] .modal-body .custom_danger,
html.dark .modal-body .custom_danger {
  background: var(--se-risk) !important;
  border-color: var(--se-risk) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Secondary prose (paragraphs under titles) */
html[data-se-theme] .modal-body > p,
html[data-se-theme] .modal-body p,
.modal-body > p,
.modal-body p {
  color: var(--se-ink-2) !important;
  font-size: 14px;
  line-height: 1.5;
}

html[data-se-theme] .modal-body p b,
html[data-se-theme] .modal-body p strong,
.modal-body p b,
.modal-body p strong {
  color: var(--se-ink) !important;
  font-weight: 600;
}

/* Keep semantic alert / risk / link colors after the ink sweep */
html[data-se-theme] .modal-body .alert :is(p, span, b, strong, div, label, li, small),
html[data-se-theme] .modal .alert :is(p, span, b, strong, div, label, li, small),
html[data-se-theme] .MuiDialogContent-root .alert :is(p, span, b, strong, div, label),
.modal-body .alert :is(p, span, b, strong, div, label, li, small),
.modal .alert :is(p, span, b, strong, div, label, li, small) {
  color: inherit !important;
}

html[data-se-theme] .modal-body a,
html[data-se-theme] .modal .alert a,
.securends .modal-body a,
.modal-body a {
  color: var(--se-brand) !important;
}

html[data-se-theme] .modal-body .error,
html[data-se-theme] .modal-body .error-msg,
html[data-se-theme] .modal-body .text-danger,
html[data-se-theme] .modal-body [style*="color: red"],
html[data-se-theme] .modal-body [style*="color:red"],
html[data-se-theme] .modal-body [style*="color: Red"],
.modal-body .error,
.modal-body .text-danger {
  color: var(--se-risk) !important;
}

/* Spans inside buttons picked up the ink sweep — restore parent button color */
html[data-se-theme] .modal-body :is(button, .btn, .button, .badge, .label) :is(span, b, strong, i, em, small),
html[data-se-theme] .MuiDialogContent-root :is(button, .btn, .button) :is(span, b, strong),
.modal-body :is(button, .btn, .button, .badge, .label) :is(span, b, strong, i, em, small) {
  color: inherit !important;
}

html[data-se-theme] .modal-body .form-control,
html[data-se-theme] .modal-body select.form-control,
.securends .modal-body .form-control {
  border-radius: var(--se-r) !important;
  border-color: var(--se-line) !important;
  color: var(--se-ink) !important;
  background-color: var(--bg-input, var(--se-card)) !important;
}

/* --------------------------------------------------------------------------
   Modal .popUpLoader ("Processing...") — ALL modal drawers / dialogs
   login.css parks .fa-spinner-icon .fa-spinner at position:absolute; right:-60px.
   Modals often sit outside .securends, so those resets never apply and the ring
   drifts left while the label stays centered. Fix: hide FA icon, draw ::before
   ring in the same flex row as the label (no .securends required).
   -------------------------------------------------------------------------- */
html[data-se-theme] .modal-content .popUpLoader,
html[data-se-theme] .modal .popUpLoader,
html[data-se-theme] .modal.right .popUpLoader,
html[data-se-theme] .modal.left .popUpLoader,
html[data-se-theme] .actions-modal .popUpLoader,
.modal-content .popUpLoader,
.modal .popUpLoader,
.modal.right .popUpLoader,
.modal.left .popUpLoader,
.actions-modal .popUpLoader,
.bulk-launch-modal-body .popUpLoader,
.securends .modal-content .popUpLoader,
.securends .modal .popUpLoader,
.securends .modal.right .popUpLoader,
.securends .actions-modal .popUpLoader {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 140px !important;
  margin: 0 auto !important;
  padding: 28px 16px !important;
  text-align: center !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  color: var(--se-ink-2, #475569) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  font-family: var(--se-sans, system-ui, sans-serif) !important;
  line-height: 1.4 !important;
}

/* Modern ring sits in the flex row next to "Processing..." */
html[data-se-theme] .modal-content .popUpLoader::before,
html[data-se-theme] .modal .popUpLoader::before,
.modal-content .popUpLoader::before,
.modal .popUpLoader::before,
.actions-modal .popUpLoader::before,
.securends .modal-content .popUpLoader::before,
.securends .modal .popUpLoader::before {
  content: "" !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 3px solid var(--se-loader-track, #e2e8f0) !important;
  border-top-color: var(--se-brand, #2563eb) !important;
  border-radius: 50% !important;
  animation: se-spin 0.7s linear infinite !important;
  position: static !important;
  float: none !important;
}

/* Kill login.css absolute FA spinner so it cannot sit on the left */
html[data-se-theme] .modal-content .popUpLoader .fa-spinner-icon,
html[data-se-theme] .modal .popUpLoader .fa-spinner-icon,
html[data-se-theme] .modal-content .popUpLoader .fa-spinner-icon .fa-spinner,
html[data-se-theme] .modal .popUpLoader .fa-spinner-icon .fa-spinner,
html[data-se-theme] .modal-content .popUpLoader i.fa.fa-spinner,
html[data-se-theme] .modal .popUpLoader i.fa.fa-spinner,
.modal-content .popUpLoader .fa-spinner-icon,
.modal .popUpLoader .fa-spinner-icon,
.modal-content .popUpLoader .fa-spinner-icon .fa-spinner,
.modal .popUpLoader .fa-spinner-icon .fa-spinner,
.modal-content .popUpLoader i.fa.fa-spinner,
.modal .popUpLoader i.fa.fa-spinner,
.actions-modal .popUpLoader .fa-spinner-icon,
.actions-modal .popUpLoader .fa-spinner-icon .fa-spinner,
.actions-modal .popUpLoader i.fa.fa-spinner,
.securends .modal-content .popUpLoader .fa-spinner-icon,
.securends .modal .popUpLoader .fa-spinner-icon,
.securends .modal-content .popUpLoader .fa-spinner-icon .fa-spinner,
.securends .modal .popUpLoader i.fa.fa-spinner {
  display: none !important;
  visibility: hidden !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  float: none !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

html[data-se-theme] .modal-content .popUpLoader>span,
html[data-se-theme] .modal .popUpLoader>span,
.modal-content .popUpLoader>span,
.modal .popUpLoader>span,
.actions-modal .popUpLoader>span,
.securends .modal-content .popUpLoader>span,
.securends .modal .popUpLoader>span {
  display: inline-flex !important;
  align-items: center !important;
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
}

/* Modal .loaderTitle wait — same centering contract without .securends */
html[data-se-theme] .modal-content .loaderTitle,
html[data-se-theme] .modal .loaderTitle,
.modal-content .loaderTitle,
.modal .loaderTitle {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 120px !important;
  margin: 0 auto !important;
  padding: 24px 16px !important;
  text-align: center !important;
  float: none !important;
}

/* --------------------------------------------------------------------------
   Footer + modal buttons (Cancel = custom__lg, Yes = custom__pg)
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal-footer,
.securends .modal-footer,
.modal-footer {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  border-radius: 0 0 var(--se-r-modal) var(--se-r-modal) !important;
  padding: 12px 20px !important;
}

html[data-se-theme] .modal.right .modal-footer,
.securends .modal.right .modal-footer,
.modal.right .modal-footer {
  border-radius: 0 0 0 var(--se-r-modal) !important;
  gap: 8px !important;
}

html[data-se-theme] .modal.right .modal-footer .custom__lg,
html[data-se-theme] .modal.right .modal-footer .custom_secondary,
html[data-se-theme] .modal.right .modal-footer a.custom__lg,
html[data-se-theme] .modal.right .modal-footer button.custom__lg,
html[data-se-theme] .modal.right .modal-footer #epNo,
html[data-se-theme] .ep-details-modal .modal-footer .custom__lg,
html[data-se-theme] .ep-details-modal .modal-footer #epNo {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r) !important;
  min-width: 72px;
  height: 32px !important;
  padding: 0 16px !important;
  margin: 0 !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 30px !important;
  box-shadow: none !important;
}

html[data-se-theme] .modal.right .modal-footer .custom__pg,
html[data-se-theme] .modal.right .modal-footer button.custom__pg,
html[data-se-theme] .modal.right .modal-footer #epYes,
html[data-se-theme] .ep-details-modal .modal-footer .custom__pg,
html[data-se-theme] .ep-details-modal .modal-footer #epYes {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  min-width: 72px;
  height: 32px !important;
  padding: 0 16px !important;
  margin: 0 !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 30px !important;
  box-shadow: none !important;
}

html[data-se-theme] .modal.right .modal-footer .custom__pg:disabled,
html[data-se-theme] .modal.right .modal-footer #epYes:disabled,
html[data-se-theme] .ep-details-modal .modal-footer #epYes:disabled {
  background: var(--se-brand) !important;
  border-color: var(--se-brand) !important;
  color: #fff !important;
  opacity: 0.4 !important;
  cursor: not-allowed !important;
}

html[data-se-theme] .modal.right .modal-footer .custom__lg:hover,
html[data-se-theme] .modal.right .modal-footer #epNo:hover {
  background: var(--se-page) !important;
  border-color: var(--se-line-soft) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .modal.right .modal-footer .custom__pg:hover:not(:disabled),
html[data-se-theme] .modal.right .modal-footer #epYes:hover:not(:disabled) {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #fff !important;
}

html[data-se-theme] .modal.left .modal-footer,
.securends .modal.left .modal-footer,
.modal.left .modal-footer {
  border-radius: 0 0 var(--se-r-modal) 0 !important;
}

html[data-se-theme] .modal-footer .custom__lg,
html[data-se-theme] .modal-footer .custom_secondary,
html[data-se-theme] .modal-footer .custom_default,
html[data-se-theme] .modal-footer .btn-default,
.securends .modal-footer .custom__lg,
.securends .modal-footer .custom_secondary,
.securends .modal-footer .custom_default,
.modal-footer .custom__lg,
.modal-footer .btn-default {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r) !important;
  height: 32px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 30px !important;
  box-shadow: none !important;
  text-transform: none !important;
}

html[data-se-theme] .modal-footer .custom__pg,
html[data-se-theme] .modal-footer .custom_primary,
html[data-se-theme] .modal-footer .custom_success,
html[data-se-theme] .modal-footer .custom_pien,
html[data-se-theme] .modal-footer .btn-primary,
.securends .modal-footer .custom__pg,
.securends .modal-footer .custom_primary,
.modal-footer .custom__pg,
.modal-footer .custom_primary,
.modal-footer .btn-primary {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  height: 32px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 30px !important;
  box-shadow: none !important;
  text-transform: none !important;
}

html[data-se-theme] .modal-footer .custom_danger,
html[data-se-theme] .modal-footer .custom_warning,
.securends .modal-footer .custom_danger,
.modal-footer .custom_danger {
  background: var(--se-risk) !important;
  border-color: var(--se-risk) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  height: 32px !important;
  padding: 0 14px !important;
}

html[data-se-theme] .modal-footer .custom__lg:hover,
.securends .modal-footer .custom__lg:hover,
.modal-footer .custom__lg:hover,
.modal-footer .btn-default:hover {
  background: var(--se-page) !important;
  border-color: var(--se-line-soft) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .modal-footer .custom__pg:hover,
html[data-se-theme] .modal-footer .custom_primary:hover,
.securends .modal-footer .custom__pg:hover,
.modal-footer .custom__pg:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #fff !important;
}

html[data-se-theme] .sidebar-btn-container,
.securends .sidebar-btn-container {
  border-top: 1px solid var(--se-line) !important;
  background: var(--se-page);
  padding: 12px 20px;
}

/* --------------------------------------------------------------------------
   MUI Dialog (Access Analysis, Form Preview, App Guide)
   -------------------------------------------------------------------------- */

html[data-se-theme] .MuiDialog-paper,
.securends .MuiDialog-paper {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-modal) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .MuiDialogTitle-root,
.securends .MuiDialogTitle-root {
  font-family: var(--se-sans) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  border-bottom: 1px solid var(--se-line);
  padding: 14px 20px !important;
}

html[data-se-theme] .MuiDialogContent-root,
.securends .MuiDialogContent-root {
  color: var(--se-ink-2) !important;
  padding: 16px 20px !important;
}

html[data-se-theme] .MuiDialogActions-root,
.securends .MuiDialogActions-root {
  border-top: 1px solid var(--se-line);
  background: var(--se-page);
  padding: 12px 20px !important;
  gap: 8px;
}

html[data-se-theme] .MuiDialog-root .MuiBackdrop-root,
.securends .MuiDialog-root .MuiBackdrop-root {
  background-color: var(--se-modal-scrim, rgba(15, 23, 42, 0.45)) !important;
}

@media (max-width: 720px) {

  html[data-se-theme] .modal:not(.right):not(.left) .modal-dialog:not(.products-menu-modal),
  .securends .modal:not(.right):not(.left) .modal-dialog:not(.products-menu-modal) {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    margin: 16px auto !important;
  }
}

/* --------------------------------------------------------------------------
   Modal form controls (global chrome)
   Theme tokens only. Keep ids, name, onChange, show/onHide, .modal.right width.
   Do not restyle flipswitch. Do not treat .multiselect as a 3-dots menu.
   Bootstrap-multiselect menus may sit in the modal or on body — style both.
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal-body label,
html[data-se-theme] .modal-body .control-label,
html[data-se-theme] .modal-body .form-label,
html[data-se-theme] .MuiDialogContent-root label,
.securends .modal-body label,
.securends .modal-body .control-label {
  color: var(--se-ink) !important;
  font-family: var(--se-sans);
  font-size: 13.5px;
  font-weight: 500;
  white-space: normal;
  max-width: 100%;
}

html[data-se-theme] .modal-body .form-control,
html[data-se-theme] .modal-body select.form-control,
html[data-se-theme] .modal-body textarea.form-control,
html[data-se-theme] .modal-body input[type="text"],
html[data-se-theme] .modal-body input[type="email"],
html[data-se-theme] .modal-body input[type="search"],
html[data-se-theme] .modal-body input[type="password"],
html[data-se-theme] .modal-body input[type="number"],
html[data-se-theme] .modal-body input.appSe,
html[data-se-theme] .MuiDialogContent-root .form-control,
html[data-se-theme] .MuiDialogContent-root input[type="text"],
.securends .modal-body .form-control,
.securends .modal-body select.form-control,
.securends .modal-body textarea.form-control {
  width: 100%;
  max-width: 100% !important;
  min-height: 36px !important;
  height: 36px;
  padding: 6px 12px !important;
  background-color: var(--bg-input, var(--se-card)) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  font-family: var(--se-sans);
  font-size: 13.5px;
}

/* Native selects in modals — keep caret (do not use background shorthand) */
html[data-se-theme] .modal-body select.form-control:not([multiple]),
html[data-se-theme] .modal-body select:not([multiple]),
.securends .modal-body select.form-control:not([multiple]),
.securends .modal-body select:not([multiple]) {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: var(--se-card) !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 7px !important;
  padding-right: 28px !important;
}

html[data-se-theme] .modal-body textarea.form-control,
.securends .modal-body textarea.form-control {
  height: auto;
  min-height: 88px !important;
}

html[data-se-theme] .modal-body .form-control::placeholder,
html[data-se-theme] .modal-body input::placeholder,
.securends .modal-body .form-control::placeholder {
  color: var(--se-ink-3) !important;
}

html[data-se-theme] .modal-body .form-control:focus,
html[data-se-theme] .modal-body select:focus,
html[data-se-theme] .modal-body input[type="text"]:focus,
html[data-se-theme] .modal-body input[type="email"]:focus,
html[data-se-theme] .modal-body input[type="search"]:focus,
html[data-se-theme] .modal-body input[type="password"]:focus,
html[data-se-theme] .modal-body input[type="number"]:focus,
.securends .modal-body .form-control:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint) !important;
  outline: none;
}

/* react-select search input — beat modal `input[type=text]` box-in-box chrome */
html[data-se-theme] .modal-body .react-select__input,
html[data-se-theme] .modal-body .react-select__input input,
html[data-se-theme] .modal-body .react-select__control input,
html[data-se-theme] .modal-body .react-select__control input[type="text"],
html[data-se-theme] .modal-body .react-select__control input[type="search"],
html[data-se-theme] .modal-body .selectCampaign input,
html[data-se-theme] .modal-body .se-modal-select input,
html[data-se-theme] .modal-body .emailTemplate input,
html[data-se-theme] .modal-body div[class^="css-"][class*="-control"] input,
html[data-se-theme] .modal-body div[class^="css-"][class*="-control"] input[type="text"],
html[data-se-theme] .modal-body div[class^="css-"][class*="-Input"] input,
html[data-se-theme] .MuiDialogContent-root .react-select__input input,
html[data-se-theme] .MuiDialogContent-root div[class^="css-"][class*="-control"] input,
.modal-body .react-select__input,
.modal-body .react-select__input input,
.modal-body .react-select__control input,
.modal-body .react-select__control input[type="text"],
.modal-body .selectCampaign input,
.modal-body .se-modal-select input,
.modal-body .emailTemplate input,
.modal-body div[class^="css-"][class*="-control"] input,
.modal-body div[class^="css-"][class*="-control"] input[type="text"] {
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

html[data-se-theme] .modal-body .react-select__input input:focus,
html[data-se-theme] .modal-body .react-select__control input:focus,
html[data-se-theme] .modal-body .react-select__control input[type="text"]:focus,
html[data-se-theme] .modal-body .selectCampaign input:focus,
html[data-se-theme] .modal-body .emailTemplate input:focus,
html[data-se-theme] .modal-body div[class^="css-"][class*="-control"] input:focus,
.modal-body .react-select__input input:focus,
.modal-body .react-select__control input:focus,
.modal-body .emailTemplate input:focus,
.modal-body div[class^="css-"][class*="-control"] input:focus {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

html[data-se-theme] .modal-body .form-control.invalid,
html[data-se-theme] .modal-body button.multiselect.invalid,
.securends .modal-body .form-control.invalid,
.securends .modal-body button.multiselect.invalid {
  border-color: var(--se-risk) !important;
}

html[data-se-theme] .modal-body .error,
html[data-se-theme] .modal-body .error-msg,
.securends .modal-body .error {
  color: var(--se-risk) !important;
}

/* Beat pickels max-width: 300px on launch-modal selects */
html[data-se-theme] .modal-body .col-md-6 .form-control,
html[data-se-theme] .campaignModal .modal-body .col-md-6 .form-control,
.securends .modal-body .col-md-6 .form-control {
  max-width: 100% !important;
}

/* Launch Campaign — email + messaging fields same width / height */
html[data-se-theme] .campaignModal .se-launch-field,
.campaignModal .se-launch-field {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 8px 0 8px !important;
  padding: 0 !important;
  float: none !important;
}

html[data-se-theme] .campaignModal .se-launch-field-label,
.campaignModal .se-launch-field-label {
  display: block !important;
  width: 100% !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  line-height: 1.35 !important;
}

html[data-se-theme] .campaignModal .se-launch-email-template-field .react-select__control,
html[data-se-theme] .campaignModal .se-launch-email-template-field .selectCampaign .react-select__control,
.campaignModal .se-launch-email-template-field .react-select__control {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 36px !important;
  height: 36px !important;
  box-sizing: border-box !important;
}

/* Choose Messaging System — compact dropdown width */
html[data-se-theme] .campaignModal .se-launch-messaging-field,
.campaignModal .se-launch-messaging-field {
  width: 100% !important;
  max-width: 280px !important;
}

html[data-se-theme] .campaignModal .se-launch-messaging-field .form-control,
.campaignModal .se-launch-messaging-field .form-control {
  width: 100% !important;
  max-width: 280px !important;
  min-height: 36px !important;
  height: 36px !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .campaignModal .se-launch-email-template-field .react-select__value-container,
.campaignModal .se-launch-email-template-field .react-select__value-container {
  padding: 0 8px 0 12px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
}

html[data-se-theme] .campaignModal .se-launch-email-template-field .react-select__indicators,
.campaignModal .se-launch-email-template-field .react-select__indicators {
  height: 36px !important;
  padding-right: 4px !important;
}

html[data-se-theme] .campaignModal .se-launch-email-template-field .react-select__clear-indicator,
html[data-se-theme] .campaignModal .se-launch-email-template-field .react-select__indicator-separator,
.campaignModal .se-launch-email-template-field .react-select__clear-indicator,
.campaignModal .se-launch-email-template-field .react-select__indicator-separator {
  display: none !important;
}

html[data-se-theme] .campaignModal .se-launch-field .error,
.campaignModal .se-launch-field .error {
  display: block;
  margin-top: 4px !important;
}

/* Launch Campaign — radio alignment (Yes/No column + nested options) */
html[data-se-theme] .campaignModal .se-launch-campaign-body,
.campaignModal .se-launch-campaign-body {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

html[data-se-theme] .campaignModal .MuiFormLabel-root:empty,
.campaignModal .MuiFormLabel-root:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
}

html[data-se-theme] .campaignModal .se-launch-radio-stack,
.campaignModal .se-launch-radio-stack {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  width: 100% !important;
  margin: 0 0 18px !important;
}

html[data-se-theme] .campaignModal .se-launch-radio-stack > p,
.campaignModal .se-launch-radio-stack > p {
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 auto !important;
  color: var(--se-ink) !important;
  line-height: 1.35 !important;
}

html[data-se-theme] .campaignModal .se-launch-radio-stack > .se-launch-radios,
.campaignModal .se-launch-radio-stack > .se-launch-radios {
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
}

html[data-se-theme] .campaignModal .se-launch-radio-stack > .se-launch-nested-radios,
.campaignModal .se-launch-radio-stack > .se-launch-nested-radios {
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 4px 0 0 !important;
}

html[data-se-theme] .campaignModal .se-launch-radios,
html[data-se-theme] .campaignModal .se-launch-nested-radios,
.campaignModal .se-launch-radios,
.campaignModal .se-launch-nested-radios {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

html[data-se-theme] .campaignModal .se-launch-nested-radios,
.campaignModal .se-launch-nested-radios {
  width: 100% !important;
  margin: 0 0 8px !important;
}

/* Keep nested options close to their parent Yes/No section */
html[data-se-theme] .campaignModal .se-launch-radio-row + .se-launch-nested-radios,
.campaignModal .se-launch-radio-row + .se-launch-nested-radios {
  margin-top: -10px !important;
}

html[data-se-theme] .campaignModal .se-launch-radio-row + .se-launch-reviewer-grid,
html[data-se-theme] .campaignModal .se-launch-nested-radios + .se-launch-reviewer-grid,
.campaignModal .se-launch-radio-row + .se-launch-reviewer-grid,
.campaignModal .se-launch-nested-radios + .se-launch-reviewer-grid {
  margin-top: 4px !important;
}

html[data-se-theme] .campaignModal .se-launch-radios .MuiFormControl-root,
.campaignModal .se-launch-radios .MuiFormControl-root {
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  max-width: 100% !important;
}

html[data-se-theme] .campaignModal .se-launch-nested-radios .MuiFormControl-root,
.campaignModal .se-launch-nested-radios .MuiFormControl-root {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
}

/* Beat CustomRadioButton JSS `group: { display: inline-block }` */
html[data-se-theme] .campaignModal .se-launch-nested-radios .MuiFormControl-root > div,
html[data-se-theme] .campaignModal .se-launch-nested-radios .MuiFormControl-root > .MuiRadioGroup-root,
.campaignModal .se-launch-nested-radios .MuiFormControl-root > div,
.campaignModal .se-launch-nested-radios .MuiFormControl-root > .MuiRadioGroup-root {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  width: 100% !important;
}

html[data-se-theme] .campaignModal .se-launch-radios .MuiRadioGroup-root,
.campaignModal .se-launch-radios .MuiRadioGroup-root {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0 4px !important;
  margin: 0 !important;
}

/* Stacked reviewer options — must beat global `.modal .MuiRadioGroup-root { row }` */
html[data-se-theme] .campaignModal .se-launch-nested-radios .MuiRadioGroup-root,
html[data-se-theme] .campaignModal .se-launch-nested-radios .MuiFormControl-root > .MuiRadioGroup-root,
html[data-se-theme] .modal.campaignModal .se-launch-nested-radios .MuiRadioGroup-root,
.campaignModal .se-launch-nested-radios .MuiRadioGroup-root,
.campaignModal .se-launch-nested-radios [class*="MuiRadioGroup"] {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

html[data-se-theme] .campaignModal .se-launch-radios .MuiFormControlLabel-root,
.campaignModal .se-launch-radios .MuiFormControlLabel-root {
  margin: 0 12px 0 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  align-items: center !important;
  white-space: nowrap;
}

html[data-se-theme] .campaignModal .se-launch-nested-radios .MuiFormControlLabel-root,
html[data-se-theme] .modal.campaignModal .se-launch-nested-radios .MuiFormControlLabel-root,
.campaignModal .se-launch-nested-radios .MuiFormControlLabel-root,
.campaignModal .se-launch-nested-radios [class*="MuiFormControlLabel"] {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  white-space: normal !important;
  float: none !important;
}

html[data-se-theme] .campaignModal .se-launch-radios .MuiRadio-root,
html[data-se-theme] .campaignModal .se-launch-nested-radios .MuiRadio-root,
html[data-se-theme] .campaignModal .se-launch-radio-row .MuiRadio-root,
.campaignModal .se-launch-radios .MuiRadio-root,
.campaignModal .se-launch-nested-radios .MuiRadio-root,
.campaignModal .se-launch-radio-row .MuiRadio-root {
  padding: 4px !important;
  margin: 0 !important;
}

/* Question on top, Yes/No radios directly below */
html[data-se-theme] .campaignModal .launch-campaign-section.se-launch-radio-row,
.campaignModal .launch-campaign-section.se-launch-radio-row {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  float: none !important;
}

html[data-se-theme] .campaignModal .launch-campaign-section.se-launch-radio-row > p,
.campaignModal .launch-campaign-section.se-launch-radio-row > p {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  white-space: normal !important;
  line-height: 1.35 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .campaignModal .launch-campaign-section.se-launch-radio-row > .se-launch-radios,
.campaignModal .launch-campaign-section.se-launch-radio-row > .se-launch-radios {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  align-self: flex-start !important;
}

/* Launch Campaign — reviewer emails as side-by-side wrapped list */
html[data-se-theme] .campaignModal .se-launch-reviewer-grid,
.campaignModal .se-launch-reviewer-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 8px 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 6px 0 10px !important;
  padding: 0 !important;
  float: none !important;
  clear: both !important;
  overflow: visible !important;
}

html[data-se-theme] .campaignModal .se-launch-reviewer-grid .reviewerList,
html[data-se-theme] .campaignModal .se-launch-reviewer-grid .msgReviewerList,
.campaignModal .se-launch-reviewer-grid .reviewerList,
.campaignModal .se-launch-reviewer-grid .msgReviewerList {
  float: none !important;
  width: auto !important;
  min-width: 200px;
  max-width: 100%;
  flex: 1 1 220px;
  display: flex !important;
  align-items: flex-start !important;
  margin: 0 !important;
  padding: 8px 10px 8px 1.75rem !important;
  position: relative !important;
  box-sizing: border-box !important;
  border: 1px solid var(--se-line-soft, var(--se-line));
  border-radius: var(--se-r);
  background: var(--se-page);
}

html[data-se-theme] .campaignModal .se-launch-reviewer-grid .custom-control-label,
.campaignModal .se-launch-reviewer-grid .custom-control-label {
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-top: 0 !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
  color: var(--se-ink) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

html[data-se-theme] .campaignModal .se-launch-reviewer-grid .custom-control-input,
.campaignModal .se-launch-reviewer-grid .custom-control-input {
  position: absolute !important;
  z-index: 1;
}

html[data-se-theme] .campaignModal .launch-campaign-option-wrap,
.campaignModal .launch-campaign-option-wrap {
  margin-left: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

/* Buttons inside the body (footer already themed) */
html[data-se-theme] .modal-body .AddAppBtn.button-primary.blue,
html[data-se-theme] .modal-body .button-primary.blue,
html[data-se-theme] .modal-body .btn-primary,
html[data-se-theme] .MuiDialogActions-root .MuiButton-containedPrimary,
html[data-se-theme] .modal-footer .AddAppBtn.button-primary.blue,
html[data-se-theme] .modal-footer .button-primary.blue,
html[data-se-theme] .modal-footer .button-primary.bottom-button,
html[data-se-theme] .modal-footer #campaign_Relaunch,
html[data-se-theme] .modal-footer .MuiButton-containedPrimary,
html[data-se-theme] .iga-justification-modal .modal-footer .MuiButton-root,
.securends .modal-body .AddAppBtn.button-primary.blue,
.modal-footer .AddAppBtn.button-primary.blue,
.modal-footer .button-primary.blue,
.modal-footer .button-primary.bottom-button,
.modal-footer #campaign_Relaunch.button-primary,
.iga-justification-modal .modal-footer .MuiButton-root {
  background: var(--se-brand) !important;
  background-color: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 16px !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-transform: none !important;
}

html[data-se-theme] .modal-footer .AddAppBtn.button-primary.blue:hover,
html[data-se-theme] .modal-footer .button-primary.blue:hover,
html[data-se-theme] .modal-footer .button-primary.bottom-button:hover,
html[data-se-theme] .modal-footer #campaign_Relaunch:hover,
html[data-se-theme] .modal-footer .MuiButton-containedPrimary:hover,
html[data-se-theme] .iga-justification-modal .modal-footer .MuiButton-root:hover,
.modal-footer .button-primary.bottom-button:hover,
.modal-footer #campaign_Relaunch.button-primary:hover,
.iga-justification-modal .modal-footer .MuiButton-root:hover {
  background: var(--se-brand-hover) !important;
  background-color: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #fff !important;
}

html[data-se-theme] .modal-body .btn-default,
html[data-se-theme] .modal-body .custom__lg,
html[data-se-theme] .MuiDialogActions-root .MuiButton-outlined,
html[data-se-theme] .MuiDialogActions-root .MuiButton-text,
.securends .modal-body .btn-default {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r) !important;
}

/* Checkboxes — skip UAR flipswitch */
html[data-se-theme] .modal-body .custom-control.custom-checkbox,
html[data-se-theme] .MuiDialogContent-root .custom-control.custom-checkbox,
.securends .modal-body .custom-control.custom-checkbox {
  display: flex !important;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
  padding-left: 1.75rem !important;
}

html[data-se-theme] .modal-body .custom-control-label,
.securends .modal-body .custom-control-label {
  color: var(--se-ink) !important;
  white-space: normal !important;
  width: auto !important;
  max-width: none !important;
  line-height: 1.4;
}

html[data-se-theme] .modal-body .custom-control-label::before,
.securends .modal-body .custom-control-label::before {
  background: var(--se-card) !important;
  border: 1.5px solid var(--se-ink-3) !important;
}

html[data-se-theme] .modal-body .custom-control-input:checked~.custom-control-label::before,
.securends .modal-body .custom-control-input:checked~.custom-control-label::before {
  background: var(--se-brand) !important;
  border-color: var(--se-brand) !important;
}

html[data-se-theme] .modal-body input[type="checkbox"]:not(.flipswitch-cb):not(.flipswitch-cb-red):not(.flipswitch-cb-all):not(.flipswitch-cb-red-all),
html[data-se-theme] .modal-body input[type="radio"]:not(.MuiPrivateSwitchBase-input),
.securends .modal-body input[type="checkbox"]:not(.flipswitch-cb):not(.flipswitch-cb-red):not(.flipswitch-cb-all):not(.flipswitch-cb-red-all) {
  accent-color: var(--se-brand);
}

/* MUI radios (CustomRadioButton) — beat JSS #337ab7 / #091432 */
html[data-se-theme] .modal .MuiRadio-root,
html[data-se-theme] .modal .MuiRadio-colorPrimary,
html[data-se-theme] .MuiDialog-paper .MuiRadio-root,
html[data-se-theme] .MuiDialog-paper .MuiRadio-colorPrimary,
.securends .modal .MuiRadio-root {
  color: var(--se-ink-3) !important;
}

html[data-se-theme] .modal .MuiRadio-colorPrimary.Mui-checked,
html[data-se-theme] .modal .MuiRadio-root.Mui-checked,
html[data-se-theme] .MuiDialog-paper .MuiRadio-colorPrimary.Mui-checked,
.securends .modal .MuiRadio-colorPrimary.Mui-checked {
  color: var(--se-brand) !important;
}

html[data-se-theme] .modal .MuiFormLabel-root,
html[data-se-theme] .modal .MuiTypography-root,
html[data-se-theme] .modal .MuiFormControlLabel-label,
html[data-se-theme] .MuiDialog-paper .MuiFormControlLabel-label,
.securends .modal .MuiFormLabel-root,
.securends .modal .MuiFormControlLabel-label {
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
}

html[data-se-theme] .modal .MuiRadioGroup-root,
html[data-se-theme] .MuiDialog-paper .MuiRadioGroup-root,
.securends .modal .MuiRadioGroup-root {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
}

/* Launch Campaign nested reviewer options stay stacked (override row above) */
html[data-se-theme] .modal.campaignModal .se-launch-nested-radios .MuiRadioGroup-root,
html[data-se-theme] .campaignModal .modal-body .se-launch-nested-radios .MuiRadioGroup-root,
.modal.campaignModal .se-launch-nested-radios .MuiRadioGroup-root,
.campaignModal .modal-body .se-launch-nested-radios .MuiRadioGroup-root {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  width: 100% !important;
}

html[data-se-theme] .modal.campaignModal .se-launch-nested-radios .MuiFormControlLabel-root,
html[data-se-theme] .campaignModal .modal-body .se-launch-nested-radios .MuiFormControlLabel-root,
.modal.campaignModal .se-launch-nested-radios .MuiFormControlLabel-root,
.campaignModal .modal-body .se-launch-nested-radios .MuiFormControlLabel-root {
  display: flex !important;
  width: 100% !important;
  margin: 0 0 4px 0 !important;
  white-space: normal !important;
}

html[data-se-theme] .modal .MuiFormControlLabel-root,
html[data-se-theme] .MuiDialog-paper .MuiFormControlLabel-root,
.securends .modal .MuiFormControlLabel-root {
  margin: 0 16px 0 0 !important;
  white-space: nowrap;
  align-items: center !important;
}

html[data-se-theme] .modal .MuiFormControl-root,
.securends .modal .MuiFormControl-root {
  width: auto !important;
  max-width: 100%;
}

html[data-se-theme] .modal-body .launch-campaign-section,
html[data-se-theme] .modal-body .bulk-launch-radio-row,
html[data-se-theme] .modal-body .campaign-info-reminders-row,
.securends .modal-body .launch-campaign-section,
.securends .modal-body .bulk-launch-radio-row {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px 16px;
  width: 100%;
  float: none !important;
}

/* Campaign Edit — question on one line, Yes/No radios on the next */
html[data-se-theme] .modal-body .launch-campaign-section.se-campaign-edit-auto-revoke,
.securends .modal-body .launch-campaign-section.se-campaign-edit-auto-revoke,
.modal-body .launch-campaign-section.se-campaign-edit-auto-revoke {
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  gap: 10px !important;
}

html[data-se-theme] .modal-body .launch-campaign-section.se-campaign-edit-auto-revoke > p,
.securends .modal-body .launch-campaign-section.se-campaign-edit-auto-revoke > p,
.modal-body .launch-campaign-section.se-campaign-edit-auto-revoke > p {
  flex: 0 0 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

html[data-se-theme] .modal-body .se-campaign-edit-auto-revoke-radios,
.securends .modal-body .se-campaign-edit-auto-revoke-radios,
.modal-body .se-campaign-edit-auto-revoke-radios {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

html[data-se-theme] .modal-body .bulk-launch-radio-label,
html[data-se-theme] .modal-body .launch-campaign-section>p,
.securends .modal-body .bulk-launch-radio-label {
  flex: 1 1 280px;
  min-width: 0;
  max-width: 100%;
  white-space: normal !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .modal-body .fa-info-circle,
.securends .modal-body .fa-info-circle {
  color: var(--se-ink-2);
  margin-left: 6px;
}

/* react-select — match kit.css app-wide chrome (modals often outside .securends) */
html[data-se-theme] .modal-body .react-select__control,
html[data-se-theme] .modal-body .selectCampaign .react-select__control,
html[data-se-theme] .modal-body .selectCampaign [class*="-control"],
html[data-se-theme] .modal-body .se-modal-select .react-select__control,
html[data-se-theme] .modal-body [class^="css-"][class*="-control"],
html[data-se-theme] .MuiDialogContent-root [class^="css-"][class*="-control"],
html[data-se-theme] .actions-modal .react-select__control,
.modal-body .react-select__control,
.modal-body .selectCampaign .react-select__control,
.modal-body .se-modal-select .react-select__control,
.modal-body [class^="css-"][class*="-control"],
.securends .modal-body [class^="css-"][class*="-control"] {
  min-height: 36px !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  color: var(--se-ink) !important;
  align-items: center !important;
}

html[data-se-theme] .modal-body .react-select__control:hover,
html[data-se-theme] .modal-body .selectCampaign [class*="-control"]:hover,
html[data-se-theme] .modal-body [class^="css-"][class*="-control"]:hover,
.modal-body .react-select__control:hover,
.securends .modal-body [class^="css-"][class*="-control"]:hover {
  border-color: var(--se-line-soft) !important;
}

html[data-se-theme] .modal-body .react-select__control--is-focused,
html[data-se-theme] .modal-body .selectCampaign [class*="-control"][class*="focused"],
html[data-se-theme] .modal-body [class^="css-"][class*="-control"][class*="focused"],
.modal-body .react-select__control--is-focused {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint) !important;
}

html[data-se-theme] .modal-body .react-select__value-container,
html[data-se-theme] .modal-body .selectCampaign [class*="-ValueContainer"],
html[data-se-theme] .modal-body div[class^="css-"][class*="-ValueContainer"],
.modal-body .react-select__value-container {
  padding: 2px 8px 2px 12px !important;
  margin: 0 !important;
}

html[data-se-theme] .modal-body .react-select__placeholder,
html[data-se-theme] .modal-body .react-select__single-value,
html[data-se-theme] .modal-body [class*="-placeholder"],
html[data-se-theme] .modal-body [class*="-singleValue"],
html[data-se-theme] .modal-body [class*="-Input"],
.modal-body .react-select__placeholder,
.modal-body .react-select__single-value,
.securends .modal-body [class*="-singleValue"] {
  margin: 0 !important;
  padding-left: 0 !important;
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
}

html[data-se-theme] .modal-body .react-select__placeholder,
html[data-se-theme] .modal-body [class*="-placeholder"],
.modal-body .react-select__placeholder {
  color: var(--se-ink-3) !important;
}

html[data-se-theme] .modal-body .react-select__indicators,
html[data-se-theme] .modal-body [class*="-IndicatorsContainer"],
.modal-body .react-select__indicators {
  align-items: center;
  padding-right: 4px;
}

html[data-se-theme] .modal-body .react-select__dropdown-indicator,
html[data-se-theme] .modal-body .react-select__clear-indicator,
html[data-se-theme] .modal-body [class*="-indicatorContainer"],
.modal-body .react-select__dropdown-indicator,
.modal-body .react-select__clear-indicator {
  color: var(--se-ink-2) !important;
  padding: 4px 6px !important;
}

html[data-se-theme] .modal-body .react-select__dropdown-indicator svg,
.modal-body .react-select__dropdown-indicator svg {
  fill: var(--se-ink-2) !important;
}

html[data-se-theme] .modal-body .react-select__menu,
html[data-se-theme] .modal-body .selectCampaign [class*="-menu"],
html[data-se-theme] .modal-body [class^="css-"][class*="-menu"],
html[data-se-theme] .modal-body [class^="css-"][class*="-MenuList"],
html[data-se-theme] .MuiDialogContent-root [class^="css-"][class*="-menu"],
.modal-body .react-select__menu,
.securends .modal-body [class^="css-"][class*="-menu"],
/* Portaled menus (menuPortalTarget) — still match kit */
html[data-se-theme] .react-select__menu-portal .react-select__menu,
html[data-se-theme] div[class*="menuPortal"] .react-select__menu,
.react-select__menu-portal .react-select__menu {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: var(--se-shadow-md) !important;
  color: var(--se-ink) !important;
  z-index: calc(var(--se-z-modal) + 5) !important;
  overflow: hidden;
}

html[data-se-theme] .modal-body .react-select__option,
html[data-se-theme] .modal-body [class^="css-"][class*="-option"],
html[data-se-theme] .MuiDialogContent-root [class^="css-"][class*="-option"],
html[data-se-theme] .react-select__menu-portal .react-select__option,
.modal-body .react-select__option,
.react-select__menu-portal .react-select__option {
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  padding: 8px 12px !important;
  background: transparent !important;
}

html[data-se-theme] .modal-body .react-select__option--is-focused,
html[data-se-theme] .modal-body .react-select__option:hover,
html[data-se-theme] .modal-body [class^="css-"][class*="-option"]:hover,
html[data-se-theme] .modal-body [class^="css-"][class*="-option"][class*="focused"],
html[data-se-theme] .react-select__menu-portal .react-select__option--is-focused,
html[data-se-theme] .react-select__menu-portal .react-select__option:hover,
.modal-body .react-select__option--is-focused,
.modal-body .react-select__option:hover,
.react-select__menu-portal .react-select__option--is-focused,
.react-select__menu-portal .react-select__option:hover {
  background: var(--se-row-hover) !important;
}

html[data-se-theme] .modal-body .react-select__option--is-selected,
html[data-se-theme] .react-select__menu-portal .react-select__option--is-selected,
.modal-body .react-select__option--is-selected,
.react-select__menu-portal .react-select__option--is-selected {
  background: var(--se-brand-tint) !important;
  color: var(--se-ink) !important;
  font-weight: 600;
}

/* Send Campaign Notifications (/listOfCampaign Remind) — form chrome */
html[data-se-theme] .se-campaign-remind-form,
.securends .se-campaign-remind-form,
.modal-body .se-campaign-remind-form,
.actions-modal .se-campaign-remind-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}

html[data-se-theme] .se-campaign-remind-intro,
.modal-body .se-campaign-remind-intro {
  margin: 0;
}

html[data-se-theme] .se-campaign-remind-intro p,
.modal-body .se-campaign-remind-intro p {
  margin: 0 !important;
  color: var(--se-ink) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

html[data-se-theme] .se-campaign-remind-field,
.modal-body .se-campaign-remind-field {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-se-theme] .se-campaign-remind-label,
.modal-body .se-campaign-remind-label,
.actions-modal .se-campaign-remind-label {
  display: block;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  font-family: var(--se-sans) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  color: var(--se-ink-2) !important;
  line-height: 1.35 !important;
}

html[data-se-theme] .se-campaign-remind-field .selectCampaign,
html[data-se-theme] .se-campaign-remind-field .se-modal-select,
.modal-body .se-campaign-remind-field .selectCampaign,
.modal-body .se-campaign-remind-field .se-modal-select {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  display: block !important;
}

/* Match /endpoints multiselect trigger: 36× full width, chevron only on the right */
html[data-se-theme] .se-campaign-remind-field .react-select__control,
html[data-se-theme] .se-campaign-remind-field .se-modal-select .react-select__control,
.modal-body .se-campaign-remind-field .react-select__control,
.actions-modal .se-campaign-remind-field .react-select__control {
  width: 100% !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  box-sizing: border-box !important;
  background-image: none !important;
}

html[data-se-theme] .se-campaign-remind-field .react-select__value-container,
.modal-body .se-campaign-remind-field .react-select__value-container {
  padding: 0 8px 0 12px !important;
  margin: 0 !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden;
}

/* Kill stray left “add/+” chrome (clear icon / ::before / separator) */
html[data-se-theme] .se-campaign-remind-field .selectCampaign::before,
html[data-se-theme] .se-campaign-remind-field .selectCampaign::after,
html[data-se-theme] .se-campaign-remind-field .se-modal-select::before,
html[data-se-theme] .se-campaign-remind-field .se-modal-select::after,
html[data-se-theme] .se-campaign-remind-field .react-select__control::before,
html[data-se-theme] .se-campaign-remind-field .react-select__control::after,
html[data-se-theme] .se-campaign-remind-field .react-select__value-container::before,
html[data-se-theme] .se-campaign-remind-field .react-select__value-container::after,
.modal-body .se-campaign-remind-field .react-select__control::before,
.modal-body .se-campaign-remind-field .react-select__control::after,
.modal-body .se-campaign-remind-field .react-select__value-container::before,
.modal-body .se-campaign-remind-field .react-select__value-container::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: none !important;
  width: 0 !important;
  height: 0 !important;
}

html[data-se-theme] .se-campaign-remind-field .react-select__clear-indicator,
html[data-se-theme] .se-campaign-remind-field .react-select__indicator-separator,
.modal-body .se-campaign-remind-field .react-select__clear-indicator,
.modal-body .se-campaign-remind-field .react-select__indicator-separator {
  display: none !important;
}

html[data-se-theme] .se-campaign-remind-field .react-select__indicators,
.modal-body .se-campaign-remind-field .react-select__indicators {
  height: 36px !important;
  padding: 0 4px 0 0 !important;
  align-items: center !important;
}

html[data-se-theme] .se-campaign-remind-field .react-select__dropdown-indicator,
.modal-body .se-campaign-remind-field .react-select__dropdown-indicator {
  padding: 4px 8px !important;
  color: var(--se-ink-2) !important;
}

html[data-se-theme] .se-campaign-remind-field .react-select__input,
html[data-se-theme] .se-campaign-remind-field .react-select__input input,
.modal-body .se-campaign-remind-field .react-select__input,
.modal-body .se-campaign-remind-field .react-select__input input {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  min-height: 0 !important;
  height: auto !important;
}

html[data-se-theme] .se-campaign-remind-field .error,
.modal-body .se-campaign-remind-field .error {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  font-size: 12.5px;
}

html[data-se-theme] .se-campaign-remind-field .error:empty,
.modal-body .se-campaign-remind-field .error:empty {
  display: none !important;
}

html[data-se-theme] .se-campaign-remind-check,
.modal-body .se-campaign-remind-check {
  margin: 0 !important;
  padding: 0 !important;
}

/* Pull checkbox closer under its preceding template field */
html[data-se-theme] .se-campaign-remind-field + .se-campaign-remind-check,
.modal-body .se-campaign-remind-field + .se-campaign-remind-check {
  margin-top: -4px !important;
}

html[data-se-theme] .se-campaign-remind-check .custom-control,
.modal-body .se-campaign-remind-check .custom-control {
  display: flex !important;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  padding-left: 1.5rem !important;
  min-height: 22px;
}

html[data-se-theme] .se-campaign-remind-check .custom-control-label,
.modal-body .se-campaign-remind-check .custom-control-label {
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  line-height: 1.4 !important;
}

html[data-se-theme] .se-campaign-remind-check + .se-build-user-list-row,
.modal-body .se-campaign-remind-check + .se-build-user-list-row,
.securends .se-campaign-remind-form .se-build-user-list-row {
  margin-top: 10px !important;
  margin-bottom: 4px !important;
}

html[data-se-theme] .se-campaign-remind-form .se-build-user-list-label,
.modal-body .se-campaign-remind-form .se-build-user-list-label {
  margin-bottom: 8px !important;
}

/* Remind Yes — modern brand ring loader in modal body */
html[data-se-theme] .se-campaign-remind-loader,
.modal-body .se-campaign-remind-loader,
.actions-modal .se-campaign-remind-loader {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 180px !important;
  margin: 8px 0 4px !important;
  padding: 20px 16px !important;
  border-radius: var(--se-r-card, 12px) !important;
  background: var(--se-brand-tint, #eaf0f8) !important;
  border: 1px solid var(--se-line, #e2e8f0) !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .se-campaign-remind-popup-loader,
.modal-body .se-campaign-remind-popup-loader,
.actions-modal .se-campaign-remind-popup-loader {
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: none !important;
  color: var(--se-ink, #0f172a) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

html[data-se-theme] .se-campaign-remind-popup-loader::before,
.modal-body .se-campaign-remind-popup-loader::before,
.actions-modal .se-campaign-remind-popup-loader::before {
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;
  border-width: 3px !important;
  border-color: var(--se-loader-track, #e2e8f0) !important;
  border-top-color: var(--se-brand, #2563eb) !important;
}

html[data-se-theme] .se-campaign-remind-yes-btn .se-campaign-remind-yes-loading,
.securends .se-campaign-remind-yes-btn .se-campaign-remind-yes-loading {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

html[data-se-theme] .se-campaign-remind-yes-btn .se-campaign-remind-yes-spinner,
.securends .se-campaign-remind-yes-btn .se-campaign-remind-yes-spinner {
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  border: 2px solid rgba(255, 255, 255, 0.35) !important;
  border-top-color: #fff !important;
  border-radius: 50% !important;
  animation: se-spin 0.7s linear infinite !important;
  box-sizing: border-box !important;
}

/* Campaign action drawer body — tighter confirm copy + footer buttons */
html[data-se-theme] .modal.right.campaignModal .actions-modal,
.securends .modal.right.campaignModal .actions-modal,
.modal.right.campaignModal .actions-modal {
  padding-top: 12px !important;
}

html[data-se-theme] .modal.right.campaignModal .modal-footer .custom__lg,
html[data-se-theme] .modal.right.campaignModal .modal-footer .custom__pg,
.securends .modal.right.campaignModal .modal-footer .custom__lg,
.securends .modal.right.campaignModal .modal-footer .custom__pg {
  min-width: 88px;
  margin: 0 !important;
}

/* Bootstrap-multiselect trigger (modal + form widgets). Not a 3-dots menu. */
html[data-se-theme] .modal button.multiselect,
html[data-se-theme] .modal button.multiselect.dropdown-toggle,
html[data-se-theme] .MuiDialog-paper button.multiselect,
.securends .modal button.multiselect,
.securends .modal button.multiselect.dropdown-toggle {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 12px !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-se-theme] .modal .selectedCampaign,
html[data-se-theme] .modal .selectedCampaign .btn-group,
html[data-se-theme] .modal .selectedCampaign .multiselect-native-select,
.securends .modal .selectedCampaign,
.securends .modal .selectedCampaign .btn-group,
.securends .modal .selectedCampaign .multiselect-native-select {
  width: 100% !important;
  max-width: 100% !important;
}

html[data-se-theme] .modal button.multiselect .multiselect-selected-text,
.securends .modal button.multiselect .multiselect-selected-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--se-ink) !important;
}

html[data-se-theme] .modal button.multiselect .caret,
.securends .modal button.multiselect .caret {
  display: inline-block !important;
  margin-left: 8px !important;
  flex: 0 0 auto;
  float: none !important;
  border-top-color: var(--se-ink-2);
}

html[data-se-theme] .modal .btn-group.open,
html[data-se-theme] .modal .btn-group.show,
.securends .modal .btn-group.open {
  z-index: 40 !important;
}

/* Multiselect panel — in-modal or appended to body */
html[data-se-theme] ul.multiselect-container.dropdown-menu,
html[data-se-theme] .modal ul.multiselect-container.dropdown-menu,
html[data-se-theme] .selectedCampaign ul.multiselect-container.dropdown-menu,
.securends ul.multiselect-container.dropdown-menu,
.multiselect-container.dropdown-menu {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: var(--se-shadow-lg) !important;
  padding: 8px 0 !important;
  max-height: min(320px, 50vh);
  overflow-x: hidden !important;
  overflow-y: auto !important;
  z-index: calc(var(--se-z-modal) + 5) !important;
}

html[data-se-theme] .modal .selectedCampaign ul.multiselect-container.dropdown-menu,
.securends .modal .selectedCampaign ul.multiselect-container.dropdown-menu {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li,
.securends ul.multiselect-container.dropdown-menu>li,
.multiselect-container.dropdown-menu>li {
  width: 100% !important;
  float: none !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li.multiselect-filter,
.securends ul.multiselect-container.dropdown-menu>li.multiselect-filter,
.multiselect-container.dropdown-menu>li.multiselect-filter {
  padding: 4px 10px 8px;
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--se-card);
}

html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group,
.securends ul.multiselect-container.dropdown-menu .multiselect-filter .input-group,
.multiselect-container.dropdown-menu .multiselect-filter .input-group {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: 100% !important;
  gap: 0;
  background: var(--se-page);
  border: 1px solid var(--se-line);
  border-radius: var(--se-r);
  overflow: hidden;
  margin: 0 !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-addon,
html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-text,
html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-btn,
.securends ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-addon,
.multiselect-container.dropdown-menu .multiselect-filter .input-group-addon,
.multiselect-container.dropdown-menu .multiselect-filter .input-group-btn {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 8px !important;
  flex: 0 0 auto;
  color: var(--se-ink-2) !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu input.form-control.multiselect-search,
.securends ul.multiselect-container.dropdown-menu input.form-control.multiselect-search,
.multiselect-container.dropdown-menu input.form-control.multiselect-search {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--se-ink) !important;
  font-size: 13px !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu .btn.multiselect-clear-filter,
.multiselect-container.dropdown-menu .btn.multiselect-clear-filter {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--se-ink-2) !important;
  padding: 4px !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li>a,
.multiselect-container.dropdown-menu>li>a {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  color: var(--se-ink) !important;
  text-decoration: none !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li>a>label,
.multiselect-container.dropdown-menu>li>a>label {
  display: flex !important;
  align-items: center;
  gap: 10px;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.3;
  color: var(--se-ink) !important;
  white-space: nowrap;
  cursor: pointer;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li>a>label>input[type="checkbox"],
.multiselect-container.dropdown-menu>li>a>label>input[type="checkbox"] {
  position: static !important;
  margin: 0 !important;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px;
  flex-shrink: 0;
  accent-color: var(--se-brand);
  cursor: pointer;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li:hover>a,
html[data-se-theme] ul.multiselect-container.dropdown-menu>li.active>a,
html[data-se-theme] ul.multiselect-container.dropdown-menu>li>a:hover,
html[data-se-theme] ul.multiselect-container.dropdown-menu>li>a:hover>label,
.multiselect-container.dropdown-menu>li:hover>a,
.multiselect-container.dropdown-menu>li>a:hover>label {
  background: var(--se-row-hover, #f8fafc) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li.multiselect-all>a>label,
.multiselect-container.dropdown-menu>li.multiselect-all>a>label {
  border-bottom: 1px solid var(--se-line);
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li.active>a,
html[data-se-theme] ul.multiselect-container.dropdown-menu>li.active>a:focus,
.multiselect-container.dropdown-menu>li.active>a,
.multiselect-container.dropdown-menu>li.active>a:focus {
  background: var(--se-brand-tint, #edf5fd) !important;
  background-image: none !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li.active:hover>a,
html[data-se-theme] ul.multiselect-container.dropdown-menu>li.active>a:hover,
.multiselect-container.dropdown-menu>li.active:hover>a,
.multiselect-container.dropdown-menu>li.active>a:hover {
  background: color-mix(in srgb, var(--se-brand) 18%, var(--se-card, #ffffff)) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li.active>a>label,
.multiselect-container.dropdown-menu>li.active>a>label {
  color: var(--se-ink) !important;
  font-weight: 500 !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu>li.multiselect-all,
.multiselect-container.dropdown-menu>li.multiselect-all {
  border-bottom: 1px solid var(--se-line) !important;
  margin-bottom: 4px !important;
}

/* Date picker popper — positioning wrapper only (never paint it as the calendar card) */
html[data-se-theme] .react-datepicker-popper,
.react-datepicker-popper {
  z-index: calc(var(--se-z-modal, 1200) + 80) !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html[data-se-theme] .react-datepicker__portal,
.react-datepicker__portal {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: calc(var(--se-z-modal, 1200) + 80) !important;
  background: rgba(15, 23, 42, 0.35) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: auto !important;
}

html[data-se-theme] .react-datepicker,
html[data-se-theme] .react-datepicker__header,
.react-datepicker {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border-color: var(--se-line) !important;
  font-family: var(--se-sans, inherit);
}

.react-datepicker {
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card, 8px) !important;
  box-shadow: var(--se-shadow-lg,
      0 10px 25px -5px rgba(0, 0, 0, 0.1),
      0 8px 10px -6px rgba(0, 0, 0, 0.1)) !important;
  overflow: visible !important;
  min-width: 280px !important;
  width: auto !important;
}

html[data-se-theme] .react-datepicker__header,
.react-datepicker__header {
  background: var(--se-table-header-bg, #f8fafc) !important;
  border-bottom: 1px solid var(--se-line) !important;
  border-top-left-radius: var(--se-r-card, 8px) !important;
  border-top-right-radius: var(--se-r-card, 8px) !important;
  color: var(--se-ink) !important;
  padding-top: 10px !important;
}

html[data-se-theme] .react-datepicker__day,
html[data-se-theme] .react-datepicker__day-name,
html[data-se-theme] .react-datepicker__current-month {
  color: var(--se-ink) !important;
}

html[data-se-theme] .react-datepicker__day-name {
  color: var(--se-ink-2, #64748b) !important;
  font-weight: 600 !important;
  font-size: 11px !important;
}

html[data-se-theme] .react-datepicker__day:hover {
  background: var(--se-brand-tint, #eaf0f8) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r, 4px) !important;
}

html[data-se-theme] .react-datepicker__day--selected,
html[data-se-theme] .react-datepicker__day--keyboard-selected {
  background: var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r, 4px) !important;
  font-weight: 600 !important;
}

html[data-se-theme] .react-datepicker__day--today {
  font-weight: 700 !important;
  color: var(--se-brand) !important;
}

html[data-se-theme] .react-datepicker__day--outside-month {
  color: var(--se-ink-3, #94a3b8) !important;
  opacity: 0.45 !important;
}

html[data-se-theme] .react-datepicker__day--disabled,
.react-datepicker__day--disabled {
  color: var(--se-ink-3) !important;
  background: transparent !important;
  opacity: 0.4 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

html[data-se-theme] .react-datepicker__day--disabled:hover,
.react-datepicker__day--disabled:hover {
  background: transparent !important;
  color: var(--se-ink-3) !important;
}

html[data-se-theme] .react-datepicker__triangle {
  border-bottom-color: var(--se-table-header-bg, #f8fafc) !important;
}

html[data-se-theme] .react-datepicker__triangle::before {
  border-bottom-color: var(--se-line) !important;
}

/* --------------------------------------------------------------------------
   Application Filter modal (Create/Update Template drawers)
   Condition rows: selects + add/trash stay inside the card. Theme-aware.
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal .application-filter-modal,
.securends .modal .application-filter-modal {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html[data-se-theme] .modal .application-filter-modal>.card-header,
.securends .modal .application-filter-modal>.card-header {
  background: var(--se-page) !important;
  border-bottom: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 12px 16px !important;
  border-radius: var(--se-r-card) var(--se-r-card) 0 0 !important;
}

html[data-se-theme] .modal .application-filter-modal>.card-body,
.securends .modal .application-filter-modal>.card-body {
  padding: 16px !important;
  overflow: visible !important;
}

html[data-se-theme] .modal .application-filter-modal .templatedata_box,
.securends .modal .application-filter-modal .templatedata_box {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 10px;
  width: 100% !important;
  max-width: 100% !important;
  margin: 12px 0 0 !important;
  padding: 14px 14px 10px !important;
  overflow: visible !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background: var(--se-page) !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .modal .application-filter-modal .templatedata_box>.row,
.securends .modal .application-filter-modal .templatedata_box>.row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  gap: 8px 10px;
  margin: 0 !important;
  width: 100% !important;
}

html[data-se-theme] .modal .application-filter-modal .templatedata_box>.row>[class*="col-"],
.securends .modal .application-filter-modal .templatedata_box>.row>[class*="col-"] {
  float: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  position: static !important;
  left: auto !important;
  top: auto !important;
  bottom: auto !important;
  margin: 0 !important;
}

html[data-se-theme] .modal .application-filter-modal .selectAttr,
.securends .modal .application-filter-modal .selectAttr {
  margin-right: 0 !important;
  flex: 1 1 180px !important;
  min-width: 160px !important;
  max-width: none !important;
  width: auto !important;
}

html[data-se-theme] .modal .application-filter-modal .templatedata_box>.row>.col-md-3,
.securends .modal .application-filter-modal .templatedata_box>.row>.col-md-3 {
  flex: 1 1 150px !important;
  min-width: 140px !important;
  max-width: none !important;
  width: auto !important;
}

html[data-se-theme] .modal .application-filter-modal .application-filter-add-condition-wrap,
html[data-se-theme] .modal .application-filter-modal .application-filter-remove-wrap,
.securends .modal .application-filter-modal .application-filter-add-condition-wrap,
.securends .modal .application-filter-modal .application-filter-remove-wrap {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  min-height: 36px;
  padding-bottom: 4px !important;
  position: static !important;
  left: auto !important;
  top: auto !important;
  bottom: auto !important;
}

html[data-se-theme] .modal .application-filter-modal .application-filter-add-btn,
.securends .modal .application-filter-modal .application-filter-add-btn,
.securends .application-filter-add-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 50% !important;
  background: var(--se-brand) !important;
  background-color: var(--se-brand) !important;
  color: #fff !important;
  font-size: 12px !important;
  line-height: 1 !important;
  margin: 0 !important;
  cursor: pointer;
}

html[data-se-theme] .modal .application-filter-modal .application-filter-remove-btn,
html[data-se-theme] .modal .application-filter-modal .AttrDeleteBtn,
.securends .modal .application-filter-modal .application-filter-remove-btn,
.securends .modal .application-filter-modal .AttrDeleteBtn {
  position: static !important;
  top: auto !important;
  left: auto !important;
  margin: 0 !important;
  color: var(--se-risk) !important;
  font-size: 16px;
}

html[data-se-theme] .modal .application-filter-modal .form-group,
.securends .modal .application-filter-modal .form-group {
  margin-bottom: 0 !important;
  width: 100%;
}

html[data-se-theme] .modal .application-filter-modal .form-group label,
.securends .modal .application-filter-modal .form-group label {
  color: var(--se-ink-2) !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  margin-bottom: 4px !important;
}

html[data-se-theme] .modal .application-filter-modal .form-control,
.securends .modal .application-filter-modal .form-control {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 36px !important;
  margin-left: 0 !important;
}

html[data-se-theme] .modal .application-filter-modal .fa.fa-info-circle,
.securends .modal .application-filter-modal .fa.fa-info-circle {
  color: var(--se-brand) !important;
}

html[data-se-theme] .modal .application-filter-add-group-link,
.securends .modal .application-filter-add-group-link {
  margin-top: 12px !important;
}

html[data-se-theme] .modal .application-filter-add-group-action,
.securends .modal .application-filter-add-group-action,
.securends .application-filter-add-group-action {
  color: var(--se-brand) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
}

html[data-se-theme] .modal .application-filter-add-group-action.is-disabled,
.securends .modal .application-filter-add-group-action.is-disabled,
.securends .application-filter-add-group-action.is-disabled {
  color: var(--se-ink-3) !important;
  opacity: 0.55;
  pointer-events: none;
  cursor: default;
}

html[data-se-theme] .modal .application-filter-modal .identityTempHR,
.securends .modal .application-filter-modal .identityTempHR {
  border-top: 1px solid var(--se-line) !important;
  margin: 12px 0 !important;
}

/* Group-level trash outside the condition card — keep in flow */
html[data-se-theme] .modal .row.template>.col-md-1,
.securends .modal .row.template>.col-md-1 {
  position: static !important;
  margin-top: 24px !important;
  margin-left: 0 !important;
}

/* --------------------------------------------------------------------------
   Bulk Select Entitlements modal
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal .Delegation.uploadTitle,
html[data-se-theme] .modal .Delegation .uploadTitle,
.securends .modal .Delegation .uploadTitle {
  margin: 0 0 12px;
}

html[data-se-theme] .modal .Delegation .uploadTitle .help-block,
.securends .modal .Delegation .uploadTitle .help-block {
  color: var(--se-ink-2) !important;
  font-size: 13.5px !important;
  margin: 0 !important;
}

html[data-se-theme] .modal .Delegation .iam_add_Import,
.securends .modal .Delegation .iam_add_Import {
  background: var(--se-btn-bg, var(--se-brand)) !important;
  border: 1px solid var(--se-btn-bg, var(--se-brand)) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  border-radius: var(--se-r) !important;
  min-height: 32px;
  padding: 0 14px;
  font-weight: 500;
  box-shadow: none !important;
}

html[data-se-theme] .modal .Delegation .iam_add_Import:hover,
.securends .modal .Delegation .iam_add_Import:hover {
  background: var(--se-btn-bg-hover, var(--se-brand-hover)) !important;
  border-color: var(--se-btn-bg-hover, var(--se-brand-hover)) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

html[data-se-theme] .modal .Delegation .iam_add_Import:disabled,
.securends .modal .Delegation .iam_add_Import:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  color: var(--se-btn-fg, #333) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #333) !important;
}

html[data-se-theme] .modal .Delegation>form>div[style*="color: red"],
html[data-se-theme] .modal .Delegation>form>div[style*="color:red"],
.securends .modal .Delegation form>div[style*="color"] {
  color: var(--se-risk) !important;
  font-size: 12.5px;
  margin: 8px 0 12px;
  line-height: 1.4;
}

html[data-se-theme] .modal .Delegation form>div[style*="float"],
.securends .modal .Delegation form>div[style*="float"] {
  float: none !important;
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}

/* --------------------------------------------------------------------------
   Bulk Launch Campaign modal — pagination, reviewers, email select
   -------------------------------------------------------------------------- */
html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-content,
.securends .bulk-launch-modal .bulk-launch-modal-content,
.bulk-launch-modal .bulk-launch-modal-content {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  max-width: 100%;
}

/* Hide empty validation spacer so it does not add a gap above the table */
html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-content > .error:empty,
.bulk-launch-modal .bulk-launch-modal-content > .error:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

html[data-se-theme] .bulk-launch-modal .selectedCampaign,
.securends .bulk-launch-modal .selectedCampaign,
.bulk-launch-modal .selectedCampaign {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

/* Single table chrome — drop the wrapper border (looked like a double border) */
html[data-se-theme] .bulk-launch-modal .bulk-launch-table-scroll,
.securends .bulk-launch-modal .bulk-launch-table-scroll,
.bulk-launch-modal .bulk-launch-table-scroll {
  width: 100%;
  max-width: 100%;
  overflow: hidden !important;
  border: none !important;
  border-radius: var(--se-r-card);
  background: transparent;
  margin-top: 2px;
  box-shadow: none !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable.ReactTable,
.securends .bulk-launch-modal .campaignListTable.ReactTable,
.bulk-launch-modal .campaignListTable.ReactTable {
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  overflow: hidden;
  width: 100% !important;
  box-shadow: none !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-table,
.bulk-launch-modal .campaignListTable .rt-table {
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  border: none !important;
}

/* Keep page / page-size / Next on one aligned row inside the drawer width */
html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination,
.securends .bulk-launch-modal .campaignListTable .-pagination,
.bulk-launch-modal .campaignListTable .-pagination {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px 12px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 12px !important;
  margin: 0 !important;
  border-top: 1px solid var(--se-line) !important;
  background: var(--se-page) !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-previous,
html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-next,
.bulk-launch-modal .campaignListTable .-pagination .-previous,
.bulk-launch-modal .campaignListTable .-pagination .-next {
  flex: 0 0 auto !important;
  text-align: left !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-center,
.bulk-launch-modal .campaignListTable .-pagination .-center {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 12px !important;
  text-align: center !important;
  white-space: nowrap !important;
  min-width: 0 !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-pageInfo,
html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-pageJump,
html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-pageSizeOptions,
.bulk-launch-modal .campaignListTable .-pagination .-pageInfo,
.bulk-launch-modal .campaignListTable .-pagination .-pageJump,
.bulk-launch-modal .campaignListTable .-pagination .-pageSizeOptions {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
  float: none !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-pageInfo,
.bulk-launch-modal .campaignListTable .-pagination .-pageInfo {
  gap: 0.4em !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination input,
html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination select,
.bulk-launch-modal .campaignListTable .-pagination input,
.bulk-launch-modal .campaignListTable .-pagination select {
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 6px !important;
  padding: 0 8px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background-color: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 13px !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-btn,
.bulk-launch-modal .campaignListTable .-pagination .-btn {
  min-width: 72px !important;
  height: 32px !important;
  padding: 0 12px !important;
  border-radius: var(--se-r) !important;
}

/* Reviewer email checkboxes — wrapped grid, not float:left 50% */
html[data-se-theme] .bulk-launch-modal .se-bulk-reviewer-grid,
.securends .bulk-launch-modal .se-bulk-reviewer-grid,
.bulk-launch-modal .se-bulk-reviewer-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 8px 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 4px 0 12px !important;
  padding: 4px 0 !important;
  float: none !important;
  clear: both !important;
}

html[data-se-theme] .bulk-launch-modal .reviewerList,
html[data-se-theme] .bulk-launch-modal .msgReviewerList,
.securends .bulk-launch-modal .reviewerList,
.securends .bulk-launch-modal .msgReviewerList,
.bulk-launch-modal .reviewerList,
.bulk-launch-modal .msgReviewerList {
  float: none !important;
  width: auto !important;
  min-width: 200px;
  max-width: 100%;
  flex: 1 1 220px;
  display: flex !important;
  align-items: flex-start !important;
  gap: 0;
  margin: 0 !important;
  padding: 8px 10px 8px 1.75rem !important;
  position: relative !important;
  box-sizing: border-box !important;
  border: 1px solid var(--se-line-soft, var(--se-line));
  border-radius: var(--se-r);
  background: var(--se-page);
}

html[data-se-theme] .bulk-launch-modal .reviewerList .custom-control-label,
html[data-se-theme] .bulk-launch-modal .msgReviewerList .custom-control-label,
.bulk-launch-modal .reviewerList .custom-control-label,
.bulk-launch-modal .msgReviewerList .custom-control-label {
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-top: 0 !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  word-break: break-word !important;
  color: var(--se-ink) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

html[data-se-theme] .bulk-launch-modal .reviewerList .custom-control-input,
html[data-se-theme] .bulk-launch-modal .msgReviewerList .custom-control-input,
.bulk-launch-modal .reviewerList .custom-control-input,
.bulk-launch-modal .msgReviewerList .custom-control-input {
  position: absolute !important;
  z-index: 1;
}

/* Email template — same chrome as /endpoints multiselect + Remind modal */
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field,
.bulk-launch-modal .se-bulk-email-template-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  margin: 8px 0 12px;
  padding: 0;
  float: none !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-label,
.bulk-launch-modal .se-bulk-email-template-label {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  font-family: var(--se-sans) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: var(--se-ink-2) !important;
  line-height: 1.35 !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .selectCampaign,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .se-modal-select,
.bulk-launch-modal .se-bulk-email-template-field .selectCampaign,
.bulk-launch-modal .se-bulk-email-template-field .se-modal-select {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  display: block !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__control,
.bulk-launch-modal .se-bulk-email-template-field .react-select__control {
  width: 100% !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  background-image: none !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__value-container,
.bulk-launch-modal .se-bulk-email-template-field .react-select__value-container {
  padding: 0 8px 0 12px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__control::before,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__control::after,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__value-container::before,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__clear-indicator,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__indicator-separator,
.bulk-launch-modal .se-bulk-email-template-field .react-select__clear-indicator,
.bulk-launch-modal .se-bulk-email-template-field .react-select__indicator-separator {
  content: none !important;
  display: none !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__indicators,
.bulk-launch-modal .se-bulk-email-template-field .react-select__indicators {
  height: 36px !important;
  padding-right: 4px !important;
}

html[data-se-theme] .bulk-launch-modal .launch-campaign-option-wrap,
.bulk-launch-modal .launch-campaign-option-wrap {
  margin-left: 0 !important;
  margin-top: 8px !important;
  padding-left: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

html[data-se-theme] .bulk-launch-modal .bulk-launch-radio-label,
.bulk-launch-modal .bulk-launch-radio-label {
  width: auto !important;
  max-width: 100% !important;
}

html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer,
.bulk-launch-modal .bulk-launch-modal-footer {
  margin-top: 0 !important;
  gap: 8px;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

/* Theme-specific Cancel / Launch */
html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .custom__lg,
.bulk-launch-modal .bulk-launch-modal-footer .custom__lg {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r) !important;
  height: 36px !important;
  min-width: 88px;
  padding: 0 16px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .custom__pg,
html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .launchBtn,
html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .AddAppBtn.button-primary.blue,
.bulk-launch-modal .bulk-launch-modal-footer .custom__pg,
.bulk-launch-modal .bulk-launch-modal-footer .launchBtn,
.bulk-launch-modal .bulk-launch-modal-footer .AddAppBtn.button-primary.blue {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  height: 36px !important;
  min-width: 88px;
  padding: 0 16px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  text-transform: none !important;
}

html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .custom__pg:hover,
html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .launchBtn:hover,
.bulk-launch-modal .bulk-launch-modal-footer .custom__pg:hover,
.bulk-launch-modal .bulk-launch-modal-footer .launchBtn:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #fff !important;
}

html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .custom__pg:disabled,
html[data-se-theme] .bulk-launch-modal .bulk-launch-modal-footer .launchBtn:disabled,
.bulk-launch-modal .bulk-launch-modal-footer .launchBtn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-launch-footer-loader,
html[data-se-theme] .bulk-launch-modal .se-bulk-launch-inline-loader,
.bulk-launch-modal .se-bulk-launch-footer-loader,
.bulk-launch-modal .se-bulk-launch-inline-loader {
  margin: 0 8px 0 0 !important;
  float: none !important;
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* Hide column-resize “dash” control inside this modal table */
html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-resizer,
html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-thead .rt-resizer,
.bulk-launch-modal .campaignListTable .rt-resizer,
.bulk-launch-modal .campaignListTable .rt-thead .rt-resizer {
  display: none !important;
  width: 0 !important;
  pointer-events: none !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-resizer::before,
html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-resizer::after,
.bulk-launch-modal .campaignListTable .rt-resizer::before,
.bulk-launch-modal .campaignListTable .rt-resizer::after {
  content: none !important;
  display: none !important;
}

/* Column headers / cells aligned in the drawer width */
html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-thead.-header .rt-th,
html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-tbody .rt-td,
.bulk-launch-modal .campaignListTable .rt-thead.-header .rt-th,
.bulk-launch-modal .campaignListTable .rt-tbody .rt-td {
  text-align: left !important;
  vertical-align: middle !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .se-bulk-launch-th,
.bulk-launch-modal .campaignListTable .se-bulk-launch-th {
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: var(--se-table-header-ink, var(--se-ink-2)) !important;
  text-align: left !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .rt-thead.-header,
.bulk-launch-modal .campaignListTable .rt-thead.-header {
  background: var(--se-table-header-bg, var(--se-page)) !important;
}

/* Pagination: page + size + Next on one row for modal width */
html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-center,
.bulk-launch-modal .campaignListTable .-pagination .-center {
  flex: 1 1 auto !important;
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination .-pageSizeOptions,
.bulk-launch-modal .campaignListTable .-pagination .-pageSizeOptions {
  display: inline-flex !important;
  margin: 0 !important;
}

html[data-se-theme] .bulk-launch-modal .campaignListTable .-pagination select,
.bulk-launch-modal .campaignListTable .-pagination select {
  min-width: 88px !important;
  max-width: 110px !important;
  height: 32px !important;
  vertical-align: middle !important;
}

/* Email template — kill left add/clear chrome (match /endpoints) */
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__control,
.bulk-launch-modal .se-bulk-email-template-field .react-select__control {
  min-height: 36px !important;
  height: 36px !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__value-container,
.bulk-launch-modal .se-bulk-email-template-field .react-select__value-container {
  padding-left: 12px !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__indicators>*:not(.react-select__dropdown-indicator),
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__clear-indicator,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__indicator-separator,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__loading-indicator,
.bulk-launch-modal .se-bulk-email-template-field .react-select__clear-indicator,
.bulk-launch-modal .se-bulk-email-template-field .react-select__indicator-separator,
.bulk-launch-modal .se-bulk-email-template-field .react-select__loading-indicator {
  display: none !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__input,
html[data-se-theme] .bulk-launch-modal .se-bulk-email-template-field .react-select__input input,
.bulk-launch-modal .se-bulk-email-template-field .react-select__input input {
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  min-width: 2px !important;
}

/* Choose Campaign(s) — compact trigger; Bulk Launch modal only */
html[data-se-theme] .bulk-launch-modal .selectedCampaign,
html[data-se-theme] .bulk-launch-modal .selectedCampaign .btn-group,
html[data-se-theme] .bulk-launch-modal .selectedCampaign .multiselect-native-select,
.securends .bulk-launch-modal .selectedCampaign,
.securends .bulk-launch-modal .selectedCampaign .btn-group,
.securends .bulk-launch-modal .selectedCampaign .multiselect-native-select,
.bulk-launch-modal .selectedCampaign,
.bulk-launch-modal .selectedCampaign .btn-group,
.bulk-launch-modal .selectedCampaign .multiselect-native-select {
  width: 320px !important;
  max-width: 100% !important;
}

html[data-se-theme] .bulk-launch-modal .selectedCampaign button.multiselect,
html[data-se-theme] .bulk-launch-modal .selectedCampaign button.multiselect.dropdown-toggle,
.securends .bulk-launch-modal .selectedCampaign button.multiselect,
.bulk-launch-modal .selectedCampaign button.multiselect,
.bulk-launch-modal .selectedCampaign button.multiselect.dropdown-toggle {
  width: 320px !important;
  max-width: 100% !important;
  min-height: 32px !important;
  height: 32px !important;
  padding: 0 10px !important;
  font-size: 13px !important;
  line-height: 30px !important;
}

html[data-se-theme] .bulk-launch-modal .selectedCampaign ul.multiselect-container.dropdown-menu,
.bulk-launch-modal .selectedCampaign ul.multiselect-container.dropdown-menu {
  min-width: 320px !important;
  max-width: 100% !important;
}

/* --------------------------------------------------------------------------
   Termination Date + Delegate Campaign (Campaign Assignment side drawers)
   Presentation only — keep handlers / show / onHide / fields.
   Width matches Campaign Info (`.modal.right` / sidebar-modal = 55%).
   -------------------------------------------------------------------------- */

/* App-wide: right drawers share Campaign Info width (55%) */
html[data-se-theme] .modal.right .modal-dialog,
html[data-se-theme] .modal.right .modal-dialog.sidebar-modal,
html[data-se-theme] .modal.right .modal-dialog.custom-dialog,
html[data-se-theme] .modal.right .modal-dialog.custom-dialog.peoples-list.sidebar-modal,
.securends .modal.right .modal-dialog,
.securends .modal.right .modal-dialog.sidebar-modal,
.modal.right .modal-dialog,
.modal.right .modal-dialog.sidebar-modal,
.modal.right .modal-dialog.custom-dialog.peoples-list.sidebar-modal,
.modal:has(.modal-dialog.custom-dialog.peoples-list.sidebar-modal:not(.products-menu-modal)) .modal-dialog.custom-dialog.peoples-list.sidebar-modal:not(.products-menu-modal),
html[data-se-theme] .modal.right.fade .modal-dialog,
html[data-se-theme] .modal.right.fade.in .modal-dialog,
html[data-se-theme] .modal.right.fade.show .modal-dialog,
.modal.right.fade .modal-dialog,
.modal.right.fade.in .modal-dialog,
.modal.right.fade.show .modal-dialog {
  width: 55% !important;
  min-width: 0 !important;
  max-width: none !important;
}

html[data-se-theme] .se-termination-date-modal .modal-dialog,
.se-termination-date-modal .modal-dialog,
html[data-se-theme] .se-termination-date-modal.modal.right .modal-dialog,
.se-termination-date-modal.modal.right .modal-dialog {
  width: 55% !important;
  max-width: none !important;
}

html[data-se-theme] .se-termination-date-modal .modal-body,
.se-termination-date-modal .modal-body {
  padding: 20px 24px 28px !important;
}

html[data-se-theme] .se-termination-date-form,
.se-termination-date-form {
  display: flex !important;
  flex-direction: column;
  gap: 20px;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

html[data-se-theme] .se-termination-user-row,
.se-termination-user-row {
  display: grid !important;
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  gap: 12px 16px;
  margin: 0 !important;
  width: 100%;
}

html[data-se-theme] .se-termination-label,
.se-termination-label {
  display: block;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--se-ink-2) !important;
  letter-spacing: 0.02em;
  margin: 0 !important;
  float: none !important;
  width: auto !important;
  padding: 0 !important;
}

html[data-se-theme] .se-termination-value,
.se-termination-value {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  line-height: 1.4;
}

html[data-se-theme] .se-termination-date-field,
.se-termination-date-field {
  display: grid !important;
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  gap: 12px 16px;
  margin: 0 !important;
  width: 100%;
}

html[data-se-theme] .se-termination-date-field > .se-termination-label,
html[data-se-theme] .se-termination-date-field > label.se-termination-label,
.se-termination-date-field > .se-termination-label,
.se-termination-date-field > label.se-termination-label {
  padding-top: 0 !important;
  line-height: 36px !important;
  height: 36px;
}

html[data-se-theme] .se-termination-date-field > label.se-termination-label b,
.se-termination-date-field > label.se-termination-label b {
  font-weight: 600 !important;
}

html[data-se-theme] .se-termination-date-modal.modal.right .modal-content,
html[data-se-theme] .se-termination-date-modal .modal-content,
html[data-se-theme] .se-termination-date-modal .modal-body,
.se-termination-date-modal.modal.right .modal-content,
.se-termination-date-modal .modal-content,
.se-termination-date-modal .modal-body {
  overflow: visible !important;
}

html[data-se-theme] .se-termination-date-input,
.se-termination-date-input {
  width: 100%;
  max-width: 280px;
  padding: 0 !important;
  overflow: visible !important;
  position: relative;
  z-index: 6;
  grid-column: 2;
  justify-self: start;
}

html[data-se-theme] .se-termination-datepicker-popper,
.se-termination-datepicker-popper {
  z-index: calc(var(--se-z-modal, 1200) + 80) !important;
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  right: auto !important;
  transform: none !important;
  margin: 0 !important;
  width: 100% !important;
  min-width: 280px;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html[data-se-theme] .se-termination-datepicker-popper .react-datepicker,
.se-termination-datepicker-popper .react-datepicker {
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .se-termination-date-field > .error,
.se-termination-date-field > .error {
  grid-column: 2;
}

html[data-se-theme] .se-termination-date-input .react-datepicker-wrapper,
html[data-se-theme] .se-termination-date-input .react-datepicker__input-container,
.se-termination-date-input .react-datepicker-wrapper,
.se-termination-date-input .react-datepicker__input-container {
  display: block !important;
  width: 100% !important;
}

html[data-se-theme] .se-termination-date-input .form-control,
html[data-se-theme] .se-termination-date-input input,
html[data-se-theme] .se-termination-date-modal input.form-control.date-picker,
.se-termination-date-input .form-control,
.se-termination-date-input input,
.se-termination-date-modal input.form-control.date-picker {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 12px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  font-family: var(--se-sans) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  line-height: 34px !important;
}

html[data-se-theme] .se-termination-date-input input::placeholder,
.se-termination-date-input input::placeholder {
  color: var(--se-ink-3) !important;
  opacity: 1;
}

html[data-se-theme] .se-termination-date-input input:focus,
.se-termination-date-input input:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint) !important;
  outline: none !important;
}

/* Beat pickels #campaignTermination popper shove (inline table date) */
html[data-se-theme] #campaignTermination .react-datepicker-popper,
#campaignTermination .react-datepicker-popper {
  left: 0 !important;
  z-index: calc(var(--se-z-modal, 1200) + 80) !important;
}

html[data-se-theme] .se-termination-actions,
.se-termination-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 8px;
  float: none !important;
  padding: 0 !important;
  width: 100%;
}

html[data-se-theme] .se-termination-actions .button,
html[data-se-theme] .se-termination-actions .Save_align,
.se-termination-actions .button,
.se-termination-actions .Save_align {
  float: none !important;
  margin: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 18px !important;
  border-radius: var(--se-r) !important;
  background: var(--se-brand) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 600 !important;
}

/* Datepicker month header — v1.4 uses border triangles, not later icon CSS */
html[data-se-theme] .react-datepicker__header,
.react-datepicker__header {
  position: relative !important;
  padding: 12px 8px 4px !important;
  box-sizing: border-box;
}

html[data-se-theme] .react-datepicker__current-month,
.react-datepicker__current-month {
  display: block !important;
  width: 100% !important;
  margin: 0 0 8px !important;
  padding: 0 32px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .react-datepicker__month-container,
.react-datepicker__month-container {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .react-datepicker__month,
.react-datepicker__month {
  margin: 0 !important;
  padding: 4px 8px 10px !important;
}

html[data-se-theme] .react-datepicker__day-names,
html[data-se-theme] .react-datepicker__week,
.react-datepicker__day-names,
.react-datepicker__week {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  align-items: center;
  justify-content: initial !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}

html[data-se-theme] .react-datepicker__day-name,
html[data-se-theme] .react-datepicker__day,
.react-datepicker__day-name,
.react-datepicker__day {
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100% !important;
  min-width: 0 !important;
  height: 2rem !important;
  line-height: 2rem !important;
  margin: 2px 0 !important;
  flex: none !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .react-datepicker__day--disabled,
.react-datepicker__day--disabled {
  color: var(--se-ink-3) !important;
  background: transparent !important;
  opacity: 0.4 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

html[data-se-theme] .react-datepicker__day--disabled:hover,
.react-datepicker__day--disabled:hover {
  background: transparent !important;
  color: var(--se-ink-3) !important;
}

html[data-se-theme] .react-datepicker__navigation,
.react-datepicker__navigation {
  background: none !important;
  position: absolute !important;
  top: 14px !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  border: 0.45rem solid transparent !important;
  z-index: 2;
  text-indent: -999em !important;
  overflow: hidden !important;
  cursor: pointer;
}

html[data-se-theme] .react-datepicker__navigation--previous,
.react-datepicker__navigation--previous {
  left: 12px !important;
  right: auto !important;
  border-right-color: var(--se-ink-2) !important;
  border-left-color: transparent !important;
}

html[data-se-theme] .react-datepicker__navigation--next,
.react-datepicker__navigation--next {
  right: 12px !important;
  left: auto !important;
  border-left-color: var(--se-ink-2) !important;
  border-right-color: transparent !important;
}

html[data-se-theme] .react-datepicker__portal .react-datepicker__navigation,
.react-datepicker__portal .react-datepicker__navigation {
  border: 0.45rem solid transparent !important;
}

html[data-se-theme] .react-datepicker__portal .react-datepicker__navigation--previous,
.react-datepicker__portal .react-datepicker__navigation--previous {
  border-right-color: var(--se-ink-2) !important;
}

html[data-se-theme] .react-datepicker__portal .react-datepicker__navigation--next,
.react-datepicker__portal .react-datepicker__navigation--next {
  border-left-color: var(--se-ink-2) !important;
}

html[data-se-theme] .react-datepicker__portal .react-datepicker,
.react-datepicker__portal .react-datepicker {
  margin: 0 auto !important;
}

/* Delegate Campaign drawer */
html[data-se-theme] .se-delegate-campaign-modal .modal-body,
.se-delegate-campaign-modal .modal-body {
  padding: 16px 20px 24px !important;
  overflow-x: hidden !important;
}

html[data-se-theme] .se-delegate-campaign-form,
.se-delegate-campaign-form,
html[data-se-theme] .se-delegate-campaign-modal .user-access-title.se-delegate-campaign-form,
.se-delegate-campaign-modal .user-access-title.se-delegate-campaign-form {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
}

html[data-se-theme] .se-delegate-field-row,
.se-delegate-field-row {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 0 0 12px !important;
  float: none !important;
  width: 100% !important;
}

html[data-se-theme] .se-delegate-label,
.se-delegate-label {
  flex: 0 0 110px;
  max-width: 130px;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  text-align: left !important;
  color: var(--se-ink-2) !important;
  font-size: 13px !important;
}

html[data-se-theme] .se-delegate-value,
.se-delegate-value {
  flex: 1 1 200px;
  min-width: 0;
  float: none !important;
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  font-weight: 500;
  word-break: break-word;
}

html[data-se-theme] .se-delegate-autocomplete,
.se-delegate-autocomplete {
  flex: 1 1 280px;
  max-width: 360px;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  z-index: 5;
}

html[data-se-theme] .se-delegate-autocomplete input.form-control,
html[data-se-theme] .se-delegate-autocomplete input#update_manager,
.se-delegate-autocomplete input.form-control,
.se-delegate-autocomplete input#update_manager {
  width: 100% !important;
  max-width: 100% !important;
  height: 36px !important;
  min-height: 36px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  box-shadow: none !important;
}

html[data-se-theme] .se-delegate-autocomplete input.form-control:focus,
.se-delegate-autocomplete input.form-control:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint) !important;
}

html[data-se-theme] .se-delegate-notes-row,
.se-delegate-notes-row {
  margin: 8px 0 0 !important;
  float: none !important;
  width: 100% !important;
}

html[data-se-theme] .se-delegate-notes-hint,
.se-delegate-notes-hint {
  color: var(--se-ink-2) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.45;
  margin: 4px 0 8px !important;
}

html[data-se-theme] .se-delegate-notes-row textarea.form-control,
.se-delegate-notes-row textarea.form-control {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 96px;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .se-delegate-actions,
.se-delegate-actions {
  display: flex !important;
  justify-content: flex-end;
  margin: 8px 0 16px !important;
  float: none !important;
}

html[data-se-theme] .se-delegate-actions .deligate_cmp,
.se-delegate-actions .deligate_cmp {
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 18px !important;
  border-radius: var(--se-r) !important;
  background: var(--se-brand) !important;
  border: none !important;
  color: #fff !important;
  font-weight: 600 !important;
}

/* Delegate nested table — visible colcfg + no phantom bottom bar */
html[data-se-theme] .se-delegate-table-wrap,
.se-delegate-table-wrap,
html[data-se-theme] .delegate-campaign-table,
.delegate-campaign-table {
  position: relative !important;
  overflow: visible !important;
  width: 100%;
  margin-top: 8px !important;
}

html[data-se-theme] .se-delegate-table-wrap .se-rt-colcfg-host,
.se-delegate-table-wrap .se-rt-colcfg-host,
html[data-se-theme] .modal .se-rt-colcfg-host,
.modal .se-rt-colcfg-host {
  position: relative !important;
  overflow: visible !important;
  padding-top: 4px;
}

html[data-se-theme] .se-delegate-table-wrap .se-rt-colcfg-corner,
.se-delegate-table-wrap .se-rt-colcfg-corner,
html[data-se-theme] .modal .se-rt-colcfg-corner,
.modal .se-rt-colcfg-corner {
  position: absolute !important;
  top: 6px !important;
  right: 10px !important;
  z-index: 30 !important;
  pointer-events: auto !important;
}

html[data-se-theme] .se-delegate-table-wrap .se-rt-colcfg-corner.se-rt-colcfg-corner--fixed,
.se-delegate-table-wrap .se-rt-colcfg-corner.se-rt-colcfg-corner--fixed,
html[data-se-theme] .modal .se-rt-colcfg-corner.se-rt-colcfg-corner--fixed,
.modal .se-rt-colcfg-corner.se-rt-colcfg-corner--fixed {
  position: fixed !important;
  top: var(--se-colcfg-top, 0px) !important;
  left: var(--se-colcfg-left, 0px) !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 40 !important;
}

html[data-se-theme] .se-delegate-table-wrap .se-rt-colcfg-btn,
.se-delegate-table-wrap .se-rt-colcfg-btn,
html[data-se-theme] .modal .se-rt-colcfg-btn,
.modal .se-rt-colcfg-btn {
  width: 32px !important;
  height: 32px !important;
  border: 1.5px solid var(--se-ink-3) !important;
  background: var(--se-card) !important;
  color: var(--se-brand) !important;
  box-shadow: var(--se-shadow) !important;
  border-radius: var(--se-r) !important;
}

html[data-se-theme] .se-delegate-table-wrap .se-rt-colcfg-btn:hover,
html[data-se-theme] .modal .se-rt-colcfg-btn:hover,
html[data-se-theme] .modal .se-rt-colcfg-btn.is-open,
.modal .se-rt-colcfg-btn:hover,
.modal .se-rt-colcfg-btn.is-open {
  border-color: var(--se-brand) !important;
  background: var(--se-brand-tint) !important;
}

html[data-se-theme] .se-delegate-table-wrap .se-rt-colcfg-bars>span,
.modal .se-rt-colcfg-bars>span {
  width: 3px !important;
  background: var(--se-ink-2) !important;
}

html[data-se-theme] .se-delegate-table-wrap .ReactTable.se-rt-has-colcfg .rt-thead.-header,
.se-delegate-table-wrap .ReactTable.se-rt-has-colcfg .rt-thead.-header,
.modal .ReactTable.se-rt-has-colcfg .rt-thead.-header {
  padding-right: 44px !important;
}

html[data-se-theme] .se-delegate-campaign-table .-pagination,
.se-delegate-campaign-table .-pagination,
html[data-se-theme] .delegate-campaign-table .ReactTable .-pagination,
.delegate-campaign-table .ReactTable .-pagination,
html[data-se-theme] .se-delegate-table-wrap .ReactTable .-pagination,
.se-delegate-table-wrap .ReactTable .-pagination {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  overflow: hidden !important;
}

html[data-se-theme] .se-delegate-table-wrap .ReactTable,
.delegate-campaign-table .ReactTable {
  border: none !important;
}

html[data-se-theme] .se-delegate-table-wrap .ReactTable .rt-table,
.delegate-campaign-table .ReactTable .rt-table {
  max-height: none !important;
  overflow: auto !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
}

/* Hide empty horizontal scrollbar track when table fits */
html[data-se-theme] .se-delegate-table-wrap .ReactTable .rt-table::-webkit-scrollbar,
.delegate-campaign-table .ReactTable .rt-table::-webkit-scrollbar {
  height: 8px;
  width: 8px;
}

html[data-se-theme] .se-delegate-table-wrap .ReactTable .rt-table::-webkit-scrollbar-thumb,
.delegate-campaign-table .ReactTable .rt-table::-webkit-scrollbar-thumb {
  background: var(--se-line-soft);
  border-radius: 8px;
}

/* Colcfg panel above modal chrome */
html[data-se-theme] .se-rt-colcfg-panel,
.se-rt-colcfg-panel {
  z-index: 11000 !important;
}

/* Update Reviewer drawer — autocomplete spacing */
html[data-se-theme] .se-update-reviewer-modal .autoComplete.update,
.se-update-reviewer-modal .autoComplete.update {
  position: relative;
  z-index: 5;
}

html[data-se-theme] .se-update-reviewer-modal .autoComplete.update input.form-control,
.se-update-reviewer-modal .autoComplete.update input.form-control {
  height: 36px !important;
  min-height: 36px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background: var(--se-card) !important;
}

/* Dropdown list only — do not change New Reviewer label/input alignment.
   Beat pickels `.autoComplete.update div { width: 78% }` and
   `#updateManagerData { float: right; min-width: 364px }` which leave a
   blank strip beside truncated suggestion rows. */
html[data-se-theme] .se-update-reviewer-modal .se-autocomplete-menu,
html[data-se-theme] .se-update-reviewer-modal .se-reviewer-ac-menu,
html[data-se-theme] .se-update-reviewer-modal .autoComplete.update .se-autocomplete-menu,
html[data-se-theme] .se-update-reviewer-modal .autoComplete.update .se-reviewer-ac-menu,
.se-update-reviewer-modal .se-autocomplete-menu,
.se-update-reviewer-modal .se-reviewer-ac-menu,
.se-update-reviewer-modal .autoComplete.update .se-autocomplete-menu {
  position: absolute !important;
  top: calc(100% + 4px) !important;
  left: 0 !important;
  right: auto !important;
  float: none !important;
  display: block !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  z-index: 10050 !important;
}

html[data-se-theme] .se-update-reviewer-modal .se-autocomplete-menu .ac_dropdown,
html[data-se-theme] .se-update-reviewer-modal .se-autocomplete-menu .se-ac-option,
html[data-se-theme] .se-update-reviewer-modal .se-autocomplete-menu #updateManagerData,
html[data-se-theme] .se-update-reviewer-modal .autoComplete.update .se-autocomplete-menu div,
html[data-se-theme] .se-update-reviewer-modal #updateManagerData,
.se-update-reviewer-modal .se-autocomplete-menu .ac_dropdown,
.se-update-reviewer-modal .se-autocomplete-menu .se-ac-option,
.se-update-reviewer-modal .se-autocomplete-menu #updateManagerData,
.se-update-reviewer-modal .autoComplete.update .se-autocomplete-menu div,
.se-update-reviewer-modal #updateManagerData {
  float: none !important;
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

.button-primary.blue.mr-3 {
  height: 32px;
  margin-right: 20px;
}

/* Additional Information (#electionInfo) — centered card, label/value rows, Close */
html[data-se-theme] #electionInfo .modal-dialog,
.securends #electionInfo .modal-dialog,
#electionInfo .modal-dialog {
  max-width: 560px;
  width: calc(100% - 32px);
}

html[data-se-theme] #electionInfo .modal-title,
.securends #electionInfo .modal-title,
#electionInfo .modal-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  line-height: 1.35 !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

html[data-se-theme] #electionInfo .modal-body,
.securends #electionInfo .modal-body,
#electionInfo .modal-body {
  padding: 16px 20px 12px !important;
}

html[data-se-theme] #electionInfo .modal-body p,
.securends #electionInfo .modal-body p,
#electionInfo .modal-body p {
  margin: 0 0 10px !important;
  color: var(--se-ink) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

html[data-se-theme] #electionInfo .modal-body p strong,
html[data-se-theme] #electionInfo .modal-body p b,
.securends #electionInfo .modal-body p strong,
#electionInfo .modal-body p strong {
  color: var(--se-ink) !important;
  font-weight: 700 !important;
}

/* Application Details — match Additional Information (centered card, label/value, Close) */
html[data-se-theme] .se-app-details-modal .modal-dialog,
.securends .se-app-details-modal .modal-dialog,
.se-app-details-modal .modal-dialog {
  max-width: 560px;
}

html[data-se-theme] .se-app-details-modal .MuiSvgIcon-root,
.se-app-details-modal .MuiSvgIcon-root {
  display: none !important;
}

html[data-se-theme] .se-app-details-modal .modal-title,
.se-app-details-modal .modal-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .se-app-details-modal .tab-content,
html[data-se-theme] .se-app-details-modal .tab-pane,
.se-app-details-modal .tab-content,
.se-app-details-modal .tab-pane {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
}

html[data-se-theme] .se-app-details-modal .tblGrid,
.se-app-details-modal .tblGrid {
  width: 100% !important;
  border: none !important;
  background: transparent !important;
}

html[data-se-theme] .se-app-details-modal .tblGrid tr,
.se-app-details-modal .tblGrid tr {
  display: block;
  margin: 0 0 10px;
  border: none !important;
}

html[data-se-theme] .se-app-details-modal .tblGrid th,
html[data-se-theme] .se-app-details-modal .tblGrid th.details_1,
.se-app-details-modal .tblGrid th,
.se-app-details-modal .tblGrid th.details_1 {
  display: inline;
  width: auto !important;
  padding: 0 6px 0 0 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--se-ink) !important;
  white-space: normal !important;
}

html[data-se-theme] .se-app-details-modal .tblGrid td,
.se-app-details-modal .tblGrid td {
  display: inline;
  width: auto !important;
  padding: 0 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--se-ink) !important;
  line-height: 1.5 !important;
  word-break: break-word;
}

html[data-se-theme] .se-app-details-modal .modal-header,
.se-app-details-modal .modal-header {
  border-bottom: 1px solid var(--se-line) !important;
}

html[data-se-theme] .se-app-details-modal .modal-footer,
.se-app-details-modal .modal-footer {
  border-top: 1px solid var(--se-line) !important;
  justify-content: flex-end !important;
}

/* Justification for entitlements — full-width field + Additional Information chrome */
html[data-se-theme] .iga-justification-modal .modal-dialog,
html[data-se-theme] .modal-dialog.iga-justification-modal-dialog,
.securends .iga-justification-modal .modal-dialog,
.iga-justification-modal .modal-dialog,
.modal-dialog.iga-justification-modal-dialog {
  max-width: 560px;
  width: calc(100% - 32px);
}

html[data-se-theme] .iga-justification-modal .modal-title,
html[data-se-theme] .modal-dialog.iga-justification-modal-dialog .modal-title,
.iga-justification-modal .modal-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .iga-justification-modal .modal-title .fa-pencil-square-o,
.iga-justification-modal .modal-title .fa-pencil-square-o {
  color: var(--se-brand) !important;
  margin-right: 8px !important;
}

html[data-se-theme] .iga-justification-modal .modal-header,
.iga-justification-modal .modal-header {
  border-bottom: 1px solid var(--se-line) !important;
}

html[data-se-theme] .iga-justification-modal textarea.form-control.history,
html[data-se-theme] .iga-justification-modal textarea.justEntNotes,
.iga-justification-modal textarea.form-control.history,
.iga-justification-modal textarea.justEntNotes {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  background: var(--bg-input, var(--se-card)) !important;
  background-color: var(--bg-input, var(--se-card)) !important;
}

/* Beat pickels `.iga-modal-justification-field .MuiOutlinedInput-root { background:#fff }` */
html[data-se-theme] .iga-modal-justification-field .MuiOutlinedInput-root,
html[data-se-theme] .iga-justification-modal .MuiOutlinedInput-root,
html[data-se-theme] .modal-body .iga-modal-justification-field .MuiOutlinedInput-root,
.iga-modal-justification-field .MuiOutlinedInput-root,
.iga-justification-modal .MuiOutlinedInput-root,
.modal-body .iga-modal-justification-field .MuiOutlinedInput-root,
.securends .iga-modal-justification-field .MuiOutlinedInput-root {
  background: var(--bg-input, var(--se-card)) !important;
  background-color: var(--bg-input, var(--se-card)) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .iga-modal-justification-field .MuiOutlinedInput-notchedOutline,
.iga-modal-justification-field .MuiOutlinedInput-notchedOutline {
  border-color: var(--se-line) !important;
}

html[data-se-theme] .iga-modal-justification-field .MuiInputLabel-outlined,
html[data-se-theme] .iga-modal-justification-field .MuiInputLabel-outlined.MuiInputLabel-shrink,
.iga-modal-justification-field .MuiInputLabel-outlined,
.iga-modal-justification-field .MuiInputLabel-outlined.MuiInputLabel-shrink {
  background: var(--se-card) !important;
  color: var(--se-ink-2) !important;
}

html[data-se-theme] .modal-body .iga-modal-justification-field textarea,
html[data-se-theme] .iga-modal-justification-field textarea,
html[data-se-theme] .iga-modal-justification-field .MuiOutlinedInput-input,
html[data-se-theme] .iga-modal-justification-field .MuiOutlinedInput-inputMultiline,
html[data-se-theme] .iga-justification-modal textarea,
.modal-body .iga-modal-justification-field textarea,
.modal-body .iga-modal-justification-field .MuiOutlinedInput-inputMultiline,
.iga-modal-justification-field textarea,
.iga-modal-justification-field .MuiOutlinedInput-input,
.iga-modal-justification-field .MuiOutlinedInput-inputMultiline,
.iga-justification-modal textarea {
  width: 100% !important;
  min-height: 88px !important;
  box-sizing: border-box !important;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--se-ink) !important;
  -webkit-text-fill-color: var(--se-ink) !important;
}

html[data-se-theme] .iga-modal-justification-field textarea::placeholder,
html[data-se-theme] .iga-modal-justification-field .MuiOutlinedInput-input::placeholder,
html[data-se-theme] .iga-modal-justification-field .MuiOutlinedInput-inputMultiline::placeholder,
.iga-modal-justification-field textarea::placeholder,
.iga-modal-justification-field .MuiOutlinedInput-input::placeholder,
.iga-modal-justification-field .MuiOutlinedInput-inputMultiline::placeholder {
  color: var(--se-ink-3) !important;
  opacity: 1 !important;
}

/* Application justification: full-width field stacks + modern OK */
html[data-se-theme] .iga-justification-modal .iga-modal-field-block,
.securends .iga-justification-modal .iga-modal-field-block,
.iga-justification-modal .iga-modal-field-block {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 14px !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .iga-justification-modal .iga-modal-field-block > textarea.justEntNotes,
html[data-se-theme] .iga-justification-modal .iga-modal-field-block > textarea.form-control,
.securends .iga-justification-modal .iga-modal-field-block > textarea.justEntNotes,
.iga-justification-modal .iga-modal-field-block > textarea.justEntNotes,
.iga-justification-modal .iga-modal-field-block > textarea.form-control {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 96px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
  resize: vertical;
}

html[data-se-theme] .iga-justification-modal .modal-footer .iga-justification-ok-btn,
html[data-se-theme] .iga-justification-modal .modal-footer .MuiButton-root.iga-justification-ok-btn,
.securends .iga-justification-modal .modal-footer .iga-justification-ok-btn,
.iga-justification-modal .modal-footer .iga-justification-ok-btn {
  min-width: 88px !important;
  min-height: 36px !important;
  padding: 8px 20px !important;
  margin: 0 !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-brand) !important;
  background: var(--se-brand) !important;
  background-color: var(--se-brand) !important;
  color: #fff !important;
  box-shadow: none !important;
  text-transform: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

html[data-se-theme] .iga-justification-modal .modal-footer .iga-justification-ok-btn:hover,
.securends .iga-justification-modal .modal-footer .iga-justification-ok-btn:hover,
.iga-justification-modal .modal-footer .iga-justification-ok-btn:hover {
  background: var(--se-brand-hover) !important;
  background-color: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  box-shadow: none !important;
}

/* Entitlement justification: let content define height; full-width date field */
html[data-se-theme] .iga-justification-modal.approvalJustModal .modal-content,
html[data-se-theme] .iga-justification-modal.approvalPerModal .modal-content,
html[data-se-theme] .modal-dialog.approvalJustModal.iga-justification-modal-dialog .modal-content,
html[data-se-theme] .modal-dialog.approvalPerModal.iga-justification-modal-dialog .modal-content,
.securends .modal-dialog.approvalJustModal.iga-justification-modal-dialog .modal-content,
.securends .modal-dialog.approvalPerModal.iga-justification-modal-dialog .modal-content,
.modal-dialog.approvalJustModal.iga-justification-modal-dialog .modal-content,
.modal-dialog.approvalPerModal.iga-justification-modal-dialog .modal-content,
.modal-dialog.approvalNoTimeBoundModal.iga-justification-modal-dialog .modal-content,
.modal-dialog.approvalJustACModal.iga-justification-modal-dialog .modal-content,
.modal-dialog.approvalPerACModal.iga-justification-modal-dialog .modal-content {
  height: auto !important;
  min-height: 0 !important;
}

html[data-se-theme] .iga-justification-modal .iga-modal-field-block .manageAccess,
html[data-se-theme] .iga-justification-modal .iga-modal-field-block .react-datepicker-wrapper,
html[data-se-theme] .iga-justification-modal .iga-modal-field-block .react-datepicker__input-container,
html[data-se-theme] .iga-justification-modal .iga-modal-field-block .react-datepicker__input-container input.form-control,
.securends .iga-justification-modal .iga-modal-field-block .manageAccess,
.securends .iga-justification-modal .iga-modal-field-block .react-datepicker-wrapper,
.securends .iga-justification-modal .iga-modal-field-block .react-datepicker__input-container,
.securends .iga-justification-modal .iga-modal-field-block .react-datepicker__input-container input.form-control,
.iga-justification-modal .iga-modal-field-block .manageAccess,
.iga-justification-modal .iga-modal-field-block .react-datepicker-wrapper,
.iga-justification-modal .iga-modal-field-block .react-datepicker__input-container,
.iga-justification-modal .iga-modal-field-block .react-datepicker__input-container input.form-control {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .iga-justification-modal .modal-body,
.securends .iga-justification-modal .modal-body.iga-modal-justification-ent,
.iga-justification-modal .iga-modal-justification-ent {
  overflow: visible !important;
  padding: 16px 20px 8px !important;
}

html[data-se-theme] .iga-justification-modal .iga-modal-body-stack,
html[data-se-theme] .iga-justification-modal .iga-modal-body-stack>div,
html[data-se-theme] .iga-justification-modal .iga-modal-summary,
.securends .iga-justification-modal .iga-modal-body-stack,
.securends .iga-justification-modal .iga-modal-body-stack>div,
.securends .iga-justification-modal .iga-modal-summary,
.iga-justification-modal .iga-modal-body-stack,
.iga-justification-modal .iga-modal-body-stack>div,
.iga-justification-modal .iga-modal-summary {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .iga-justification-modal .iga-modal-row,
.securends .iga-justification-modal .iga-modal-row,
.iga-justification-modal .iga-modal-row {
  display: flex !important;
  align-items: flex-start;
  flex-wrap: wrap;
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
}

html[data-se-theme] .iga-justification-modal .iga-modal-label,
.securends .iga-justification-modal .iga-modal-label,
.iga-justification-modal .iga-modal-label {
  width: auto !important;
  min-width: 0 !important;
  margin: 0 6px 0 0 !important;
  padding: 0 !important;
  font-weight: 700 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .iga-justification-modal .iga-modal-value,
.iga-justification-modal .iga-modal-value {
  font-weight: 400 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .modal-body .iga-modal-justification-field,
html[data-se-theme] .iga-justification-modal .iga-modal-row.iga-modal-justification-field,
.securends .modal-body .iga-modal-justification-field,
.iga-justification-modal .iga-modal-justification-field,
.modal-body .iga-modal-justification-field {
  display: block !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .modal-body .iga-modal-justification-field .MuiFormControl-root,
html[data-se-theme] .modal-body .iga-modal-justification-field .MuiTextField-root,
html[data-se-theme] .modal-body .iga-modal-justification-field .MuiFormControl-fullWidth,
html[data-se-theme] .modal-body .iga-modal-justification-field .MuiOutlinedInput-root,
.securends .modal-body .iga-modal-justification-field .MuiFormControl-root,
.securends .modal-body .iga-modal-justification-field .MuiTextField-root,
.securends .modal-body .iga-modal-justification-field .MuiOutlinedInput-root,
.modal-body .iga-modal-justification-field .MuiFormControl-root,
.modal-body .iga-modal-justification-field .MuiTextField-root,
.modal-body .iga-modal-justification-field .MuiOutlinedInput-root {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .modal-body .iga-modal-justification-field textarea,
.modal-body .iga-modal-justification-field textarea,
.modal-body .iga-modal-justification-field .MuiOutlinedInput-inputMultiline {
  width: 100% !important;
  min-height: 88px !important;
  box-sizing: border-box !important;
  background: transparent !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .iga-justification-modal .modal-footer,
.iga-justification-modal .modal-footer {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  border-top: 1px solid var(--se-line) !important;
  padding: 12px 20px !important;
}

html[data-se-theme] .iga-justification-modal .iga-justification-save-wrap,
.iga-justification-modal .iga-justification-save-wrap {
  margin: 0 !important;
  float: none !important;
}

html[data-se-theme] .iga-justification-modal .modal-footer .MuiButton-root,
.iga-justification-modal .modal-footer .MuiButton-root {
  text-transform: none !important;
  box-shadow: none !important;
  min-height: 36px !important;
  padding: 6px 16px !important;
  border-radius: var(--se-r) !important;
  background: var(--se-brand) !important;
  background-color: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
}

html[data-se-theme] .modal-body .iga-access-duration-block,
.iga-justification-modal .iga-access-duration-block,
.modal-body .iga-access-duration-block {
  margin: 8px 0 0 !important;
  padding: 0 !important;
}

html[data-se-theme] .iga-justification-modal .iga-access-duration-label,
.iga-justification-modal .iga-access-duration-label,
.modal-body .iga-access-duration-label {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  top: auto !important;
}

html[data-se-theme] .iga-justification-modal .iga-access-duration-label .iga-modal-label,
.iga-justification-modal .iga-access-duration-label .iga-modal-label,
.modal-body .iga-access-duration-label .iga-modal-label {
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-se-theme] .iga-justification-modal .iga-access-duration-label .fa-info-circle,
.iga-justification-modal .iga-access-duration-label .fa-info-circle,
.modal-body .iga-access-duration-label .fa-info-circle {
  margin: 0 !important;
  color: var(--se-brand) !important;
  font-size: 14px !important;
  line-height: 1 !important;
}

html[data-se-theme] .modal-body .iga-access-duration-info,
.iga-justification-modal .iga-access-duration-info,
.modal-body .iga-access-duration-info {
  display: inline-flex !important;
  align-items: center !important;
  cursor: default;
  line-height: 1 !important;
}

html[data-se-theme] .modal-body .iga-access-duration-label+.iga-access-duration-radios,
.modal-body .iga-access-duration-label+.iga-access-duration-radios {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  position: static !important;
  top: auto !important;
  bottom: auto !important;
}

html[data-se-theme] .modal-body .iga-access-duration-label,
.modal-body .iga-access-duration-label {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
}

html[data-se-theme] .modal-body .iga-access-duration-radios .MuiFormControl-root,
.modal-body .iga-access-duration-radios .MuiFormControl-root {
  margin: 0 !important;
  padding: 0 !important;
}

html[data-se-theme] .modal-body .iga-access-duration-radios .MuiRadioGroup-root,
.modal-body .iga-access-duration-radios .MuiRadioGroup-root {
  margin: 0 !important;
  padding: 0 !important;
  gap: 4px 12px;
}

html[data-se-theme] .modal-body .iga-access-duration-radios .MuiFormControlLabel-root,
.modal-body .iga-access-duration-radios .MuiFormControlLabel-root {
  margin: 0 12px 0 0 !important;
}

html[data-se-theme] .modal-body .iga-access-duration-radios .MuiRadio-root,
.modal-body .iga-access-duration-radios .MuiRadio-root {
  padding: 4px 6px 4px 0 !important;
}

html[data-se-theme] .modal-body .iga-access-duration-radios .MuiFormLabel-root,
.modal-body .iga-access-duration-radios .MuiFormLabel-root {
  display: none !important;
  margin: 0 !important;
  height: 0 !important;
}

/* MUI tooltip (portaled to body) — theme tokens */
html[data-se-theme] .MuiTooltip-tooltip,
.MuiTooltip-tooltip {
  background-color: var(--se-ink) !important;
  color: var(--se-page) !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  border-radius: var(--se-r-sm) !important;
  box-shadow: var(--se-shadow-md);
  padding: 6px 10px !important;
}

html[data-se-theme] .MuiTooltip-arrow,
.MuiTooltip-arrow {
  color: var(--se-ink) !important;
}

/* Bootstrap tooltip (portaled to body) — theme tokens, beat pickels black */
html[data-se-theme] .tooltip .tooltip-inner,
.tooltip .tooltip-inner {
  background-color: var(--se-ink) !important;
  color: var(--se-page) !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: var(--se-r-sm) !important;
}

html[data-se-theme] .tooltip.bottom .tooltip-arrow,
html[data-se-theme] .tooltip.bs-tooltip-bottom .arrow::before,
html[data-se-theme] .bs-tooltip-bottom .arrow::before,
.tooltip.bottom .tooltip-arrow {
  border-bottom-color: var(--se-ink) !important;
}

html[data-se-theme] .tooltip.top .tooltip-arrow,
html[data-se-theme] .bs-tooltip-top .arrow::before,
.tooltip.top .tooltip-arrow {
  border-top-color: var(--se-ink) !important;
}

/* --------------------------------------------------------------------------
   Assign Delegates (sidebar drawer) — theme tokens; keep right-slide
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal.right .se-assign-delegates-modal .modal-content,
html[data-se-theme] .se-assign-delegates-modal .modal-content,
.se-assign-delegates-modal .modal-content {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .se-assign-delegates-modal .modelheader,
html[data-se-theme] .se-assign-delegates-modal .modal-header,
.se-assign-delegates-modal .modelheader {
  background: var(--se-card) !important;
  border-bottom: 1px solid var(--se-line) !important;
}

html[data-se-theme] .se-assign-delegates-modal .modal-title,
.se-assign-delegates-modal .modal-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .se-assign-delegates-modal .modal-body,
.se-assign-delegates-modal .modal-body {
  padding: 20px 24px 24px !important;
  background: var(--se-card) !important;
}

html[data-se-theme] .se-assign-delegates-modal form.autoComplete label,
.se-assign-delegates-modal form.autoComplete label {
  display: block;
  margin: 0 0 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
}

html[data-se-theme] .se-assign-delegates-modal form.autoComplete input.form-control,
html[data-se-theme] .se-assign-delegates-modal .react-datepicker-wrapper,
html[data-se-theme] .se-assign-delegates-modal .react-datepicker-wrapper input.form-control,
.se-assign-delegates-modal form.autoComplete input.form-control,
.se-assign-delegates-modal input.form-control.date-picker {
  width: 100% !important;
  max-width: 100% !important;
  height: 36px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 14px !important;
  box-shadow: none !important;
}

html[data-se-theme] .se-assign-delegates-modal form.autoComplete input.form-control:focus,
.se-assign-delegates-modal form.autoComplete input.form-control:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint) !important;
  outline: none !important;
}

html[data-se-theme] .se-assign-delegates-modal .MuiRadio-root,
.se-assign-delegates-modal .MuiRadio-root {
  color: var(--se-ink-3) !important;
}

html[data-se-theme] .se-assign-delegates-modal .MuiRadio-root.Mui-checked,
.se-assign-delegates-modal .MuiRadio-root.Mui-checked {
  color: var(--se-brand) !important;
}

html[data-se-theme] .se-assign-delegates-modal .MuiFormControlLabel-label,
.se-assign-delegates-modal .MuiFormControlLabel-label {
  color: var(--se-ink) !important;
  font-size: 13px !important;
  font-family: var(--se-sans) !important;
}

html[data-se-theme] .se-assign-delegates-modal .submit-button.button-primary,
html[data-se-theme] .se-assign-delegates-modal button.button-primary.blue,
.se-assign-delegates-modal .submit-button.button-primary {
  height: 32px !important;
  padding: 0 16px !important;
  border-radius: var(--se-r) !important;
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  text-transform: none !important;
}

html[data-se-theme] .se-assign-delegates-modal .submit-button.button-primary:hover,
.se-assign-delegates-modal .submit-button.button-primary:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
}

html[data-se-theme] .se-assign-delegates-modal .custom_secondary,
.se-assign-delegates-modal .custom_secondary {
  height: 32px !important;
  padding: 0 16px !important;
  border-radius: var(--se-r) !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
}

/* --------------------------------------------------------------------------
   Delete Delegate — centered confirm (Access Request + UAR Delegation)
   -------------------------------------------------------------------------- */

html[data-se-theme] .se-delete-delegate-modal .modal-dialog,
html[data-se-theme] .modal-dialog.se-delete-delegate-modal-dialog,
.se-delete-delegate-modal .modal-dialog,
.modal-dialog.se-delete-delegate-modal-dialog {
  max-width: 480px;
  width: calc(100% - 32px);
  margin: 48px auto 24px !important;
}

html[data-se-theme] .se-delete-delegate-modal .modal-content,
html[data-se-theme] .se-delete-delegate-modal-dialog .modal-content,
.se-delete-delegate-modal .modal-content {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-modal) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .se-delete-delegate-modal .modal-title,
.se-delete-delegate-modal .modal-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .se-delete-delegate-modal .modal-body,
.se-delete-delegate-modal .modal-body {
  padding: 16px 20px 8px !important;
}

html[data-se-theme] .se-delete-delegate-modal .assignDelegateInfo,
.se-delete-delegate-modal .assignDelegateInfo {
  font-family: var(--se-sans) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--se-ink) !important;
  line-height: 1.5 !important;
  margin: 0 0 12px !important;
}

html[data-se-theme] .se-delete-delegate-modal .assignDelegateInfo b,
.se-delete-delegate-modal .assignDelegateInfo b {
  font-weight: 700 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .se-delete-delegate-modal .fa-exclamation-triangle,
.se-delete-delegate-modal .fa-exclamation-triangle {
  color: var(--se-risk) !important;
  margin-right: 6px !important;
}

html[data-se-theme] .se-delete-delegate-modal .checkbox,
.se-delete-delegate-modal .checkbox {
  margin: 4px 0 8px !important;
}

html[data-se-theme] .se-delete-delegate-modal .checkbox label,
.se-delete-delegate-modal .checkbox label {
  display: flex !important;
  align-items: center;
  gap: 8px;
  font-size: 14px !important;
  color: var(--se-ink) !important;
  font-weight: 400 !important;
}

html[data-se-theme] .se-delete-delegate-modal .checkbox input[type="checkbox"],
.se-delete-delegate-modal .checkbox input[type="checkbox"] {
  accent-color: var(--se-brand) !important;
  width: 16px;
  height: 16px;
  margin: 0 !important;
}

html[data-se-theme] .se-delete-delegate-modal .modal-footer .custom__pg,
html[data-se-theme] .se-delete-delegate-modal .modal-footer .se_btn_new,
html[data-se-theme] .se-delete-delegate-modal .modal-footer .btn-primary,
.se-delete-delegate-modal .modal-footer .custom__pg,
.se-delete-delegate-modal .modal-footer .btn-primary {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  height: 32px !important;
}

html[data-se-theme] .se-delete-delegate-modal .modal-footer .custom__pg:disabled,
.se-delete-delegate-modal .modal-footer .custom__pg:disabled,
.se-delete-delegate-modal .modal-footer .btn-primary:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.tooltip.top .tooltip-arrow {
  border-top-color: var(--se-ink) !important;
}

/* Reset inner inputs within React-Select / CreatableSelect inside modals */
html[data-se-theme] .modal-body [class*="-Input"] input,
html[data-se-theme] .modal-body [class*="-input"] input,
html[data-se-theme] .modal-body .Select-input input,
html[data-se-theme] .MuiDialogContent-root [class*="-Input"] input,
.securends .modal-body [class*="-Input"] input,
.modal.right [class*="-Input"] input,
#employeeTypeBox input {
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Template Details right drawer — Access Analysis / shared AccessTemplateInfoDetails */
html[data-se-theme] .se-template-details-modal .modal-content,
.securends .se-template-details-modal .modal-content,
.se-template-details-modal .modal-content {
  background: var(--se-card) !important;
  border-radius: var(--se-r-modal) 0 0 var(--se-r-modal) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .se-template-details-modal .modal-header,
.securends .se-template-details-modal .modal-header,
.se-template-details-modal .modal-header {
  background: var(--se-card) !important;
  border-bottom: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .se-template-details-modal .modal-title,
.se-template-details-modal .modal-title {
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-weight: 600 !important;
  font-size: 16px !important;
}

html[data-se-theme] .se-template-details-modal .modal-body,
.se-template-details-modal .modal-body {
  background: var(--se-page, var(--se-card)) !important;
  color: var(--se-ink) !important;
}

/* Portaled drawer: ensure dark tokens resolve (body may sit outside .securends) */
html[data-se-mode="dark"] .se-template-details-modal,
html[data-theme="dark"] .se-template-details-modal,
html.dark .se-template-details-modal {
  --se-page: var(--bg-app, #0b1220);
  --se-card: var(--bg-surface, #111827);
  --se-raise: var(--bg-surface-secondary, #151e2e);
  --se-ink: var(--text-primary, #e5e7eb);
  --se-ink-2: var(--text-secondary, #a7b0c0);
  --se-ink-3: var(--text-muted, #6f7b8f);
  --se-line: var(--border-default, #263348);
  --se-line-soft: var(--bg-surface-secondary, #151e2e);
  --se-brand: #dbeafe;
  --se-brand-line: color-mix(in srgb, #dbeafe 36%, #111827);
  --bs-card-cap-bg: transparent;
  --bs-card-bg: var(--se-card);
}

html[data-se-mode="dark"] .se-template-details-modal .modal-content,
html[data-se-mode="dark"] .se-template-details-modal .modal-header,
html[data-se-mode="dark"] .se-template-details-modal .modal-body {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border-color: var(--se-line) !important;
}

html[data-se-mode="dark"] .se-template-details-modal .modal-body {
  background: var(--se-page) !important;
}

.modal-body .checkbox label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding-left: 0 !important;
  min-height: 0 !important;
  cursor: pointer;
  font-size: 13.5px;
  color: var(--se-ink);
  line-height: 1.4;
  white-space: normal;
}

html[data-se-theme] .modal-body .checkbox label input[type="checkbox"],
.securends .modal-body .checkbox label input[type="checkbox"],
.modal-body .checkbox label input[type="checkbox"] {
  position: static !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  width: 14px !important;
  height: 14px !important;
  cursor: pointer;
  accent-color: var(--se-brand);
}

html[data-se-theme] .modal-body .checkbox,
.securends .modal-body .checkbox,
.modal-body .checkbox {
  margin-top: 12px !important;
  margin-bottom: 4px !important;
}

/* Footer disabled Yes button (Delete confirm) */
html[data-se-theme] .modal-footer button:disabled,
.securends .modal-footer button:disabled,
.modal-footer button:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}

/* --------------------------------------------------------------------------
   Revoke Immediately confirm (Direct / Entitlement / Review All Elections)
   Portals to body — style html[data-se-theme] + bare class. Keep show/onHide
   / #revokeImmediatelyConfirm / handleCancelRevokeImmediately / confirmRevokeImmediately.
   -------------------------------------------------------------------------- */

html[data-se-theme] .revoke-immediately-modal .modal-dialog,
.revoke-immediately-modal .modal-dialog {
  max-width: 520px !important;
  width: calc(100% - 32px) !important;
  margin: 48px auto 24px !important;
}

html[data-se-theme] .revoke-immediately-modal .modal-content,
.revoke-immediately-modal .modal-content {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-modal) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .revoke-immediately-modal .modal-header,
.revoke-immediately-modal .modal-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 14px 20px !important;
  min-height: 52px !important;
  background: var(--se-card) !important;
  border-bottom: 1px solid var(--se-line) !important;
}

html[data-se-theme] .revoke-immediately-modal .modal-header .close,
html[data-se-theme] .revoke-immediately-modal .modal-header button.close,
.revoke-immediately-modal .modal-header .close {
  order: 2;
  margin-left: auto !important;
}

html[data-se-theme] .revoke-immediately-modal .modal-title,
.revoke-immediately-modal .modal-title {
  font-family: var(--se-sans) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: var(--se-ink) !important;
  margin: 0 !important;
}

html[data-se-theme] .revoke-immediately-modal .modal-body,
.revoke-immediately-modal .modal-body {
  padding: 20px 24px 8px !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
}

html[data-se-theme] .revoke-immediately-warning,
.revoke-immediately-warning {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  color: var(--se-risk) !important;
  margin: 0 0 8px !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
}

html[data-se-theme] .revoke-immediately-warning strong,
.revoke-immediately-warning strong {
  color: var(--se-risk) !important;
  font-weight: 600 !important;
  font-family: var(--se-sans) !important;
}

html[data-se-theme] .revoke-warning-icon,
.revoke-warning-icon {
  flex: 0 0 20px !important;
  width: 20px !important;
  height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--se-risk) !important;
  font-size: 16px !important;
  line-height: 1 !important;
  margin-top: 1px !important;
}

html[data-se-theme] .revoke-immediately-description,
.revoke-immediately-description {
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  color: var(--se-ink-2) !important;
  margin: 0 0 14px 30px !important;
}

html[data-se-theme] .revoke-immediately-danger,
.revoke-immediately-danger {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  margin: 0 0 18px !important;
  background: var(--se-warn-tint) !important;
  border: 1px solid color-mix(in srgb, var(--se-warn) 35%, var(--se-line)) !important;
  border-radius: var(--se-r) !important;
  color: var(--se-warn) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
}

html[data-se-theme] .revoke-immediately-danger span,
.revoke-immediately-danger span {
  color: var(--se-warn) !important;
}

html[data-se-theme] .revoke-immediately-danger-icon,
html[data-se-theme] .revoke-immediately-danger > span:first-of-type,
.revoke-immediately-danger-icon,
.revoke-immediately-danger > span:first-of-type {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  background: var(--se-warn) !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

html[data-se-theme] .revoke-immediately-danger-icon i,
html[data-se-theme] .revoke-immediately-danger > span:first-of-type i,
.revoke-immediately-danger-icon i,
.revoke-immediately-danger > span:first-of-type i {
  color: #fff !important;
  font-size: 10px !important;
  line-height: 1 !important;
}

html[data-se-theme] .revoke-immediately-danger > span:last-of-type,
.revoke-immediately-danger > span:last-of-type {
  display: inline !important;
  margin: 0 !important;
  background: transparent !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  border-radius: 0 !important;
  color: var(--se-warn) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

html[data-se-theme] .revoke-election-details,
.revoke-election-details {
  margin: 0 0 16px !important;
}

html[data-se-theme] .revoke-election-details > b,
.revoke-election-details > b {
  display: block !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 0 0 10px !important;
}

html[data-se-theme] .revoke-detail-row,
.revoke-detail-row {
  display: grid !important;
  grid-template-columns: 128px 12px minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 4px !important;
  margin: 0 0 8px !important;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  font-family: var(--se-sans) !important;
}

html[data-se-theme] .revoke-detail-row > span:first-child,
.revoke-detail-row > span:first-child {
  color: var(--se-ink-2) !important;
  font-weight: 500 !important;
}

html[data-se-theme] .revoke-detail-row > span:nth-child(2),
.revoke-detail-row > span:nth-child(2) {
  color: var(--se-ink-3) !important;
  text-align: center !important;
}

html[data-se-theme] .revoke-detail-row > span:last-child,
.revoke-detail-row > span:last-child {
  color: var(--se-ink) !important;
  font-weight: 500 !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

html[data-se-theme] .revoke-justification-label,
.revoke-justification-label {
  margin: 4px 0 12px !important;
}

html[data-se-theme] .revoke-justification-label label,
.revoke-justification-label label {
  display: block !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 0 0 6px !important;
}

html[data-se-theme] .revoke-justification-label label span,
.revoke-justification-label label span {
  color: var(--se-risk) !important;
}

html[data-se-theme] .revoke-justification-label textarea,
.revoke-justification-label textarea {
  display: block !important;
  width: 100% !important;
  min-height: 88px !important;
  resize: vertical !important;
  padding: 10px 12px !important;
  box-sizing: border-box !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  color: var(--se-ink) !important;
  background: var(--bg-input, var(--se-card)) !important;
  background-color: var(--bg-input, var(--se-card)) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
}

html[data-se-theme] .revoke-justification-label textarea:focus,
.revoke-justification-label textarea:focus {
  outline: none !important;
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint) !important;
}

html[data-se-theme] .revoke-justification-label textarea::placeholder,
.revoke-justification-label textarea::placeholder {
  color: var(--se-ink-3) !important;
}

html[data-se-theme] .revoke-confirm-checkbox,
.revoke-confirm-checkbox {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin: 4px 0 12px !important;
}

html[data-se-theme] .revoke-confirm-checkbox input[type="checkbox"],
.revoke-confirm-checkbox input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  margin: 2px 0 0 !important;
  flex-shrink: 0 !important;
  accent-color: var(--se-brand);
  cursor: pointer;
}

html[data-se-theme] .revoke-confirm-checkbox label,
.revoke-confirm-checkbox label {
  margin: 0 !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  line-height: 1.4 !important;
  cursor: pointer;
}

html[data-se-theme] .revoke-immediately-modal .modal-footer,
.revoke-immediately-modal .modal-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  padding: 12px 20px !important;
  background: var(--se-page) !important;
  border-top: 1px solid var(--se-line) !important;
  border-radius: 0 0 var(--se-r-modal) var(--se-r-modal) !important;
}

html[data-se-theme] .revoke-immediately-modal .modal-footer .fa-spinner-icon,
html[data-se-theme] .revoke-immediately-modal .modal-footer .saveSpinner,
.revoke-immediately-modal .modal-footer .fa-spinner-icon,
.revoke-immediately-modal .modal-footer .saveSpinner {
  position: static !important;
  float: none !important;
  margin: 0 4px 0 0 !important;
  top: auto !important;
  right: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  color: var(--se-brand) !important;
}

html[data-se-theme] .revoke-cancel-button,
.revoke-cancel-button {
  height: 36px !important;
  min-width: 88px !important;
  padding: 0 16px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 34px !important;
  box-shadow: none !important;
  cursor: pointer;
}

html[data-se-theme] .revoke-cancel-button:hover,
.revoke-cancel-button:hover {
  background: var(--se-raise) !important;
  border-color: var(--se-brand-line) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .revoke-immediately-confirm-button,
.revoke-immediately-confirm-button {
  height: 36px !important;
  min-width: 88px !important;
  padding: 0 16px !important;
  border: none !important;
  border-radius: var(--se-r) !important;
  background: var(--se-brand) !important;
  color: #fff !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 36px !important;
  box-shadow: none !important;
  cursor: pointer;
}

html[data-se-theme] .revoke-immediately-confirm-button:hover:not(:disabled),
.revoke-immediately-confirm-button:hover:not(:disabled) {
  background: var(--se-brand-hover) !important;
  color: #fff !important;
}

html[data-se-theme] .revoke-immediately-confirm-button:disabled,
.revoke-immediately-confirm-button:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}

/* --------------------------------------------------------------------------
   Close Campaign review summary + info/warning cards
   Drawer stay .modal.right. Beat pickels-v4 hex on summary/banners only.
   -------------------------------------------------------------------------- */

html[data-se-theme] .se-close-campaign-incomplete,
.se-close-campaign-incomplete {
  display: block !important;
  margin: 0 0 10px !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .se-close-campaign-confirm,
.se-close-campaign-confirm {
  margin: 0 0 4px !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: var(--se-ink-2) !important;
}

html[data-se-theme] .se-close-campaign-confirm b,
.se-close-campaign-confirm b {
  color: var(--se-ink) !important;
  font-weight: 600 !important;
}

html[data-se-theme] .review-summary,
.review-summary {
  margin-top: 18px !important;
}

html[data-se-theme] .se-close-campaign-summary-title,
.review-summary > b,
.se-close-campaign-summary-title {
  display: block !important;
  margin: 0 0 8px !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .review-summary-container,
.review-summary-container {
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  padding: 0 16px !important;
  margin-top: 8px !important;
  background: var(--se-card) !important;
}

html[data-se-theme] .review-summary-row,
.review-summary-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 44px !important;
  border-bottom: 1px solid var(--se-line) !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .review-summary-row:last-child,
.review-summary-row:last-child {
  border-bottom: none !important;
}

html[data-se-theme] .review-summary-label,
.review-summary-label {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .review-summary-row > b,
.review-summary-row > b {
  font-family: var(--se-sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .review-icon,
.review-icon {
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
}

html[data-se-theme] .review-icon svg,
.review-icon svg {
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
}

html[data-se-theme] .approved-icon,
.approved-icon {
  background: var(--se-chart-approved, var(--se-ok)) !important;
}

html[data-se-theme] .revoke-icon,
.revoke-icon {
  background: var(--se-chart-revoked, var(--se-risk)) !important;
}

html[data-se-theme] .revoke-immediately-icon,
.revoke-immediately-icon {
  background: var(--se-metric-6) !important;
}

html[data-se-theme] .pending-icon,
.pending-icon {
  background: var(--se-chart-pending, var(--se-warn)) !important;
}

html[data-se-theme] .close-campaign-info,
html[data-se-theme] .close-campaign-warning,
.close-campaign-info,
.close-campaign-warning {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-top: 14px !important;
  padding: 10px 12px !important;
  border-radius: var(--se-r) !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.45 !important;
}

html[data-se-theme] .close-campaign-info,
.close-campaign-info {
  background: color-mix(in srgb, var(--se-info) 12%, var(--se-card)) !important;
  border: 1px solid color-mix(in srgb, var(--se-info) 32%, var(--se-line)) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .close-campaign-warning,
.close-campaign-warning {
  background: var(--se-warn-tint) !important;
  border: 1px solid color-mix(in srgb, var(--se-warn) 35%, var(--se-line)) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .close-campaign-info-icon,
html[data-se-theme] .warning-icon,
.close-campaign-info-icon,
.warning-icon {
  min-width: 18px !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  margin-top: 1px !important;
}

html[data-se-theme] .close-campaign-info-icon,
.close-campaign-info-icon {
  background: var(--se-info) !important;
}

html[data-se-theme] .warning-icon,
.warning-icon {
  background: var(--se-warn) !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu,
html[data-se-theme] .modal ul.multiselect-container.dropdown-menu,
html[data-se-theme] .selectedCampaign ul.multiselect-container.dropdown-menu,
.securends ul.multiselect-container.dropdown-menu,
.multiselect-container.dropdown-menu {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: var(--se-shadow-lg) !important;
  padding: 0 0 8px !important;
  max-height: min(320px, 50vh);
  overflow-x: auto !important;
  overflow-y: auto !important;
  z-index: calc(var(--se-z-modal) + 5) !important;
}

/* --------------------------------------------------------------------------
   9-dots Products menu (.products-menu-modal / .product-menu)
   Theme tokens for light + dark. Beat pickels #091432 / #0078d4.
   -------------------------------------------------------------------------- */

html[data-se-theme] .modal:has(.products-menu-modal) .products-menu-modal .modal-content,
html[data-se-theme] .products-menu-modal .modal-content,
.products-menu-modal .modal-content {
  background: var(--se-card) !important;
  background-color: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  box-shadow: var(--se-shadow-lg) !important;
}

html[data-se-theme] .products-menu-modal .products-menu-header,
html[data-se-theme] .products-menu-modal .modelheader.products-menu-header,
html[data-se-theme] .products-menu-modal .modal-header.products-menu-header,
.products-menu-modal .products-menu-header,
.products-menu-modal .modelheader.products-menu-header {
  background: var(--se-card) !important;
  background-color: var(--se-card) !important;
  border-bottom: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .products-menu-modal .modal-body,
.products-menu-modal .modal-body {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  padding: 16px 18px 56px !important;
}

html[data-se-theme] .product-menu,
.product-menu {
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
}

html[data-se-theme] .product-menu h5,
.product-menu h5 {
  color: var(--se-ink-2) !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0 0 12px !important;
}

html[data-se-theme] .product-menu ul,
.product-menu ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

html[data-se-theme] .product-menu ul li,
.product-menu ul li {
  font-size: 13px !important;
  padding: 0 0 8px !important;
  margin: 0 !important;
}

html[data-se-theme] .product-menu ul li a,
.product-menu ul li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid transparent !important;
  text-decoration: none !important;
  color: var(--se-ink) !important;
  cursor: pointer;
  transition: background var(--se-ease), border-color var(--se-ease), box-shadow var(--se-ease);
}

html[data-se-theme] .product-menu ul li a:hover,
html[data-se-theme] .product-menu ul li a:focus,
.product-menu ul li a:hover,
.product-menu ul li a:focus {
  background: var(--se-page) !important;
  border-color: var(--se-line) !important;
  box-shadow: none !important;
  color: var(--se-ink) !important;
  outline: none;
}

html[data-se-theme] .product-menu .prod-img,
.product-menu .prod-img {
  flex: 0 0 36px;
  width: 36px;
  height: 36px;
  margin-right: 0 !important;
  border-radius: var(--se-r);
  background: var(--se-brand-tint);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

html[data-se-theme] .product-menu .prod-img img,
.product-menu .prod-img img {
  width: 22px !important;
  height: 22px !important;
  object-fit: contain;
  display: block;
}

html[data-se-theme] .product-menu .prod-title,
.product-menu .prod-title {
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  flex: 1 1 auto;
  min-width: 0;
}

html[data-se-theme] .product-menu hr,
.product-menu hr {
  border: 0 !important;
  border-top: 1px solid var(--se-line) !important;
  margin: 16px 0 !important;
  opacity: 1 !important;
  background: transparent !important;
}

html[data-se-theme] .products-menu-modal .appVersion,
html[data-se-theme] .products-menu-modal .appVersion-sidebar,
html[data-se-theme] .product-menu .appVersion,
html[data-se-theme] .product-menu .appVersion-sidebar,
.products-menu-modal .appVersion,
.products-menu-modal .appVersion-sidebar,
.product-menu .appVersion,
.product-menu .appVersion-sidebar {
  color: var(--se-ink-3) !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-style: normal !important;
}

html[data-se-theme] .products-menu-modal .appVersion-sidebar a,
html[data-se-theme] .product-menu .appVersion-sidebar a,
.products-menu-modal .appVersion-sidebar a,
.product-menu .appVersion-sidebar a {
  color: var(--se-brand) !important;
}

html[data-se-theme] .modal-backdrop.left-backdrop,
.modal-backdrop.left-backdrop {
  background-color: var(--se-navy) !important;
}

/* Keep the checkbox inside the item box: 10px from the left border,
   level with the first line of the email. */
html[data-se-theme] .bulk-launch-modal .se-bulk-reviewer-grid > .reviewerList,
html[data-se-theme] .bulk-launch-modal .se-bulk-reviewer-grid > .msgReviewerList,
.bulk-launch-modal .se-bulk-reviewer-grid > .reviewerList,
.bulk-launch-modal .se-bulk-reviewer-grid > .msgReviewerList {
  padding-left: 36px !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-reviewer-grid .custom-control-label,
.bulk-launch-modal .se-bulk-reviewer-grid .custom-control-label {
  position: relative !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-reviewer-grid .custom-control-label::before,
html[data-se-theme] .bulk-launch-modal .se-bulk-reviewer-grid .custom-control-label::after,
.bulk-launch-modal .se-bulk-reviewer-grid .custom-control-label::before,
.bulk-launch-modal .se-bulk-reviewer-grid .custom-control-label::after {
  left: -26px !important;
  top: 1px !important;
  transform: none !important;
  margin: 0 !important;
  width: 16px !important;
  height: 16px !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .bulk-launch-modal .se-bulk-reviewer-grid .custom-control-input,
.bulk-launch-modal .se-bulk-reviewer-grid .custom-control-input {
  left: 10px !important;
  top: 9px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}
/* SOR child screens (Add / Update) plus shared 3-dots destinations
   (audit trail, schedule export, sync status, CSV load).
   Same components also serve Applications — presentation only. */

/* --------------------------------------------------------------------------
   System of Record list toolbar — match Applications (#epTable) header
   Note: do NOT use .topLevelRecords on the title bar — kit strips its padding.
   -------------------------------------------------------------------------- */

.securends .se-sor-page > .row.manageApp,
.securends #epTable.se-sor-page > .row.manageApp {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 16px 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

html[data-se-theme] .securends .se-sor-page > .row.manageApp > h2.o-form-title-bar,
.securends .se-sor-page > .row.manageApp > h2.o-form-title-bar,
.securends #epTable.se-sor-page > .row.manageApp > h2.o-form-title-bar {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card, 14px) !important;
  box-shadow: var(--se-shadow) !important;
  padding: 10px 20px !important;
  margin: 0 0 16px !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  min-height: var(--se-page-toolbar, 56px) !important;
  height: auto !important;
  line-height: normal !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
  overflow: visible !important;
  font-family: var(--se-sans) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .securends .se-sor-page .o-form-title-bar > button.custom__pg.AddAppBtn,
html[data-se-theme] .securends .se-sor-page .o-form-title-bar > button.AddAppBtn,
.securends .se-sor-page .o-form-title-bar > button.custom__pg.AddAppBtn,
.securends .se-sor-page .o-form-title-bar > button.AddAppBtn.addButtonData,
.securends #epTable.se-sor-page .o-form-title-bar > button.custom__pg.AddAppBtn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 12px !important;
  margin: 0 !important;
  background: var(--se-brand) !important;
  background-color: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 26px !important;
  box-shadow: none !important;
  text-transform: none !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  float: none !important;
  position: static !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .securends .se-sor-page .o-form-title-bar > button.custom__pg.AddAppBtn:hover,
.securends .se-sor-page .o-form-title-bar > button.AddAppBtn:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #fff !important;
}

html[data-se-theme] .securends .se-sor-page .o-form-title-bar > .Sort_By_Data,
.securends .se-sor-page .o-form-title-bar > .Sort_By_Data {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  float: none !important;
  height: auto !important;
  line-height: 28px !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

html[data-se-theme] .securends .se-sor-page .o-form-title-bar > .Sort_By_Data select,
.securends .se-sor-page .o-form-title-bar > .Sort_By_Data select {
  height: 28px !important;
  min-height: 28px !important;
  min-width: 96px !important;
  padding: 0 24px 0 8px !important;
  margin: 0 !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background-color: var(--se-card) !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 7px !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  line-height: 26px !important;
}

html[data-se-theme] .securends .se-sor-page .o-form-title-bar > .se-toolbar-actions.se-ep-toolbar-end,
.securends .se-sor-page .o-form-title-bar > .se-toolbar-actions.se-ep-toolbar-end,
.securends #epTable.se-sor-page .se-ep-toolbar-end {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  flex-shrink: 0 !important;
  position: static !important;
  float: none !important;
}

html[data-se-theme] .securends .se-sor-page .se-ep-toolbar-end .iam_add_Export,
.securends .se-sor-page .se-ep-toolbar-end .iam_add_Export,
.securends #epTable.se-sor-page .se-ep-toolbar-end .iam_add_Export {
  position: static !important;
  right: auto !important;
  top: auto !important;
  margin: 0 !important;
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r) !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 26px !important;
  box-shadow: none !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

html[data-se-theme] .securends .se-sor-page .se-ep-toolbar-end .iam_add_Export:hover,
.securends .se-sor-page .se-ep-toolbar-end .iam_add_Export:hover {
  background: var(--se-page) !important;
  border-color: var(--se-line-soft, #CBD5E1) !important;
  color: var(--se-ink) !important;
}

.securends .se-sor-page .se-sor-toolbar-spinner {
  position: static !important;
  margin: 0 !important;
  top: auto !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* --------------------------------------------------------------------------
   Detail pages: kill pickels sticky 1272px header wrappers
   -------------------------------------------------------------------------- */

.securends .se-detail-page [style*="1272px"] {
  width: 100% !important;
  max-width: 100% !important;
  position: static !important;
  top: auto !important;
  z-index: auto !important;
}

.securends .se-detail-page .row1,
.securends .se-detail-page>.row {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.securends .se-detail-meta,
.securends .se-detail-page .CampaignTable>div:first-child,
.securends .se-detail-page .container1>p {
  margin: 0 0 12px !important;
  font-size: 13px !important;
  color: var(--se-ink-2) !important;
}

.securends .se-detail-page .CampaignTable>div:first-child b,
.securends .se-detail-page .container1>p b {
  color: var(--se-ink);
  font-weight: 600;
}

/* --------------------------------------------------------------------------
   Add / Update SOR — Clean 2-Column Grid Alignment & Presentation
   -------------------------------------------------------------------------- */

.securends .se-sor-create-page .se-create-app-head,
.securends .se-sor-update-page .se-create-app-head {
  display: block !important;
  margin-bottom: 16px !important;
  width: 100% !important;
  max-width: 100% !important;
}

.securends .se-sor-create-page .manageApp,
.securends .se-sor-update-page .manageApp {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
  width: 100% !important;
}

.securends .se-sor-create-page .se-create-app-head .manageApp .o-form-title-bar,
.securends .se-sor-create-page .se-create-app-head .o-form-title-bar,
.securends .se-sor-create-page .manageApp .o-form-title-bar,
.securends .se-sor-create-page .o-form-title-bar,
.securends .se-sor-update-page .se-create-app-head .manageApp .o-form-title-bar,
.securends .se-sor-update-page .se-create-app-head .o-form-title-bar,
.securends .se-sor-update-page .manageApp .o-form-title-bar,
.securends .se-sor-update-page .o-form-title-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: var(--se-page-toolbar, 52px) !important;
  padding: 12px 20px !important;
  margin: 0 !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow) !important;
  box-sizing: border-box !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  line-height: 1.3 !important;
}

.securends .se-sor-create-page .se-create-app-head .o-form-title-bar .iam_add_Export,
.securends .se-sor-create-page .manageApp .o-form-title-bar .iam_add_Export,
.securends .se-sor-create-page .o-form-title-bar .iam_add_Export,
.securends .se-sor-update-page .se-create-app-head .o-form-title-bar .iam_add_Export,
.securends .se-sor-update-page .manageApp .o-form-title-bar .iam_add_Export,
.securends .se-sor-update-page .o-form-title-bar .iam_add_Export,
.securends .se-sor-create-page .iam_add_Export,
.securends .se-sor-update-page .iam_add_Export {
  margin-left: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-right: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 32px !important;
  min-height: 32px !important;
  min-width: 72px !important;
  padding: 0 16px !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  border-radius: var(--se-r-sm, 8px) !important;
  border: 1px solid var(--se-brand) !important;
  background: var(--se-brand) !important;
  background-color: var(--se-brand) !important;
  color: #ffffff !important;
  box-shadow: none !important;
  text-decoration: none !important;
  text-transform: none !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  float: right !important;
  box-sizing: border-box !important;
  transition: all var(--se-speed-fast, 150ms) ease !important;
}

.securends .se-sor-create-page .o-form-title-bar .iam_add_Export:hover,
.securends .se-sor-update-page .o-form-title-bar .iam_add_Export:hover,
.securends .se-sor-create-page .iam_add_Export:hover,
.securends .se-sor-update-page .iam_add_Export:hover {
  background: var(--se-brand-hover) !important;
  background-color: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #ffffff !important;
}

.securends .se-sor-create-page .headerInfo,
.securends .se-sor-create-page .se-create-app-head>p {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
  color: var(--se-ink-2) !important;
  font-size: 13.5px !important;
  max-width: 720px;
  line-height: 1.5;
}

/* 1. Cards styling in SOR create/update flows */
.securends .se-sor-create-page .card.sor-header,
.securends .se-sor-update-page .card.sor-header {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow) !important;
  margin: 0 0 16px !important;
  overflow: visible !important;
}

.securends .se-sor-create-page .card.sor-header>.card-header,
.securends .se-sor-update-page .card.sor-header>.card-header {
  background: transparent !important;
  border-bottom: 1px solid var(--se-line) !important;
  padding: 14px 20px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

.securends .se-sor-create-page .card.sor-header>.card-body,
.securends .se-sor-update-page .card.sor-header>.card-body,
.securends .se-sor-create-page .card.sor-header>[class=""],
.securends .se-sor-update-page .card.sor-header>[class=""] {
  padding: 16px 20px !important;
}

/* 2. Data Ingestion Card — 2-column grid alignment matching all cards below */
.securends .se-sor-create-page .row:has(.uar-radio-dataInfo),
.securends .se-sor-update-page .row:has(.uar-radio) {
  display: grid !important;
  grid-template-columns: 210px minmax(0, 1fr) !important;
  gap: 20px !important;
  align-items: center !important;
  margin: 0 0 16px !important;
  padding: 16px 20px !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow) !important;
  box-sizing: border-box !important;
}

.securends .se-sor-create-page .row:has(.uar-radio-dataInfo)>[class*="col-"],
.securends .se-sor-update-page .row:has(.uar-radio)>[class*="col-"] {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

.securends .se-sor-create-page .row:has(.uar-radio-dataInfo) .settingsTitle,
.securends .se-sor-update-page .row:has(.uar-radio) .settingsTitle {
  padding-left: 0 !important;
  margin: 0 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.securends .se-sor-create-page .uar-radio-dataInfo,
.securends .se-sor-update-page .uar-radio {
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
}

html[data-se-mode="dark"] .securends .se-sor-update-page .uar-radio .MuiFormControlLabel-label,
html[data-se-mode="dark"] .securends .se-sor-update-page .uar-radio .MuiFormControlLabel-label.Mui-disabled,
html[data-se-mode="dark"] .securends .se-sor-update-page .uar-radio .MuiTypography-root,
html[data-se-mode="dark"] .securends .se-sor-update-page .uar-radio .MuiTypography-root.Mui-disabled,
html[data-theme="dark"] .securends .se-sor-update-page .uar-radio .MuiFormControlLabel-label,
html[data-theme="dark"] .securends .se-sor-update-page .uar-radio .MuiFormControlLabel-label.Mui-disabled,
html.dark .securends .se-sor-update-page .uar-radio .MuiFormControlLabel-label,
html.dark .securends .se-sor-update-page .uar-radio .MuiFormControlLabel-label.Mui-disabled,
.securends .se-sor-update-page .uar-radio .MuiFormControlLabel-label.Mui-disabled,
.securends .se-sor-update-page .uar-radio .MuiTypography-root.Mui-disabled {
  color: var(--se-ink, #e5e7eb) !important;
  -webkit-text-fill-color: var(--se-ink, #e5e7eb) !important;
  opacity: 0.9 !important;
}

html[data-se-theme] .securends p.labelShortDesc,
.securends p.labelShortDesc,
p.labelShortDesc,
.labelShortDesc {
  font-size: 12.5px !important;
  font-weight: 400 !important;
  font-style: italic !important;
  color: var(--se-ink-2, #5f6d7e) !important;
  white-space: nowrap !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 4px 0 12px 0 !important;
}


/* 3. The 2-Column Grid for Setup Application & Notifications */
/* Reset any wrapper .row that contains .col-md-12 or an inner .row.
   Exclude Filter Options rows (#customRolesFilterType): they use a trailing
   col-md-12 for validation and must stay display:flex for Filter Type | field pairs. */
.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#customRolesFilterType)):not(.se-azure-config-row):has(> .col-md-12),
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#customRolesFilterType)):not(.se-azure-config-row):has(> .col-md-12),
.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#customRolesFilterType)):not(.se-azure-config-row):has(> .row),
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#customRolesFilterType)):not(.se-azure-config-row):has(> .row) {
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: none !important;
  width: 100% !important;
  float: none !important;
}

/* Apply 2-column grid to all form field rows in Setup Application and Notifications */
.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)) > .col-md-12:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *),
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)) > .col-md-12:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *),
.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)) > .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(:has(.settingsTitle)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)),
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.settingsTitle)):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)) > .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(:has(.settingsTitle)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)),
.securends .se-sor-create-page .endpointConfigCard .row:has(.settingsTitleName):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(> .col-md-12)):not(:has(> .row)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)),
.securends .se-sor-update-page .endpointConfigCard .row:has(.settingsTitleName):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(> .col-md-12)):not(:has(> .row)):not(:has(> .col-md-5 + .col-md-5)):not(:has(> .col-md-6 + .col-md-6)) {
  display: grid !important;
  grid-template-columns: 210px minmax(0, 1fr) !important;
  gap: 20px !important;
  padding: 13px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--se-line-soft) !important;
  align-items: center !important;
  width: 100% !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Wrapper .col-md-12 around Application Name (SettingsTabModal) must be full
   width so the inner 210px | 1fr grid can size the input. */
.securends .se-sor-create-page .endpointConfigCard .row > .col-md-12:first-child,
.securends .se-sor-update-page .endpointConfigCard .row > .col-md-12:first-child {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  float: none !important;
  box-sizing: border-box !important;
}

.securends .se-sor-create-page .endpointConfigCard .o-form-input form,
.securends .se-sor-update-page .endpointConfigCard .o-form-input form,
.securends .se-sor-create-page .endpointConfigCard .o-form-input .form-group,
.securends .se-sor-update-page .endpointConfigCard .o-form-input .form-group {
  width: 100% !important;
  max-width: 420px !important;
  margin: 0 !important;
}

.securends .se-sor-create-page .endpointConfigCard .o-form-input .form-label:empty,
.securends .se-sor-update-page .endpointConfigCard .o-form-input .form-label:empty,
.securends .se-sor-create-page .endpointConfigCard .o-form-input .form-group > span:has(> .form-label:empty),
.securends .se-sor-update-page .endpointConfigCard .o-form-input .form-group > span:has(> .form-label:empty) {
  display: none !important;
}

.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):last-child > .col-md-12,
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):last-child > .col-md-12,
.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):last-child > .row,
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):last-child > .row,
.securends .se-sor-create-page .endpointConfigCard .row:has(.settingsTitleName):not(.data-import-schedule-row):not(.data-import-schedule-row *):last-child,
.securends .se-sor-update-page .endpointConfigCard .row:has(.settingsTitleName):not(.data-import-schedule-row):not(.data-import-schedule-row *):last-child {
  border-bottom: none !important;
}

/* 4. Reset column widths, margins, floats, paddings inside the grid rows (strictly excluding configurations & flexfolder & data import schedule) */
.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)):not(:has(a[download*="Sample_File_CSV"])) > .col-md-12:not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)):not(:has(a[download*="Sample_File_CSV"])) > [class*="col-md-"]:not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper *):not(#flexFolderFilePath *):not([class*="test"]):not(:has(.newform_lab1)),
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)):not(:has(a[download*="Sample_File_CSV"])) > .col-md-12:not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)):not(:has(a[download*="Sample_File_CSV"])) > [class*="col-md-"]:not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper *):not(#flexFolderFilePath *):not([class*="test"]):not(:has(.newform_lab1)),
.securends .se-sor-create-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)):not(:has(a[download*="Sample_File_CSV"])) > .row:not(.attributes-flex-conn-wrapper):not(.attributes-conn-wrapper):not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)) > [class*="col-md-"]:not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper *):not(#flexFolderFilePath *):not([class*="test"]):not(:has(.newform_lab1)),
.securends .se-sor-update-page .endpointConfigCard .row:not(.attributes-flex-conn-wrapper):not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper):not(.attributes-conn-wrapper *):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(.attributes-flex-conn-wrapper)):not(:has(.attributes-conn-wrapper)):not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)):not(:has(a[download*="Sample_File_CSV"])) > .row:not(.attributes-flex-conn-wrapper):not(.attributes-conn-wrapper):not(:has(#flexFolderFilePath)):not(:has(.newform_lab1)) > [class*="col-md-"]:not(.attributes-flex-conn-wrapper *):not(.attributes-conn-wrapper *):not(#flexFolderFilePath *):not([class*="test"]):not(:has(.newform_lab1)),
.securends .se-sor-create-page .endpointConfigCard .row:has(.settingsTitleName):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(> .col-md-12)):not(:has(> .row)) > [class*="col-md-"],
.securends .se-sor-update-page .endpointConfigCard .row:has(.settingsTitleName):not(.data-import-schedule-row):not(.data-import-schedule-row *):not(:has(> .col-md-12)):not(:has(> .row)) > [class*="col-md-"] {
  width: auto !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  float: none !important;
  padding: 0 !important;
}

.securends .se-sor-create-page .endpointConfigCard .row:has(.settingsTitleName) .form-group,
.securends .se-sor-update-page .endpointConfigCard .row:has(.settingsTitleName) .form-group {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}

/* 5. Clean Title / Label Styling */
.securends .se-sor-create-page .settingsTitleName,
.securends .se-sor-update-page .settingsTitleName,
.securends .se-sor-create-page .settingsTitle,
.securends .se-sor-update-page .settingsTitle {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--se-ink) !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  line-height: 1.4 !important;
  white-space: normal !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.securends .se-sor-create-page .settingsTitleName i,
.securends .se-sor-update-page .settingsTitleName i,
.securends .se-sor-create-page .settingsTitle i,
.securends .se-sor-update-page .settingsTitle i {
  color: var(--se-ink-3) !important;
  font-size: 14px !important;
}

/* Notifications: ensure labels stay on a single line and radios align horizontally */
.securends .se-sor-create-page .card.sor-header:has(#entitlement-tooltip) .endpointConfigCard .row,
.securends .se-sor-update-page .card.sor-header:has(#entitlement-tooltip) .endpointConfigCard .row,
.securends .se-sor-create-page .card.sor-header:has(#entitlement-tooltip-completed) .endpointConfigCard .row,
.securends .se-sor-update-page .card.sor-header:has(#entitlement-tooltip-completed) .endpointConfigCard .row {
  grid-template-columns: 260px minmax(0, 1fr) !important;
  align-items: center !important;
}

.securends .se-sor-create-page .settingsTitleName.radioTitle,
.securends .se-sor-update-page .settingsTitleName.radioTitle,
.securends .se-sor-create-page .radioTitle,
.securends .se-sor-update-page .radioTitle {
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: normal !important;
}

/* 6. Form Controls Standardized (max-width: 420px, clean rounded borders) */
.securends .se-sor-create-page input.form-control,
.securends .se-sor-update-page input.form-control {
  max-width: 420px !important;
  width: 100% !important;
  min-height: 38px !important;
  height: 38px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  padding: 6px 12px !important;
  box-sizing: border-box !important;
  line-height: 24px !important;
}

/* Fix dropdown text clipping:
   Native <select> elements in Chrome/Windows clip text vertically if vertical padding > 0.
   Using padding: 0 32px 0 12px !important and line-height: 36px !important centers the text
   vertically without clipping, and reserves space on the right for the custom dropdown caret. */
.securends .se-sor-create-page select,
.securends .se-sor-update-page select,
.securends .se-sor-create-page select.form-control,
.securends .se-sor-update-page select.form-control,
.securends .se-sor-create-page .schedule-import,
.securends .se-sor-update-page .schedule-import,
.securends .se-sor-create-page select.schedule-import,
.securends .se-sor-update-page select.schedule-import,
.securends .se-sor-create-page select.connectorSchImportType,
.securends .se-sor-update-page select.connectorSchImportType {
  max-width: 420px !important;
  width: 100% !important;
  min-height: 38px !important;
  height: 38px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background-color: var(--se-card) !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 10px 7px !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  padding: 0 32px 0 12px !important;
  line-height: 36px !important;
  box-sizing: border-box !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  cursor: pointer !important;
}

.securends .se-sor-create-page select::-ms-expand,
.securends .se-sor-update-page select::-ms-expand,
.securends .se-sor-create-page select.form-control::-ms-expand,
.securends .se-sor-update-page select.form-control::-ms-expand {
  display: none !important;
}

.securends .se-sor-create-page .form-group,
.securends .se-sor-update-page .form-group {
  margin: 0 !important;
  max-width: 420px !important;
  width: 100% !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard.steps > .hrsystemAppCnt > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-create-page .endpointConfigCard.steps > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)),
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):has(select, input, textarea, label):not(:has(> .o-form-label)):not(.data-import-schedule-row):not(.attributes-conn-wrapper):not(.attributes-flex-conn-wrapper):not(.se-azure-config-row),
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):has(select, input, textarea, label):not(:has(> .o-form-label)):not(.data-import-schedule-row):not(.attributes-conn-wrapper):not(.attributes-flex-conn-wrapper):not(.se-azure-config-row) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 8px 0 4px !important;
  margin: 0 -12px !important;
  border-bottom: none !important;
  width: calc(100% + 24px) !important;
  max-width: calc(100% + 24px) !important;
  float: none !important;
  box-sizing: border-box !important;
  grid-template-columns: none !important;
}

/* Filter Options (SalesForce / GitHub / etc.): keep Filter Type | field
   pairs visible on one line. Identified by #customRolesFilterType so the trailing
   validation col-md-12 cannot force display:block or collapse the row.
   Clearfix ::before/::after: collapse without display:none (that hid fields). */
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType),
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType),
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType):not(:where(.se-create-parity *)) {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  gap: 0 !important;
  padding: 8px 0 4px !important;
  margin: 0 -12px !important;
  border-bottom: none !important;
  width: calc(100% + 24px) !important;
  max-width: calc(100% + 24px) !important;
  float: none !important;
  box-sizing: border-box !important;
  grid-template-columns: none !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType)::before,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType)::after,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType)::before,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType)::after,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType):not(:where(.se-create-parity *))::before,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType):not(:where(.se-create-parity *))::after {
  content: none !important;
  flex: 0 0 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType) > .col-md-5,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType) > .col-md-5,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType) > .col-md-5:not(:where(.se-create-parity *)) {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  grid-column: auto !important;
  width: 50% !important;
  min-width: 0 !important;
  max-width: 50% !important;
  flex: 0 0 50% !important;
  float: none !important;
  margin: 0 0 16px !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType) > .col-md-12,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType) > .col-md-12,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType) > .col-md-12:not(:where(.se-create-parity *)) {
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 12px !important;
  margin: 0 !important;
  float: none !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType) .form-group,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType) .form-group:not(:where(.se-create-parity *)),
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType) .form-label,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType) .form-label,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType) .form-label:not(:where(.se-create-parity *)),
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType) input.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType) input.form-control,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType) input.form-control:not(:where(.se-create-parity *)),
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(#customRolesFilterType) select.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(#customRolesFilterType) select.form-control,
.securends.securends .se-create-app .endpointConfigCard .row:has(#customRolesFilterType) select.form-control:not(:where(.se-create-parity *)) {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: none !important;
  width: 100% !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard.steps > .hrsystemAppCnt > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-create-page .endpointConfigCard.steps > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > [class*="col-md-5"],
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > [class*="col-md-5"],
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > [class*="col-md-5"],
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > [class*="col-md-5"],
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):has(select, input, textarea, label):not(:has(> .o-form-label)):not(.data-import-schedule-row):not(.attributes-conn-wrapper):not(.attributes-flex-conn-wrapper) > .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):has(select, input, textarea, label):not(:has(> .o-form-label)):not(.data-import-schedule-row):not(.attributes-conn-wrapper):not(.attributes-flex-conn-wrapper) > .col-md-6 {
  grid-column: auto !important;
  width: 50% !important;
  min-width: 0 !important;
  max-width: 50% !important;
  flex: 0 0 50% !important;
  float: none !important;
  margin: 0 0 16px !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-group {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-label,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-label,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-label,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) .form-label {
  display: block !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
  line-height: 1.3 !important;
  min-height: 17px !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) input.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) input.form-control,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select.form-control,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) input.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) input.form-control,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) select.form-control {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  box-sizing: border-box !important;
}

/* Filter Type: stretch to the same column width as Role Filter / User Filter inputs. */
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):not(:has(> .o-form-label)):not(.data-import-schedule-row) > .col-md-6:has(select):not(:has(input)) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):not(:has(> .o-form-label)):not(.data-import-schedule-row) > .col-md-6:has(select):not(:has(input)) .form-group {
  width: 100% !important;
  max-width: none !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select.form-control,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5:has(select):not(:has(input)) select.form-control,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):not(:has(> .o-form-label)):not(.data-import-schedule-row) > .col-md-6:has(select):not(:has(input)) select,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):not(:has(> .o-form-label)):not(.data-import-schedule-row) > .col-md-6:has(select):not(:has(input)) select,
.securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):not(:has(> .o-form-label)):not(.data-import-schedule-row) > .col-md-6:has(select):not(:has(input)) select.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):not(:has(> .o-form-label)):not(.data-import-schedule-row) > .col-md-6:has(select):not(:has(input)) select.form-control {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  display: block !important;
  field-sizing: fixed;
}

/* 7. Radio Groups & Labels Horizontal Alignment */
/* Default for Yes/No and standard radio groups: align side by side horizontally */
.securends .se-sor-create-page .endpointConfigCard .MuiFormGroup-root,
.securends .se-sor-update-page .endpointConfigCard .MuiFormGroup-root,
.securends .se-sor-create-page .MuiFormGroup-root,
.securends .se-sor-update-page .MuiFormGroup-root,
.securends .se-sor-create-page .MuiRadioGroup-root,
.securends .se-sor-update-page .MuiRadioGroup-root {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Match By radio group: stack vertically below the input/select controls */
.securends .se-sor-create-page .col-md-7.o-form-input .MuiFormGroup-root,
.securends .se-sor-update-page .col-md-7.o-form-input .MuiFormGroup-root,
.securends .se-sor-create-page .o-form-input .MuiFormGroup-root,
.securends .se-sor-update-page .o-form-input .MuiFormGroup-root,
.securends .se-sor-create-page .se-match-by-radios .MuiFormGroup-root,
.securends .se-sor-update-page .se-match-by-radios .MuiFormGroup-root,
.securends .se-sor-create-page .MuiFormGroup-root:has(.campiagnRadiobtn),
.securends .se-sor-update-page .MuiFormGroup-root:has(.campiagnRadiobtn) {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

.securends .se-sor-create-page .endpointConfigCard .MuiFormControl-root,
.securends .se-sor-update-page .endpointConfigCard .MuiFormControl-root {
  margin: 0 !important;
  padding: 0 !important;
}

.securends .se-sor-create-page .MuiFormControlLabel-root,
.securends .se-sor-update-page .MuiFormControlLabel-root {
  margin-right: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
}

.securends .se-sor-create-page .MuiFormControlLabel-root .MuiRadio-root,
.securends .se-sor-update-page .MuiFormControlLabel-root .MuiRadio-root {
  padding: 4px !important;
}

.securends .se-sor-create-page .MuiFormControlLabel-root .MuiTypography-root,
.securends .se-sor-update-page .MuiFormControlLabel-root .MuiTypography-root {
  font-size: 13.5px !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
}

/* 8. Connector Picker & Search Toolbar (Connector Mode) */
.securends .se-sor-create-page .hrsystemAppCnt>.row.mt-3,
.securends .se-sor-update-page .hrsystemAppCnt>.row.mt-3 {
  display: block !important;
  position: static !important;
  right: auto !important;
  left: auto !important;
  margin: 12px 0 0 !important;
  padding: 14px 0 0 !important;
  border-top: 1px solid var(--se-line-soft) !important;
  border-bottom: 1px solid var(--se-line-soft) !important;
  width: 100% !important;
}

.securends .se-sor-create-page .apps-conn-wrapper,
.securends .se-sor-update-page .apps-conn-wrapper,
.securends .se-sor-create-page .uar-apps-wrapper,
.securends .se-sor-update-page .uar-apps-wrapper {
  position: static !important;
  right: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 16px 0 24px !important;
  padding: 0 !important;
}

/* Apps Section Container: Generous modern padding and subtle border */
.securends .se-sor-create-page .apps-conn-section,
.securends .se-sor-update-page .apps-conn-section,
.securends .se-sor-create-page .flexConnectorScrol,
.securends .se-sor-update-page .flexConnectorScrol,
.securends .se-sor-create-page .uar-apps-section,
.securends .se-sor-update-page .uar-apps-section {
  position: static !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: auto !important;
  padding: 20px 24px !important;
  margin: 0 !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}

.securends .se-sor-create-page .conn-featured-block,
.securends .se-sor-update-page .conn-featured-block,
.securends .se-sor-create-page .uar-featured-block,
.securends .se-sor-update-page .uar-featured-block {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
}

.securends .se-sor-create-page .uar-search-toolbar,
.securends .se-sor-update-page .uar-search-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 0 0 16px !important;
  margin: 0 !important;
}

/* 5 apps in one line, increased card size */
.securends .se-sor-create-page .uar-appl-list,
.securends .se-sor-create-page .uar-appl-list-less,
.securends .se-sor-update-page .uar-appl-list,
.securends .se-sor-update-page .uar-appl-list-less,
.securends .se-sor-update-page .uar-appl-list-update {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 14px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 !important;
  top: 0 !important;
  position: static !important;
  width: 100% !important;
}

@media (max-width: 1100px) {
  .securends .se-sor-create-page .uar-appl-list,
  .securends .se-sor-create-page .uar-appl-list-less,
  .securends .se-sor-update-page .uar-appl-list,
  .securends .se-sor-update-page .uar-appl-list-less,
  .securends .se-sor-update-page .uar-appl-list-update {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 650px) {
  .securends .se-sor-create-page .uar-appl-list,
  .securends .se-sor-create-page .uar-appl-list-less,
  .securends .se-sor-update-page .uar-appl-list,
  .securends .se-sor-update-page .uar-appl-list-less,
  .securends .se-sor-update-page .uar-appl-list-update {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

.securends .se-sor-create-page .uar-dashboard-items,
.securends .se-sor-update-page .uar-dashboard-items,
.securends .se-sor-create-page .conn-dashboard-items,
.securends .se-sor-update-page .conn-dashboard-items {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.securends .se-sor-create-page .agentName,
.securends .se-sor-update-page .agentName,
.securends .se-sor-create-page .uar-dashboard-items .col-md-2,
.securends .se-sor-update-page .uar-dashboard-items .col-md-2 {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

.securends .se-sor-create-page .uar-item-img.card,
.securends .se-sor-update-page .uar-item-img.card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  padding: 14px 18px !important;
  min-height: 60px !important;
  height: 60px !important;
  box-shadow: none !important;
  background: var(--se-card) !important;
  cursor: pointer !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  transition: border-color var(--se-speed-fast), background var(--se-speed-fast) !important;
}

.securends .se-sor-create-page .uar-item-img.card:hover,
.securends .se-sor-update-page .uar-item-img.card:hover {
  border-color: var(--se-line-strong, #b0b8c2) !important;
  background: var(--se-hover) !important;
}

.securends .se-sor-create-page .uar-item-img.card.appSelected,
.securends .se-sor-update-page .uar-item-img.card.appSelected {
  border-color: var(--se-brand) !important;
  background: var(--se-brand-tint) !important;
}

/* Disabled (not subscribed) connectors: beat legacy #selectedConInfo { background:#ddd }
   so names stay readable in dark mode. */
.securends .se-sor-create-page #selectedConInfo.uar-item-img.card,
.securends .se-sor-create-page #selectedConInfo.uar-item-img.card:hover,
.securends .se-sor-update-page #selectedConInfo.uar-item-img.card,
.securends .se-sor-update-page #selectedConInfo.uar-item-img.card:hover {
  background: var(--se-page) !important;
  border-color: var(--se-line) !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

.securends .se-sor-create-page #selectedConInfo.uar-item-img.card .uar_text_title,
.securends .se-sor-update-page #selectedConInfo.uar-item-img.card .uar_text_title {
  color: var(--se-ink-2) !important;
  -webkit-text-fill-color: var(--se-ink-2) !important;
}

.securends .se-sor-create-page .uar-item-img img,
.securends .se-sor-update-page .uar-item-img img {
  width: 32px !important;
  height: 32px !important;
  max-height: 32px !important;
  min-height: 32px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
}

.securends .se-sor-create-page .uar_text_title,
.securends .se-sor-update-page .uar_text_title {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  line-height: 1.25 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Update FlexConnector Application Connection Type only (#selectIconsData).
   Do not change Create FlexConnector or other connector pickers. */
.securends .se-sor-update-page .hrsystemAppCnt > .row:has(#selectIconsData) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 16px 0 24px !important;
  padding: 0 !important;
  float: none !important;
  overflow: visible !important;
}

.securends .se-sor-update-page .apps-conn-wrapper-updateFlex {
  display: block !important;
  position: static !important;
  right: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.securends .se-sor-update-page #selectIconsData.apps-conn-section {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: 20px 24px !important;
  margin: 0 !important;
  overflow: visible !important;
  opacity: 1 !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
}

.securends .se-sor-update-page #selectIconsData .conn-featured-block {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
}

.securends .se-sor-update-page #selectIconsData .uar-appl-list,
.securends .se-sor-update-page #selectIconsData .uar-appl-list-update {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

.securends .se-sor-update-page #selectIconsData .uar-dashboard-items:not(:has(.uar-item-img)) {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.securends .se-sor-update-page #selectIconsData .uar-dashboard-items,
.securends .se-sor-update-page #selectIconsData .agentName {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.securends .se-sor-update-page #selectIconsData .uar-item-img.card {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  width: 220px !important;
  max-width: 220px !important;
  height: 60px !important;
  min-height: 60px !important;
  max-height: 60px !important;
  overflow: hidden !important;
  cursor: default !important;
  box-sizing: border-box !important;
}

.securends .se-sor-update-page #selectIconsData img {
  width: 36px !important;
  height: 36px !important;
  max-width: 36px !important;
  max-height: 36px !important;
  min-width: 36px !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: contain !important;
  object-position: center !important;
  flex: 0 0 36px !important;
  align-self: center !important;
  display: block !important;
}

.securends .se-sor-update-page #selectIconsData .agent {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

/* 9. Configurations Section Alignment (All Apps: Flex Connectors & Pre-built Connectors) */

/* Heading: Configurations */
.securends .se-sor-create-page .endpointConfigCard .row:has(> .settingsTitle),
.securends .se-sor-update-page .endpointConfigCard .row:has(> .settingsTitle),
.securends .se-sor-create-page .endpointConfigCard .row.col-md-4:has(.settingsTitle),
.securends .se-sor-update-page .endpointConfigCard .row.col-md-4:has(.settingsTitle),
.securends .se-sor-create-page .endpointConfigCard .row:has(.settingsTitle),
.securends .se-sor-update-page .endpointConfigCard .row:has(.settingsTitle) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 24px 0 16px !important;
  padding: 0 !important;
  border: none !important;
  float: none !important;
}

.securends .se-sor-create-page .endpointConfigCard .settingsTitle,
.securends .se-sor-update-page .endpointConfigCard .settingsTitle {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

/* Attributes Wrappers & Containers for all Apps (including FLEXFOLDER, SFTP, Web API, CloudDB, DB Extract) */
.securends.securends .se-sor-create-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-flex-conn-wrapper,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-flex-conn-wrapper,
.securends.securends .se-sor-create-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-conn-wrapper,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-conn-wrapper,
.securends .se-sor-create-page .attributes-flex-conn-wrapper,
.securends .se-sor-update-page .attributes-flex-conn-wrapper,
.securends .se-sor-create-page .attributes-conn-wrapper,
.securends .se-sor-update-page .attributes-conn-wrapper,
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath),
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath),
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(.newform_lab1),
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(.newform_lab1),
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(a[download*="Sample_File_CSV"]),
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(a[download*="Sample_File_CSV"]) {
  display: flex !important;
  flex-wrap: wrap !important;
  position: static !important;
  left: 0 !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  margin: 0 -12px !important;
  padding: 16px 0 0 !important;
  width: calc(100% + 24px) !important;
  max-width: calc(100% + 24px) !important;
  min-height: 0 !important;
  height: auto !important;
  float: none !important;
  border: none !important;
  box-sizing: border-box !important;
}

/* Inner Row containers: ONLY match actual row wrappers, NEVER column elements that also have .row */
.securends.securends .se-sor-create-page .attributes-flex-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends.securends .se-sor-update-page .attributes-flex-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends.securends .se-sor-create-page .attributes-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends.securends .se-sor-update-page .attributes-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .row:not(.col-md-6):not(.col-md-12),
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(.newform_lab1) .row:not(.col-md-6):not(.col-md-12),
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(.newform_lab1) .row:not(.col-md-6):not(.col-md-12),
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .row:not(.col-md-6):not(.col-md-12),
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .row:not(.col-md-6):not(.col-md-12) {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* ==========================================================================
   Data Import Schedule & Configuration Header Styling
   ========================================================================== */
.securends .se-sor-create-page .endpointConfigCard.steps .sor-config-desc,
.securends .se-sor-update-page .endpointConfigCard.steps .sor-config-desc,
.securends .se-sor-create-page .endpointConfigCard.steps form .sor-config-desc,
.securends .se-sor-update-page .endpointConfigCard.steps form .sor-config-desc,
.securends .se-sor-create-page .endpointConfigCard.steps form > div:has(> p),
.securends .se-sor-update-page .endpointConfigCard.steps form > div:has(> p) {
  position: static !important;
  left: 0 !important;
  right: auto !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: none !important;
  width: 100% !important;
}

.securends .se-sor-create-page .endpointConfigCard.steps .sor-config-desc p,
.securends .se-sor-update-page .endpointConfigCard.steps .sor-config-desc p,
.securends .se-sor-create-page .endpointConfigCard.steps form .sor-config-desc p,
.securends .se-sor-update-page .endpointConfigCard.steps form .sor-config-desc p,
.securends .se-sor-create-page .endpointConfigCard.steps form > div > p {
  font-size: 13.5px !important;
  color: var(--se-ink-2) !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  border: none !important;
}

/* Data Import Schedule Row: Aligned horizontally with 210px label and 420px max select */
.securends.securends .se-sor-create-page .endpointConfigCard .row.data-import-schedule-row,
.securends.securends .se-sor-update-page .endpointConfigCard .row.data-import-schedule-row {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 8px 0 16px !important;
  padding: 4px 0 0 !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Divider above configuration inputs (Create + Update SOR). */
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper.row,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper.row,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper.row,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper.row,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-conn-wrapper,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-flex-conn-wrapper {
  padding-top: 0 !important;
}

.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper.row::after,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper.row::after {
  display: none !important;
  content: none !important;
  flex: 0 0 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row:not(.data-import-schedule-row):not(.attributes-conn-wrapper):not(.attributes-flex-conn-wrapper):not(.mt-3):not(:has(.apps-conn-wrapper)):not(:has(.uar-item-img)):not(:has(input)):not(:has(select)):not(:has(textarea)):not(:has(label)):not(:has(.configureInputs)):not(:has(.custom-control)):not(:has(.o-form-label)):not(:has(.settingsTitleName)) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  border: none !important;
  overflow: hidden !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper.row::before,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper.row::before,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper.row::before,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper.row::before,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-conn-wrapper::before,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-flex-conn-wrapper::before {
  content: "" !important;
  display: block !important;
  flex: 0 0 calc(100% - 24px) !important;
  width: calc(100% - 24px) !important;
  max-width: calc(100% - 24px) !important;
  height: 0 !important;
  margin: 0 12px 16px !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--se-line-soft) !important;
  box-sizing: border-box !important;
  float: none !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .data-import-schedule-row > .col-md-4,
.securends.securends .se-sor-update-page .endpointConfigCard .data-import-schedule-row > .col-md-4 {
  width: 210px !important;
  min-width: 210px !important;
  max-width: 210px !important;
  flex: 0 0 210px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .data-import-schedule-row .settingsTitleName,
.securends.securends .se-sor-update-page .endpointConfigCard .data-import-schedule-row .settingsTitleName {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  line-height: 1.4 !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .data-import-schedule-row > .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .data-import-schedule-row > .col-md-6 {
  width: 100% !important;
  max-width: 420px !important;
  flex: 0 1 420px !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .data-import-schedule-row .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .data-import-schedule-row .form-group {
  width: 100% !important;
  max-width: 420px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.securends .se-sor-create-page .data-import-schedule-row select,
.securends .se-sor-update-page .data-import-schedule-row select {
  width: 100% !important;
  max-width: 420px !important;
}

/* ==========================================================================
   2-Column Form Layout: 50% width per field column across all applications
   ========================================================================== */
.securends.securends .se-sor-create-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-flex-conn-wrapper > .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-flex-conn-wrapper > .col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-conn-wrapper > .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard.steps > .hrsystemAppCnt > .row.attributes-conn-wrapper > .col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .row.col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .row.col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .row.col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .row.col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .row.col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .row.col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(.newform_lab1) .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(.newform_lab1) .col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(.newform_lab1) .row.col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(.newform_lab1) .row.col-md-6,
.securends.securends .se-sor-create-page .endpointConfigCard .hrsystemAppCnt form .col-md-6:not(.data-import-schedule-row *),
.securends.securends .se-sor-update-page .endpointConfigCard .hrsystemAppCnt form .col-md-6:not(.data-import-schedule-row *),
.securends.securends .se-sor-create-page .endpointConfigCard .hrsystemAppCnt form .row.col-md-6:not(.data-import-schedule-row *),
.securends.securends .se-sor-update-page .endpointConfigCard .hrsystemAppCnt form .row.col-md-6:not(.data-import-schedule-row *),
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-6:has(> .configureInputs),
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-6:has(> .configureInputs),
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-6:has(.configureInputs),
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-6:has(.configureInputs),
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-6.configureInputs,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-6.configureInputs,
.securends.securends .se-sor-create-page .endpointConfigCard .test,
.securends.securends .se-sor-update-page .endpointConfigCard .test,
.securends.securends .se-sor-create-page .endpointConfigCard .test1,
.securends.securends .se-sor-update-page .endpointConfigCard .test1,
.securends.securends .se-sor-create-page .endpointConfigCard div:has(> .newform_lab1),
.securends.securends .se-sor-update-page .endpointConfigCard div:has(> .newform_lab1) {
  grid-column: auto !important;
  width: 50% !important;
  max-width: 50% !important;
  flex: 0 0 50% !important;
  padding: 0 12px !important;
  margin: 0 0 16px !important;
  float: left !important;
  box-sizing: border-box !important;
  display: block !important;
  border: none !important;
  position: static !important;
  right: auto !important;
  left: auto !important;
}

/* Inner field wrappers inside configuration columns */
.securends.securends .se-sor-create-page .endpointConfigCard .configureInputs,
.securends.securends .se-sor-update-page .endpointConfigCard .configureInputs,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-6:has(.configureInputs) > div,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-6:has(.configureInputs) > div,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-6.configureInputs > div,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-6.configureInputs > div {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  float: none !important;
  display: block !important;
}

@media (max-width: 768px) {
  .securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-6,
  .securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-6,
  .securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .col-md-6,
  .securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .col-md-6,
  .securends.securends .se-sor-create-page .endpointConfigCard.steps form .col-md-6,
  .securends.securends .se-sor-update-page .endpointConfigCard.steps form .col-md-6,
  .securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-6,
  .securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-6,
  .securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(.newform_lab1) .col-md-6,
  .securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(.newform_lab1) .col-md-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* Inner wrapper div reset in FLEXFOLDER (handles <div className="col-md-6"><div className="">) */
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(.newform_lab1) .col-md-6 > div,
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(.newform_lab1) .col-md-6 > div {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  float: none !important;
}

/* Download sample CSV paragraph in FLEXFOLDER */
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-8,
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-8 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding: 0 12px !important;
  margin: 0 0 12px !important;
}

.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-8 p,
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-8 p {
  font-size: 13.5px !important;
  color: var(--se-ink-2) !important;
  margin: 0 !important;
}

.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-8 a,
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) .col-md-8 a {
  color: var(--se-brand) !important;
  font-weight: 500 !important;
  text-decoration: underline !important;
}

/* Reset any inline offsets on AWS Region dropdown */
.securends .se-sor-create-page .endpointConfigCard .col-md-6:has(#AWS\ Region),
.securends .se-sor-update-page .endpointConfigCard .col-md-6:has(#AWS\ Region) {
  margin-top: 0 !important;
}

/* Full width sections / headers / textareas inside configurations */
.securends .se-sor-create-page .attributes-flex-conn-wrapper .col-md-12:not(.custom-control),
.securends .se-sor-update-page .attributes-flex-conn-wrapper .col-md-12:not(.custom-control),
.securends .se-sor-create-page .attributes-conn-wrapper .col-md-12:not(.custom-control),
.securends .se-sor-update-page .attributes-conn-wrapper .col-md-12:not(.custom-control) {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding: 0 12px !important;
  margin: 8px 0 12px !important;
  float: none !important;
  box-sizing: border-box !important;
  display: block !important;
  border: none !important;
}

/* Form group, labels, and inputs inside configurations */
.securends .se-sor-create-page .attributes-flex-conn-wrapper .form-group,
.securends .se-sor-update-page .attributes-flex-conn-wrapper .form-group,
.securends .se-sor-create-page .attributes-conn-wrapper .form-group,
.securends .se-sor-update-page .attributes-conn-wrapper .form-group,
.securends .se-sor-create-page .configureInputs .form-group,
.securends .se-sor-update-page .configureInputs .form-group,
.securends .se-sor-create-page .endpointConfigCard .form-group:has(.newform_lab1),
.securends .se-sor-update-page .endpointConfigCard .form-group:has(.newform_lab1) {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* Single dropdown fields inside col-md-12 (Host * in CloudDB & Cloud Storage) should match 50% width */
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(select[name="Host"]),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(select[name="Host"]),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(#Host),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(#Host),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(label[for="Host"]),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(label[for="Host"]),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(select[name="Host"]),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(select[name="Host"]),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(#Host),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(#Host) {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding: 0 12px !important;
  margin: 0 0 16px !important;
  float: none !important;
  box-sizing: border-box !important;
  display: block !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(select[name="Host"]) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(select[name="Host"]) .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(#Host) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(#Host) .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(label[for="Host"]) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .col-md-12:has(label[for="Host"]) .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .form-group:has(select[name="Host"]),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .form-group:has(select[name="Host"]),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .form-group:has(#Host),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .form-group:has(#Host),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper .form-group:has(label[for="Host"]),
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper .form-group:has(label[for="Host"]),
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(select[name="Host"]) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(select[name="Host"]) .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(#Host) .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper .col-md-12:has(#Host) .form-group {
  width: calc(50% - 12px) !important;
  max-width: calc(50% - 12px) !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0 !important;
  float: none !important;
  box-sizing: border-box !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper select[name="Host"],
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper select[name="Host"],
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-flex-conn-wrapper select#Host,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-flex-conn-wrapper select#Host,
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper select[name="Host"],
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper select[name="Host"],
.securends.securends .se-sor-create-page .endpointConfigCard .attributes-conn-wrapper select#Host,
.securends.securends .se-sor-update-page .endpointConfigCard .attributes-conn-wrapper select#Host {
  width: 100% !important;
  max-width: 100% !important;
}

.securends .se-sor-create-page .attributes-flex-conn-wrapper form,
.securends .se-sor-update-page .attributes-flex-conn-wrapper form,
.securends .se-sor-create-page .attributes-conn-wrapper form,
.securends .se-sor-update-page .attributes-conn-wrapper form {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Labels: EXCLUDE custom-control-label so checkbox labels stay inline */
/* Labels inside configurations */
.securends .se-sor-create-page .attributes-flex-conn-wrapper label:not(.custom-control-label),
.securends .se-sor-update-page .attributes-flex-conn-wrapper label:not(.custom-control-label),
.securends .se-sor-create-page .attributes-conn-wrapper label:not(.custom-control-label),
.securends .se-sor-update-page .attributes-conn-wrapper label:not(.custom-control-label),
.securends .se-sor-create-page .configureInputs label:not(.custom-control-label),
.securends .se-sor-update-page .configureInputs label:not(.custom-control-label),
.securends .se-sor-create-page label.newform_lab:not(.custom-control-label),
.securends .se-sor-update-page label.newform_lab:not(.custom-control-label),
.securends .se-sor-create-page label.newform_lab1:not(.custom-control-label),
.securends .se-sor-update-page label.newform_lab1:not(.custom-control-label) {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  text-align: left !important;
  line-height: 1.4 !important;
}

/* Labels with inline info icons (like JSON (i)) */
.securends .se-sor-create-page .attributes-flex-conn-wrapper label:has(i),
.securends .se-sor-update-page .attributes-flex-conn-wrapper label:has(i),
.securends .se-sor-create-page .attributes-conn-wrapper label:has(i),
.securends .se-sor-update-page .attributes-conn-wrapper label:has(i),
.securends .se-sor-create-page .endpointConfigCard label:has(i) {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

/* Inputs inside configurations */
.securends .se-sor-create-page .attributes-flex-conn-wrapper input.form-control,
.securends .se-sor-update-page .attributes-flex-conn-wrapper input.form-control,
.securends .se-sor-create-page .attributes-conn-wrapper input.form-control,
.securends .se-sor-update-page .attributes-conn-wrapper input.form-control,
.securends .se-sor-create-page .configureInputs input.form-control,
.securends .se-sor-update-page .configureInputs input.form-control,
.securends .se-sor-create-page .endpointConfigCard input.form-control:has(~ .newform_lab1),
.securends .se-sor-update-page .endpointConfigCard input.form-control:has(~ .newform_lab1),
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(.newform_lab1) input.form-control,
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(.newform_lab1) input.form-control,
.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) input.form-control,
.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(#flexFolderFilePath) input.form-control,
.securends .se-sor-create-page .attributes-conn-wrapper select.form-control,
.securends .se-sor-update-page .attributes-conn-wrapper select.form-control,
.securends .se-sor-create-page .attributes-flex-conn-wrapper select.form-control:not(#schedule-import),
.securends .se-sor-update-page .attributes-flex-conn-wrapper select.form-control:not(#schedule-import) {
  width: 100% !important;
  max-width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  padding: 6px 12px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  line-height: 24px !important;
}

/* Radio Buttons layout inside Setup Application and Notifications */
.securends .se-sor-create-page .endpointConfigCard .MuiFormControl-root,
.securends .se-sor-update-page .endpointConfigCard .MuiFormControl-root {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  margin: 0 !important;
}

/* Match By radio group: stacked vertically one below the other */
.securends .se-sor-create-page .endpointConfigCard .se-match-by-radios .MuiFormControl-root,
.securends .se-sor-update-page .endpointConfigCard .se-match-by-radios .MuiFormControl-root,
.securends .se-sor-create-page .endpointConfigCard .MuiFormControl-root:has(.campiagnRadiobtn),
.securends .se-sor-update-page .endpointConfigCard .MuiFormControl-root:has(.campiagnRadiobtn) {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: 100% !important;
  margin: 0 !important;
}

.securends .se-sor-create-page .endpointConfigCard .se-match-by-radios .MuiFormGroup-root,
.securends .se-sor-update-page .endpointConfigCard .se-match-by-radios .MuiFormGroup-root,
.securends .se-sor-create-page .endpointConfigCard .MuiFormGroup-root:has(.campiagnRadiobtn),
.securends .se-sor-update-page .endpointConfigCard .MuiFormGroup-root:has(.campiagnRadiobtn),
.securends .se-sor-create-page .endpointConfigCard .row:has(.campiagnRadiobtn) .MuiFormGroup-root,
.securends .se-sor-update-page .endpointConfigCard .row:has(.campiagnRadiobtn) .MuiFormGroup-root,
.securends .se-sor-create-page .endpointConfigCard .campiagnRadiobtn .MuiFormGroup-root,
.securends .se-sor-update-page .endpointConfigCard .campiagnRadiobtn .MuiFormGroup-root {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
  margin: 0 !important;
  width: 100% !important;
}

.securends .se-sor-create-page .endpointConfigCard .se-match-by-radios .MuiFormControlLabel-root,
.securends .se-sor-update-page .endpointConfigCard .se-match-by-radios .MuiFormControlLabel-root,
.securends .se-sor-create-page .endpointConfigCard .MuiFormControlLabel-root.campiagnRadiobtn,
.securends .se-sor-update-page .endpointConfigCard .MuiFormControlLabel-root.campiagnRadiobtn {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
}

/* Horizontal radio groups (like Exclude Employee ID & Notifications Yes/No) */
.securends .se-sor-create-page .endpointConfigCard .MuiFormGroup-root:not(:has(.campiagnRadiobtn)):not(.se-match-by-radios *),
.securends .se-sor-update-page .endpointConfigCard .MuiFormGroup-root:not(:has(.campiagnRadiobtn)):not(.se-match-by-radios *) {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 16px !important;
  margin: 0 !important;
}

.securends .se-sor-create-page .endpointConfigCard .MuiFormControlLabel-root,
.securends .se-sor-update-page .endpointConfigCard .MuiFormControlLabel-root {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  cursor: pointer !important;
}

.securends .se-sor-create-page .endpointConfigCard .MuiFormControlLabel-root .MuiTypography-root,
.securends .se-sor-update-page .endpointConfigCard .MuiFormControlLabel-root .MuiTypography-root {
  font-size: 13.5px !important;
  color: var(--se-ink) !important;
  margin: 0 0 0 4px !important;
  line-height: 1.4 !important;
}

.securends .se-sor-create-page .MuiRadio-colorPrimary.Mui-checked,
.securends .se-sor-update-page .MuiRadio-colorPrimary.Mui-checked {
  color: var(--se-brand) !important;
}

/* Disabled inputs inside configurations (e.g. Content-Type on Web API) */
.securends .se-sor-create-page .attributes-flex-conn-wrapper input.form-control:disabled,
.securends .se-sor-update-page .attributes-flex-conn-wrapper input.form-control:disabled,
.securends .se-sor-create-page .attributes-conn-wrapper input.form-control:disabled,
.securends .se-sor-update-page .attributes-conn-wrapper input.form-control:disabled,
.securends .se-sor-create-page .endpointConfigCard input.form-control:disabled,
.securends .se-sor-update-page .endpointConfigCard input.form-control:disabled,
.securends .se-sor-create-page input#Content-Type.form-control:disabled,
.securends .se-sor-update-page input#Content-Type.form-control:disabled {
  width: 100% !important;
  max-width: 100% !important;
  background: var(--bg-input, var(--se-raise, #f5f6f8)) !important;
  background-color: var(--bg-input, var(--se-raise, #f5f6f8)) !important;
  color: var(--se-ink-2, var(--text-secondary, #475569)) !important;
  -webkit-text-fill-color: var(--se-ink-2, var(--text-secondary, #475569)) !important;
  border-color: var(--se-line) !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

/* Web API JSON sample (#Path / .textAreaGoogleDrive) */
.securends .se-sor-create-page .textAreaGoogleDrive textarea.form-control,
.securends .se-sor-update-page .textAreaGoogleDrive textarea.form-control,
.securends .se-sor-create-page textarea#Path.form-control,
.securends .se-sor-update-page textarea#Path.form-control {
  background: var(--bg-input, var(--se-card)) !important;
  background-color: var(--bg-input, var(--se-card)) !important;
  color: var(--se-ink) !important;
  -webkit-text-fill-color: var(--se-ink) !important;
  border-color: var(--se-line) !important;
  caret-color: var(--se-ink) !important;
}

.securends .se-sor-create-page .textAreaGoogleDrive textarea.form-control::placeholder,
.securends .se-sor-update-page .textAreaGoogleDrive textarea.form-control::placeholder,
.securends .se-sor-create-page textarea#Path.form-control::placeholder,
.securends .se-sor-update-page textarea#Path.form-control::placeholder {
  color: var(--se-ink-2) !important;
  opacity: 1 !important;
}

/* Selects inside configurations: 0 vertical padding prevents text clipping in Chrome */
.securends .se-sor-create-page .attributes-flex-conn-wrapper select,
.securends .se-sor-update-page .attributes-flex-conn-wrapper select,
.securends .se-sor-create-page .attributes-flex-conn-wrapper select.form-control,
.securends .se-sor-update-page .attributes-flex-conn-wrapper select.form-control,
.securends .se-sor-create-page .attributes-conn-wrapper select,
.securends .se-sor-update-page .attributes-conn-wrapper select,
.securends .se-sor-create-page .attributes-conn-wrapper select.form-control,
.securends .se-sor-update-page .attributes-conn-wrapper select.form-control,
.securends .se-sor-create-page .configureInputs select,
.securends .se-sor-update-page .configureInputs select,
.securends .se-sor-create-page .configureInputs select.form-control,
.securends .se-sor-update-page .configureInputs select.form-control {
  width: 100% !important;
  max-width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background-color: var(--se-card) !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 10px 7px !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  padding: 0 32px 0 12px !important;
  line-height: 36px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  cursor: pointer !important;
}

.securends .se-sor-create-page .attributes-flex-conn-wrapper select::-ms-expand,
.securends .se-sor-update-page .attributes-flex-conn-wrapper select::-ms-expand,
.securends .se-sor-create-page .attributes-conn-wrapper select::-ms-expand,
.securends .se-sor-update-page .attributes-conn-wrapper select::-ms-expand {
  display: none !important;
}

.securends .se-sor-create-page textarea.form-control,
.securends .se-sor-update-page textarea.form-control {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 80px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

/* Sub-headings inside configurations (e.g. "Connection Details", "User Access Review", "Mapping") */
.securends .se-sor-create-page .attributes-flex-conn-wrapper .col-md-12 > label:not(.custom-control-label),
.securends .se-sor-update-page .attributes-flex-conn-wrapper .col-md-12 > label:not(.custom-control-label),
.securends .se-sor-create-page .attributes-conn-wrapper .col-md-12 > label:not(.custom-control-label),
.securends .se-sor-update-page .attributes-conn-wrapper .col-md-12 > label:not(.custom-control-label) {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 12px 0 8px !important;
  padding: 0 !important;
  display: block !important;
}

/* ==========================================================================
   CHECKBOXES & INFO ICONS ALIGNMENT
   Align checkboxes with the 12px input grid gutter, and keep info icons
   strictly on the same horizontal line directly next to the checkbox label.
   ========================================================================== */
.securends.securends .se-sor-create-page .endpointConfigCard .custom-control.custom-checkbox,
.securends.securends .se-sor-update-page .endpointConfigCard .custom-control.custom-checkbox,
.securends.securends .se-sor-create-page .endpointConfigCard .col-md-12.custom-control.custom-checkbox,
.securends.securends .se-sor-update-page .endpointConfigCard .col-md-12.custom-control.custom-checkbox,
.securends.securends .se-sor-create-page .attributes-flex-conn-wrapper .custom-control.custom-checkbox,
.securends.securends .se-sor-update-page .attributes-flex-conn-wrapper .custom-control.custom-checkbox,
.securends.securends .se-sor-create-page .attributes-conn-wrapper .custom-control.custom-checkbox,
.securends.securends .se-sor-update-page .attributes-conn-wrapper .custom-control.custom-checkbox {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding-left: 36px !important; /* 12px grid gutter + 16px indicator box + 8px gap */
  padding-right: 12px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin: 12px 0 16px !important;
  min-height: 24px !important;
  float: none !important;
  box-sizing: border-box !important;
}

/* Native input hit target: positioned directly over the 16px indicator box */
.securends .se-sor-create-page .endpointConfigCard .custom-control-input,
.securends .se-sor-update-page .endpointConfigCard .custom-control-input {
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  z-index: 2 !important;
  cursor: pointer !important;
}

/* Checkbox indicator: left: -24px relative to label (which begins at 36px padding)
   places indicator at exactly 12px from container left, aligning with inputs */
.securends .se-sor-create-page .endpointConfigCard .custom-control-label::before,
.securends .se-sor-update-page .endpointConfigCard .custom-control-label::before,
.securends .se-sor-create-page .endpointConfigCard .custom-control-label::after,
.securends .se-sor-update-page .endpointConfigCard .custom-control-label::after {
  left: -24px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  border-radius: 2px !important;
  box-sizing: border-box !important;
}

/* Checkbox label text */
.securends .se-sor-create-page .endpointConfigCard .custom-control-label,
.securends .se-sor-update-page .endpointConfigCard .custom-control-label {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  line-height: normal !important;
  cursor: pointer !important;
  vertical-align: middle !important;
  position: relative !important;
}

/* Checkbox info icon (i) sits inline directly next to the label */
.securends .se-sor-create-page .endpointConfigCard .customConfigTip,
.securends .se-sor-update-page .endpointConfigCard .customConfigTip,
.securends .se-sor-create-page .endpointConfigCard .custom-control .customConfigTip,
.securends .se-sor-update-page .endpointConfigCard .custom-control .customConfigTip,
.securends .se-sor-create-page .endpointConfigCard .custom-control i.fa-info-circle,
.securends .se-sor-update-page .endpointConfigCard .custom-control i.fa-info-circle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 8px !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  color: var(--se-ink-3) !important;
  font-size: 14px !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  cursor: pointer !important;
  float: none !important;
  white-space: nowrap !important;
}

.securends .se-sor-create-page .endpointConfigCard .customConfigTip i,
.securends .se-sor-update-page .endpointConfigCard .customConfigTip i {
  color: var(--se-ink-3) !important;
  font-size: 14px !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Suppress legacy redundant <br /> tags in checkbox blocks */
.securends .se-sor-create-page .endpointConfigCard br,
.securends .se-sor-update-page .endpointConfigCard br {
  display: none !important;
}

/* 10. Notifications and Save Action Footer */
.securends .se-sor-create-page .o-form-button-bar,
.securends .se-sor-update-page .o-form-button-bar,
.securends .se-sor-create-page .se-create-app-actions,
.securends .se-sor-update-page .se-create-app-actions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 16px 0 0 !important;
  padding: 0 !important;
}

.securends .se-sor-create-page .submit-button,
.securends .se-sor-update-page .submit-button,
.securends .se-sor-create-page .button.button-primary,
.securends .se-sor-update-page .button.button-primary,
.securends .se-sor-create-page .se-create-save,
.securends .se-sor-update-page .se-create-save,
.securends .se-create-app .submit-button.se-create-save:not(:where(.se-create-parity *)),
.securends .se-create-app .se-create-save:not(:where(.se-create-parity *)),
.securends .se-create-app button.se-create-save:not(:where(.se-create-parity *)) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: normal !important;
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 24px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  box-shadow: var(--se-shadow) !important;
  transition: all var(--se-speed-fast, 150ms) ease !important;
}

.securends .se-sor-create-page .submit-button:hover,
.securends .se-sor-update-page .submit-button:hover,
.securends .se-sor-create-page .se-create-save:hover,
.securends .se-sor-update-page .se-create-save:hover,
.securends .se-create-app .se-create-save:hover:not(:where(.se-create-parity *)),
.securends .se-create-app button.se-create-save:hover:not(:where(.se-create-parity *)) {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #fff !important;
}

.securends .se-sor-update-page .altTOp {
  float: none !important;
  width: 100% !important;
  margin: 0 0 16px !important;
}

.securends .se-sor-update-page .alert-success {
  background: var(--se-ok-tint, #dcfce7) !important;
  border: 1px solid var(--se-ok) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r) !important;
}

/* --------------------------------------------------------------------------
   Schedule export form
   -------------------------------------------------------------------------- */

/* Title-bar Back — solid primary like Campaign Preview Back */
.securends .se-schedule-export-page .o-form-title-bar .campaign_progress {
  position: static !important;
  float: none !important;
  top: auto !important;
  right: auto !important;
  margin: 0 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
}

html[data-se-theme] .securends .se-schedule-export-page .o-form-title-bar .campaign_progress input.AddAppBtn,
.securends .se-schedule-export-page .o-form-title-bar .campaign_progress input.AddAppBtn {
  height: 28px !important;
  min-height: 28px !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 12px !important;
  margin: 0 !important;
  line-height: 26px !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  background: var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  border: 1px solid var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  cursor: pointer;
}

html[data-se-theme] .securends .se-schedule-export-page .o-form-title-bar .campaign_progress input.AddAppBtn:hover,
.securends .se-schedule-export-page .o-form-title-bar .campaign_progress input.AddAppBtn:hover {
  background: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  border-color: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

.securends .se-schedule-export-page .endpointConfigCard {
  background: var(--se-card);
  border: 1px solid var(--se-line);
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 20px 24px 8px !important;
  margin-top: 0 !important;
}

.securends .se-schedule-export-page .appSchedulerData {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 0 14px !important;
}

.securends .se-schedule-export-page .appSchedulerData>[class*="col-md-3"],
.securends .se-schedule-export-page .appSchedulerData>.required,
.securends .se-schedule-export-page .appSchedulerData>.o-form-label {
  flex: 0 0 220px;
  max-width: 220px;
  padding-left: 0 !important;
}

/* One label track for every row: pickels-v2 `.required { margin-left:-26px }`
   and the inline -10px / -35px offsets on the email rows made them drift. */
.securends .se-schedule-export-page .appSchedulerData>.required,
.securends .se-schedule-export-page .appSchedulerData>.o-form-label:first-child {
  margin: 0 !important;
}

.securends .se-schedule-export-page .appSchedulerData>.o-form-label+.o-form-label {
  flex: 1 1 auto;
  max-width: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 !important;
  padding-left: calc(var(--bs-gutter-x, 1.5rem) * 0.5) !important;
  padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5) !important;
}

.securends .se-schedule-export-page .appSchedulerData>.o-form-label+.o-form-label .uar-radio-data {
  margin: 0 !important;
  padding: 0 !important;
}

.securends .se-schedule-export-page .appSchedulerData>.o-form-label+.o-form-label>.settingsTitle {
  position: static !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.securends .se-schedule-export-page .appSchedulerData>.o-form-label+.o-form-label>div:first-child:not(.uar-radio-data) {
  margin-left: 0 !important;
}

.securends .se-schedule-export-page .appSchedulerData .control-label,
.securends .se-schedule-export-page .appSchedulerData .settingsTitle {
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
}

.securends .se-schedule-export-page .appSchedulerData .form-control {
  height: 36px !important;
  border-radius: var(--se-r) !important;
  border-color: var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
}

.securends .se-schedule-export-page .o-form-button-bar {
  position: static !important;
  right: auto !important;
  left: auto !important;
  display: flex !important;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin: 8px 0 16px !important;
  padding: 0 !important;
  width: 100%;
}

.securends .se-schedule-export-page .o-form-button-bar>div {
  float: none !important;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Export Now / Schedule Export — solid primary like Campaign Preview Back */
html[data-se-theme] .securends .se-schedule-export-page .o-form-button-bar button.submit-button,
.securends .se-schedule-export-page .o-form-button-bar button.submit-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 28px !important;
  min-height: 28px !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 12px !important;
  margin: 0 !important;
  line-height: 26px !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  background: var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  border: 1px solid var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  cursor: pointer;
}

html[data-se-theme] .securends .se-schedule-export-page .o-form-button-bar button.submit-button:hover:not(:disabled),
.securends .se-schedule-export-page .o-form-button-bar button.submit-button:hover:not(:disabled) {
  background: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  border-color: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

.securends .se-schedule-export-page .o-form-button-bar button.submit-button:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

.securends .se-schedule-export-page .o-form-button-bar .fa-spinner {
  position: static !important;
  left: auto !important;
  font-size: 16px !important;
  color: var(--se-brand);
}

/* --------------------------------------------------------------------------
   CSV load / mapping
   -------------------------------------------------------------------------- */

.securends .se-csv-page .panel-info,
.securends .se-csv-page .panel {
  background: var(--se-brand-tint) !important;
  border: 1px solid var(--se-brand) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  margin-bottom: 16px;
  color: var(--se-ink);
}

.securends .se-csv-page .panel-heading {
  background: transparent !important;
  border: none !important;
  font-weight: 600;
  color: var(--se-ink);
  padding: 12px 16px 0 !important;
}

.securends .se-csv-page .panel-body {
  padding: 8px 16px 14px !important;
  color: var(--se-ink-2);
  font-size: 13px;
}

.securends .se-csv-page .uploadTitle {
  display: none;
}

.securends .se-csv-page .border.upload,
.securends .se-csv-page .csvConfigSettings .border.upload {
  background: var(--se-card);
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 16px 20px;
  margin-bottom: 16px;
}

.securends .se-csv-page .custom-file {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.securends .se-csv-page .custom-file-input,
.securends .se-csv-page .form-control {
  border-radius: var(--se-r) !important;
  border-color: var(--se-line) !important;
  height: 36px !important;
}

.securends .se-csv-page .sample-file {
  margin: 0 !important;
}

.securends .se-csv-page .sample-file a {
  color: var(--se-brand);
  font-size: 13px;
  font-weight: 500;
}

.securends .se-csv-page .csv-fields .form-group.row,
.securends .se-csv-page .csv_fields {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.securends .se-csv-page .csv-fields select.form-control {
  min-width: 220px;
}

.securends .se-csv-page .nav-button {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 20px;
}

.securends .se-csv-page .nav-button .custom_pien,
.securends .se-csv-page .nav-button .custom_secondary,
.securends .se-csv-page .nav-button button {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  height: 32px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 30px !important;
}

.securends .se-csv-page .nav-button .custom_secondary {
  background: var(--se-card) !important;
  border-color: var(--se-line) !important;
  color: var(--se-ink) !important;
}

.securends .se-csv-page .csvTableResults h2 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 0 0 12px !important;
}

.securends .se-csv-page .csvTableResults .table {
  background: var(--se-card);
  border: 1px solid var(--se-line);
  border-radius: var(--se-r);
}

.securends .se-csv-page .alert {
  border-radius: var(--se-r);
  max-width: 100% !important;
}

/* --------------------------------------------------------------------------
   Audit / sync tables
   -------------------------------------------------------------------------- */

.securends .se-audit-trail-page .ReactTable,
.securends .se-sync-status-page .ReactTable {
  background: var(--se-card);
  border: 1px solid var(--se-line);
  border-radius: var(--se-r-card);
}

/* Sync Status Details — Back solid primary like Campaign Preview Back;
   Refresh secondary like the Applications list Refresh (kit.css .iam_add_Export) */
.securends .se-sync-status-page .se-toolbar-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.securends .se-sync-status-page .se-toolbar-actions .campaign_progress {
  position: static !important;
  float: none !important;
  top: auto !important;
  right: auto !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
}

html[data-se-theme] .securends .se-sync-status-page .se-toolbar-actions input.AddAppBtn,
.securends .se-sync-status-page .se-toolbar-actions input.AddAppBtn {
  height: 28px !important;
  min-height: 28px !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 12px !important;
  margin: 0 !important;
  line-height: 26px !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  background: var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  border: 1px solid var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  cursor: pointer;
}

html[data-se-theme] .securends .se-sync-status-page .se-toolbar-actions input.AddAppBtn:hover:not(:disabled),
.securends .se-sync-status-page .se-toolbar-actions input.AddAppBtn:hover:not(:disabled) {
  background: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  border-color: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

.securends .se-sync-status-page .se-toolbar-actions input.AddAppBtn:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

html[data-se-theme] .securends .se-sync-status-page .se-sync-refresh input.AddAppBtn,
.securends .se-sync-status-page .se-sync-refresh input.AddAppBtn {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  -webkit-text-fill-color: var(--se-ink) !important;
}

html[data-se-theme] .securends .se-sync-status-page .se-sync-refresh input.AddAppBtn:hover:not(:disabled),
.securends .se-sync-status-page .se-sync-refresh input.AddAppBtn:hover:not(:disabled) {
  background: var(--se-page) !important;
  border-color: var(--se-line-soft) !important;
  color: var(--se-ink) !important;
  -webkit-text-fill-color: var(--se-ink) !important;
}

html[data-se-mode="dark"][data-se-theme] .securends .se-sync-status-page .se-sync-refresh input.AddAppBtn {
  background: var(--se-btn-bg) !important;
  border-color: var(--se-btn-bg) !important;
  color: var(--se-btn-fg) !important;
  -webkit-text-fill-color: var(--se-btn-fg) !important;
}

html[data-se-mode="dark"][data-se-theme] .securends .se-sync-status-page .se-sync-refresh input.AddAppBtn:hover:not(:disabled) {
  background: var(--se-btn-bg-hover) !important;
  border-color: var(--se-btn-bg-hover) !important;
}

/* Application Audit Trail — Export / Back both solid primary like Campaign Preview Back */
.securends .se-audit-trail-page .se-toolbar-actions {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.securends .se-audit-trail-page .se-toolbar-actions .campaign_progress {
  position: static !important;
  float: none !important;
  top: auto !important;
  right: auto !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
}

html[data-se-theme] .securends .se-audit-trail-page .se-toolbar-actions input.AddAppBtn,
.securends .se-audit-trail-page .se-toolbar-actions input.AddAppBtn {
  height: 28px !important;
  min-height: 28px !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 12px !important;
  margin: 0 !important;
  line-height: 26px !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  background: var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  border: 1px solid var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  cursor: pointer;
}

html[data-se-theme] .securends .se-audit-trail-page .se-toolbar-actions input.AddAppBtn:hover:not(:disabled),
.securends .se-audit-trail-page .se-toolbar-actions input.AddAppBtn:hover:not(:disabled) {
  background: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  border-color: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

.securends .se-audit-trail-page .se-audit-export input.AddAppBtn:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

.securends .se-audit-trail-page .se-audit-export .fa-spinner-icon .assignLoaderData {
  float: none !important;
  margin: 0 !important;
  color: var(--se-brand);
}
/* Application Audit Trail — header / filter / body share one flex track.
   First column is the Action *value* (Updated), not a gear menu; skip freeze
   so search/filter does not desync Description / From / To. */
.securends .se-audit-trail-page .col-md-12.campaignList.Table {
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

.securends .se-audit-trail-page .CampaignTable {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.securends .se-audit-trail-page .listofCampTable.ReactTable,
.securends .se-audit-trail-page .ReactTable.listofCampTable {
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-table {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-thead .rt-tr,
.securends .se-audit-trail-page .listofCampTable .rt-tbody .rt-tr {
  display: flex !important;
  width: 100% !important;
  min-width: 100% !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-th,
.securends .se-audit-trail-page .listofCampTable .rt-td {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-thead.-header .rt-th:nth-child(1),
.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th:nth-child(1),
.securends .se-audit-trail-page .listofCampTable .rt-tbody .rt-td:nth-child(1) {
  flex: 0 1 110px !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-thead.-header .rt-th:nth-child(2),
.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th:nth-child(2),
.securends .se-audit-trail-page .listofCampTable .rt-tbody .rt-td:nth-child(2) {
  flex: 1 1 180px !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-thead.-header .rt-th:nth-child(3),
.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th:nth-child(3),
.securends .se-audit-trail-page .listofCampTable .rt-tbody .rt-td:nth-child(3) {
  flex: 0 1 160px !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-thead.-header .rt-th:nth-child(4),
.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th:nth-child(4),
.securends .se-audit-trail-page .listofCampTable .rt-tbody .rt-td:nth-child(4) {
  flex: 2 1 220px !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-thead.-header .rt-th:nth-child(5),
.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th:nth-child(5),
.securends .se-audit-trail-page .listofCampTable .rt-tbody .rt-td:nth-child(5),
.securends .se-audit-trail-page .listofCampTable .rt-thead.-header .rt-th:nth-child(6),
.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th:nth-child(6),
.securends .se-audit-trail-page .listofCampTable .rt-tbody .rt-td:nth-child(6) {
  flex: 1 1 160px !important;
}

.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th input,
.securends .se-audit-trail-page .listofCampTable .rt-thead.-filters .rt-th .form-control {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* --------------------------------------------------------------------------
   Modernized Connector Configurations (GitHub & Ceridian Dayforce)
   -------------------------------------------------------------------------- */

/* GitHub Organization Data Card Modernization */
.securends .se-github-org-card,
.securends .se-github-org-card.card.sor-header {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.04)) !important;
  overflow: hidden !important;
  margin: 12px 0 20px !important;
  width: 100% !important;
  float: none !important;
}

.securends .se-github-org-card-header,
.securends .se-github-org-card.card.sor-header > .card-header {
  background: var(--se-card-head, rgba(14, 116, 144, 0.04)) !important;
  border-bottom: 1px solid var(--se-line) !important;
  padding: 12px 20px !important;
  min-height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

.securends .se-github-org-card-header span {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  letter-spacing: -0.01em !important;
}

.securends .se-github-org-card-body,
.securends .se-github-org-card.card.sor-header > .card-body {
  padding: 20px !important;
  background: var(--se-card) !important;
}

.securends .se-github-org-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
}

.securends .se-github-org-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  float: none !important;
}

.securends .se-github-org-row > .se-github-org-col {
  flex: 1 1 0 !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  float: none !important;
}

.securends .se-github-org-row .configureInputs {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.securends .se-github-org-row .configureInputs label.nameLabel {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  margin: 0 0 6px 0 !important;
  line-height: 1.4 !important;
}

.securends .se-github-org-row .configureInputs input.form-control {
  width: 100% !important;
  max-width: 100% !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
}

.securends .se-github-org-row .configureInputs input.form-control:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint, rgba(14, 116, 144, 0.15)) !important;
  outline: none !important;
}

.securends .se-github-org-row > .se-github-org-action {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 24px 0 0 0 !important;
  float: none !important;
}

.securends .se-github-del-btn,
.securends .se-github-del-btn.AttrDeleteBtn {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  color: var(--se-ink-3) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all var(--se-speed-fast, 150ms) ease !important;
  margin: 0 !important;
}

.securends .se-github-del-btn:hover,
.securends .se-github-del-btn.AttrDeleteBtn:hover {
  color: var(--se-risk, #dc2626) !important;
  border-color: rgba(220, 38, 38, 0.4) !important;
  background: rgba(220, 38, 38, 0.08) !important;
}

.securends .se-github-del-btn i.fa-trash-o {
  font-size: 16px !important;
  line-height: 1 !important;
  color: inherit !important;
}

.securends .se-github-org-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 16px !important;
}

.securends .se-github-add-btn,
.securends .se-github-add-btn.ApproverAddButton {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-brand) !important;
  background: var(--se-brand-tint, rgba(14, 116, 144, 0.08)) !important;
  border: 1px solid var(--se-brand) !important;
  border-radius: var(--se-r) !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all var(--se-speed-fast, 150ms) ease !important;
  margin: 0 !important;
  float: none !important;
}

.securends .se-github-add-btn:hover,
.securends .se-github-add-btn.ApproverAddButton:hover {
  background: var(--se-brand) !important;
  color: #fff !important;
}

.securends .se-github-add-btn i.fa-plus {
  font-size: 12px !important;
  margin-right: 4px !important;
}

.securends .se-github-reset-btn,
.securends .se-github-reset-btn.ApproverAddButton {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all var(--se-speed-fast, 150ms) ease !important;
  margin: 0 0 0 8px !important;
  float: none !important;
}

.securends .se-github-reset-btn:hover,
.securends .se-github-reset-btn.ApproverAddButton:hover {
  color: var(--se-ink) !important;
  border-color: var(--se-line-strong, var(--se-ink-3)) !important;
  background: var(--se-hover) !important;
}

/* Ceridian Dayforce Modernization */
.securends .se-ceridian-pagesize-group {
  margin-bottom: 0 !important;
  padding: 0 !important;
}

.securends .se-ceridian-pagesize-group label.radioTitle {
  display: block !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  margin: 0 0 6px 0 !important;
  line-height: 1.4 !important;
}

.securends .se-ceridian-pagesize-group .d-flex {
  display: flex !important;
  align-items: center !important;
  height: 38px !important;
  gap: 16px !important;
}

.securends .se-ceridian-pagesize-group .custom-radio,
.securends .se-ceridian-pagesize-group .form-check-inline {
  display: inline-flex !important;
  align-items: center !important;
  margin-right: 16px !important;
  margin-bottom: 0 !important;
  cursor: pointer !important;
}

.securends .se-ceridian-pagesize-group input[type="radio"] {
  margin-right: 6px !important;
  accent-color: var(--se-brand) !important;
  cursor: pointer !important;
}

.securends .se-ceridian-pagesize-group label {
  color: var(--se-ink) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  margin-bottom: 0 !important;
}

@media (max-width: 900px) {
  .securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
  .securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
  .securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > [class*="col-md-5"],
  .securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > [class*="col-md-5"],
  .securends.securends .se-sor-create-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
  .securends.securends .se-sor-update-page .endpointConfigCard .col-md-12:has(> .col-md-5 + .col-md-5):not(:has(> .o-form-label)) > .col-md-5,
  .securends.securends .se-sor-create-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):has(select, input, textarea, label):not(:has(> .o-form-label)):not(.data-import-schedule-row):not(.attributes-conn-wrapper):not(.attributes-flex-conn-wrapper) > .col-md-6,
  .securends.securends .se-sor-update-page .endpointConfigCard .row:has(> .col-md-6 + .col-md-6):has(select, input, textarea, label):not(:has(> .o-form-label)):not(.data-import-schedule-row):not(.attributes-conn-wrapper):not(.attributes-flex-conn-wrapper) > .col-md-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
}

@media (max-width: 960px) {

  .securends .se-sor-create-page .row:has(.uar-radio-dataInfo)>.o-form-label,
  .securends .se-sor-update-page .row:has(.uar-radio)>.o-form-label,
  .securends .se-schedule-export-page .appSchedulerData>[class*="col-md-3"] {
    flex-basis: 100%;
    max-width: 100%;
  }
}

/* ==========================================================================
   Connector Form Actions, Alignment & Modernization
   - SFTP inputs 2-column grid alignment & empty element collapse
   - Fetch Files button row alignment & enterprise styling
   - Include Last Auth Date checkbox single-line horizontal alignment
   - Test Connection action row & modern enterprise button styling
   ========================================================================== */

/* 1. Collapse phantom empty grid elements */
.securends .endpointConfigCard .col-md-6:empty,
.securends .endpointConfigCard div.col-md-6:not(:has(*)),
.securends .endpointConfigCard .row > div:empty,
.securends .endpointConfigCard .attributes-conn-wrapper > .col-md-6:not(:has(input)):not(:has(select)):not(:has(textarea)):not(:has(.configureInputs)):not(:has(.custom-control)):not(:has(label)),
.securends .endpointConfigCard .attributes-flex-conn-wrapper > .col-md-6:not(:has(input)):not(:has(select)):not(:has(textarea)):not(:has(.configureInputs)):not(:has(.custom-control)):not(:has(label)) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 0 !important;
  height: 0 !important;
  flex: 0 0 0% !important;
  max-width: 0 !important;
}

/* 2. Fetch Files Action Row (Image 1) */
.securends .se-fetch-files-row,
.securends .endpointConfigCard .se-fetch-files-row {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 12px !important;
  clear: both !important;
  padding: 0 12px !important;
  margin: 16px 0 8px !important;
  box-sizing: border-box !important;
  float: none !important;
  position: static !important;
}

.securends .se-fetch-files-row .se_btn_new,
.securends .endpointConfigCard .se-fetch-files-row .se_btn_new {
  margin: 0 !important;
  float: none !important;
  height: 36px !important;
  min-height: 36px !important;
  border-radius: var(--se-r) !important;
  padding: 0 18px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  box-shadow: var(--se-shadow-xs) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.securends .se-fetch-files-row .se_btn_new:hover,
.securends .endpointConfigCard .se-fetch-files-row .se_btn_new:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  box-shadow: var(--se-shadow-sm) !important;
}

.securends .se-fetch-files-row .error,
.securends .endpointConfigCard .se-fetch-files-row .error {
  color: #d32f2f !important;
  font-size: 12.5px !important;
  margin: 0 !important;
  float: none !important;
}

.securends .se-fetch-files-row .saveSORSpinner,
.securends .endpointConfigCard .se-fetch-files-row .saveSORSpinner {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  position: static !important;
}

.securends .se-fetch-files-row .saveSORSpinner i,
.securends .endpointConfigCard .se-fetch-files-row .saveSORSpinner i {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  float: none !important;
  padding: 0 !important;
}

/* 3. Single horizontal line for Include Last Auth Date checkbox (Image 2) */
.securends .se-last-auth-date-checkbox,
.securends .endpointConfigCard .se-last-auth-date-checkbox {
  display: flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: 100% !important;
  margin-top: 8px !important;
  margin-bottom: 0 !important;
  padding-left: 0 !important;
  white-space: nowrap !important;
}

.securends .se-last-auth-date-checkbox .custom-checkbox,
.securends .endpointConfigCard .se-last-auth-date-checkbox .custom-checkbox {
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
}

.securends .se-last-auth-date-checkbox .custom-control-label,
.securends .endpointConfigCard .se-last-auth-date-checkbox .custom-control-label {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
  cursor: pointer !important;
  gap: 6px !important;
  margin: 0 !important;
  line-height: normal !important;
}

.securends .se-last-auth-date-checkbox .custom-control-label span {
  white-space: nowrap !important;
  display: inline !important;
}

.securends .se-last-auth-date-checkbox .custom-control-label i.fa-info-circle {
  font-size: 13.5px !important;
  color: var(--se-muted) !important;
  margin-left: 4px !important;
  cursor: pointer !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

.securends .se-last-auth-date-checkbox .custom-control-label i.fa-info-circle:hover {
  color: var(--se-brand) !important;
}

/* 4. Test Connection Action Row & Button Modernization (Image 2 & Image 3) */
.securends .se-test-conn-row,
.securends .endpointConfigCard .se-test-conn-row {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 12px !important;
  clear: both !important;
  padding: 0 12px !important;
  margin: 20px 0 8px !important;
  box-sizing: border-box !important;
  float: none !important;
  position: static !important;
}

.securends .se-test-conn-row .se_btn_new_testConnection,
.securends .endpointConfigCard .se-test-conn-row .se_btn_new_testConnection {
  position: static !important;
  right: auto !important;
  left: auto !important;
  top: auto !important;
  bottom: auto !important;
  float: none !important;
  height: 36px !important;
  min-height: 36px !important;
  border-radius: var(--se-r) !important;
  padding: 0 18px !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  box-shadow: var(--se-shadow-xs) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  margin: 0 !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.securends .se-test-conn-row .se_btn_new_testConnection:hover,
.securends .endpointConfigCard .se-test-conn-row .se_btn_new_testConnection:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  box-shadow: var(--se-shadow-sm) !important;
}

.securends .se-test-conn-row .se_btn_new_testConnection:disabled,
.securends .se-test-conn-row .se_btn_new_testConnection.isADDisabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

.securends .se-test-conn-row .error,
.securends .endpointConfigCard .se-test-conn-row .error {
  color: #d32f2f !important;
  font-size: 12.5px !important;
  margin: 0 !important;
  float: none !important;
}

.securends .se-test-conn-row .saveSORSpinner,
.securends .endpointConfigCard .se-test-conn-row .saveSORSpinner {
  display: inline-flex !important;
  align-items: center !important;
  margin: 0 !important;
  position: static !important;
}

.securends .se-test-conn-row .saveSORSpinner i,
.securends .endpointConfigCard .se-test-conn-row .saveSORSpinner i {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  float: none !important;
  padding: 0 !important;
}

/* ---- AZUREAD Test Connection: dynamic state overrides ---- */
/* Primary (default) state — reinforce brand navy over legacy #11aaec */
.securends .se-test-conn-row button.se_btn_new_testConnection.custom_primary {
  background: var(--se-brand) !important;
  border-color: var(--se-brand) !important;
  color: #fff !important;
}
.securends .se-test-conn-row button.se_btn_new_testConnection.custom_primary:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
}

/* Danger state — "Connection Failed" */
.securends .se-test-conn-row button.se_btn_new_testConnection.custom_danger {
  background: var(--se-risk, #d32f2f) !important;
  border-color: var(--se-risk, #d32f2f) !important;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(211, 47, 47, 0.18) !important;
}
.securends .se-test-conn-row button.se_btn_new_testConnection.custom_danger:hover {
  background: #b71c1c !important;
  border-color: #b71c1c !important;
}

/* Success state — "Success" */
.securends .se-test-conn-row button.se_btn_new_testConnection.custom_success {
  background: var(--se-ok, #1b7f5b) !important;
  border-color: var(--se-ok, #1b7f5b) !important;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(27, 127, 91, 0.18) !important;
}
.securends .se-test-conn-row button.se_btn_new_testConnection.custom_success:hover {
  background: #155e42 !important;
  border-color: #155e42 !important;
}

/* Ensure the o-form-button-bar without se-test-conn-row still aligns right
   (fallback for any edge case we haven't caught) */
.securends .card.sor-header .o-form-button-bar {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  padding: 0 12px !important;
  gap: 10px !important;
}

/* Azure AD Configure Application on SOR create/update: two equal columns.
   Beats the single-column row reset that matches this row because it also
   contains the full-width Include Last Auth Date field. */
.securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row,
.securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row,
.securends.securends .se-create-app.se-sor-create-page .endpointConfigCard .row.se-azure-config-row:not(:where(.se-create-parity *)),
.securends.securends .se-create-app.se-sor-update-page .endpointConfigCard .row.se-azure-config-row:not(:where(.se-create-parity *)) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  column-gap: 24px !important;
  row-gap: 16px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  border: none !important;
  border-bottom: none !important;
  box-sizing: border-box !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row > .col-md-6,
.securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row > .col-md-6,
.securends.securends .se-create-app.se-sor-create-page .endpointConfigCard .row.se-azure-config-row > .col-md-6:not(:where(.se-create-parity *)),
.securends.securends .se-create-app.se-sor-update-page .endpointConfigCard .row.se-azure-config-row > .col-md-6:not(:where(.se-create-parity *)) {
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: none !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  grid-column: auto !important;
  box-sizing: border-box !important;
  display: block !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row > .col-md-12,
.securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row > .col-md-12,
.securends.securends .se-create-app.se-sor-create-page .endpointConfigCard .row.se-azure-config-row > .col-md-12:not(:where(.se-create-parity *)),
.securends.securends .se-create-app.se-sor-update-page .endpointConfigCard .row.se-azure-config-row > .col-md-12:not(:where(.se-create-parity *)) {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row > .col-md-6:not(:has(.configureInputs)),
.securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row > .col-md-6:not(:has(.configureInputs)),
.securends.securends .se-create-app.se-sor-create-page .endpointConfigCard .row.se-azure-config-row > .col-md-6:not(:has(.configureInputs)):not(:where(.se-create-parity *)),
.securends.securends .se-create-app.se-sor-update-page .endpointConfigCard .row.se-azure-config-row > .col-md-6:not(:has(.configureInputs)):not(:where(.se-create-parity *)) {
  display: none !important;
}

.securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row .configureInputs,
.securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row .configureInputs,
.securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row .form-group,
.securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row .form-group,
.securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row input.form-control,
.securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row input.form-control {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

@media (max-width: 768px) {
  .securends.securends .se-sor-create-page .endpointConfigCard .row.se-azure-config-row,
  .securends.securends .se-sor-update-page .endpointConfigCard .row.se-azure-config-row,
  .securends.securends .se-create-app.se-sor-create-page .endpointConfigCard .row.se-azure-config-row:not(:where(.se-create-parity *)),
  .securends.securends .se-create-app.se-sor-update-page .endpointConfigCard .row.se-azure-config-row:not(:where(.se-create-parity *)) {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Create + Update SOR: Test Connection at bottom-right — divider above, gap below to card border. */
.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row::before,
.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row::after {
  display: none !important;
  content: none !important;
  flex: 0 0 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row > .col-md-12:has(.se-last-auth-date-checkbox) {
  grid-column: 1 / -1 !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  align-self: center !important;
}

.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row .se-last-auth-date-checkbox {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.securends.securends :is(.se-sor-create-page, .se-sor-update-page).se-create-app .endpointConfigCard .se-azure-config-row > .se-test-conn-row:not(:where(.se-create-parity *)),
.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row > .se-test-conn-row {
  grid-column: 1 / -1 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  align-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 8px 0 0 !important;
  padding: 12px 0 20px !important;
  border-top: 1px solid var(--se-line-soft) !important;
  box-sizing: border-box !important;
  float: none !important;
  position: static !important;
}

@media (max-width: 768px) {
  .securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row > .col-md-12:has(.se-last-auth-date-checkbox),
  .securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row > .se-test-conn-row {
    grid-column: 1 / -1 !important;
  }

  .securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .se-azure-config-row > .se-test-conn-row {
    justify-content: flex-start !important;
  }
}

/* Azure create/update: empty attributes-conn-wrapper only adds a stray divider + whitespace below Test Connection. */
.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .attributes-conn-wrapper.row:not(:has(.configureInputs)):not(:has(input)):not(:has(select)):not(:has(textarea)):not(:has(label)):not(:has(.custom-control)):not(:has(.settingsTitleName)):not(:has(.o-form-label)) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  border: none !important;
  overflow: hidden !important;
}

.securends.securends :is(.se-sor-create-page, .se-sor-update-page).se-create-app .card.sor-header:has(.se-azure-config-row .se-test-conn-row) > .card-body:not(:where(.se-create-parity *)),
.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .card.sor-header:has(.se-azure-config-row .se-test-conn-row) > .card-body,
.securends.securends :is(.se-sor-create-page, .se-sor-update-page).se-create-app .card.sor-header:has(.se-azure-config-row .se-test-conn-row) > [class=""]:not(:where(.se-create-parity *)),
.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .card.sor-header:has(.se-azure-config-row .se-test-conn-row) > [class=""] {
  padding-bottom: 20px !important;
}

.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard:has(.se-azure-config-row .se-test-conn-row),
.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard:has(.se-azure-config-row .se-test-conn-row) .hrsystemAppCnt {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.securends.securends :is(.se-sor-create-page, .se-sor-update-page) .endpointConfigCard .col-md-12:has(> .se-azure-config-row) {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}


/* SoD Reports — /endpoint/sod (SeperationOfDuties).
   Wrapper: .se-sod-page. Presentation only.
   Sidebar label: Reports (customerType sod). Not SOD campaigns (*SOD) unless named. */

.securends .se-sod-page {
  padding: 0 !important;
}

/* ── Page toolbar: Reports + Add + Refresh on one card ── */
.securends .se-sod-page .row.manageApp,
.securends .se-sod-page .reports-page-header,
.securends .se-sod-page .sod-policy-list-header {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 16px !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  width: 100%;
  background: transparent !important; /* beat pickels #f7f7f7 & kit.css card border */
  justify-content: flex-start !important;
}

.securends .se-sod-page .reports-page-header-left {
  display: contents; /* flatten nested column so title card is the chrome */
}

.securends .se-sod-page h2.o-form-title-bar,
.securends .se-sod-page .o-form-title-bar {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 10px 20px !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
  min-height: var(--se-page-toolbar);
  height: auto !important;
  width: 100% !important;
  box-sizing: border-box;
  position: static !important;
  top: auto !important;
  left: auto !important;
  font-size: var(--se-t-page-head) !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  line-height: 1.3 !important;
}

.securends .se-sod-page .reports-page-header .se-toolbar-actions {
  display: flex !important;
  align-items: center;
  flex: 1 1 auto;
  margin-left: 0 !important;
  float: none !important;
  width: 100%;
}

/* Beat pickels absolute Refresh */
.securends .se-sod-page .campaign_progress,
.securends .se-sod-page .campaign_progress.reports-page-refresh {
  position: static !important;
  float: none !important;
  right: auto !important;
  margin: 0 !important;
}

/* "Add" button on Reports list page — filled primary blue button positioned right next to header title */
.securends .se-sod-page .reports-page-header .se-toolbar-actions .addButtonData,
.securends .se-sod-page .reports-page-header .se-toolbar-actions button.custom__pg {
  background: var(--se-brand, #17457E) !important;
  border: 1px solid var(--se-brand, #17457E) !important;
  color: #ffffff !important;
  border-radius: var(--se-r-sm, 8px) !important;
  height: 32px !important;
  line-height: 30px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  margin: 0 !important;
  margin-right: auto !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.securends .se-sod-page .reports-page-header .se-toolbar-actions .addButtonData:hover,
.securends .se-sod-page .reports-page-header .se-toolbar-actions button.custom__pg:hover {
  background: var(--se-brand-hover, #10365F) !important;
  border-color: var(--se-brand-hover, #10365F) !important;
  color: #ffffff !important;
}

/* "Refresh" button on Reports list page — outlined light button positioned on far right */
.securends .se-sod-page .reports-page-header .se-toolbar-actions button.button-primary.blue {
  background: var(--se-card, #ffffff) !important;
  border: 1px solid var(--se-line, #E2E8F0) !important;
  color: var(--se-ink-2, #475569) !important;
  border-radius: var(--se-r-sm, 8px) !important;
  height: 32px !important;
  line-height: 30px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-left: auto !important;
  box-shadow: none !important;
  cursor: pointer !important;
}

.securends .se-sod-page .reports-page-header .se-toolbar-actions button.button-primary.blue:hover {
  background: var(--se-row-hover, #F8FAFC) !important;
  border-color: var(--se-brand-line, #CBD5E1) !important;
  color: var(--se-brand, #17457E) !important;
}

/* Create / View SOD Report header toolbar & Back button alignment & solid primary styling */
.securends .se-sod-page.create-sod-report-page .o-form-title-bar > .se-toolbar-actions,
.securends .se-sod-page.create-sod-report-page .se-toolbar-actions,
.securends .se-sod-page.view-sod-report-page .o-form-title-bar > .se-toolbar-actions,
.securends .se-sod-page.view-sod-report-page .se-toolbar-actions,
.securends .se-sod-page .create-sod-report-header-row .se-toolbar-actions,
.securends .se-sod-page .view-sod-report-header-row .se-toolbar-actions {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto !important;
  width: auto !important;
}

.securends .se-sod-page.create-sod-report-page .AddAppBtn,
.securends .se-sod-page.create-sod-report-page button.AddAppBtn,
.securends .se-sod-page.view-sod-report-page .AddAppBtn,
.securends .se-sod-page.view-sod-report-page button.AddAppBtn,
.securends .se-sod-page .create-sod-report-header-row .AddAppBtn,
.securends .se-sod-page .view-sod-report-header-row .AddAppBtn {
  background: var(--se-brand, #17457E) !important;
  border: 1px solid var(--se-brand, #17457E) !important;
  color: #ffffff !important;
  border-radius: var(--se-r-sm, 8px) !important;
  box-shadow: none !important;
  height: 32px !important;
  line-height: 30px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-left: auto !important;
  cursor: pointer !important;
}

.securends .se-sod-page.create-sod-report-page .AddAppBtn:hover,
.securends .se-sod-page.create-sod-report-page button.AddAppBtn:hover,
.securends .se-sod-page.view-sod-report-page .AddAppBtn:hover,
.securends .se-sod-page.view-sod-report-page button.AddAppBtn:hover,
.securends .se-sod-page .create-sod-report-header-row .AddAppBtn:hover,
.securends .se-sod-page .view-sod-report-header-row .AddAppBtn:hover {
  background: var(--se-brand-hover, #103463) !important;
  border-color: var(--se-brand-hover, #103463) !important;
  color: #ffffff !important;
}

/* ReactTable — kit/tables.css apply; reinforce ink */
.securends .se-sod-page .ReactTable .rt-th,
.securends .se-sod-page .ReactTable .rt-td {
  font-family: var(--se-sans) !important;
  color: var(--se-ink);
}

.securends .se-sod-page .ReactTable .rt-th {
  font-weight: 600 !important;
  font-size: 12px !important;
}

.securends .se-sod-page .table-container {
  margin-top: 0 !important;
}

/* SoD Validation Policy list — keep header / filter / body on one flex track
   after search. Truncated header labels were being measured and pixel-locked,
   which opened a gutter and shifted Last Modified columns. */
.securends .se-sod-policy-list-page .table-container {
  width: 100% !important;
  max-width: 100% !important;
}

.securends .se-sod-policy-list-page .ReactTable {
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.securends .se-sod-policy-list-page .ReactTable .rt-table {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

.securends .se-sod-policy-list-page .ReactTable .rt-thead .rt-tr,
.securends .se-sod-policy-list-page .ReactTable .rt-tbody .rt-tr {
  display: flex !important;
  width: 100% !important;
  min-width: 100% !important;
}

.securends .se-sod-policy-list-page .ReactTable .rt-th,
.securends .se-sod-policy-list-page .ReactTable .rt-td {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

.securends .se-sod-policy-list-page .ReactTable .rt-thead.-header .rt-th:nth-child(1),
.securends .se-sod-policy-list-page .ReactTable .rt-thead.-filters .rt-th:nth-child(1),
.securends .se-sod-policy-list-page .ReactTable .rt-tbody .rt-td:nth-child(1) {
  flex: 0 0 74px !important;
  width: 74px !important;
}

.securends .se-sod-policy-list-page .ReactTable .rt-thead.-header .rt-th:nth-child(5),
.securends .se-sod-policy-list-page .ReactTable .rt-thead.-filters .rt-th:nth-child(5),
.securends .se-sod-policy-list-page .ReactTable .rt-tbody .rt-td:nth-child(5) {
  flex: 1.4 1 160px !important;
}

.securends .se-sod-policy-list-page .ReactTable .rt-thead.-header .rt-th:nth-child(7),
.securends .se-sod-policy-list-page .ReactTable .rt-thead.-filters .rt-th:nth-child(7),
.securends .se-sod-policy-list-page .ReactTable .rt-tbody .rt-td:nth-child(7) {
  flex: 1.1 1 170px !important;
}

.securends .se-sod-policy-list-page .ReactTable .rt-thead.-filters .rt-th input,
.securends .se-sod-policy-list-page .ReactTable .rt-thead.-filters .rt-th .form-control {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* Actions gear — Bootstrap dropdown (SODPopup); matches /endpoints standard */
.securends .se-sod-page .dropdown.badge {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.securends .se-sod-page .dropdown.badge > .btn.dropdown-toggle {
  background: transparent !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  color: var(--se-ink-2) !important;
  box-shadow: none !important;
  padding: 4px 8px !important;
  height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.securends .se-sod-page .dropdown.badge > .btn.dropdown-toggle:hover,
.securends .se-sod-page .dropdown.badge.open > .btn.dropdown-toggle,
.securends .se-sod-page .dropdown.badge.show > .btn.dropdown-toggle {
  border-color: var(--se-brand) !important;
  color: var(--se-brand) !important;
  background: var(--se-brand-tint) !important;
}

.securends .se-sod-page .dropdown.badge .fa.appGear {
  color: inherit !important;
}

/* Dropdown Menu Container (both in-table and portaled to body) */
.securends .se-sod-page .dropdown-menu,
.securends .se-sod-page .dropdown.badge .dropdown-menu,
.securends .se-sod-page .ReactTable .dropdown-menu.leftAlign,
body > .dropdown-menu.se-table-action-menu-portaled,
body > .dropdown-menu.leftAlign {
  background: var(--se-card) !important;
  background-color: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: 12px !important;
  box-shadow: var(--se-shadow-lg) !important;
  padding: 6px !important;
  min-width: 160px !important;
}

/* Remove dividers & borders from list items and links */
.securends .se-sod-page .dropdown-menu li,
.securends .se-sod-page .dropdown-menu li > a,
.securends .se-sod-page .dropdown-menu .child,
body > .dropdown-menu.se-table-action-menu-portaled li,
body > .dropdown-menu.se-table-action-menu-portaled li > a,
body > .dropdown-menu.se-table-action-menu-portaled .child,
body > .dropdown-menu.leftAlign li,
body > .dropdown-menu.leftAlign li > a,
body > .dropdown-menu.leftAlign .child {
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Menu link items */
.securends .se-sod-page .dropdown-menu li > a,
.securends .se-sod-page .dropdown-menu .child,
body > .dropdown-menu.se-table-action-menu-portaled li > a,
body > .dropdown-menu.se-table-action-menu-portaled .child,
body > .dropdown-menu.leftAlign li > a,
body > .dropdown-menu.leftAlign .child {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  font-family: var(--se-sans) !important;
  color: var(--se-ink) !important;
  border-radius: 8px !important;
  background: transparent !important;
  text-decoration: none !important;
  cursor: pointer !important;
  line-height: 1.3 !important;
  min-height: 34px !important;
  margin: 0 !important;
}

/* Hover & Focus state */
.securends .se-sod-page .dropdown-menu li > a:hover,
.securends .se-sod-page .dropdown-menu li > a:focus,
.securends .se-sod-page .dropdown-menu .child:hover,
body > .dropdown-menu.se-table-action-menu-portaled li > a:hover,
body > .dropdown-menu.se-table-action-menu-portaled .child:hover,
body > .dropdown-menu.leftAlign li > a:hover,
body > .dropdown-menu.leftAlign .child:hover {
  background: var(--se-row-hover, #EFF6FF) !important;
  color: var(--se-ink) !important;
}

/* Icons inside action items */
.securends .se-sod-page .dropdown-menu li > a i,
.securends .se-sod-page .dropdown-menu .child i,
body > .dropdown-menu.se-table-action-menu-portaled i,
body > .dropdown-menu.leftAlign i {
  width: 16px !important;
  min-width: 16px !important;
  font-size: 14px !important;
  color: var(--se-ink-2) !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.securends .se-sod-page .dropdown-menu li > a:hover i,
.securends .se-sod-page .dropdown-menu .child:hover i,
body > .dropdown-menu.se-table-action-menu-portaled li > a:hover i,
body > .dropdown-menu.leftAlign li > a:hover i {
  color: var(--se-brand) !important;
}

/* Empty / loader */
.securends .se-sod-page .noDataComponent {
  color: var(--se-ink-2) !important;
  font-family: var(--se-sans) !important;
}

/* SoD Queries list cell styling */
.securends .se-sod-page .sodQueryColumn ul {
  margin: 0 !important;
  padding-left: 18px !important;
  list-style-type: disc !important;
}

.securends .se-sod-page .sodQueryColumn li {
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: var(--se-ink) !important;
  word-break: break-word !important;
}

@media (max-width: 768px) {
  .securends .se-sod-page h2.o-form-title-bar {
    flex-wrap: wrap;
  }
}

/* ═══════════════════════════════════════════════════════════
   Create SoD Policy Config — /createSodPolicyConfig
   Wrapper: .se-sod-policy-page (CreateSoDPolicyConfig).
   Paired UpdateSoDPolicyConfig is NOT styled until named.
   ═══════════════════════════════════════════════════════════ */

.securends .se-sod-policy-page {
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.securends .se-sod-policy-page.endpointConfigCard,
.securends .se-sod-policy-page.sodCard {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Strip outer box from .row.manageApp — only .o-form-title-bar is the card */
.securends .se-sod-policy-page .row.manageApp {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  width: 100%;
  position: static !important;
  top: auto !important;
}

.securends .se-sod-policy-page .row.manageApp .o-form-title-bar,
.securends .se-sod-policy-page .o-form-title-bar,
.securends .se-sod-policy-page div.o-form-title-bar {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 10px 20px !important;
  margin: 0 0 16px !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  min-height: var(--se-page-toolbar);
  height: auto !important;
  width: 100% !important;
  box-sizing: border-box;
  position: static !important;
  font-size: var(--se-t-page-head) !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  line-height: 1.3 !important;
}

.securends .se-sod-policy-page .o-form-title-bar > span,
.securends .se-sod-policy-page .se-toolbar-actions {
  float: none !important;
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
}

.securends .se-sod-policy-page .AddAppBtn,
.securends .se-sod-policy-page button.AddAppBtn,
.securends .se-sod-policy-page .button-primary.blue,
.securends .se-sod-policy-page .submit-button {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  height: 28px !important;
  padding: 0 14px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 26px !important;
  margin: 0 !important;
}

/* Duty "Select Entitlements" — when no entitlement selected (full width) */
.securends .se-sod-policy-page .sod_query_box button.entitlementButtonNew,
.securends .se-sod-policy-page .sod_query_box1 button.entitlementButtonNew,
.securends .se-sod-policy-page button.submit-button.entitlementButtonNew {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  line-height: 34px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* Duty "Select Entitlements" — when entitlement IS selected (auto width next to Remove button) */
.securends .se-sod-policy-page .sod_query_box button.entitlementButton,
.securends .se-sod-policy-page .sod_query_box1 button.entitlementButton,
.securends .se-sod-policy-page button.submit-button.entitlementButton {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  line-height: 34px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  width: auto !important;
  max-width: max-content !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* Duty "Remove Entitlements" button */
.securends .se-sod-policy-page .sod_query_box .MuiButton-root,
.securends .se-sod-policy-page .sod_query_box1 .MuiButton-root,
.securends .se-sod-policy-page .sod_query_box button.capitalize,
.securends .se-sod-policy-page .sod_query_box1 button.capitalize {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  line-height: 34px !important;
  padding: 0 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
  border-radius: var(--se-r) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  background: var(--se-card) !important;
  box-shadow: none !important;
}

.securends .se-sod-policy-page .sod_query_box .MuiButton-root:hover,
.securends .se-sod-policy-page .sod_query_box1 .MuiButton-root:hover,
.securends .se-sod-policy-page .sod_query_box button.capitalize:hover,
.securends .se-sod-policy-page .sod_query_box1 button.capitalize:hover {
  background: var(--se-row-hover, #EFF6FF) !important;
  border-color: var(--se-brand) !important;
  color: var(--se-brand) !important;
}

.securends .se-sod-policy-page .AddAppBtn:hover,
.securends .se-sod-policy-page .button-primary.blue:hover,
.securends .se-sod-policy-page .submit-button:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
}

.securends .se-sod-policy-page .AddAppBtn:disabled,
.securends .se-sod-policy-page .submit-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* Form surface — one card around the policy fields */
.securends .se-sod-policy-page > div > .row:not(.manageApp) > div > .col-md-12.form-group {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 16px 20px !important;
  margin: 0 0 16px !important;
  box-sizing: border-box;
}

.securends .se-sod-policy-page .control-label.temp-lbl,
.securends .se-sod-policy-page label.control-label {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--se-ink-2) !important;
  font-family: var(--se-sans) !important;
}

.securends .se-sod-policy-page .form-control,
.securends .se-sod-policy-page input[type="text"],
.securends .se-sod-policy-page textarea,
.securends .se-sod-policy-page select.form-control {
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background-color: var(--se-card) !important;
  color: var(--se-ink) !important;
  font-size: 13px !important;
  font-family: var(--se-sans) !important;
}

.securends .se-sod-policy-page .form-control:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 2px var(--se-brand-tint) !important;
}

.securends .se-sod-policy-page .error {
  color: var(--se-risk) !important;
  font-size: 12px !important;
}

.securends .se-sod-policy-page .sod_container {
  overflow: visible !important;
}

/* SoD Query outer frame — same chrome as duty cards, less side padding */
.securends .se-sod-policy-page .row:has(> ul > .sod_query_box),
.securends .se-sod-policy-page .col-md-11 > .row:has(.sod_query_box) {
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  background: var(--se-card) !important;
  box-shadow: var(--se-shadow) !important;
  padding: 10px 8px 14px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.securends .se-sod-policy-page .sod_query_box,
.securends .se-sod-policy-page .sod_query_box1,
.securends .se-sod-policy-page li.sod_query_box {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: none;
  overflow: visible !important;
  position: relative;
  padding: 8px 10px 12px !important;
  box-sizing: border-box;
  width: 45.5% !important;
  margin-left: 8px !important;
}

.securends .se-sod-policy-page .sod_query_operator_box {
  color: var(--se-ink-2) !important;
}

.securends .se-sod-policy-page .sod_center {
  color: var(--se-ink) !important;
  font-weight: 600 !important;
}

.securends .se-sod-policy-page .endPointRolesContainer {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 8px !important;
}

.securends .se-sod-policy-page .uar-radio {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.securends .se-sod-policy-page .o-form-button-bar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--se-line-soft);
  width: 100%;
}

/* Duty field rows — label next to control, no Bootstrap gutter */
.securends .se-sod-policy-page .sod_query_box .row.form-group,
.securends .se-sod-policy-page .sod_query_box1 .row.form-group {
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr);
  column-gap: 10px;
  align-items: center;
  margin: 8px 0 0 !important;
  padding: 0 !important;
  position: relative;
  z-index: 1;
}

/* Keep the open Applications menu above Entitlement / AND-OR radios */
.securends .se-sod-policy-page .sod_query_box .row.form-group:has(.selectUsertype),
.securends .se-sod-policy-page .sod_query_box1 .row.form-group:has(.selectUsertype) {
  z-index: 6;
}

.securends .se-sod-policy-page .sod_query_box .row.form-group:has(.selectUsertype):focus-within,
.securends .se-sod-policy-page .sod_query_box1 .row.form-group:has(.selectUsertype):focus-within {
  z-index: 50;
}

.securends .se-sod-policy-page .sod_query_box .row.form-group > [class*="col-"],
.securends .se-sod-policy-page .sod_query_box1 .row.form-group > [class*="col-"] {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.securends .se-sod-policy-page .sod_query_box .row.form-group > div:nth-child(2),
.securends .se-sod-policy-page .sod_query_box1 .row.form-group > div:nth-child(2) {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  min-height: 36px !important;
}

.securends .se-sod-policy-page .sod_query_box .o-form-label,
.securends .se-sod-policy-page .sod_query_box1 .o-form-label,
.securends .se-sod-policy-page .sod_query_box .row.form-group > .col-md-3,
.securends .se-sod-policy-page .sod_query_box1 .row.form-group > .col-md-3 {
  display: flex;
  align-items: center;
  min-height: 36px;
}

.securends .se-sod-policy-page .sod_query_box .o-form-input,
.securends .se-sod-policy-page .sod_query_box1 .o-form-input {
  display: block;
}

.securends .se-sod-policy-page .sod_query_box .control-label.temp-lbl,
.securends .se-sod-policy-page .sod_query_box1 .control-label.temp-lbl {
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  line-height: 1.3 !important;
}

.securends .se-sod-policy-page .sod_query_box .Create_Mulitselect,
.securends .se-sod-policy-page .sod_query_box1 .Create_Mulitselect {
  margin-top: 0 !important;
  width: 100% !important;
}

/* react-select — one field chrome (no nested inner box) */
.securends .se-sod-policy-page .selectUsertype {
  min-width: 0 !important;
  width: 100% !important;
}

.securends .se-sod-policy-page .selectUsertype > div:not([class$="-control"]) {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  margin: 0 !important;
  min-width: 0 !important;
  width: 100% !important;
}

.securends .se-sod-policy-page .selectUsertype [class$="-control"],
.securends .se-sod-policy-page .selectUsertype .css-yk16xz-control,
.securends .se-sod-policy-page .selectUsertype .react-select__control {
  min-height: 36px !important;
  height: 36px !important;
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  align-items: center !important;
  overflow: hidden;
}

.securends .se-sod-policy-page .selectUsertype [class$="-control"]:hover,
.securends .se-sod-policy-page .selectUsertype .react-select__control:hover {
  border-color: var(--se-brand-line, var(--se-brand)) !important;
}

.securends .se-sod-policy-page .selectUsertype [class$="-control"][class*="focused"],
.securends .se-sod-policy-page .selectUsertype [class$="-control"]:focus-within,
.securends .se-sod-policy-page .selectUsertype .react-select__control--is-focused {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 2px var(--se-brand-tint) !important;
  overflow: visible;
}

.securends .se-sod-policy-page .selectUsertype [class*="-ValueContainer"],
.securends .se-sod-policy-page .selectUsertype [class*="-value-container"],
.securends .se-sod-policy-page .selectUsertype .react-select__value-container {
  height: 34px !important;
  min-height: 34px !important;
  padding: 0 8px 0 12px !important;
  display: flex !important;
  align-items: center !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-singleValue"],
.securends .se-sod-policy-page .selectUsertype [class*="-single-value"],
.securends .se-sod-policy-page .selectUsertype [class*="-placeholder"],
.securends .se-sod-policy-page .selectUsertype .react-select__placeholder,
.securends .se-sod-policy-page .selectUsertype .react-select__single-value {
  color: var(--se-ink) !important;
  font-size: 13px !important;
  line-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-placeholder"],
.securends .se-sod-policy-page .selectUsertype .react-select__placeholder {
  color: var(--se-ink-3) !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-indicatorSeparator"],
.securends .se-sod-policy-page .selectUsertype .react-select__indicator-separator {
  display: none !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-indicatorContainer"],
.securends .se-sod-policy-page .selectUsertype [class*="-dropdownIndicator"],
.securends .se-sod-policy-page .selectUsertype [class*="-clearIndicator"] {
  color: var(--se-ink-2) !important;
  padding: 4px 8px !important;
  background: transparent !important;
  border: none !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-Input"],
.securends .se-sod-policy-page .selectUsertype [class*="-dummyInput"],
.securends .se-sod-policy-page .selectUsertype input,
.securends .se-sod-policy-page .selectUsertype input[type="text"],
.securends .se-sod-policy-page .selectUsertype input[type="search"],
.securends .se-sod-policy-page .selectUsertype textarea {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  min-height: 0 !important;
  height: 18px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.securends .se-sod-policy-page .selectUsertype input:focus,
.securends .se-sod-policy-page .selectUsertype input[type="text"]:focus {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Autocomplete dropdown */
.securends .se-sod-policy-page .ac_dropdown {
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  padding: 6px 10px !important;
  font-family: var(--se-sans) !important;
}

/* Entitlement chips / cards in SoD Policy Remove Entitlements modal popup (Portal rendered at body level) */
.entDesc,
.peoples-list .entDesc,
.modal .entDesc,
html[data-se-theme] .entDesc,
html[data-se-theme] .peoples-list .entDesc,
.securends .entDesc,
.securends .se-sod-policy-page .entDesc {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  float: none !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 5px 10px 5px 12px !important;
  margin: 4px 6px 4px 0 !important;
  background: var(--se-brand-tint, #EFF6FF) !important;
  border: 1px solid var(--se-brand-line, #BFDBFE) !important;
  border-radius: 20px !important;
  color: var(--se-brand, #17457E) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
}

.etName,
.peoples-list .etName,
.modal .etName,
html[data-se-theme] .etName,
html[data-se-theme] .peoples-list .etName,
.securends .etName,
.securends .se-sod-policy-page .etName {
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--se-ink, #0F172A) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 260px !important;
}

.closeEt,
.peoples-list .closeEt,
.modal .closeEt,
html[data-se-theme] .closeEt,
html[data-se-theme] .peoples-list .closeEt,
.securends .closeEt,
.securends .se-sod-policy-page .closeEt {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  border-radius: 50% !important;
  border: none !important;
  background: rgba(15, 23, 42, 0.12) !important;
  color: var(--se-ink-2, #475569) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  transition: all 0.15s ease !important;
}

.closeEt:hover,
.peoples-list .closeEt:hover,
.modal .closeEt:hover,
html[data-se-theme] .closeEt:hover,
.securends .closeEt:hover {
  background: var(--se-risk, #EF4444) !important;
  color: #ffffff !important;
}

/* ReactTable Cell container wrapping entitlement chips inside modal */
.peoples-list .rt-td,
.peoples-list .ReactTable .rt-tbody .rt-td,
.modal .ReactTable .rt-tbody .rt-td {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  align-content: flex-start !important;
  gap: 4px !important;
  padding: 12px !important;
}

.securends .se-sod-policy-page .AttrDeleteBtn_se,
.securends .se-sod-policy-page .AttrDeleteBtn_seDisabled {
  color: var(--se-risk) !important;
  cursor: pointer;
}

.securends .se-sod-policy-page .AttrDeleteBtn_seDisabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Multiselect trigger (do not treat as 3-dots) */
.securends .se-sod-policy-page button.multiselect.dropdown-toggle {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  color: var(--se-ink) !important;
  height: 32px !important;
  font-size: 12px !important;
}

.securends .se-sod-policy-page button.multiselect.dropdown-toggle:hover,
.securends .se-sod-policy-page button.multiselect.dropdown-toggle:focus {
  border-color: var(--se-brand) !important;
}

/* Applications react-select menu popup container */
.securends .se-sod-policy-page .selectUsertype [class*="-menu"]:not([class*="-menuList"]):not([class*="-menu-list"]):not([class*="-menuNotice"]):not([class*="-noOptionsMessage"]),
.securends .se-sod-policy-page .selectUsertype .react-select__menu,
.securends .se-sod-policy-page [class*="-menu"]:not([class*="-menuList"]):not([class*="-menu-list"]):not([class*="-menuNotice"]):not([class*="-noOptionsMessage"]),
.securends .se-sod-policy-page .react-select__menu,
.securends .se-sod-policy-page div[class*="react-select__menu"] {
  background: var(--se-card, #ffffff) !important;
  border: 1px solid var(--se-nav-border, #CBD5E1) !important;
  border-radius: var(--se-r-sm, 8px) !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14), 0 4px 8px rgba(15, 23, 42, 0.06) !important;
  padding: 4px 0 !important;
  margin-top: 4px !important;
  z-index: 1000 !important;
  overflow: hidden !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-menuList"],
.securends .se-sod-policy-page .selectUsertype [class*="-menu-list"],
.securends .se-sod-policy-page .selectUsertype .react-select__menu-list,
.securends .se-sod-policy-page [class*="-menuList"],
.securends .se-sod-policy-page [class*="-menu-list"],
.securends .se-sod-policy-page .react-select__menu-list {
  padding: 4px 0 !important;
  background: var(--se-card, #ffffff) !important;
  border: none !important;
  box-shadow: none !important;
  max-height: 220px !important;
  overflow-y: auto !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-option"],
.securends .se-sod-policy-page .selectUsertype .react-select__option,
.securends .se-sod-policy-page [class*="-option"],
.securends .se-sod-policy-page .react-select__option {
  font-size: 13px !important;
  font-family: var(--se-sans) !important;
  color: var(--se-ink) !important;
  padding: 8px 14px !important;
  border-radius: 0 !important;
  cursor: pointer !important;
  background: var(--se-card, #ffffff) !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-option"]:hover,
.securends .se-sod-policy-page .selectUsertype [class*="-option"][class*="focused"],
.securends .se-sod-policy-page .selectUsertype .react-select__option--is-focused,
.securends .se-sod-policy-page [class*="-option"]:hover,
.securends .se-sod-policy-page [class*="-option"][class*="focused"],
.securends .se-sod-policy-page .react-select__option--is-focused {
  background: var(--se-row-hover, #EFF6FF) !important;
  color: var(--se-brand) !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-option"][class*="selected"],
.securends .se-sod-policy-page .selectUsertype .react-select__option--is-selected,
.securends .se-sod-policy-page [class*="-option"][class*="selected"],
.securends .se-sod-policy-page .react-select__option--is-selected {
  background: var(--se-brand-tint, #DBEAFE) !important;
  color: var(--se-brand) !important;
  font-weight: 600 !important;
}

.securends .se-sod-policy-page .selectUsertype [class*="-noOptionsMessage"],
.securends .se-sod-policy-page [class*="-noOptionsMessage"] {
  color: var(--se-ink-2) !important;
  font-size: 12px !important;
  font-family: var(--se-sans) !important;
  padding: 10px 14px !important;
}

/* Save / submit button styling */

.securends .se-sod-policy-page .campaignTemCancelBtn,
.securends .se-sod-policy-page .submit-button.campaignTemCancelBtn {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  height: 32px !important;
  padding: 0 20px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 30px !important;
  margin: 0 !important;
  cursor: pointer;
}

.securends .se-sod-policy-page .campaignTemCancelBtn:hover {
  background: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
}

.securends .se-sod-policy-page .campaignTemCancelBtn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

@media (max-width: 768px) {
  .securends .se-sod-policy-page .o-form-title-bar {
    flex-wrap: wrap;
  }
}

/* ── Create / View SoD Report + Query screens (also .se-sod-page) ── */
.securends .se-sod-page.create-sod-report-page .create-sod-report-header-row,
.securends .se-sod-page.view-sod-report-page .view-sod-report-header-row,
.securends .se-sod-page .create-sod-report-header,
.securends .se-sod-page .view-sod-report-header {
  background: transparent !important;
  width: 100%;
}

.securends .se-sod-page .view-sod-report-export-menu {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: var(--se-shadow-md) !important;
  padding: 4px 0 !important;
  min-width: 120px;
}

.securends .se-sod-page .view-sod-report-export-menu .dropdown-item {
  color: var(--se-ink) !important;
  font-size: 12px !important;
  padding: 6px 12px !important;
}

.securends .se-sod-page .view-sod-report-export-menu .dropdown-item:hover {
  background: var(--se-brand-tint) !important;
  color: var(--se-brand) !important;
}

/* sodQuery users table header */
.securends .se-sod-page .sodPolicyHeader {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 10px 20px !important;
  margin: 0 0 16px !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  position: static !important;
  top: auto !important;
  width: 100% !important;
  box-sizing: border-box;
}

.securends .se-sod-page .sodPolicyTitle {
  font-size: var(--se-t-page-head) !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
}

.securends .se-sod-page .btn-export {
  margin-left: auto;
}

.securends .se-sod-page .sodPolicyExportButton,
.securends .se-sod-page .custom_pien.createPolicybtn {
  background: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r) !important;
  height: 28px !important;
  padding: 0 14px !important;
  font-size: 12px !important;
}

.securends .se-sod-page .sodWrapper {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 16px 20px !important;
  margin: 0 0 16px !important;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.securends .se-sod-page > h2:not(.o-form-title-bar):not(.header) {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 10px 20px !important;
  margin: 0 0 16px !important;
  font-size: var(--se-t-page-head) !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
}

.securends .se-sod-page .custom_secondary {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r) !important;
  height: 28px !important;
  padding: 0 14px !important;
  font-size: 12px !important;
}

/* ── Create SoD Report Modern Form Card & Layout ── */
.securends .se-sod-page.create-sod-report-page > br {
  display: none !important;
}

.securends .se-sod-page.create-sod-report-page > div:not(.create-sod-report-header-row) {
  background: var(--se-card, #ffffff) !important;
  border: 1px solid var(--se-line, #E2E8F0) !important;
  border-radius: var(--se-r-card, 12px) !important;
  box-shadow: var(--se-shadow, 0 1px 3px rgba(15, 23, 42, 0.08)) !important;
  padding: 28px 32px !important;
  margin-top: 16px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.securends .se-sod-page.create-sod-report-page .row.form-group {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 20px !important;
  gap: 16px !important;
}

.securends .se-sod-page.create-sod-report-page .col-md-2 {
  flex: 0 0 180px !important;
  max-width: 180px !important;
  width: 180px !important;
  padding: 0 !important;
  margin: 0 !important;
}

.securends .se-sod-page.create-sod-report-page .control-label.temp-lbl {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink, #0F172A) !important;
  font-family: var(--se-sans) !important;
  margin: 0 !important;
}

.securends .se-sod-page.create-sod-report-page .col-md-3.o-form-input {
  flex: 0 0 380px !important;
  max-width: 380px !important;
  width: 380px !important;
  padding: 0 !important;
  position: relative !important;
}

.securends .se-sod-page.create-sod-report-page .form-control,
.securends .se-sod-page.create-sod-report-page input[type="text"],
.securends .se-sod-page.create-sod-report-page select.form-control {
  height: 38px !important;
  border: 1px solid var(--se-line, #CBD5E1) !important;
  border-radius: var(--se-r-sm, 8px) !important;
  background-color: var(--se-card, #ffffff) !important;
  color: var(--se-ink, #0F172A) !important;
  font-size: 13px !important;
  font-family: var(--se-sans) !important;
  padding: 8px 14px !important;
  box-shadow: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

/* Native select — vertical-center “On Demand” (top/bottom padding breaks select text) */
.securends .se-sod-page.create-sod-report-page select.form-control,
.securends .se-sod-page.create-sod-report-page .o-form-input select.form-control {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  padding-left: 14px !important;
  padding-right: 32px !important;
  line-height: 36px !important;
  display: block !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 10px 7px !important;
  vertical-align: middle !important;
}

.securends .se-sod-page.create-sod-report-page .form-control:focus,
.securends .se-sod-page.create-sod-report-page input[type="text"]:focus,
.securends .se-sod-page.create-sod-report-page select.form-control:focus {
  border-color: var(--se-brand, #17457E) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint, #DBEAFE) !important;
  outline: none !important;
}

/* MultiSelect Dropdown button styling */
.securends .se-sod-page.create-sod-report-page .selectDropDownTemplate,
.securends .se-sod-page.create-sod-report-page .selectDropDownTemplate .btn-group,
.securends .se-sod-page.create-sod-report-page .selectDropDownTemplate .Create_Mulitselect {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
}

.securends .se-sod-page.create-sod-report-page .multiselect.dropdown-toggle,
.securends .se-sod-page.create-sod-report-page button.multiselect.dropdown-toggle,
.securends .se-sod-page.create-sod-report-page .selectDropDownTemplate button.multiselect.dropdown-toggle {
  height: 38px !important;
  line-height: 22px !important;
  border: 1px solid var(--se-line, #CBD5E1) !important;
  border-radius: var(--se-r-sm, 8px) !important;
  background-color: var(--se-card, #ffffff) !important;
  color: var(--se-ink, #0F172A) !important;
  font-size: 13px !important;
  font-family: var(--se-sans) !important;
  padding: 8px 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

.securends .se-sod-page.create-sod-report-page .multiselect.dropdown-toggle:focus,
.securends .se-sod-page.create-sod-report-page button.multiselect.dropdown-toggle:focus {
  border-color: var(--se-brand, #17457E) !important;
  box-shadow: 0 0 0 3px var(--se-brand-tint, #DBEAFE) !important;
}

.securends .se-sod-page.create-sod-report-page .multiselect.dropdown-toggle b.caret {
  margin-left: auto !important;
  margin-top: 0 !important;
  border-top-color: var(--se-ink-2, #475569) !important;
}

/* Menu: match trigger width (beat pickels 382px); works in-place + when portaled via toggle width */
.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu,
.securends .se-sod-page.create-sod-report-page .selectDropDownTemplate ul.multiselect-container.dropdown-menu {
  background: var(--se-card, #ffffff) !important;
  border: 1px solid var(--se-line, #CBD5E1) !important;
  border-radius: var(--se-r-sm, 8px) !important;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.12) !important;
  padding: 0 0 6px !important;
  max-height: 220px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: auto !important;
  margin: 4px 0 0 !important;
  box-sizing: border-box !important;
  z-index: 100 !important;
}

/* Equal checkbox column — Select all + policy rows */
.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu > li > a,
.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu > li.multiselect-all > a {
  margin: 2px 6px !important;
  width: auto !important;
  min-width: calc(100% - 12px) !important;
  max-width: none !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu li > a > label,
.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu li.multiselect-all > a > label,
.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu li > a > label.checkbox {
  color: var(--se-ink, #0F172A) !important;
  font-size: 13px !important;
  padding: 8px 10px !important;
  font-family: var(--se-sans) !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  text-indent: 0 !important;
}

.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu li > a > label > input[type="checkbox"],
.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu li.multiselect-all > a > label > input[type="checkbox"] {
  position: static !important;
  float: none !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  left: auto !important;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  flex-shrink: 0 !important;
}

.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu li:hover > a > label,
.securends .se-sod-page.create-sod-report-page .multiselect-container.dropdown-menu li.active > a > label {
  background: var(--se-row-hover, #EFF6FF) !important;
  color: var(--se-brand, #17457E) !important;
  border-radius: 4px !important;
}

/* Error text positioning */
.securends .se-sod-page.create-sod-report-page .error {
  color: var(--se-risk, #EF4444) !important;
  font-size: 12px !important;
  margin-top: 4px !important;
  display: block !important;
}

/* Form Action / Button Bar */
.securends .se-sod-page.create-sod-report-page .row:has(.o-form-button-bar) {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 12px !important;
  width: 100% !important;
}

.securends .se-sod-page.create-sod-report-page .o-form-button-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  padding-top: 20px !important;
  border-top: 1px solid var(--se-line, #E2E8F0) !important;
  margin-top: 8px !important;
  width: 100% !important;
  gap: 12px !important;
}

.securends .se-sod-page.create-sod-report-page .submit-button,
.securends .se-sod-page.create-sod-report-page button[type="submit"] {
  background: var(--se-brand, #17457E) !important;
  border: 1px solid var(--se-brand, #17457E) !important;
  color: #ffffff !important;
  border-radius: var(--se-r-sm, 8px) !important;
  height: 36px !important;
  line-height: 34px !important;
  padding: 0 28px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}

.securends .se-sod-page.create-sod-report-page .submit-button:hover,
.securends .se-sod-page.create-sod-report-page button[type="submit"]:hover {
  background: var(--se-brand-hover, #103463) !important;
  border-color: var(--se-brand-hover, #103463) !important;
  color: #ffffff !important;
}

.securends .se-sod-page.create-sod-report-page .submit-button:disabled,
.securends .se-sod-page.create-sod-report-page button[type="submit"]:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

/* Beat pickels update-sod nested header chrome when using se-sod-policy-page */
.securends .se-sod-policy-page .update-sod-policy-header-row,
.securends .se-sod-policy-page .update-sod-policy-header {
  background: transparent !important;
  width: 100%;
}

/* ── View SoD Report Modern Styling ── */
.securends .se-sod-page.view-sod-report-page {
  width: 100% !important;
}

/* Report summary header card (.user-access-title) — compact padding & tight vertical spacing */
.securends .se-sod-page.view-sod-report-page .user-access-title {
  background: var(--se-card, #ffffff) !important;
  border: 1px solid var(--se-line, #E2E8F0) !important;
  border-radius: var(--se-r-card, 12px) !important;
  box-shadow: var(--se-shadow, 0 1px 3px rgba(15, 23, 42, 0.08)) !important;
  padding: 12px 20px !important;
  margin: 12px 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  box-sizing: border-box !important;
}

.securends .se-sod-page.view-sod-report-page .user-access-title .row {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  gap: 8px !important;
  width: 100% !important;
}

.securends .se-sod-page.view-sod-report-page .user-access-title .user-campaign-label {
  margin-right: 0 !important;
  font-size: 13px !important;
  color: var(--se-ink-2, #475569) !important;
  font-weight: 500 !important;
  padding: 0 !important;
  width: 120px !important;
  min-width: 120px !important;
  flex: 0 0 120px !important;
  text-align: left !important;
}

.securends .se-sod-page.view-sod-report-page .user-access-title .col-md-10 {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink, #0F172A) !important;
  padding: 0 !important;
  flex: 1 1 auto !important;
  width: auto !important;
}

/* Policy details card (.policy-details) — compact padding & clean 3-column layout */
.securends .se-sod-page.view-sod-report-page .policy-details {
  background: var(--se-card, #ffffff) !important;
  border: 1px solid var(--se-line, #E2E8F0) !important;
  border-radius: var(--se-r-card, 12px) !important;
  box-shadow: var(--se-shadow, 0 1px 3px rgba(15, 23, 42, 0.08)) !important;
  padding: 16px 20px !important;
  margin: 12px 0 !important;
  box-sizing: border-box !important;
}

/* Remove all unwanted internal borders from nested Bootstrap columns/rows inside .policy-details */
.securends .se-sod-page.view-sod-report-page .policy-details div,
.securends .se-sod-page.view-sod-report-page .policy-details .row,
.securends .se-sod-page.view-sod-report-page .policy-details .col-md-3,
.securends .se-sod-page.view-sod-report-page .policy-details .col-md-6 {
  border: none !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row {
  display: flex !important;
  align-items: stretch !important;
  margin: 0 !important;
  width: 100% !important;
}

/* Policy details Section 1: Policy Name & Identity Filter alignment */
.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:first-child {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 12px !important;
  padding: 4px 16px 4px 4px !important;
  flex: 0 0 28% !important;
  max-width: 28% !important;
  width: 28% !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:first-child .row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: baseline !important;
  margin: 0 !important;
  gap: 8px !important;
  width: 100% !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:first-child .user-campaign-label {
  flex: 0 0 95px !important;
  max-width: 95px !important;
  width: 95px !important;
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--se-ink-2, #475569) !important;
  padding: 0 !important;
  text-align: left !important;
  white-space: nowrap !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:first-child .col-md-6:last-child {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  padding: 0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink, #0F172A) !important;
  word-break: break-word !important;
}

/* Policy details Section 2: SoD Queries column (with clean divider borders) */
.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-6 {
  border-left: 1px solid var(--se-line, #E2E8F0) !important;
  border-right: 1px solid var(--se-line, #E2E8F0) !important;
  padding: 4px 20px !important;
  flex: 0 0 44% !important;
  max-width: 44% !important;
  width: 44% !important;
  min-height: 120px !important;
  max-height: 180px !important;
  overflow-y: auto !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-6 p.text-center b {
  display: block !important;
  text-align: center !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink, #0F172A) !important;
  margin-bottom: 10px !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-6 ul {
  padding-left: 16px !important;
  margin: 0 !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-6 li {
  font-size: 12px !important;
  color: var(--se-ink, #0F172A) !important;
  line-height: 1.6 !important;
  margin-bottom: 4px !important;
}

/* Policy details Section 3: Last Sync column alignment */
.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:last-child {
  display: flex !important;
  flex-direction: column !important;
  padding: 4px 4px 4px 16px !important;
  flex: 0 0 28% !important;
  max-width: 28% !important;
  width: 28% !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:last-child p.text-center b {
  display: block !important;
  text-align: center !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink, #0F172A) !important;
  margin-bottom: 10px !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:last-child .row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 0 8px 0 !important;
  gap: 8px !important;
  width: 100% !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:last-child .user-campaign-label {
  flex: 0 0 auto !important;
  max-width: 55% !important;
  width: auto !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
  font-size: 12px !important;
  color: var(--se-ink-2, #475569) !important;
  font-weight: 500 !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:last-child .user-campaign-label span[style*="width"] {
  width: auto !important;
  display: inline-block !important;
  max-width: 110px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  vertical-align: middle !important;
}

.securends .se-sod-page.view-sod-report-page .policy-details > .row > .col-md-3:last-child .col-md-6:last-child {
  flex: 0 0 auto !important;
  width: auto !important;
  padding: 0 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--se-ink, #0F172A) !important;
  white-space: nowrap !important;
  text-align: right !important;
}

/* Horizontal separators */
.securends .se-sod-page.view-sod-report-page hr {
  border: none !important;
  border-top: 1px solid var(--se-line, #E2E8F0) !important;
  margin: 16px 0 !important;
}

/* ReactTable container in View SOD Report — matches Report List Page table design */
.securends .se-sod-page.view-sod-report-page .ReactTable {
  background: var(--se-card, #ffffff) !important;
  border: 1px solid var(--se-line, #E2E8F0) !important;
  border-radius: var(--se-r-card, 12px) !important;
  box-shadow: var(--se-shadow, 0 1px 3px rgba(15, 23, 42, 0.08)) !important;
  overflow: hidden !important;
  margin-top: 16px !important;
}

.securends .se-sod-page.view-sod-report-page .ReactTable .rt-thead .rt-th {
  background: var(--se-table-head, #F8FAFC) !important;
  color: var(--se-ink-2, #475569) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--se-line, #E2E8F0) !important;
  border-right: none !important;
  box-shadow: none !important;
}

.securends .se-sod-page.view-sod-report-page .ReactTable .rt-tbody .rt-td {
  padding: 10px 14px !important;
  font-size: 13px !important;
  color: var(--se-ink, #0F172A) !important;
  border-bottom: 1px solid var(--se-line, #E2E8F0) !important;
  border-right: none !important;
}

.securends .se-sod-page.view-sod-report-page .ReactTable .rt-tr-group:hover {
  background: var(--se-row-hover, #F8FAFC) !important;
}

.securends .se-sod-page.view-sod-report-page .ReactTable .rt-tbody .rt-tr-group:last-child .rt-td {
  border-bottom: none !important;
}

/* Roles + Access Templates batch (presentation only).
   Wrapper: .se-roles-page
   Routes: /ListofRoles, /createSeRole, /createSeRoleCopy,
   /viewRoles/:rowId, /updateSeRoles/:roleRID, /roles, /rolesReport.
   Access Template Management uses .se-forms-page (forms-flow.css). */

.securends .se-roles-page {
  padding: 0 !important;
}

/* Strip outer card from .row.manageApp — only .o-form-title-bar is the header card */
.securends .se-roles-page .row.manageApp {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  position: static !important;
  top: auto !important;
}

.securends .se-roles-page .row.manageApp>.o-form-title-bar,
.securends .se-roles-page h2.o-form-title-bar,
.securends .se-roles-page div.o-form-title-bar {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 10px 20px !important;
  margin: 0 0 16px !important;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  min-height: var(--se-page-toolbar);
  height: auto !important;
  width: 100% !important;
  box-sizing: border-box;
  position: static !important;
  font-size: var(--se-t-page-head) !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  line-height: 1.3 !important;
}

.securends .se-roles-page h2.header {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 10px 20px !important;
  margin: 0 0 16px !important;
  height: auto !important;
  font-size: var(--se-t-page-head) !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: var(--se-page-toolbar);
}

.securends .se-roles-page .campaign_progress,
.securends .se-roles-page .iam_add_Export {
  position: static !important;
  float: none !important;
  right: auto !important;
  top: auto !important;
  margin: 0 !important;
}

.securends .se-roles-page .o-form-title-bar>.se-toolbar-actions,
.securends .se-roles-page .se-toolbar-actions {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  float: none !important;
}

/* Right-align Back button wrapper inside title bar */
.securends .se-roles-page .o-form-title-bar>span:has(.button_alignment),
.securends .se-roles-page .o-form-title-bar>span:has(button) {
  margin-left: auto !important;
  float: none !important;
  display: inline-flex !important;
  align-items: center;
}

/* Primary brand buttons (Save / Add) */
.securends .se-roles-page .AddAppBtn:not(.button_alignment),
.securends .se-roles-page button.AddAppBtn:not(.button_alignment),
.securends .se-roles-page .custom__pg.AddAppBtn,
.securends .se-roles-page .button-primary.blue:not(.button_alignment),
.securends .se-roles-page .submit-button,
.securends .se-roles-page .custom__pg {
  background: var(--se-brand) !important;
  background-color: var(--se-brand) !important;
  border: 1px solid var(--se-brand) !important;
  color: #fff !important;
  border-radius: var(--se-r-sm, 8px) !important;
  box-shadow: none !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 16px !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-transform: none !important;
}

/* Back button — solid primary like Campaign Preview Back */
html[data-se-theme] .securends .se-roles-page .o-form-title-bar button.button_alignment,
.securends .se-roles-page .o-form-title-bar .button_alignment,
.securends .se-roles-page .o-form-title-bar button.button_alignment,
.securends .se-roles-page .o-form-title-bar .AddAppBtn.button_alignment,
.securends .se-roles-page .o-form-title-bar .button-primary.blue.button_alignment,
.securends .se-roles-page button.button_alignment {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  width: auto !important;
  min-width: 0 !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 12px !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 26px !important;
  letter-spacing: normal !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
  background: var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  background-color: var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  border: 1px solid var(--se-btn-bg, var(--se-brand-fill, var(--se-brand))) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  float: none !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  text-transform: none !important;
  transition: all 0.15s ease-in-out !important;
}

.securends .se-roles-page .iam_add_Export:not([data-type="export"]),
.securends .se-roles-page button.iam_add_Export:not([data-type="export"]) {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r-sm, 8px) !important;
  box-shadow: none !important;
  font-family: var(--se-sans) !important;
  font-weight: 600 !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 16px !important;
  line-height: 1 !important;
  font-size: 13px !important;
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.securends .se-roles-page .custom_secondary {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  border-radius: var(--se-r-sm, 8px) !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

.securends .se-roles-page .AddAppBtn:hover:not(.button_alignment),
.securends .se-roles-page .custom__pg:hover,
.securends .se-roles-page .button-primary.blue:hover:not(.button_alignment),
.securends .se-roles-page .submit-button:hover {
  background: var(--se-brand-hover) !important;
  background-color: var(--se-brand-hover) !important;
  border-color: var(--se-brand-hover) !important;
  color: #ffffff !important;
}

html[data-se-theme] .securends .se-roles-page .o-form-title-bar button.button_alignment:hover,
.securends .se-roles-page .o-form-title-bar .button_alignment:hover,
.securends .se-roles-page .o-form-title-bar button.button_alignment:hover,
.securends .se-roles-page .o-form-title-bar .AddAppBtn.button_alignment:hover,
.securends .se-roles-page button.button_alignment:hover {
  background: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  background-color: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  border-color: var(--se-btn-bg-hover, var(--se-brand-fill-hover, var(--se-brand-hover))) !important;
  color: var(--se-btn-fg, #fff) !important;
  -webkit-text-fill-color: var(--se-btn-fg, #fff) !important;
}

.securends .se-roles-page .iam_add_Export:hover:not([data-type="export"]),
.securends .se-roles-page button.iam_add_Export:hover:not([data-type="export"]) {
  background: var(--se-page) !important;
  color: var(--se-ink) !important;
  border-color: var(--se-line-soft) !important;
}

.securends .se-roles-page .o-form-title-bar select,
.securends .se-roles-page #statusSelect {
  background-color: var(--se-card) !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 7px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  color: var(--se-ink) !important;
  font-size: 12px !important;
  height: 28px !important;
  padding: 0 24px 0 8px !important;
  font-weight: 400 !important;
}

html[data-se-mode="dark"] .securends .se-roles-page .o-form-title-bar select,
html[data-se-mode="dark"] .securends .se-roles-page #statusSelect {
  background-image: var(--se-select-caret-dark) !important;
}

.securends .se-roles-page .o-form-title-bar label {
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
}

.securends .se-roles-page .row.table-container {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

.securends .se-roles-page .ReactTable .rt-th,
.securends .se-roles-page .ReactTable .rt-td {
  font-family: var(--se-sans) !important;
  color: var(--se-ink);
}

.securends .se-roles-page .ReactTable .rt-th {
  font-weight: 600 !important;
  font-size: 12px !important;
}

.securends .se-roles-page .ReactTable .rt-thead.-header .rt-th {
  display: flex !important;
  align-items: center !important;
  padding: 8px 12px !important;
  height: var(--se-table-colhead) !important;
  box-sizing: border-box !important;
}

.securends .se-roles-page .ReactTable .rt-thead.-header .rt-th .rt-resizable-header-content {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.securends .se-roles-page .ReactTable .rt-tbody .rt-td {
  display: flex !important;
  align-items: center !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
}

.securends .se-roles-page .ReactTable .rt-thead.-filters .rt-th {
  position: relative !important;
  overflow: visible !important;
}

.securends .se-roles-page .campaignList,
.securends .se-roles-page .react-datepicker-wrapper,
.securends .se-roles-page .react-datepicker__input-container {
  width: 100% !important;
  display: block !important;
}

.securends .se-roles-page .react-datepicker__input-container input {
  height: 28px !important;
  font-size: 12px !important;
  padding: 0 22px 0 8px !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

.securends .se-roles-page .react-datepicker__close-icon {
  right: 4px !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}

.securends .se-roles-page .react-datepicker__close-icon::after {
  background-color: var(--se-ink-3) !important;
  color: var(--se-card) !important;
  font-size: 12px !important;
  height: 16px !important;
  width: 16px !important;
  line-height: 16px !important;
}

/* Datepicker calendar popper selected day contrast */
.react-datepicker__day--selected,
.react-datepicker__day--keyboard-selected,
.react-datepicker__day--in-selecting-range,
.react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__quarter-text--selected,
.securends .react-datepicker__day--selected,
.securends .react-datepicker__day--keyboard-selected,
div.react-datepicker__day.react-datepicker__day--selected,
div.react-datepicker__day.react-datepicker__day--keyboard-selected {
  background-color: var(--se-brand, #1e3a8a) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}

.react-datepicker__day--selected:hover,
.react-datepicker__day--keyboard-selected:hover,
div.react-datepicker__day.react-datepicker__day--selected:hover,
div.react-datepicker__day.react-datepicker__day--keyboard-selected:hover {
  background-color: var(--se-brand-hover, #1d4ed8) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.securends .se-roles-page .ReactTable .rt-thead.-header .rt-tr>.rt-th:first-child,
.securends .se-roles-page .ReactTable .rt-tbody .rt-tr>.rt-td:first-child,
.securends .se-roles-page .ReactTable .rt-thead.-filters .rt-tr>.rt-th:first-child {
  text-align: center !important;
  justify-content: center !important;
}

.securends .se-roles-page .ReactTable .rt-tbody .rt-td:first-child .dropdown.badge {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
}

/* ── Create / Update Access Template Form Container (Standard Design Card) ── */
.securends .se-roles-page .alert.alert-warning {
  background: var(--se-warn-tint, #fffbe6) !important;
  border: 1px solid var(--se-warn, #ffe58f) !important;
  border-radius: var(--se-r-card) !important;
  color: var(--se-ink) !important;
  padding: 12px 20px !important;
  margin-bottom: 16px !important;
  font-size: 13px !important;
}

/* Single Unified Card Container for Create & Update Access Template */
.securends .se-roles-page>.row:not(.manageApp) {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow) !important;
  padding: 28px 32px 32px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 28px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  display: block !important;
  clear: both !important;
  float: none !important;
  position: relative !important;
}

.securends .se-roles-page>.row:not(.manageApp)::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

/* 1st Column: Name & Owner (stacked vertically in Column 1) */
.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:first-of-type {
  width: 42% !important;
  max-width: 42% !important;
  float: left !important;
  clear: none !important;
  margin-bottom: 20px !important;
  padding-left: 0 !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}

.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:first-of-type>.form-group {
  width: 100% !important;
  margin-bottom: 16px !important;
}

.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:first-of-type>label#ownerLabel {
  margin-top: 0 !important;
  margin-bottom: 6px !important;
  display: block !important;
}

.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:first-of-type>div:has(> #rolesAutocomplete),
.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:first-of-type>#rolesAutocomplete,
.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:first-of-type>div:has(> #owner) {
  width: 100% !important;
  margin-top: 0 !important;
}

/* 2nd Column: Description (Column 2 in Middle) */
.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:nth-of-type(2) {
  width: 42% !important;
  max-width: 42% !important;
  float: left !important;
  clear: none !important;
  margin-bottom: 20px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}

.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:nth-of-type(2) .form-group {
  width: 100% !important;
  margin-bottom: 0 !important;
}

.securends .se-roles-page>.row:not(.manageApp)>.col-md-5:nth-of-type(2) textarea.form-control {
  width: 100% !important;
  max-width: 100% !important;
  height: 124px !important;
  min-height: 124px !important;
}

/* 3rd Column: Version Indicator Pill (Column 3 on Right) */
.securends .se-roles-page>.row:not(.manageApp)>.col-md-2 {
  width: 16% !important;
  max-width: 16% !important;
  float: left !important;
  clear: none !important;
  margin-bottom: 20px !important;
  padding-left: 8px !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  text-align: right !important;
}

.securends .se-roles-page>.row:not(.manageApp)>.col-md-2 .form-group {
  margin-bottom: 0 !important;
}

.securends .se-roles-page .col-md-12::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

/* Force applications section & catalog container to expand height fully inside container */
.securends .se-roles-page .Create_Mulitselect,
.securends .se-roles-page .catalog-container,
.securends .se-roles-page .col-md-12>.form-group {
  display: flow-root !important;
  clear: both !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  position: relative !important;
  margin-top: 12px !important;
  margin-bottom: 16px !important;
}

.securends .se-roles-page .Create_Mulitselect::after,
.securends .se-roles-page .catalog-container::after,
.securends .se-roles-page .col-md-12>.form-group::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

/* Seamless single card container for CreateSeRole (where endPointRolesContainer is sibling) */
.securends .se-roles-page>.row:not(.manageApp):has(+ .endPointRolesContainer) {
  border-bottom: none !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
}

.securends .se-roles-page>.endPointRolesContainer {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-top: 1px solid var(--se-line-soft) !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  border-bottom-left-radius: var(--se-r-card) !important;
  border-bottom-right-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow) !important;
  padding: 28px 32px 32px !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 28px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
  clear: both !important;
  display: flow-root !important;
  position: relative !important;
}

/* Single unified container for UpdateSeRole (where endPointRolesContainer is nested inside row) */
.securends .se-roles-page>.row:not(.manageApp)>.endPointRolesContainer,
.securends .se-roles-page .row:not(.manageApp) .endPointRolesContainer {
  background: transparent !important;
  border: none !important;
  border-top: 1px solid var(--se-line-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 28px 0 0 0 !important;
  margin-top: 32px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
  clear: both !important;
  display: flow-root !important;
  position: relative !important;
}

.securends .se-roles-page .endPointRolesContainer::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

.securends .se-roles-page .endPointRolesContainer label#endPointsLabel {
  clear: both !important;
  display: block !important;
  margin-top: 0 !important;
  margin-bottom: 16px !important;
  width: 100% !important;
  float: none !important;
}

.securends .se-roles-page label.control-label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
  margin-bottom: 6px !important;
  margin-top: 0 !important;
  display: block !important;
}

/* Spacing between Name and Owner field */
.securends .se-roles-page label#ownerLabel {
  margin-top: 18px !important;
  margin-bottom: 6px !important;
  display: block !important;
}

.securends .se-roles-page input[type="text"].form-control,
.securends .se-roles-page textarea.form-control {
  background: var(--bg-input, var(--se-card)) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  color: var(--se-ink) !important;
  font-size: 13px !important;
  font-family: var(--se-sans) !important;
  box-shadow: none !important;
  transition: border-color var(--se-ease), box-shadow var(--se-ease) !important;
}

.securends .se-roles-page input[type="text"].form-control {
  height: 36px !important;
  padding: 0 12px !important;
}

.securends .se-roles-page textarea.form-control {
  height: auto !important;
  min-height: 96px !important;
  padding: 10px 12px !important;
  line-height: 1.4 !important;
}

.securends .se-roles-page input[type="text"].form-control:focus,
.securends .se-roles-page textarea.form-control:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 2px var(--se-brand-tint) !important;
  outline: none !important;
}

.securends .se-roles-page input:disabled,
.securends .se-roles-page textarea:disabled,
.securends .se-roles-page select:disabled {
  background: var(--se-page) !important;
  color: var(--se-ink-2) !important;
  border-color: var(--se-line-soft) !important;
  cursor: not-allowed !important;
  opacity: 0.85 !important;
}

/* Autocomplete Owner Input — keep inside col-md-5 without overlapping Description */
.securends .se-roles-page div[style*="position: absolute"]:has(#owner),
.securends .se-roles-page div[style*="position:absolute"]:has(#owner),
.securends .se-roles-page div:has(> #rolesAutocomplete),
.securends .se-roles-page #rolesAutocomplete,
.securends .se-roles-page div:has(> #owner) {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  margin-top: 4px !important;
}

.securends .se-roles-page #owner {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.securends .se-roles-page .ac_dropdown {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  color: var(--se-ink) !important;
  padding: 8px 12px !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  border-radius: var(--se-r) !important;
  box-shadow: var(--se-shadow-sm) !important;
}

.securends .se-roles-page .ac_dropdown:hover {
  background: var(--se-brand-tint) !important;
  color: var(--se-brand) !important;
}

/* Version Indicator Pill */
.securends .se-roles-page .col-md-2 label#descriptionLabel {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
  background: var(--se-page) !important;
  border: 1px solid var(--se-line-soft) !important;
  padding: 4px 10px !important;
  border-radius: var(--se-r) !important;
  display: inline-block !important;
  float: right !important;
  margin-top: 0 !important;
}

/* Applications Selection Section */
.securends .se-roles-page #endPointsLabel {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin-bottom: 12px !important;
}

.securends .se-roles-page .header1 input.search-bar {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  height: 34px !important;
  padding: 0 12px 0 32px !important;
  font-size: 13px !important;
  color: var(--se-ink) !important;
  box-shadow: none !important;
  max-width: 320px !important;
  width: 100% !important;
}

.securends .se-roles-page .header1 input.search-bar:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 2px var(--se-brand-tint) !important;
}

.securends .se-roles-page .se-create-role-apps-toolbar {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 12px;
  width: 100%;
  margin: 0 0 8px !important;
}

.securends .se-roles-page .se-create-role-apps-toolbar .header1 {
  flex: 0 0 auto;
  margin: 0 !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
}

.securends .se-roles-page .se-create-role-apps-toolbar .header1 input.search-bar {
  margin-bottom: 0 !important;
}

.securends .se-roles-page .se-create-role-aa-alert {
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
  max-width: none !important;
  position: static !important;
  left: auto !important;
  bottom: auto !important;
  display: flex !important;
  align-items: center !important;
}

.securends .se-roles-page .se-create-role-aa-alert .alert,
.securends .se-roles-page .se-create-role-aa-alert .alert.alert-danger {
  margin: 0 !important;
  padding: 8px 12px !important;
  width: 100% !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
  font-family: var(--se-sans) !important;
  color: var(--se-ink) !important;
  background: var(--se-risk-tint) !important;
  border: 1px solid var(--se-risk) !important;
  border-radius: var(--se-r) !important;
}

/* Application Card Grid */
.securends .se-roles-page .catalog-container {
  margin-top: 16px !important;
}

.securends .se-roles-page .catalog-container .grid.appication-card-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
  gap: 16px !important;
}

.securends .se-roles-page .catalog-container .grid .card {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  padding: 16px 12px !important;
  box-shadow: var(--se-shadow-sm) !important;
  transition: all 0.2s var(--se-ease) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  min-height: 120px !important;
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.securends .se-roles-page .catalog-container .grid .card > div,
.securends .se-roles-page .catalog-container .grid .card .card-image-container {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}

.securends .se-roles-page .catalog-container .grid .card .MuiTypography-root,
.securends .se-roles-page .catalog-container .grid .card p,
.securends .se-roles-page .catalog-container .grid .card .se-app-card-name {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 8px 0 0 !important;
  padding: 0 4px;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  text-align: center;
  font-size: 13px !important;
  line-height: 1.3 !important;
  color: var(--se-ink) !important;
}

.securends .se-roles-page .catalog-container .grid .card:hover {
  border-color: var(--se-brand) !important;
  box-shadow: var(--se-shadow) !important;
  transform: translateY(-2px) !important;
}

.securends .se-roles-page .catalog-container .grid .card.card-selected,
.securends .se-roles-page .catalog-container .grid .card.active {
  border: 2px solid var(--se-brand) !important;
  background: var(--se-brand-tint) !important;
}

/* Center Load More Applications button wrapper */
.securends .se-roles-page .catalog-container .grid.appication-card-container+div,
.securends .se-roles-page .catalog-container div.row:has(#templatesave),
.securends .se-roles-page .catalog-container div[style*="marginLeft: 450px"],
.securends .se-roles-page .catalog-container div[style*="margin-left: 450px"],
.securends .se-roles-page .catalog-container .row[style*="450px"] {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 24px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  grid-column: 1 / -1 !important;
}

.securends .se-roles-page button#templatesave:not([type="submit"]) {
  background: var(--se-card) !important;
  border: 1px solid var(--se-brand) !important;
  color: var(--se-brand) !important;
  -webkit-text-fill-color: var(--se-brand) !important;
  border-radius: var(--se-r) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  height: 34px !important;
  padding: 0 20px !important;
  margin: 0 auto !important;
  cursor: pointer !important;
  transition: all 0.2s var(--se-ease) !important;
}

.securends .se-roles-page button#templatesave:not([type="submit"]):hover {
  background: var(--se-brand-tint) !important;
  border-color: var(--se-brand) !important;
  color: var(--se-brand) !important;
  -webkit-text-fill-color: var(--se-brand) !important;
}

/* /roles assign form */
.securends .se-roles-page .roles-form {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  padding: 16px 20px !important;
}

.securends .se-roles-page .roles-form .form-checks {
  padding: 6px 0;
  border-bottom: 1px solid var(--se-line-soft);
}

.securends .se-roles-page .roles-form .Button_container {
  display: flex;
  gap: 8px;
  margin-top: 16px;
  padding-top: 12px;
}

/* /rolesReport DataTable */
.securends .se-roles-page #roles-rep-table {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card);
}

.securends .se-roles-page #roles-rep-table thead th {
  font-family: var(--se-sans) !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  background: var(--se-table-header-bg, var(--se-bg)) !important;
}

.securends .se-roles-page .form-control:focus {
  border-color: var(--se-brand) !important;
  box-shadow: 0 0 0 2px var(--se-brand-tint) !important;
}

/* Entitlements Tab Navigation & Toolbar */
.securends .se-roles-page .endPointRolesContainer .tab-cnt,
.securends .se-roles-page .endPointRolesContainer .MuiTabs-root {
  border-bottom: 1px solid var(--se-line-soft) !important;
  margin-bottom: 16px !important;
  background: transparent !important;
}

.securends .se-roles-page .endPointRolesContainer .MuiTab-root {
  text-transform: none !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
  min-height: 40px !important;
}

.securends .se-roles-page .endPointRolesContainer .MuiTab-root.Mui-selected {
  color: var(--se-brand) !important;
  font-weight: 600 !important;
}

.securends .se-roles-page .endPointRolesContainer .MuiTabs-indicator {
  background-color: var(--se-brand) !important;
  height: 2px !important;
}

/* Entitlements Card Grid for UpdateApplicationEntitlementList */
.securends .se-roles-page .endPointRolesContainer .role-card.entitlement-card,
.securends .se-roles-page .endPointRolesContainer .cardGridContent .card {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  padding: 14px 16px !important;
  box-shadow: var(--se-shadow-sm) !important;
  transition: all 0.2s var(--se-ease) !important;
  margin: 0 !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

.securends .se-roles-page .endPointRolesContainer .role-card.entitlement-card:hover,
.securends .se-roles-page .endPointRolesContainer .cardGridContent .card:hover {
  border-color: var(--se-brand) !important;
  box-shadow: var(--se-shadow) !important;
  transform: translateY(-2px) !important;
}

.securends .se-roles-page .endPointRolesContainer .role-card.entitlement-card.active,
.securends .se-roles-page .endPointRolesContainer .role-card.entitlement-card.checked,
.securends .se-roles-page .endPointRolesContainer .cardGridContent .card.active {
  border: 2px solid var(--se-brand) !important;
  background: var(--se-brand-tint) !important;
}

/* Access Approval Workflow section — seamless divider inside single container */
.securends .se-roles-page .endPointRolesContainer .card.sor-header {
  background: transparent !important;
  border: none !important;
  border-top: 1px solid var(--se-line-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-top: 28px !important;
  padding: 20px 0 0 0 !important;
}

.securends .se-roles-page .endPointRolesContainer .card.sor-header .card-header {
  background: transparent !important;
  border: none !important;
  padding: 0 0 12px 0 !important;
}

.securends .se-roles-page .endPointRolesContainer .card.sor-header .card-body {
  padding: 0 !important;
}

/*
 * Create/Update Access Template — Access Approval Workflow + Requestable
 * as individual inset boxes (not flush seamless dividers).
 */
.securends .se-roles-page > .row:not(.manageApp) .card.sor-header,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card, 14px) !important;
  box-shadow: none !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .card-header,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .card-header {
  background: transparent !important;
  border: none !important;
  border-bottom: none !important;
  padding: 16px 20px 4px !important;
  margin: 0 !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .card-body,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .card-body {
  padding: 4px 20px 16px !important;
  margin: 0 !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .card-body > div,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .card-body > div {
  margin-top: 0 !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .MuiFormControl-root,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .MuiFormControl-root {
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .MuiFormLabel-root,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .MuiFormLabel-root,
.securends .se-roles-page .se-roles-requestable-box .MuiFormLabel-root {
  margin: 0 0 8px !important;
  padding: 0 !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .MuiRadioGroup-root,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .MuiRadioGroup-root,
.securends .se-roles-page .se-roles-requestable-box .MuiRadioGroup-root {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 4px 8px !important;
  margin: 0 !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .MuiFormControlLabel-root,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .MuiFormControlLabel-root,
.securends .se-roles-page .se-roles-requestable-box .MuiFormControlLabel-root {
  margin: 0 16px 0 0 !important;
  margin-left: 0 !important;
  align-items: center !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .MuiRadio-root,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .MuiRadio-root,
.securends .se-roles-page .se-roles-requestable-box .MuiRadio-root {
  padding: 4px !important;
  margin: 0 !important;
}

.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .card-header .control-label,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .card-header .control-label,
.securends .se-roles-page > .row:not(.manageApp) .card.sor-header .card-header #endPointsLabel,
.securends .se-roles-page .row:not(.manageApp) > .col-md-12 > .card.sor-header .card-header #endPointsLabel {
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--se-sans) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--se-ink) !important;
}

/* Keep approval col flush with form card inset */
.securends .se-roles-page > .row:not(.manageApp) > .col-md-12:has(> .card.sor-header) {
  margin-top: 8px !important;
  margin-bottom: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}

/* Requestable — matching individual box */
.securends .se-roles-page .se-roles-requestable-box {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card, 14px) !important;
  box-shadow: none !important;
  margin: 12px 0 0 !important;
  padding: 16px 20px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.securends .se-roles-page .se-roles-requestable-box .MuiFormControl-root {
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

.securends .se-roles-page > .endPointRolesContainer {
  margin-top: 0 !important;
  padding-top: 12px !important;
}

.securends .se-roles-page > .endPointRolesContainer > .se-roles-requestable-box {
  margin-top: 0 !important;
}

/* Remove outer Card border on MuiCard wrappers in UpdateApplicationEntitlementList */
.securends .se-roles-page .endPointRolesContainer .MuiCard-root:not(.role-card):not(.card) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.securends .se-roles-page .error {
  color: var(--se-risk) !important;
}

/* ── View Access Template Modal Modernization (.access-template-modal / .react-table1) ── */

/* Modal Dialog & Content */
.access-template-modal .modal-content,
.custom-dialog.iga .modal-content,
.securends .access-template-modal .modal-content,
.securends .custom-dialog.iga .modal-content {
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow-lg) !important;
  background: var(--se-card) !important;
  overflow: hidden !important;
}

.access-template-modal .modal-header,
.custom-dialog.iga .modelheader,
.securends .access-template-modal .modal-header,
.securends .custom-dialog.iga .modelheader {
  background: var(--se-card) !important;
  border-bottom: 1px solid var(--se-line) !important;
  padding: 16px 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.access-template-modal .modal-title,
.custom-dialog.iga #ModalHeader,
.securends .access-template-modal .modal-title,
.securends .custom-dialog.iga #ModalHeader {
  font-family: var(--se-sans) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 0 !important;
}

.access-template-modal .modal-header .close,
.custom-dialog.iga .modelheader .close,
.securends .access-template-modal .modal-header .close,
.securends .custom-dialog.iga .modelheader .close {
  color: var(--se-ink-2) !important;
  opacity: 0.7 !important;
  font-size: 20px !important;
  transition: opacity 0.2s var(--se-ease) !important;
}

.access-template-modal .modal-header .close:hover,
.custom-dialog.iga .modelheader .close:hover,
.securends .access-template-modal .modal-header .close:hover,
.securends .custom-dialog.iga .modelheader .close:hover {
  opacity: 1 !important;
  color: var(--se-ink) !important;
}

.access-template-modal .modal-body,
.custom-dialog.iga .modal-body,
.securends .access-template-modal .modal-body,
.securends .custom-dialog.iga .modal-body {
  background: var(--se-bg, #f8fafc) !important;
  padding: 24px !important;
}

/* View Mode Toggle Button Group (Card View / Map View) */
.data-view.MuiButtonGroup-root,
.access-template-modal .data-view,
.react-table1 .data-view,
.securends .data-view {
  margin-bottom: 20px !important;
  box-shadow: var(--se-shadow-sm) !important;
  border-radius: var(--se-r) !important;
  overflow: hidden !important;
  display: inline-flex !important;
  border: 1px solid var(--se-line) !important;
  height: 34px !important;
}

.data-view .MuiButton-root,
.access-template-modal .data-view .MuiButton-root,
.react-table1 .data-view .MuiButton-root,
.securends .data-view .MuiButton-root {
  width: auto !important;
  min-width: 125px !important;
  height: 34px !important;
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  padding: 0 16px !important;
  transition: all 0.2s var(--se-ease) !important;
  box-sizing: border-box !important;
}

.data-view .MuiButton-root .MuiButton-label,
.access-template-modal .data-view .MuiButton-root .MuiButton-label,
.react-table1 .data-view .MuiButton-root .MuiButton-label,
.securends .data-view .MuiButton-root .MuiButton-label {
  white-space: nowrap !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: none !important;
}

.data-view .MuiButton-root.active-view-btn,
.data-view .MuiButton-root[style*="337ab7"],
.data-view .MuiButton-root[style*="1e3a8a"],
.data-view .MuiButton-root[style*="rgb(51, 122, 183)"],
.data-view .MuiButton-root[style*="rgb(30, 58, 138)"],
.access-template-modal .data-view .MuiButton-root.active-view-btn,
.react-table1 .data-view .MuiButton-root.active-view-btn {
  background-color: var(--se-brand) !important;
  border-color: var(--se-brand) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.data-view .MuiButton-root.active-view-btn .MuiButton-startIcon svg,
.access-template-modal .data-view .MuiButton-root.active-view-btn .MuiButton-startIcon svg {
  color: #ffffff !important;
}

.data-view .MuiButton-root:not(.active-view-btn):not(.is-active):not([style*="337ab7"]):not([style*="1e3a8a"]):not([style*="rgb(51, 122, 183)"]):not([style*="rgb(30, 58, 138)"]) {
  background-color: var(--se-card) !important;
  border-color: var(--se-line) !important;
  color: var(--se-ink) !important;
  font-weight: 500 !important;
}

.data-view .MuiButton-root:not(.active-view-btn):not(.is-active) .MuiButton-startIcon svg {
  color: var(--se-ink-2) !important;
}

.data-view .MuiButton-root .MuiButton-startIcon,
.access-template-modal .data-view .MuiButton-root .MuiButton-startIcon,
.react-table1 .data-view .MuiButton-root .MuiButton-startIcon {
  margin-right: 6px !important;
  margin-left: -2px !important;
}

.data-view .MuiButton-root .MuiButton-startIcon svg,
.access-template-modal .data-view .MuiButton-root .MuiButton-startIcon svg,
.react-table1 .data-view .MuiButton-root .MuiButton-startIcon svg {
  font-size: 16px !important;
}

/* Mindmap container card for Map View */
.mindmap-container-card {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow-sm) !important;
  padding: 24px !important;
  margin-top: 16px !important;
  min-height: 450px !important;
  overflow: auto !important;
  box-sizing: border-box !important;
}

/* Access Template Details Summary Header Card */
.access-template-details-summary,
.react-table1 .access-template-details-summary,
.securends .react-table1 .access-template-details-summary {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  padding: 16px 20px !important;
  margin-bottom: 20px !important;
  box-shadow: var(--se-shadow-sm) !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 16px !important;
}

.access-template-details-summary p,
.react-table1 .access-template-details-summary p {
  margin: 0 !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  color: var(--se-ink) !important;
  line-height: 1.5 !important;
  display: flex !important;
  flex-direction: column !important;
}

.access-template-details-summary p b,
.react-table1 .access-template-details-summary p b {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  color: var(--se-ink-2) !important;
  margin-bottom: 4px !important;
}

/* Application Tabs (.tab-cnt) */
.tab-cnt,
.react-table1 .tab-cnt,
.react-table1 .MuiTabs-root {
  border-bottom: 1px solid var(--se-line) !important;
  margin-bottom: 20px !important;
  background: transparent !important;
  min-height: 42px !important;
}

.tab-cnt .MuiTab-root,
.react-table1 .tab-cnt .MuiTab-root {
  text-transform: none !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--se-ink-2) !important;
  min-height: 42px !important;
  padding: 6px 18px !important;
  min-width: auto !important;
  opacity: 1 !important;
  margin-right: 6px !important;
  border-radius: var(--se-r) var(--se-r) 0 0 !important;
  transition: all 0.2s var(--se-ease) !important;
}

.tab-cnt .MuiTab-wrapper,
.react-table1 .tab-cnt .MuiTab-wrapper {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

.tab-cnt .MuiTab-wrapper svg,
.react-table1 .tab-cnt .MuiTab-wrapper svg {
  color: var(--se-ink-3) !important;
  font-size: 18px !important;
  flex-shrink: 0 !important;
  margin-right: 6px !important;
  transition: color 0.2s var(--se-ease) !important;
}

.tab-cnt .MuiTab-root:hover,
.react-table1 .tab-cnt .MuiTab-root:hover {
  color: var(--se-brand) !important;
  background: var(--se-brand-tint, rgba(30, 58, 138, 0.05)) !important;
}

.tab-cnt .MuiTab-root:hover .MuiTab-wrapper svg,
.react-table1 .tab-cnt .MuiTab-root:hover .MuiTab-wrapper svg {
  color: var(--se-brand) !important;
}

.tab-cnt .MuiTab-root.Mui-selected,
.react-table1 .tab-cnt .MuiTab-root.Mui-selected {
  color: var(--se-brand) !important;
  font-weight: 600 !important;
  background: var(--se-brand-tint, rgba(30, 58, 138, 0.08)) !important;
}

.tab-cnt .MuiTab-root.Mui-selected .MuiTab-wrapper svg,
.react-table1 .tab-cnt .MuiTab-root.Mui-selected .MuiTab-wrapper svg {
  color: var(--se-brand) !important;
}

.tab-cnt .MuiTabs-indicator,
.react-table1 .tab-cnt .MuiTabs-indicator {
  background-color: var(--se-brand) !important;
  height: 3px !important;
  border-radius: 3px 3px 0 0 !important;
}

/* Tab Panel Outer Card */
.react-table1 div[role="tabpanel"]>.MuiBox-root>.MuiTypography-root>.MuiCard-root {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  box-shadow: var(--se-shadow-sm) !important;
  padding: 20px !important;
  margin-top: 0 !important;
}

.react-table1 div[role="tabpanel"] .MuiCardContent-root {
  padding: 0 !important;
}

.react-table1 div[role="tabpanel"] .MuiCardContent-root>div:first-child {
  float: none !important;
  margin-bottom: 16px !important;
}

.react-table1 div[role="tabpanel"] .MuiCardContent-root>div:first-child .MuiTypography-root {
  font-family: var(--se-sans) !important;
  font-size: 14px !important;
  color: var(--se-ink) !important;
  font-weight: 500 !important;
}

.react-table1 div[role="tabpanel"] .MuiCardContent-root>div:first-child .MuiTypography-root b {
  color: var(--se-ink-2) !important;
  font-weight: 600 !important;
  margin-right: 4px !important;
}

/* Toolbar & Search Controls inside Tab Panel */
.access-template-entitlement-toolbar,
.react-table1 .access-template-entitlement-toolbar {
  margin-bottom: 16px !important;
}

.access-template-entitlement-toolbar select,
.access-template-entitlement-toolbar input,
.react-table1 .access-template-entitlement-toolbar select,
.react-table1 .access-template-entitlement-toolbar input {
  font-family: var(--se-sans) !important;
}

/* Entitlement Cards Grid inside View Modal */
.role-card.entitlement-card,
.react-table1 .role-card.entitlement-card {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  padding: 0px !important;
  box-shadow: var(--se-shadow-sm) !important;
  transition: all 0.2s var(--se-ease) !important;
  margin: 0 !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
}

.role-card.entitlement-card:hover,
.react-table1 .role-card.entitlement-card:hover {
  border-color: var(--se-brand) !important;
  box-shadow: var(--se-shadow) !important;
  transform: translateY(-2px) !important;
}

.role-card.entitlement-card .card-content,
.react-table1 .role-card.entitlement-card .card-content,
.react-table1 .role-card.entitlement-card .MuiCardContent-root {
  padding: 12px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  justify-content: space-between !important;
  box-sizing: border-box !important;
}

.role-card.entitlement-card .card-header,
.react-table1 .role-card.entitlement-card .card-header {
  padding: 0 !important;
  margin: 0 0 4px !important;
}

.role-card.entitlement-card .card-header b,
.react-table1 .role-card.entitlement-card .card-header b {
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  line-height: 1.3 !important;
}

.role-card.entitlement-card .ent-description,
.react-table1 .role-card.entitlement-card .ent-description {
  font-family: var(--se-sans) !important;
  font-size: 12px !important;
  color: var(--se-ink-2) !important;
  line-height: 1.4 !important;
}

.role-card.entitlement-card .card-footer,
.react-table1 .role-card.entitlement-card .card-footer {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  font-family: var(--se-sans) !important;
  font-size: 11px !important;
  color: var(--se-ink-3) !important;
  border-top: 1px solid var(--se-line-soft) !important;
  padding-top: 10px !important;
  margin-top: 12px !important;
  background: transparent !important;
  background-color: transparent !important;
}

.role-card.entitlement-card .card-footer strong,
.react-table1 .role-card.entitlement-card .card-footer strong {
  color: var(--se-ink-2) !important;
  font-weight: 600 !important;
}

/* Access Approval Workflow Section inside View Modal */
.card.sor-header,
.react-table1 .card.sor-header {
  background: var(--se-card) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card) !important;
  padding: 0px !important;
  margin-top: 24px !important;
  box-shadow: var(--se-shadow-sm) !important;
}

.card.sor-header .card-header,
.react-table1 .card.sor-header .card-header {
  background: transparent !important;
  border: none !important;
  padding: 0 0 12px 0 !important;
  border-bottom: 1px solid var(--se-line-soft) !important;
}

.card.sor-header .card-header label#endPointsLabel,
.react-table1 .card.sor-header .card-header label#endPointsLabel {
  font-family: var(--se-sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--se-ink) !important;
  margin: 0 !important;
}

.card.sor-header .card-body,
.react-table1 .card.sor-header .card-body {
  padding: 12px 0 0 0 !important;
}

.card.sor-header .level-container,
.react-table1 .card.sor-header .level-container {
  background: var(--se-page) !important;
  border: 1px solid var(--se-line-soft) !important;
  border-radius: var(--se-r) !important;
  padding: 14px 16px !important;
  margin-top: 12px !important;
}

/* Approver field: drop stacked 20px col/form-group gaps */
.securends .se-roles-page .levelHieracrchyTxt .level-container {
  padding: 10px 16px 10px !important;
}

.securends .se-roles-page .levelHieracrchyTxt .level-body {
  padding: 6px 0 4px !important;
  margin: 0 !important;
}

.securends .se-roles-page .levelHieracrchyTxt .level-body .col-md-4 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.securends .se-roles-page .levelHieracrchyTxt .level-body .form-group {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.securends .se-roles-page .levelHieracrchyTxt .level-body .form-group > label,
.securends .se-roles-page .levelHieracrchyTxt .level-body label {
  margin: 0 0 4px 0 !important;
  padding: 0 !important;
}

.securends .se-roles-page .levelHieracrchyTxt .level-body .form-group .form-group {
  margin: 0 !important;
}

@media (max-width: 768px) {

  .se-roles-page .o-form-title-bar,
  .se-roles-page h2.header {
    flex-wrap: wrap;
  }
}

/* ── Empty State "No access templates are available to display" Layout Fix ── */
.securends .grid > .MuiGrid-item:has(.no-data-card),
.securends .grid .no-data-card,
.grid > .MuiGrid-item:has(.no-data-card),
.grid .no-data-card {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
}

.securends .grid .no-data-card,
.grid .no-data-card {
  background: var(--se-card, #ffffff) !important;
  border: 1px dashed var(--se-line, #cbd5e1) !important;
  border-radius: var(--se-r, 8px) !important;
  box-shadow: none !important;
  padding: 16px 20px !important;
  margin: 12px 0 !important;
  box-sizing: border-box !important;
}

.securends .grid .no-data-card .card-content,
.securends .grid .no-data-card .MuiCardContent-root,
.grid .no-data-card .card-content,
.grid .no-data-card .MuiCardContent-root {
  padding: 0 !important;
  width: 100% !important;
}

.securends .grid .no-data-card .MuiTypography-root,
.grid .no-data-card .MuiTypography-root {
  color: var(--se-muted, #64748b) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  white-space: normal !important;
  word-break: normal !important;
  word-wrap: normal !important;
  overflow-wrap: normal !important;
  hyphens: manual !important;
  text-align: left !important;
}
/* Sprint Release announcement (SprintReleaseAnnouncement.js): dashboard hero,
   feature cards, feature page (new tab), profile "What's New" dialog.
   Tokens only. Light: saturated --se-brand hero (navy on White, teal on Teal).
   Dark: tinted surface hero. Dialogs portal to body, so selectors are not
   scoped under .securends. */

.se-sprint-release {
  container-type: inline-size;
  container-name: se-sprint;
  width: 100%;
  margin: 0 0 16px;
  font-family: var(--se-sans);
  box-sizing: border-box;
}

.se-sprint-release *,
.se-sprint-release *::before,
.se-sprint-release *::after {
  box-sizing: border-box;
}

/* ---------------- Hero ---------------- */

.se-sprint-release .se-sprint-release__hero {
  position: relative;
  display: grid;
  grid-template-columns: 88px minmax(0, 1.35fr) minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  padding: 24px 56px 24px 24px;
  border-radius: var(--se-r-card);
  border: 1px solid color-mix(in srgb, var(--se-brand) 70%, var(--se-line));
  box-shadow: var(--se-shadow-md);
  overflow: hidden;
  color: var(--se-card);
  background:
    radial-gradient(circle at 92% 110%, color-mix(in srgb, var(--se-card) 12%, transparent) 0 22%, transparent 23%),
    radial-gradient(circle at 70% -30%, color-mix(in srgb, var(--se-card) 8%, transparent) 0 30%, transparent 31%),
    linear-gradient(115deg,
      color-mix(in srgb, var(--se-brand) 82%, var(--se-ink)) 0%,
      var(--se-brand) 55%,
      color-mix(in srgb, var(--se-brand) 78%, var(--se-ok)) 100%);
}

.se-sprint-release .se-sprint-release__hero-art {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  border-radius: 50%;
  font-size: 38px;
  color: var(--se-card);
  background: color-mix(in srgb, var(--se-card) 16%, transparent);
  box-shadow: 0 0 0 10px color-mix(in srgb, var(--se-card) 7%, transparent);
}

.se-sprint-release .se-sprint-release__hero-main {
  min-width: 0;
}

.se-sprint-release .se-sprint-release__badge {
  display: inline-block;
  padding: 4px 12px;
  margin-bottom: 10px;
  border-radius: var(--se-r-pill);
  font-size: var(--se-t-xs);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--se-brand);
  background: var(--se-card);
}

.se-sprint-release .se-sprint-release__title {
  margin: 0 0 8px;
  font-family: var(--se-sans);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  color: inherit;
}

.se-sprint-release .se-sprint-release__summary {
  margin: 0;
  font-size: var(--se-t-sm);
  line-height: 1.55;
  color: color-mix(in srgb, var(--se-card) 88%, transparent);
}

.se-sprint-release .se-sprint-release__highlights {
  min-width: 0;
  padding-left: 24px;
  border-left: 1px solid color-mix(in srgb, var(--se-card) 30%, transparent);
}

.se-sprint-release .se-sprint-release__highlights-title {
  margin: 0 0 10px;
  font-family: var(--se-sans);
  font-size: 15px;
  font-weight: 700;
  color: inherit;
}

.se-sprint-release .se-sprint-release__highlights ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.se-sprint-release .se-sprint-release__highlights li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 0 0 7px;
  font-size: var(--se-t-sm);
  line-height: 1.4;
}

.se-sprint-release .se-sprint-release__highlights li:last-child {
  margin-bottom: 0;
}

.se-sprint-release .se-sprint-release__highlights .fa {
  flex: 0 0 auto;
  margin-top: 2px;
  font-size: 14px;
}

.se-sprint-release .se-sprint-release__hero-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 190px;
}

/* ---------------- Buttons ---------------- */

.se-sprint-release__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 18px;
  border-radius: var(--se-r);
  border: 1px solid transparent;
  font-family: var(--se-sans);
  font-size: var(--se-t-sm);
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none !important;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--se-ease), color var(--se-ease), border-color var(--se-ease), box-shadow var(--se-ease);
}

.se-sprint-release .se-sprint-release__btn--light {
  background: var(--se-card);
  color: var(--se-brand) !important;
  box-shadow: var(--se-shadow);
}

.se-sprint-release .se-sprint-release__btn--light:hover {
  background: color-mix(in srgb, var(--se-card) 88%, var(--se-brand));
}

.se-sprint-release .se-sprint-release__btn--ghost {
  background: transparent;
  color: var(--se-card) !important;
  border-color: color-mix(in srgb, var(--se-card) 65%, transparent);
}

.se-sprint-release .se-sprint-release__btn--ghost:hover {
  background: color-mix(in srgb, var(--se-card) 14%, transparent);
}

/* Watch Release Video (primary hero action) + View Release Notes as text link */
.se-sprint-release .se-sprint-release__btn--video {
  gap: 10px;
  padding-right: 10px;
}

.se-sprint-release .se-sprint-release__play {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--se-brand);
  color: var(--se-card);
  font-size: 9px;
}

.se-sprint-release .se-sprint-release__play .fa {
  margin-left: 2px;
}

.se-sprint-release .se-sprint-release__btn--link {
  min-height: 32px;
  padding: 4px 8px;
  background: transparent;
  color: color-mix(in srgb, var(--se-card) 88%, transparent) !important;
}

.se-sprint-release .se-sprint-release__btn--link:hover {
  color: var(--se-card) !important;
  text-decoration: underline !important;
}

.se-sprint-release__modal .se-sprint-release__btn--primary {
  background: var(--se-brand);
  color: var(--se-card) !important;
}

.se-sprint-release__modal .se-sprint-release__btn--primary:hover {
  background: color-mix(in srgb, var(--se-brand) 85%, var(--se-ink));
}

.se-sprint-release__modal .se-sprint-release__btn--outline,
.se-sprint-release .se-sprint-release__btn--outline {
  background: var(--se-card);
  color: var(--se-ink) !important;
  border-color: var(--se-line);
}

.se-sprint-release__modal .se-sprint-release__btn--outline:hover,
.se-sprint-release .se-sprint-release__btn--outline:hover {
  border-color: var(--se-brand);
  color: var(--se-brand) !important;
}

.se-sprint-release .se-sprint-release__dismiss {
  position: absolute;
  top: 12px;
  right: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--se-card);
  font-size: 18px;
  cursor: pointer;
  transition: background-color var(--se-ease);
}

.se-sprint-release .se-sprint-release__dismiss:hover {
  background: color-mix(in srgb, var(--se-card) 18%, transparent);
}

/* Focus: brand ring on light surfaces, card ring inside the brand hero */
.se-sprint-release__btn:focus-visible,
.se-sprint-release__feature:focus-visible,
.se-sprint-release__modal .se-sprint-release__zoom:focus-visible,
.se-sprint-release__modal .se-sprint-release__close:focus-visible {
  outline: 2px solid var(--se-brand);
  outline-offset: 2px;
}

.se-sprint-release__hero .se-sprint-release__btn:focus-visible,
.se-sprint-release__hero .se-sprint-release__dismiss:focus-visible {
  outline: 2px solid var(--se-card);
  outline-offset: 2px;
}

/* ---------------- Feature cards ---------------- */

.se-sprint-release .se-sprint-release__feature-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  list-style: none;
  margin: 16px 0 0;
  padding: 0;
}

.se-sprint-release .se-sprint-release__feature-grid > li {
  display: flex;
  margin: 0;
  padding: 0;
}

/* More than 8 features: cap at two card rows and scroll the rest.
   Padding keeps card hover lift and focus rings inside the scroll box. */
.se-sprint-release .se-sprint-release__feature-grid--scroll {
  max-height: 404px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 4px 8px 4px 4px;
  margin-right: -8px;
}

/* ---------------- Thin scrollbars (feature grid + feature modal) ---------------- */

.se-sprint-release .se-sprint-release__feature-grid--scroll,
html .se-sprint-release__whatsnew .MuiDialog-container {
  scrollbar-width: thin;
  scrollbar-color: var(--se-nav-scroll-thumb) transparent;
}

.se-sprint-release .se-sprint-release__feature-grid--scroll::-webkit-scrollbar,
html .se-sprint-release__whatsnew .MuiDialog-container::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.se-sprint-release .se-sprint-release__feature-grid--scroll::-webkit-scrollbar-track,
html .se-sprint-release__whatsnew .MuiDialog-container::-webkit-scrollbar-track {
  background: transparent;
}

.se-sprint-release .se-sprint-release__feature-grid--scroll::-webkit-scrollbar-thumb,
html .se-sprint-release__whatsnew .MuiDialog-container::-webkit-scrollbar-thumb {
  background: var(--se-nav-scroll-thumb);
  border-radius: 999px;
}

.se-sprint-release .se-sprint-release__feature-grid--scroll::-webkit-scrollbar-thumb:hover,
html .se-sprint-release__whatsnew .MuiDialog-container::-webkit-scrollbar-thumb:hover {
  background: var(--se-brand);
}

.se-sprint-release .se-sprint-release__feature {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  width: 100%;
  margin: 0;
  padding: 18px;
  text-align: left;
  font-family: var(--se-sans);
  background: var(--se-card);
  color: var(--se-ink);
  border: 1px solid var(--se-line);
  border-radius: var(--se-r-card);
  box-shadow: var(--se-shadow);
  cursor: pointer;
  transition: border-color var(--se-ease), box-shadow var(--se-ease), transform var(--se-ease);
}

.se-sprint-release a.se-sprint-release__feature,
.se-sprint-release a.se-sprint-release__feature:hover,
.se-sprint-release a.se-sprint-release__feature:focus {
  color: var(--se-ink);
  text-decoration: none;
}

.se-sprint-release .se-sprint-release__feature:hover {
  border-color: color-mix(in srgb, var(--se-brand) 45%, var(--se-line));
  box-shadow: var(--se-shadow-md);
  transform: translateY(-1px);
}

.se-sprint-release__feature-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--se-r);
  font-size: 20px;
  color: var(--se-brand);
  background: color-mix(in srgb, var(--se-brand) 12%, var(--se-card));
}

/* shell.css paints every .securends [class*="content"] with --se-page */
.securends .se-sprint-release .se-sprint-release__feature-content {
  background: transparent !important;
}

.se-sprint-release .se-sprint-release__feature-content {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1 1 auto;
  height: 100%;
}

.se-sprint-release .se-sprint-release__feature-title {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--se-ink);
}

.se-sprint-release .se-sprint-release__feature-desc {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  margin: 6px 0 10px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--se-ink-2);
}

.se-sprint-release .se-sprint-release__feature-link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--se-brand);
}

.se-sprint-release .se-sprint-release__feature:hover .se-sprint-release__feature-link .fa {
  transform: translateX(2px);
}

.se-sprint-release .se-sprint-release__feature-link .fa {
  transition: transform var(--se-ease);
}

/* ---------------- Notice: loading / not configured / load failed ---------------- */

.se-sprint-release .se-sprint-release__notice {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 56px 18px 20px;
  border: 1px solid var(--se-line);
  border-left: 4px solid var(--se-brand);
  border-radius: var(--se-r-card);
  background: var(--se-card);
  color: var(--se-ink);
  box-shadow: var(--se-shadow);
}

.se-sprint-release .se-sprint-release__notice--error {
  border-left-color: var(--se-warn);
}

.se-sprint-release .se-sprint-release__notice-icon {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  font-size: 20px;
  color: var(--se-brand);
  background: color-mix(in srgb, var(--se-brand) 12%, var(--se-card));
}

.se-sprint-release .se-sprint-release__notice--error .se-sprint-release__notice-icon {
  color: var(--se-warn);
  background: color-mix(in srgb, var(--se-warn) 14%, var(--se-card));
}

.se-sprint-release .se-sprint-release__notice-body {
  flex: 1 1 auto;
  min-width: 0;
}

.se-sprint-release .se-sprint-release__notice-title {
  margin: 0 0 4px;
  font-family: var(--se-sans);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--se-ink);
}

.se-sprint-release .se-sprint-release__notice-text {
  margin: 0;
  font-size: var(--se-t-sm);
  line-height: 1.5;
  color: var(--se-ink-2);
}

.se-sprint-release .se-sprint-release__notice .se-sprint-release__dismiss {
  color: var(--se-ink-2);
}

.se-sprint-release .se-sprint-release__notice .se-sprint-release__dismiss:hover {
  background: var(--se-line-soft);
  color: var(--se-ink);
}

.se-sprint-release .se-sprint-release__notice .se-sprint-release__dismiss:focus-visible {
  outline: 2px solid var(--se-brand);
  outline-offset: 2px;
}

@container se-sprint (max-width: 560px) {
  .se-sprint-release .se-sprint-release__notice {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .se-sprint-release .se-sprint-release__notice-body {
    flex-basis: calc(100% - 60px);
  }
}

/* ---------------- Responsive (container width, so it works in the dialog too) ---------------- */

@container se-sprint (max-width: 820px) {
  .se-sprint-release .se-sprint-release__feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container se-sprint (max-width: 960px) {
  .se-sprint-release .se-sprint-release__hero {
    grid-template-columns: 72px minmax(0, 1fr) auto;
  }

  .se-sprint-release .se-sprint-release__hero-art {
    width: 72px;
    height: 72px;
    font-size: 30px;
  }

  .se-sprint-release .se-sprint-release__highlights {
    grid-column: 2 / 3;
    grid-row: 2;
    padding: 16px 0 0;
    border-left: 0;
    border-top: 1px solid color-mix(in srgb, var(--se-card) 30%, transparent);
  }

  .se-sprint-release .se-sprint-release__hero-actions {
    grid-column: 3;
    grid-row: 1 / span 2;
    align-self: center;
  }
}

@container se-sprint (max-width: 720px) {
  .se-sprint-release .se-sprint-release__hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 20px 48px 20px 20px;
  }

  .se-sprint-release .se-sprint-release__hero-art {
    display: none;
  }

  .se-sprint-release .se-sprint-release__highlights,
  .se-sprint-release .se-sprint-release__hero-actions {
    grid-column: 1;
    grid-row: auto;
  }

  .se-sprint-release .se-sprint-release__hero-actions {
    flex-direction: row;
    flex-wrap: wrap;
    min-width: 0;
  }

  .se-sprint-release .se-sprint-release__hero-actions .se-sprint-release__btn {
    flex: 1 1 180px;
  }

  .se-sprint-release .se-sprint-release__title {
    font-size: 18px;
  }
}

@container se-sprint (max-width: 560px) {
  .se-sprint-release .se-sprint-release__feature-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* ---------------- Feature detail modal ---------------- */

html .se-sprint-release__modal .MuiDialog-paper {
  border-radius: var(--se-r-modal) !important;
}

html .se-sprint-release__modal .se-sprint-release__modal-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 16px 16px 20px !important;
}

.se-sprint-release__modal .se-sprint-release__modal-heading {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
}

.se-sprint-release__modal .se-sprint-release__modal-group {
  font-size: var(--se-t-xs);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--se-ink-3);
}

.se-sprint-release__modal .se-sprint-release__modal-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--se-ink);
}

.se-sprint-release__modal .se-sprint-release__close {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  color: var(--se-ink-2) !important;
}

.se-sprint-release__modal .se-sprint-release__close:hover {
  background: var(--se-line-soft) !important;
  color: var(--se-ink) !important;
}

.se-sprint-release__modal .se-sprint-release__modal-summary {
  margin: 0 0 18px;
  padding: 12px 14px;
  border-radius: var(--se-r);
  border-left: 3px solid var(--se-brand);
  background: color-mix(in srgb, var(--se-brand) 8%, var(--se-card));
  font-size: 14px;
}

.se-sprint-release__modal .se-sprint-release__modal-section {
  margin: 20px 0 10px;
  font-family: var(--se-sans);
  font-size: 15px;
  font-weight: 700;
}

.se-sprint-release__modal .se-sprint-release__modal-summary + .se-sprint-release__modal-section {
  margin-top: 0;
}

.se-sprint-release__modal .se-sprint-release__modal-list {
  margin: 0 0 8px;
  padding-left: 20px;
}

.se-sprint-release__modal .se-sprint-release__modal-list li {
  margin: 0 0 4px;
}

.se-sprint-release__modal .se-sprint-release__modal-list li::marker {
  color: var(--se-brand);
}

.se-sprint-release__modal .se-sprint-release__modal-detail {
  padding: 12px 0;
  border-bottom: 1px solid var(--se-line);
}

.se-sprint-release__modal .se-sprint-release__modal-detail:last-of-type {
  border-bottom: 0;
}

.se-sprint-release__modal .se-sprint-release__modal-detail-title {
  margin: 0 0 4px;
  font-family: var(--se-sans);
  font-size: 14px;
  font-weight: 600;
}

html .se-sprint-release__modal .MuiDialogContent-root p.se-sprint-release__modal-detail-text,
html .se-sprint-release__feature-page .se-sprint-release__page-card p.se-sprint-release__modal-detail-text {
  margin: 0 0 6px;
  color: var(--se-ink-2) !important;
  white-space: pre-line;
}

.se-sprint-release__modal .se-sprint-release__modal-figure {
  margin: 10px 0 4px;
}

/* Screenshot zoom trigger; hint icon mirrors App Guide (.se-guide-img-hint) */
.se-sprint-release__modal .se-sprint-release__zoom {
  position: relative;
  display: inline-block;
  max-width: 100%;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--se-r);
  background: transparent;
  line-height: 0;
  cursor: zoom-in;
}

.se-sprint-release__modal .se-sprint-release__modal-figure img {
  display: block;
  max-width: 100%;
  height: auto;
  border: 1px solid var(--se-line);
  border-radius: var(--se-r);
  background: var(--se-card);
  box-shadow: var(--se-shadow);
}

.se-sprint-release__modal .se-sprint-release__zoom-hint {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid var(--se-line);
  background: var(--se-card);
  color: var(--se-ink-2);
  box-shadow: var(--se-shadow);
  font-size: 12px;
  pointer-events: none;
}

.se-sprint-release__modal .se-sprint-release__zoom:hover .se-sprint-release__zoom-hint,
.se-sprint-release__modal .se-sprint-release__zoom:focus-visible .se-sprint-release__zoom-hint {
  display: inline-flex;
}

html .se-sprint-release__modal .se-sprint-release__modal-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

/* ---------------- Feature page (card opened in a new tab) ---------------- */

/* Standalone page rendered by index.js instead of the app shell */
.se-sprint-release__feature-page {
  display: block;
  min-height: 100vh;
  background: var(--se-page);
  color: var(--se-ink);
}

.se-sprint-release__feature-page .se-sprint-release__page {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px;
  box-sizing: border-box;
  font-family: var(--se-sans);
}

@container se-sprint (min-width: 961px) {
  .se-sprint-release__feature-page .se-sprint-release__hero--no-highlights {
    grid-template-columns: 88px minmax(0, 1fr) auto;
  }
}

.se-sprint-release__feature-page .se-sprint-release__page-card {
  padding: 24px;
  border: 1px solid var(--se-line);
  border-radius: var(--se-r-card);
  background: var(--se-card);
  color: var(--se-ink);
  box-shadow: var(--se-shadow);
  font-size: var(--se-t-sm);
  line-height: 1.6;
}

.se-sprint-release__feature-page .se-sprint-release__page-card .se-sprint-release__modal-actions {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--se-line);
}

.se-sprint-release__feature-page .se-sprint-release__page-status {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 48px 24px;
  text-align: center;
}

.se-sprint-release__feature-page .se-sprint-release__page-status > .fa {
  font-size: 28px;
  color: var(--se-brand);
}

.se-sprint-release__feature-page .se-sprint-release__page-status-title {
  margin: 0;
  font-family: var(--se-sans);
  font-size: 16px;
  font-weight: 700;
  color: var(--se-ink);
}

.se-sprint-release__feature-page .se-sprint-release__page-status-text {
  margin: 0 0 6px;
  color: var(--se-ink-2);
}

/* Release Updates (after the feature details) */
.se-sprint-release__feature-page .se-sprint-release__page-updates {
  margin-top: 8px;
}

.se-sprint-release__feature-page .se-sprint-release__updates {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.se-sprint-release__feature-page .se-sprint-release__update {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--se-line);
  border-radius: var(--se-r);
  background: var(--se-card);
  color: var(--se-ink);
  font-family: var(--se-sans);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  transition: border-color var(--se-ease), background-color var(--se-ease);
}

.se-sprint-release__feature-page .se-sprint-release__update .fa {
  flex: 0 0 auto;
  width: 16px;
  text-align: center;
  color: var(--se-brand);
}

.se-sprint-release__feature-page .se-sprint-release__update:hover {
  border-color: var(--se-brand);
}

.se-sprint-release__feature-page .se-sprint-release__update.is-current {
  border-color: var(--se-brand);
  background: color-mix(in srgb, var(--se-brand) 10%, var(--se-card));
  color: var(--se-brand);
}

.se-sprint-release__feature-page .se-sprint-release__update:focus-visible {
  outline: 2px solid var(--se-brand);
  outline-offset: 2px;
}

/* Previous / Next on the left of the View Release Notes row */
.se-sprint-release__feature-page .se-sprint-release__pager {
  display: flex;
  gap: 8px;
  margin-right: auto;
}

.se-sprint-release__feature-page .se-sprint-release__pager .se-sprint-release__btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  border-color: var(--se-line);
  color: var(--se-ink-3) !important;
}

@media (max-width: 600px) {
  .se-sprint-release__feature-page .se-sprint-release__page {
    padding: 12px;
  }

  .se-sprint-release__feature-page .se-sprint-release__page-card {
    padding: 16px;
  }

  .se-sprint-release__feature-page .se-sprint-release__pager {
    width: 100%;
  }
}

/* ---------------- Profile "What's New" dialog ---------------- */

html .se-sprint-release__whatsnew .MuiDialog-paper {
  background: var(--se-page) !important;
  padding: 16px !important;
  overflow: visible;
}

.se-sprint-release__whatsnew .se-sprint-release {
  margin: 0;
}

@media (max-width: 600px) {
  html .se-sprint-release__modal .MuiDialog-paper,
  html .se-sprint-release__whatsnew .MuiDialog-paper {
    margin: 8px !important;
    width: calc(100% - 16px) !important;
    max-width: calc(100% - 16px) !important;
  }

  html .se-sprint-release__modal .MuiDialog-paper {
    max-height: calc(100% - 16px) !important;
  }

  html .se-sprint-release__whatsnew .MuiDialog-paper {
    padding: 8px !important;
  }
}

/* ---------------- Release video player ---------------- */

html .se-sprint-release__video-modal .se-sprint-release__video-content {
  padding: 0 20px 20px !important;
  overflow: hidden;
}

.se-sprint-release__video-modal .se-sprint-release__video-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--se-r-card);
  overflow: hidden;
  background: var(--se-ink);
  box-shadow: var(--se-shadow);
}

.se-sprint-release__video-modal .se-sprint-release__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: var(--se-ink);
}

.se-sprint-release__video-modal .se-sprint-release__video:focus-visible {
  outline: 2px solid var(--se-brand);
  outline-offset: -2px;
}

.se-sprint-release__video-modal .se-sprint-release__video-error {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 220px;
  padding: 24px;
  border: 1px dashed var(--se-line);
  border-radius: var(--se-r-card);
  color: var(--se-ink-2);
  font-size: var(--se-t-sm);
  text-align: center;
}

.se-sprint-release__video-modal .se-sprint-release__video-error .fa {
  color: var(--se-warn);
  font-size: 22px;
}

/* ---------------- Dark mode: tinted surface hero instead of a bright brand plate ---------------- */

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__hero {
  color: var(--se-ink);
  border-color: var(--se-line);
  background:
    radial-gradient(circle at 92% 110%, color-mix(in srgb, var(--se-brand) 10%, transparent) 0 22%, transparent 23%),
    linear-gradient(115deg,
      color-mix(in srgb, var(--se-brand) 20%, var(--se-card)) 0%,
      var(--se-card) 60%,
      color-mix(in srgb, var(--se-ok) 12%, var(--se-card)) 100%);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__hero-art {
  color: var(--se-brand);
  background: color-mix(in srgb, var(--se-brand) 14%, transparent);
  box-shadow: 0 0 0 10px color-mix(in srgb, var(--se-brand) 6%, transparent);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__badge {
  color: var(--se-card);
  background: var(--se-brand);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__summary {
  color: var(--se-ink-2);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__highlights {
  border-color: var(--se-line);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__highlights .fa {
  color: var(--se-ok);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__btn--light {
  background: var(--se-brand);
  color: var(--se-card) !important;
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__btn--video .se-sprint-release__play {
  background: var(--se-card);
  color: var(--se-brand);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__btn--link {
  color: var(--se-ink-2) !important;
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__btn--link:hover {
  color: var(--se-brand) !important;
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__btn--ghost {
  color: var(--se-ink) !important;
  border-color: var(--se-line);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__btn--ghost:hover {
  background: var(--se-line-soft);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__dismiss {
  color: var(--se-ink-2);
}

html[data-se-mode="dark"] .se-sprint-release .se-sprint-release__dismiss:hover {
  background: var(--se-line-soft);
  color: var(--se-ink);
}

html[data-se-mode="dark"] .se-sprint-release__hero .se-sprint-release__btn:focus-visible,
html[data-se-mode="dark"] .se-sprint-release__hero .se-sprint-release__dismiss:focus-visible {
  outline-color: var(--se-brand);
}

@media (prefers-reduced-motion: reduce) {
  .se-sprint-release .se-sprint-release__feature,
  .se-sprint-release .se-sprint-release__feature-link .fa {
    transition: none;
  }

  .se-sprint-release .se-sprint-release__feature:hover {
    transform: none;
  }

  .se-sprint-release .se-sprint-release__notice-icon .fa-spin {
    animation: none;
  }
}

/* Native <select> caret — last-loaded so toolbar/table `background` shorthands
   cannot wipe the arrow. Do not apply to multiple / hidden native clones. */

html[data-se-theme] .securends select:not([multiple]),
html[data-se-theme] .securends select.form-control:not([multiple]),
html[data-se-theme] .securends .Sort_By_Data select,
html[data-se-theme] .securends .Sort_Status select,
html[data-se-theme] .securends .typeControls select,
html[data-se-theme] .securends .sortBlock select,
html[data-se-theme] .securends .manageApp select,
html[data-se-theme] .securends .o-form-title-bar select,
html[data-se-theme] .securends .ReactTable select,
html[data-se-theme] .securends .ReactTable .rt-thead.-filters select,
html[data-se-theme] .securends .ReactTable .rt-thead.-filters select.form-control,
html[data-se-theme] .securends .ReactTable .-pagination select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 7px !important;
  padding-right: 24px !important;
}

/* CSV / drawer mapping selects often render outside .securends — still show caret */
html[data-se-theme] .modal select:not([multiple]),
html[data-se-theme] .modal select.form-control:not([multiple]),
html[data-se-theme] .modal-body select:not([multiple]),
html[data-se-theme] .modal-body select.form-control:not([multiple]),
html[data-se-theme] .modal.right select:not([multiple]),
html[data-se-theme] .modal.right select.form-control:not([multiple]),
html[data-se-theme] .sidebar-modal select:not([multiple]),
html[data-se-theme] .sidebar-modal select.form-control:not([multiple]),
html[data-se-theme] .actions-modal select:not([multiple]),
html[data-se-theme] .actions-modal select.form-control:not([multiple]),
html[data-se-theme] .csv-fields select:not([multiple]),
html[data-se-theme] .csv-fields select.form-control:not([multiple]),
html[data-se-theme] .mapping-fields select:not([multiple]),
html[data-se-theme] .mapping-fields select.form-control:not([multiple]) {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: var(--se-card) !important;
  background-image: var(--se-select-caret) !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 7px !important;
  padding-right: 28px !important;
}

html[data-se-theme] .securends .multiselect-native-select select,
html[data-se-theme] .securends select[multiple] {
  appearance: auto !important;
  -webkit-appearance: auto !important;
  background-image: none !important;
  padding-right: 8px !important;
}

html[data-se-mode="dark"] .securends select:not([multiple]),
html[data-se-mode="dark"] .securends select.form-control:not([multiple]),
html[data-se-mode="dark"] .securends .Sort_By_Data select,
html[data-se-mode="dark"] .securends .ReactTable select {
  background-image: var(--se-select-caret-dark) !important;
}

html[data-se-mode="dark"] .modal select:not([multiple]),
html[data-se-mode="dark"] .modal select.form-control:not([multiple]),
html[data-se-mode="dark"] .modal-body select:not([multiple]),
html[data-se-mode="dark"] .modal.right select:not([multiple]),
html[data-se-mode="dark"] .sidebar-modal select:not([multiple]),
html[data-se-mode="dark"] .actions-modal select:not([multiple]) {
  background-image: var(--se-select-caret-dark) !important;
}

/* Bootstrap filter carets (not 3-dots action menus) */
html[data-se-theme] .securends .dropdown-toggle:not(.multiselect) .caret,
html[data-se-theme] .securends button.multiselect .caret {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  border-top-color: var(--se-ink-2) !important;
}

html[data-se-theme] .securends .ActionDropdown > button .caret,
html[data-se-theme] .securends .configActionDropdown .caret,
html[data-se-theme] .securends .dropdown.badge .caret {
  display: none !important;
}

/* Native <option> highlight — beat OS / Bootstrap #007bff with theme brand.
   Chrome/Edge need the linear-gradient trick on option:checked. */
html[data-se-theme] .securends select,
html[data-se-theme] .securends select.form-control {
  accent-color: var(--se-brand);
}

html[data-se-theme] .securends select option,
html[data-se-theme] .securends select.form-control option {
  background-color: var(--se-card);
  color: var(--se-ink);
}

html[data-se-theme] .securends select option:hover,
html[data-se-theme] .securends select option:focus {
  background-color: var(--se-brand-tint) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .securends select option:checked,
html[data-se-theme] .securends select option:checked:hover,
html[data-se-theme] .securends select option:checked:focus {
  background-color: var(--se-brand) !important;
  background-image: linear-gradient(var(--se-brand), var(--se-brand)) !important;
  color: #fff !important;
}

html[data-se-mode="dark"] .securends select option:checked,
html[data-se-mode="dark"] .securends select option:checked:hover,
html[data-se-mode="dark"] .securends select option:checked:focus,
html[data-theme="dark"] .securends select option:checked,
html.dark .securends select option:checked {
  background-color: var(--se-btn-bg, #dbeafe) !important;
  background-image: linear-gradient(var(--se-btn-bg, #dbeafe), var(--se-btn-bg, #dbeafe)) !important;
  color: var(--se-btn-fg, #333333) !important;
}

html[data-se-theme] .securends .dropdown-menu:not(.multiselect-container) > .active > a,
html[data-se-theme] .securends .dropdown-menu:not(.multiselect-container) > .active > a:hover,
html[data-se-theme] .securends .dropdown-menu:not(.multiselect-container) > .active > a:focus,
html[data-se-theme] .securends .dropdown-item:not(.multiselect-container *).active,
html[data-se-theme] .securends .dropdown-item:not(.multiselect-container *):active {
  background-color: var(--se-brand) !important;
  background-image: none !important;
  color: #fff !important;
}

html[data-se-mode="dark"] .securends .dropdown-menu:not(.multiselect-container) > .active > a,
html[data-se-mode="dark"] .securends .dropdown-menu:not(.multiselect-container) > .active > a:hover,
html[data-se-mode="dark"] .securends .dropdown-menu:not(.multiselect-container) > .active > a:focus,
html[data-se-mode="dark"] .securends .dropdown-item:not(.multiselect-container *).active,
html[data-se-mode="dark"] .securends .dropdown-item:not(.multiselect-container *):active {
  background-color: var(--se-btn-bg, #dbeafe) !important;
  color: var(--se-btn-fg, #333333) !important;
}

/* Dropdown labels / options — left-align (beat centered Status/Manager values). */
html[data-se-theme] .securends select:not([multiple]),
html[data-se-theme] .securends select.form-control:not([multiple]),
html[data-se-theme] .securends .Sort_By_Data select,
html[data-se-theme] .securends .manageApp select,
html[data-se-theme] .securends .o-form-title-bar select {
  text-align: left !important;
  text-align-last: left !important;
}

html[data-se-theme] .securends select option,
html[data-se-theme] .securends select.form-control option {
  text-align: left !important;
}

html[data-se-theme] .securends .react-select__control,
html[data-se-theme] .securends .selectUsertype .react-select__control,
html[data-se-theme] .securends .Manager .react-select__control,
html[data-se-theme] .securends .selectCampaign [class*="-control"],
html[data-se-theme] .securends div[class^="css-"][class*="-control"] {
  justify-content: flex-start !important;
  text-align: left !important;
}

html[data-se-theme] .securends .react-select__value-container,
html[data-se-theme] .securends .selectUsertype .react-select__value-container,
html[data-se-theme] .securends .Manager .react-select__value-container,
html[data-se-theme] .securends .selectCampaign [class*="-ValueContainer"],
html[data-se-theme] .securends div[class^="css-"][class*="-ValueContainer"],
html[data-se-theme] .securends div[class^="css-"][class*="-value-container"] {
  justify-content: flex-start !important;
  justify-items: start !important;
  text-align: left !important;
}

html[data-se-theme] .securends .react-select__single-value,
html[data-se-theme] .securends .react-select__placeholder,
html[data-se-theme] .securends .selectUsertype .react-select__single-value,
html[data-se-theme] .securends .selectUsertype .react-select__placeholder,
html[data-se-theme] .securends .Manager .react-select__single-value,
html[data-se-theme] .securends .Manager .react-select__placeholder,
html[data-se-theme] .securends .selectCampaign [class*="-singleValue"],
html[data-se-theme] .securends .selectCampaign [class*="-placeholder"],
html[data-se-theme] .securends div[class^="css-"][class*="-singleValue"],
html[data-se-theme] .securends div[class^="css-"][class*="-placeholder"] {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  /* react-select v3 absolutely positions these — auto keeps them after the
     value-container padding; left:0 pinned the text onto the control border. */
  left: auto !important;
  right: auto !important;
  max-width: 100% !important;
}

html[data-se-theme] .securends .react-select__option,
html[data-se-theme] .securends .selectUsertype .react-select__option,
html[data-se-theme] .securends .Manager .react-select__option,
html[data-se-theme] .securends .selectCampaign [class*="-option"],
html[data-se-theme] .securends div[class^="css-"][class*="-option"],
html[data-se-theme] .react-select__menu-portal .react-select__option,
html[data-se-theme] .react-select__menu-portal [class*="-option"],
html[data-se-theme] [class*="menuPortal"] [class*="-option"] {
  text-align: left !important;
  justify-content: flex-start !important;
}

/* Global bootstrap-multiselect chrome — app-wide.
   MUST load last in ui-modern/index.css so prod chunk order cannot let
   bootstrap-multiselect / pickels / configActionDropdown win and paint an
   extra top line on portaled menus (Historic Campaign Quarters, etc.).
   Presentation only. Menus open via placeMultiselectMenu.js (fixed under trigger).
   Do not treat button.multiselect as a 3-dots action menu. */

/* --------------------------------------------------------------------------
   Trigger
   -------------------------------------------------------------------------- */

html[data-se-theme] .securends button.multiselect.dropdown-toggle,
html[data-se-theme] .securends button.multiselect.dropdown-toggle.btn.btn-default,
html[data-se-theme] .securends .btn-group button.multiselect.dropdown-toggle,
.securends button.multiselect.dropdown-toggle,
.securends button.multiselect.dropdown-toggle.btn.btn-default,
.securends .btn-group button.multiselect.dropdown-toggle {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 12px !important;
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  box-shadow: none !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  text-align: left !important;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3 !important;
}

html[data-se-theme] .securends button.multiselect .multiselect-selected-text,
.securends button.multiselect .multiselect-selected-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] .securends button.multiselect .caret,
.securends button.multiselect .caret {
  display: inline-block !important;
  margin-left: 8px !important;
  flex: 0 0 auto;
  float: none !important;
  border-top-color: var(--se-ink-2);
}

html[data-se-theme] .securends .multiselect-native-select,
html[data-se-theme] .securends .multiselect-native-select .btn-group,
.securends .multiselect-native-select,
.securends .multiselect-native-select .btn-group {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

/* --------------------------------------------------------------------------
   Menu panel (in-place or body-portaled)
   -------------------------------------------------------------------------- */

html[data-se-theme] ul.multiselect-container.dropdown-menu,
html[data-se-theme] ul.multiselect-container.dropdown-menu.show,
html[data-se-theme] ul.multiselect-container.dropdown-menu.open,
html[data-se-theme] .btn-group.open > ul.multiselect-container.dropdown-menu,
html[data-se-theme] .se-multiselect-menu-portaled,
.securends ul.multiselect-container.dropdown-menu,
ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled,
.multiselect-container.dropdown-menu {
  background: var(--se-card) !important;
  color: var(--se-ink) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r-card, 12px) !important;
  box-shadow: var(--se-shadow-lg) !important;
  padding: 0 0 6px !important;
  margin: 4px 0 0 !important;
  max-height: min(320px, 50vh) !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: auto !important;
  list-style: none !important;
  z-index: 10050 !important;
  transform: none !important;
  box-sizing: border-box !important;
  background-image: none !important;
  background-clip: padding-box !important;
  outline: none !important;
}

/* Portaled menus (body) — beat any later vendor sheet; kill ghost top line */
html[data-se-theme] body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled,
html[data-se-theme] ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled,
body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled,
ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled {
  margin: 0 !important;
  margin-top: 0 !important;
  padding-top: 6px !important;
  border: 1px solid var(--se-line) !important;
  border-top: 1px solid var(--se-line) !important;
  border-bottom: 1px solid var(--se-line) !important;
  box-shadow: var(--se-shadow-lg) !important;
  background: var(--se-card) !important;
  background-image: none !important;
}

/* Sticky search row pins below the scroller's padding-top, so any top padding
   leaves a strip where scrolled options bleed above the search box. */
html[data-se-theme] body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:has(> li.multiselect-filter),
html[data-se-theme] ul.multiselect-container.dropdown-menu:has(> li.multiselect-filter),
body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:has(> li.multiselect-filter),
.securends ul.multiselect-container.dropdown-menu:has(> li.multiselect-filter),
ul.multiselect-container.dropdown-menu:has(> li.multiselect-filter) {
  padding-top: 0 !important;
}

/* Empty / orphan portaled <ul> shells render as a thin white line in prod */
html[data-se-theme] body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:empty,
html[data-se-theme] ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:empty,
body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:empty,
ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:empty,
html[data-se-theme] body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:not(:has(> li)),
body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:not(:has(> li)),
ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled:not(:has(> li)) {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

html[data-se-theme] body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::before,
html[data-se-theme] body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::after,
html[data-se-theme] ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::before,
html[data-se-theme] ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::after,
body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::before,
body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::after,
ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::before,
ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled::after,
ul.multiselect-container.dropdown-menu::before,
ul.multiselect-container.dropdown-menu::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

/* Bootstrap .divider / select-all separator — hide the stray 1px line */
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.divider,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-item.divider,
html[data-se-theme] body > ul.multiselect-container.dropdown-menu > li.divider,
.securends ul.multiselect-container.dropdown-menu > li.divider,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-item.divider,
ul.multiselect-container.dropdown-menu > li.divider,
ul.multiselect-container.dropdown-menu > li.multiselect-item.divider,
.multiselect-container.dropdown-menu > li.divider,
.multiselect-container.dropdown-menu > .divider {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li:first-child,
html[data-se-theme] body > ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled > li:first-child,
ul.multiselect-container.dropdown-menu.se-multiselect-menu-portaled > li:first-child,
.multiselect-container.dropdown-menu > li:first-child {
  border-top: 0 !important;
  box-shadow: none !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu.se-ms-fit,
.securends ul.multiselect-container.dropdown-menu.se-ms-fit,
ul.multiselect-container.dropdown-menu.se-ms-fit {
  max-height: min(340px, 50vh) !important;
  max-width: min(420px, 90vw) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  width: max-content !important;
  min-width: 248px !important;
  scrollbar-width: thin !important;
  -ms-overflow-style: auto !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu.se-ms-fit::-webkit-scrollbar,
.securends ul.multiselect-container.dropdown-menu.se-ms-fit::-webkit-scrollbar,
ul.multiselect-container.dropdown-menu.se-ms-fit::-webkit-scrollbar {
  display: block !important;
  width: 6px !important;
  height: 6px !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu.se-ms-fit::-webkit-scrollbar-thumb,
.securends ul.multiselect-container.dropdown-menu.se-ms-fit::-webkit-scrollbar-thumb,
ul.multiselect-container.dropdown-menu.se-ms-fit::-webkit-scrollbar-thumb {
  background: var(--se-line, #cbd5e1) !important;
  border-radius: 999px !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu.se-ms-fit > li,
html[data-se-theme] ul.multiselect-container.dropdown-menu.se-ms-fit > li > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu.se-ms-fit > li > a > label,
.securends ul.multiselect-container.dropdown-menu.se-ms-fit > li,
.securends ul.multiselect-container.dropdown-menu.se-ms-fit > li > a,
.securends ul.multiselect-container.dropdown-menu.se-ms-fit > li > a > label {
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: unset !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li:not(.multiselect-filter-hidden),
.securends ul.multiselect-container.dropdown-menu > li:not(.multiselect-filter-hidden),
.multiselect-container.dropdown-menu > li:not(.multiselect-filter-hidden) {
  float: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative;
  z-index: 0;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li:not(.multiselect-filter):not(.multiselect-reset):not(.multiselect-group):not(.multiselect-filter-hidden),
.securends ul.multiselect-container.dropdown-menu > li:not(.multiselect-filter):not(.multiselect-reset):not(.multiselect-group):not(.multiselect-filter-hidden),
.multiselect-container.dropdown-menu > li:not(.multiselect-filter):not(.multiselect-reset):not(.multiselect-group):not(.multiselect-filter-hidden) {
  width: max-content !important;
  min-width: 100% !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-filter-hidden,
html[data-se-theme] ul.multiselect-container.dropdown-menu.se-ms-fit > li.multiselect-filter-hidden,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-filter-hidden,
.multiselect-container.dropdown-menu > li.multiselect-filter-hidden,
.multiselect-container.dropdown-menu.show > li.multiselect-filter-hidden,
.multiselect-container.dropdown-menu.open > li.multiselect-filter-hidden {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  width: auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
}

/* --------------------------------------------------------------------------
   Search row — single flex line: icon | input | clear
   Beats configActionDropdown-styles table-cell / dual borders.
   -------------------------------------------------------------------------- */

html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-filter,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-filter,
.multiselect-container.dropdown-menu > li.multiselect-filter {
  position: sticky !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 5 !important;
  padding: 8px 10px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--se-line) !important;
  background: var(--se-card) !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group,
html[data-se-theme] ul.multiselect-container.dropdown-menu .input-group,
.securends ul.multiselect-container.dropdown-menu .multiselect-filter .input-group,
.multiselect-container.dropdown-menu .multiselect-filter .input-group,
.multiselect-container.dropdown-menu .input-group {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
  background: var(--se-page) !important;
  border: 1px solid var(--se-line) !important;
  border-radius: var(--se-r) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group > *,
.multiselect-container.dropdown-menu .multiselect-filter .input-group > * {
  float: none !important;
  width: auto !important;
  display: flex !important;
  align-items: center !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-addon,
html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-text,
html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-btn,
.securends ul.multiselect-container.dropdown-menu .multiselect-filter .input-group-addon,
.multiselect-container.dropdown-menu .multiselect-filter .input-group-addon,
.multiselect-container.dropdown-menu .multiselect-filter .input-group-text,
.multiselect-container.dropdown-menu .multiselect-filter .input-group-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  flex-shrink: 0 !important;
  float: none !important;
  width: auto !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  position: relative !important;
  z-index: 2 !important;
  pointer-events: auto !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--se-ink-2) !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu input.form-control.multiselect-search,
html[data-se-theme] ul.multiselect-container.dropdown-menu .multiselect-filter input.multiselect-search,
.securends ul.multiselect-container.dropdown-menu input.form-control.multiselect-search,
.multiselect-container.dropdown-menu input.form-control.multiselect-search,
.multiselect-container.dropdown-menu .multiselect-filter input.multiselect-search {
  flex: 1 1 auto !important;
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 32px !important;
  min-height: 32px !important;
  margin: 0 !important;
  padding: 0 8px !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--se-page) !important;
  color: var(--se-ink) !important;
  font-family: var(--se-sans) !important;
  font-size: 13px !important;
  line-height: 32px !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu input.multiselect-search::-webkit-search-cancel-button,
.multiselect-container.dropdown-menu input.multiselect-search::-webkit-search-cancel-button,
html[data-se-theme] ul.multiselect-container.dropdown-menu input.multiselect-search::-ms-clear,
.multiselect-container.dropdown-menu input.multiselect-search::-ms-clear {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu .btn.multiselect-clear-filter,
.multiselect-container.dropdown-menu .btn.multiselect-clear-filter,
.multiselect-container.dropdown-menu .multiselect-filter .input-group-btn .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 2 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--se-ink-2) !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 32px !important;
  min-height: 32px !important;
  width: 28px !important;
  min-width: 28px !important;
  flex: 0 0 28px !important;
  line-height: 1 !important;
}

/* Glyphicons → Font Awesome (Bootstrap 5) */
html[data-se-theme] .multiselect-container .multiselect-filter .glyphicon-search::before,
.multiselect-container .multiselect-filter .glyphicon-search::before {
  content: "\f002" !important;
  font-family: "FontAwesome" !important;
}

html[data-se-theme] .multiselect-container .multiselect-filter .glyphicon-remove-circle::before,
.multiselect-container .multiselect-filter .glyphicon-remove-circle::before {
  content: "\f057" !important;
  font-family: "FontAwesome" !important;
}

/* Options */
html[data-se-theme] ul.multiselect-container.dropdown-menu > li > a,
.securends ul.multiselect-container.dropdown-menu > li > a,
.multiselect-container.dropdown-menu > li > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu.show > li > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu.open > li > a,
.btn-group.open > ul.multiselect-container.dropdown-menu > li > a {
  display: block !important;
  width: max-content !important;
  min-width: calc(100% - 12px) !important;
  margin: 2px 6px !important;
  padding: 0 !important;
  border-radius: 6px !important;
  color: var(--se-ink) !important;
  text-decoration: none !important;
  background: transparent !important;
  transition: background 0.15s ease, color 0.15s ease;
  z-index: 0;
}

/* Checkbox + text: flex row with a real gap (beats Bootstrap .checkbox
   padding-left / margin-left:-20px and configActionDropdown display:block). */
html[data-se-theme] ul.multiselect-container.dropdown-menu > li > a > label,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li > a > label.checkbox,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li > a > label.radio,
html[data-se-theme] ul.multiselect-container.dropdown-menu.show > li > a > label,
html[data-se-theme] ul.multiselect-container.dropdown-menu.open > li > a > label,
html[data-se-theme] .btn-group.open > ul.multiselect-container.dropdown-menu > li > a > label,
.securends ul.multiselect-container.dropdown-menu > li > a > label,
.securends ul.multiselect-container.dropdown-menu > li > a > label.checkbox,
.securends ul.multiselect-container.dropdown-menu.show > li > a > label,
.multiselect-container.dropdown-menu > li > a > label,
.multiselect-container.dropdown-menu > li > a > label.checkbox,
.multiselect-container.dropdown-menu.show > li > a > label,
.multiselect-container.dropdown-menu.open > li > a > label,
.btn-group.open .multiselect-container.dropdown-menu li > a > label {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 10px !important;
  width: max-content !important;
  max-width: none !important;
  min-width: 100% !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  font-family: var(--se-sans) !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  color: var(--se-ink) !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  border-radius: 6px !important;
  text-indent: 0 !important;
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li > a > label > input[type="checkbox"],
html[data-se-theme] ul.multiselect-container.dropdown-menu > li > a > label.checkbox > input[type="checkbox"],
html[data-se-theme] ul.multiselect-container.dropdown-menu.show > li > a > label > input[type="checkbox"],
html[data-se-theme] ul.multiselect-container.dropdown-menu.open > li > a > label > input[type="checkbox"],
.securends ul.multiselect-container.dropdown-menu > li > a > label > input[type="checkbox"],
.securends ul.multiselect-container.dropdown-menu > li > a > label.checkbox > input[type="checkbox"],
.multiselect-container.dropdown-menu > li > a > label > input[type="checkbox"],
.multiselect-container.dropdown-menu > li > a > label.checkbox > input[type="checkbox"],
.multiselect-container.dropdown-menu.show li > a > label.checkbox > input[type="checkbox"],
.multiselect-container.dropdown-menu.open li > a > label.checkbox > input[type="checkbox"],
.btn-group.open .multiselect-container.dropdown-menu li > a > label.checkbox > input[type="checkbox"] {
  position: static !important;
  float: none !important;
  left: auto !important;
  top: auto !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  flex: 0 0 15px !important;
  flex-shrink: 0 !important;
  accent-color: var(--se-brand);
  cursor: pointer;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  vertical-align: middle !important;
}

/* Hover state on unselected item */
html[data-se-theme] ul.multiselect-container.dropdown-menu > li:hover > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li > a:hover,
.securends ul.multiselect-container.dropdown-menu > li:hover > a,
.securends ul.multiselect-container.dropdown-menu > li > a:hover,
.multiselect-container.dropdown-menu > li:hover > a,
.multiselect-container.dropdown-menu > li > a:hover {
  background: var(--se-row-hover, #f8fafc) !important;
  color: var(--se-ink) !important;
}

/* Selected item (active) — surface color by theme mode, not brand/blue tint */
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.active > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.active > a:focus,
html[data-se-theme] .securends ul.multiselect-container.dropdown-menu > li.active > a,
html[data-se-theme] .securends ul.multiselect-container.dropdown-menu > li.active > a:focus,
.securends ul.multiselect-container.dropdown-menu > li.active > a,
.securends ul.multiselect-container.dropdown-menu > li.active > a:focus,
.multiselect-container.dropdown-menu > li.active > a,
.multiselect-container.dropdown-menu > li.active > a:focus {
  background: var(--se-card) !important;
  background-image: none !important;
  color: var(--se-ink) !important;
  box-shadow: none !important;
  outline: none !important;
  border: 0 !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li.active:hover > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.active > a:hover,
html[data-se-theme] .securends ul.multiselect-container.dropdown-menu > li.active:hover > a,
html[data-se-theme] .securends ul.multiselect-container.dropdown-menu > li.active > a:hover,
.securends ul.multiselect-container.dropdown-menu > li.active:hover > a,
.securends ul.multiselect-container.dropdown-menu > li.active > a:hover,
.multiselect-container.dropdown-menu > li.active:hover > a,
.multiselect-container.dropdown-menu > li.active > a:hover {
  background: var(--se-row-hover, var(--se-card)) !important;
  color: var(--se-ink) !important;
}

/* Ensure label inside active anchor also retains dark ink text */
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.active > a > label,
html[data-se-theme] .securends ul.multiselect-container.dropdown-menu > li.active > a > label,
.securends ul.multiselect-container.dropdown-menu > li.active > a > label,
.multiselect-container.dropdown-menu > li.active > a > label {
  color: var(--se-ink) !important;
  font-weight: 500 !important;
}

/* Select-all — same horizontal inset as every other option row */
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-all,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-all,
.multiselect-container.dropdown-menu > li.multiselect-all {
  border-bottom: 0 !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-all > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu.show > li.multiselect-all > a,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-all > a,
.multiselect-container.dropdown-menu > li.multiselect-all > a,
.multiselect-container.dropdown-menu li > a.multiselect-all {
  background: transparent !important;
  margin: 2px 6px !important;
  width: max-content !important;
  min-width: calc(100% - 12px) !important;
  padding: 0 !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-all:hover > a,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-all > a:hover,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-all:hover > a,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-all > a:hover,
.multiselect-container.dropdown-menu > li.multiselect-all:hover > a,
.multiselect-container.dropdown-menu > li.multiselect-all > a:hover {
  background: var(--se-row-hover, #f8fafc) !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-all > a > label,
html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-all > a > label.checkbox,
html[data-se-theme] ul.multiselect-container.dropdown-menu li > a.multiselect-all > label,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-all > a > label,
.securends ul.multiselect-container.dropdown-menu > li.multiselect-all > a > label.checkbox,
.multiselect-container.dropdown-menu > li.multiselect-all > a > label,
.multiselect-container.dropdown-menu li > a.multiselect-all label {
  border-bottom: none !important;
  padding: 8px 10px !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  text-indent: 0 !important;
  font-weight: 500 !important;
  color: var(--se-ink) !important;
}

html[data-se-theme] ul.multiselect-container.dropdown-menu > li.multiselect-all > a > label > input[type="checkbox"],
html[data-se-theme] ul.multiselect-container.dropdown-menu li > a.multiselect-all label > input[type="checkbox"],
.securends ul.multiselect-container.dropdown-menu > li.multiselect-all > a > label > input[type="checkbox"],
.multiselect-container.dropdown-menu > li.multiselect-all > a > label > input[type="checkbox"],
.multiselect-container.dropdown-menu li > a.multiselect-all label > input[type="checkbox"] {
  position: static !important;
  float: none !important;
  left: auto !important;
  margin: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* --------------------------------------------------------------------------
   Dark mode ACTION button — #dropdownMenu in pickels-v3.css forces
   background-color:#fff !important (ID beats every class rule).
   Light mode unchanged.
   -------------------------------------------------------------------------- */
html[data-se-mode="dark"] #dropdownMenu,
html[data-se-mode="dark"] button#dropdownMenu.btn.btn-default {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: #b0e0e6 !important;
}

html[data-se-mode="dark"] #dropdownMenu .fa-cog,
html[data-se-mode="dark"] #dropdownMenu .fa-cog::before,
html[data-se-mode="dark"] #dropdownMenu .appGear,
html[data-se-mode="dark"] #dropdownMenu .appGear::before {
  background: transparent !important;
  background-color: transparent !important;
  color: #b0e0e6 !important;
}

/* Resolution locks — presentation only.
   The header, breadcrumb, and page canvas fill the column beside the sidebar
   (QA31). A fixed 1140/1440 cap left an empty band on the right of laptop
   and 1920px windows, so width stays the full column. From 1366px the shared
   inset locks at 24px. Dark + horizontal still flushes that inset to 0.
   Below 1366 the foundation clamp is unchanged. */

@media (min-width: 1366px) {
  :root,
  .securends {
    --se-header-inset-x: 24px;
    --se-header-pad-x: 24px;
    --se-page-pad-x: var(--se-header-inset-x);
    --se-page-max: 100%;
    --se-chrome-w: calc(100% - var(--se-sidebar-w) - (2 * var(--se-header-inset-x)));
  }

  html[data-se-nav="horizontal"] .securends {
    --se-chrome-w: calc(100% - (2 * var(--se-header-inset-x)));
  }

  /* 1. Header and canvas share the inset and span the full column. */
  .securends .MuiAppBar-root,
  .securends header.MuiAppBar-root {
    left: auto !important;
    right: var(--se-header-inset-x) !important;
    width: var(--se-chrome-w) !important;
    max-width: none !important;
  }

  html[data-se-nav="horizontal"] .securends .MuiAppBar-root,
  html[data-se-nav="horizontal"] .securends header.MuiAppBar-root {
    left: var(--se-header-inset-x) !important;
    right: auto !important;
    width: var(--se-chrome-w) !important;
    max-width: none !important;
  }

  .securends .main-content {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    box-sizing: border-box;
  }

  /* 5. Breadcrumb uses the same box as the AppBar and stays above page stickies. */
  .securends .se-breadcrumb {
    left: auto !important;
    right: var(--se-header-inset-x) !important;
    width: var(--se-chrome-w) !important;
    max-width: none !important;
    z-index: 55;
  }

  html[data-se-nav="horizontal"] .securends .se-breadcrumb {
    left: var(--se-header-inset-x) !important;
    right: auto !important;
    width: var(--se-chrome-w) !important;
    max-width: none !important;
    z-index: 55;
  }

  /* 2. Title bars stay one row. Actions sit in the trailing group. */
  .securends .o-form-title-bar,
  .securends h2.o-form-title-bar,
  .securends div.o-form-title-bar,
  .securends .manageApp:has(> .se-toolbar-actions) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between;
    flex-wrap: nowrap;
    min-width: 0;
  }

  .securends .o-form-title-bar > .se-toolbar-actions,
  .securends .manageApp > .se-toolbar-actions,
  .securends .se-toolbar-actions {
    display: inline-flex !important;
    align-items: center;
    flex-wrap: nowrap;
    flex: 0 0 auto;
    margin-left: auto !important;
  }

  /* 3. Overflowing tables: header and filter rows share one token height. */
  .securends .ReactTable.se-table-hscroll .rt-thead.-header,
  .securends .ReactTable.se-table-hscroll .rt-thead.-filters {
    height: var(--se-table-colhead) !important;
    min-height: var(--se-table-colhead) !important;
    max-height: var(--se-table-colhead) !important;
  }

  .securends .ReactTable.se-table-hscroll .rt-thead.-filters {
    top: var(--se-table-colhead) !important;
  }

  /* 4. Filter and query rows lock to the control baseline. */
  .securends .ReactTable .rt-thead.-filters .rt-tr,
  .securends .modal .application-filter-modal .templatedata_box > .row {
    align-items: flex-end !important;
  }

  .securends .modal .application-filter-modal .templatedata_box > .row > [class*="col-"] {
    margin-top: 0 !important;
    padding-top: 0 !important;
    align-self: flex-end;
  }
}

/* Tablet foundation (768×1024). MUI hides the docked drawer below 960px and
   the canvas is full width. Keep the header on that same width — subtracting
   --se-sidebar-w here left a short bar and parked the apps icon in the gap. */
@media (max-width: 959px) {
  .securends {
    --se-sidebar-w: 0px;
  }

  .securends .MuiAppBar-root,
  .securends header.MuiAppBar-root {
    left: var(--se-header-inset-x) !important;
    right: auto !important;
    width: calc(100% - (2 * var(--se-header-inset-x))) !important;
    max-width: none !important;
    margin-left: 0 !important;
  }

  .securends .se-breadcrumb {
    left: var(--se-header-inset-x) !important;
    right: auto !important;
    width: calc(100% - (2 * var(--se-header-inset-x))) !important;
    max-width: none !important;
  }

  .securends .MuiAppBar-root .MuiToolbar-root {
    padding-left: 44px !important;
  }

  html:not([data-se-nav="horizontal"]) .securends .prod-popup-sidebar {
    top: 18px !important;
    left: calc(var(--se-header-inset-x) + 12px) !important;
    color: var(--se-ink) !important;
  }

  html:not([data-se-nav="horizontal"]) .securends .prod-popup-sidebar .material-icons {
    color: var(--se-ink) !important;
  }
}

/* Dark + horizontal stays flush. Must follow the 24px lock above. */
@media (min-width: 1366px) {
  html[data-se-mode="dark"][data-se-nav="horizontal"],
  html.dark[data-se-nav="horizontal"],
  html[data-theme="dark"][data-se-nav="horizontal"],
  html[data-se-mode="dark"][data-se-nav="horizontal"] .securends,
  html.dark[data-se-nav="horizontal"] .securends,
  html[data-theme="dark"][data-se-nav="horizontal"] .securends {
    --se-header-inset-x: 0px;
    --se-header-pad-x: 0px;
    --se-page-pad-x: 0px;
  }
}


/*# sourceMappingURL=main-8c575a6e.9537a2b3.css.map*/