:root {
  --dl-final-bg: #0f141d;
  --dl-final-panel: #111823;
  --dl-final-border: #dbe3ef;
  --dl-final-line: #e8edf5;
  --dl-final-text: #172033;
  --dl-final-muted: #64748b;
  --dl-final-pink: #d91b83;
  --dl-final-pink-dark: #b81772;
  --dl-final-blue-head: #f3f7fc;
}

#container,
#content,
#header,
#nav,
#sub_nav {
  box-sizing: border-box !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: geometricPrecision !important;
}

#content h1,
#content h2,
#content h3,
#content .subject,
#content .headline {
  text-wrap: balance !important;
}

#container #header .staff-login-link {
  color: rgba(255,255,255,.78) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

#container #header .staff-login-link:hover {
  color: #fff !important;
}

#container #header .staff-login-link-separator {
  margin: 0 8px !important;
  color: rgba(255,255,255,.35) !important;
}

#nav,
#sub_nav {
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap !important;
}

#nav li,
#sub_nav li,
#nav li.active,
#sub_nav li.active {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
}

#nav li > a,
#sub_nav li > a,
#nav a,
#sub_nav a {
  min-height: 38px !important;
  min-width: 104px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 13px !important;
  border-radius: 6px 6px 0 0 !important;
  background: transparent !important;
  background-image: none !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

#sub_nav li > a,
#sub_nav a {
  min-width: 96px !important;
}

#nav a[href*="kb"],
#nav a[href*="Knowledgebase"],
#sub_nav a[href*="settings.php?t=kb"] {
  min-width: 136px !important;
}

#nav li.active > a,
#sub_nav li.active > a,
#nav a.active,
#sub_nav a.active {
  background: rgba(217,27,131,.14) !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 var(--dl-final-pink) !important;
}

#landing_page .front-page-button,
#landing_page .front-page-button p,
#content #landing_page .front-page-button,
#content #landing_page .front-page-button p {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 248px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#landing_page .front-page-button a,
#landing_page .front-page-button .button,
#content #landing_page .front-page-button a,
#content #landing_page .front-page-button .button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  width: 100% !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: linear-gradient(135deg, var(--dl-final-pink), var(--dl-final-pink-dark)) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: 0 16px 32px rgba(217,27,131,.22) !important;
  text-align: center !important;
  text-decoration: none !important;
}

#clientLogin {
  display: block !important;
  box-sizing: border-box !important;
  width: min(100%, 860px) !important;
  max-width: 860px !important;
  overflow: hidden !important;
}

#clientLogin > div[style*="display:table-row"] {
  display: grid !important;
  box-sizing: border-box !important;
  grid-template-columns: minmax(260px, 300px) minmax(280px, 360px) !important;
  gap: 28px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: 708px !important;
}

#clientLogin .login-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 18px !important;
  border: 1px solid var(--dl-final-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: 0 18px 44px rgba(15,23,42,.08) !important;
}

#clientLogin .login-box input[type="text"],
#clientLogin .login-box input[type="password"] {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 38px !important;
}

#clientLogin .login-box p {
  margin: 4px 0 0 !important;
}

#clientLogin .login-box + div {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding: 18px 0 0 !important;
  background: transparent !important;
}

#clientLogin .login-box + div hr {
  width: min(100%, 360px) !important;
  margin: 10px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--dl-final-border) !important;
}

.external-auth {
  width: min(100%, 360px) !important;
  margin: 0 !important;
}

.external-auth .external-sign-in,
#loginBox .external-auth .external-sign-in,
#clientLogin .external-auth .external-sign-in {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 44px !important;
  gap: 12px !important;
  padding: 0 16px !important;
  border: 1px solid var(--dl-final-border) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #111827 !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  box-shadow: 0 16px 36px rgba(15,23,42,.08) !important;
}

.external-auth .external-auth-box {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.external-auth .external-auth-icon {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  background:
    linear-gradient(#f25022 0 0) 0 0 / 8px 8px no-repeat,
    linear-gradient(#7fba00 0 0) 10px 0 / 8px 8px no-repeat,
    linear-gradient(#00a4ef 0 0) 0 10px / 8px 8px no-repeat,
    linear-gradient(#ffb900 0 0) 10px 10px / 8px 8px no-repeat !important;
}

.external-auth .external-auth-icon i {
  display: none !important;
}

.external-auth .external-auth-name {
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}

#content .search,
#content form[action*="search"],
#content form[action*="tickets"] > div:first-child,
#content > div:first-child {
  max-width: 100% !important;
}

#content input[type="text"],
#content input[type="email"],
#content input[type="password"],
#content input[type="search"],
#content select,
#content textarea {
  border: 1px solid #d7dfec !important;
  border-radius: 7px !important;
  box-shadow: none !important;
}

#content input[type="text"]:focus,
#content input[type="email"]:focus,
#content input[type="password"]:focus,
#content input[type="search"]:focus,
#content select:focus,
#content textarea:focus {
  border-color: rgba(217,27,131,.55) !important;
  box-shadow: 0 0 0 3px rgba(217,27,131,.14) !important;
  outline: none !important;
}

#content .attached.button,
#content .drop-down-button,
#content .pull-right .button,
#content .pull-right a.button,
#content button,
#content input[type="button"],
#content input[type="reset"] {
  min-height: 36px !important;
  padding: 0 12px !important;
  border: 1px solid #d8e1ef !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #334155 !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.05) !important;
}

#content input[type="submit"],
#content a[href*="add"].button,
#content a[href*="open"].button,
#content .green.button.action-button {
  min-height: 38px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: linear-gradient(135deg, var(--dl-final-pink), var(--dl-final-pink-dark)) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: 0 16px 30px rgba(217,27,131,.2) !important;
}

table.list th,
.list th,
#content > table th {
  background: var(--dl-final-blue-head) !important;
  color: #172033 !important;
}

#content,
#clientLogin,
#content .login-box,
#content .list,
#content table.list,
#content > table,
#content .dialog,
.ui-dialog {
  box-shadow:
    0 0 0 1px rgba(15,23,42,.045),
    0 10px 30px -22px rgba(15,23,42,.28),
    0 22px 52px -34px rgba(15,23,42,.18) !important;
}

#content .list,
#content table.list,
#content > table {
  border-radius: 0 !important;
}

#content td,
#content th,
#content table,
#content .number,
#content .preview,
#content [class*="ticket"],
#content [href*="sort"],
#content time {
  font-variant-numeric: tabular-nums !important;
}

#content a,
#content button,
#content input,
#content select,
#content textarea,
#nav a,
#sub_nav a {
  transition:
    color .18s cubic-bezier(.16,1,.3,1),
    background-color .18s cubic-bezier(.16,1,.3,1),
    border-color .18s cubic-bezier(.16,1,.3,1),
    box-shadow .18s cubic-bezier(.16,1,.3,1),
    transform .18s cubic-bezier(.16,1,.3,1) !important;
}

#content a.button:hover,
#content button:hover,
#content input[type="submit"]:hover,
#content input[type="button"]:hover {
  transform: translateY(-1px) !important;
}

#content a.button:active,
#content button:active,
#content input[type="submit"]:active,
#content input[type="button"]:active {
  transform: translateY(0) scale(.985) !important;
}

#overlay,
.dialog,
.modal,
.popup,
.ui-dialog {
  border-radius: 8px !important;
}

.ui-dialog,
.dialog {
  box-shadow: 0 28px 80px rgba(0,0,0,.32) !important;
}

.ui-dialog .buttons,
.dialog .buttons,
.dialog .button-group {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}

@media (max-width: 760px) {
  #clientLogin > div[style*="display:table-row"] {
    grid-template-columns: 1fr !important;
  }

  #clientLogin .login-box + div,
  .external-auth {
    width: 100% !important;
  }
}

/* Lucide / Animate UI-style icon replacement for legacy osTicket icons */
i[class^="icon-"],
i[class*=" icon-"],
a[class*="icon-"]::before,
button[class*="icon-"]::before {
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  margin-right: 6px !important;
  color: currentColor !important;
  background-color: currentColor !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 16px 16px !important;
  font-size: 0 !important;
  line-height: 1 !important;
  vertical-align: -3px !important;
  transition: transform .24s cubic-bezier(.16,1,.3,1), opacity .24s cubic-bezier(.16,1,.3,1) !important;
  -webkit-mask: var(--dl-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='1'/%3E%3Ccircle cx='19' cy='12' r='1'/%3E%3Ccircle cx='5' cy='12' r='1'/%3E%3C/svg%3E")) center / contain no-repeat !important;
  mask: var(--dl-icon, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='1'/%3E%3Ccircle cx='19' cy='12' r='1'/%3E%3Ccircle cx='5' cy='12' r='1'/%3E%3C/svg%3E")) center / contain no-repeat !important;
}

a:hover i[class^="icon-"],
a:hover i[class*=" icon-"],
button:hover i[class^="icon-"],
button:hover i[class*=" icon-"] {
  transform: translateY(-1px) scale(1.04) !important;
}

.icon-search { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E"); }
.icon-plus, .icon-plus-sign, .icon-list-add, .icon-form-add { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E"); }
.icon-cog, .icon-gear, .icon-cogs { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Z'/%3E%3Cpath d='M19.4 15a1.7 1.7 0 0 0 .3 1.9l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.9-.3 1.7 1.7 0 0 0-1 1.6V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1-1.6 1.7 1.7 0 0 0-1.9.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1A1.7 1.7 0 0 0 4.6 15a1.7 1.7 0 0 0-1.6-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.6-1 1.7 1.7 0 0 0-.3-1.9l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1A1.7 1.7 0 0 0 9 4.6a1.7 1.7 0 0 0 1-1.6V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.6 1.7 1.7 0 0 0 1.9-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.9 1.7 1.7 0 0 0 1.6 1h.1a2 2 0 1 1 0 4H21a1.7 1.7 0 0 0-1.6 1Z'/%3E%3C/svg%3E"); }
.icon-trash, .icon-remove, .icon-remove-circle { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4h8v2'/%3E%3Cpath d='M19 6l-1 14H6L5 6'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E"); }
.icon-edit, .icon-pencil { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z'/%3E%3C/svg%3E"); }
.icon-user, .icon-group { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E"); }
.icon-ticket { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9a3 3 0 0 0 0 6v3a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-3a3 3 0 0 0 0-6V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z'/%3E%3Cpath d='M13 5v2'/%3E%3Cpath d='M13 17v2'/%3E%3Cpath d='M13 11v2'/%3E%3C/svg%3E"); }
.icon-tasks, .icon-list, .icon-list-alt, .icon-columns { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 6h13'/%3E%3Cpath d='M8 12h13'/%3E%3Cpath d='M8 18h13'/%3E%3Cpath d='M3 6h.01'/%3E%3Cpath d='M3 12h.01'/%3E%3Cpath d='M3 18h.01'/%3E%3C/svg%3E"); }
.icon-envelope { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E"); }
.icon-print { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V2h12v7'/%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M6 14h12v8H6z'/%3E%3C/svg%3E"); }
.icon-share, .icon-share-alt, .icon-mail-reply, .icon-reply-all, .icon-undo { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 14-5-5 5-5'/%3E%3Cpath d='M20 20v-7a4 4 0 0 0-4-4H4'/%3E%3C/svg%3E"); }
.icon-refresh { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 1-15 6.7L3 16'/%3E%3Cpath d='M3 12a9 9 0 0 1 15-6.7L21 8'/%3E%3Cpath d='M3 21v-5h5'/%3E%3Cpath d='M21 3v5h-5'/%3E%3C/svg%3E"); }
.icon-sort, .icon-sort-by-attributes, .icon-sort-by-order, .icon-filter { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M7 12h10'/%3E%3Cpath d='M10 18h4'/%3E%3C/svg%3E"); }
.icon-caret-down, .icon-chevron-sign-down, .icon-sort-down { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
.icon-caret-right, .icon-chevron-right, .icon-double-angle-right { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E"); }
.icon-paperclip, .icon-link { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.4 11.6-8.5 8.5a5 5 0 0 1-7.1-7.1l9.2-9.2a3.5 3.5 0 0 1 5 5l-9.2 9.2a2 2 0 1 1-2.8-2.8l8.5-8.5'/%3E%3C/svg%3E"); }
.icon-question-sign, .icon-info-sign { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.1 9a3 3 0 1 1 5.8 1c-.5 1.5-2.9 2-2.9 4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E"); }
.icon-lock, .icon-unlock, .icon-key { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='10' rx='2'/%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'/%3E%3C/svg%3E"); }
.icon-flag { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 22V4'/%3E%3Cpath d='M4 4h12l-1 4 1 4H4'/%3E%3C/svg%3E"); }
.icon-ok-circle, .icon-ok-sign, .icon-check { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-5'/%3E%3C/svg%3E"); }
.icon-code-fork, .icon-sitemap { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='6' r='3'/%3E%3Ccircle cx='18' cy='6' r='3'/%3E%3Ccircle cx='12' cy='18' r='3'/%3E%3Cpath d='M6 9v2a4 4 0 0 0 4 4h2'/%3E%3Cpath d='M18 9v2a4 4 0 0 1-4 4h-2'/%3E%3C/svg%3E"); }
.icon-hand-down, .icon-download, .icon-download-alt { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3Cpath d='M5 21h14'/%3E%3C/svg%3E"); }
.icon-hand-up, .icon-upload, .icon-cloud-upload { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21V9'/%3E%3Cpath d='m7 14 5-5 5 5'/%3E%3Cpath d='M5 3h14'/%3E%3C/svg%3E"); }
.icon-exchange, .icon-retweet { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 3l4 4-4 4'/%3E%3Cpath d='M3 7h18'/%3E%3Cpath d='M7 21l-4-4 4-4'/%3E%3Cpath d='M21 17H3'/%3E%3C/svg%3E"); }
.icon-ellipsis-vertical, .icon-fixed-width, .icon-fixed-with, .icon-blank { --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='1'/%3E%3Ccircle cx='19' cy='12' r='1'/%3E%3Ccircle cx='5' cy='12' r='1'/%3E%3C/svg%3E"); opacity: .45 !important; }

/* Dirty Looks pass 1: navigation, type, priority cells, and icon alignment */
html,
body,
input,
button,
select,
textarea,
table,
#container,
#content {
  font-family: Arimo, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  letter-spacing: 0 !important;
}

#nav,
#sub_nav {
  display: flex !important;
  align-items: stretch !important;
  gap: 2px !important;
  min-height: 42px !important;
  padding: 0 20px !important;
  background: #0a1019 !important;
  border-color: rgba(148,163,184,.18) !important;
  scrollbar-width: thin !important;
}

#nav > li,
#sub_nav > li {
  display: flex !important;
  align-items: stretch !important;
  margin: 0 !important;
  padding: 0 !important;
}

#nav > li > a,
#sub_nav > li > a {
  position: relative !important;
  min-height: 42px !important;
  height: 42px !important;
  min-width: 120px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  background: transparent !important;
  color: rgba(226,232,240,.78) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  transform: none !important;
}

#sub_nav > li > a {
  min-width: 122px !important;
}

#nav > li > a[href*="kb"],
#sub_nav > li > a[href*="kb"],
#sub_nav > li > a[href*="canned"],
#sub_nav > li > a[href*="categories"] {
  min-width: 148px !important;
}

#nav > li > a:hover,
#sub_nav > li > a:hover,
#nav > li > a:focus,
#sub_nav > li > a:focus {
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 rgba(217,27,131,.45) !important;
  outline: none !important;
}

#nav > li.active > a,
#sub_nav > li.active > a,
#nav > li > a.active,
#sub_nav > li > a.active {
  background: rgba(217,27,131,.16) !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 var(--dl-final-pink) !important;
}

#nav li li a,
#sub_nav li li a {
  min-height: 34px !important;
  height: auto !important;
  min-width: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #334155 !important;
}

#nav li li a:hover,
#sub_nav li li a:hover {
  background: #f8fafc !important;
  color: #111827 !important;
  box-shadow: none !important;
}

table.list th,
.list th,
#content > table th {
  background: #f8fafc !important;
  color: #475569 !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

table.list th a,
.list th a,
#content > table th a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 30px !important;
  width: 100% !important;
  color: #475569 !important;
  background: transparent !important;
  border-radius: 0 !important;
  text-decoration: none !important;
}

table.list th:hover,
.list th:hover,
#content > table th:hover {
  background: #f1f5f9 !important;
}

table.list td[style*="#FFFFF0"],
table.list td[style*="#fffff0"],
table.list td[style*="rgb(255, 255, 240)"],
table.list td[style*="background-color"] > div[style*="#FFFFF0"],
table.list td[style*="background-color"] > div[style*="#fffff0"],
table.list td[style*="background-color"] > div[style*="rgb(255, 255, 240)"] {
  background: transparent !important;
  background-color: transparent !important;
}

table.list td[style*="#FFFFF0"] > div,
table.list td[style*="#fffff0"] > div,
table.list td[style*="rgb(255, 255, 240)"] > div {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 2px 8px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 999px !important;
  background: #f8fafc !important;
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

i.icon-fixed-width:not(.icon-hand-down):not(.icon-pencil):not(.icon-plus-sign),
i.icon-fixed-with,
i.icon-blank {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
}

#content .button i[class^="icon-"],
#content .button i[class*=" icon-"],
#content button i[class^="icon-"],
#content button i[class*=" icon-"],
#content .action-button i[class^="icon-"],
#content .action-button i[class*=" icon-"],
#content .attached.button i[class^="icon-"],
#content .attached.button i[class*=" icon-"] {
  flex: 0 0 16px !important;
  margin-right: 0 !important;
  vertical-align: middle !important;
}

#content .action-button,
#content .attached.button,
#content .drop-down-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
}

#content .attached.button:has(i:only-child),
#content button:has(i:only-child) {
  width: 38px !important;
  min-width: 38px !important;
  padding: 0 !important;
}

.icon-file,
.icon-file-alt,
.icon-file-text,
.icon-file-text-alt,
.icon-copy,
.icon-paste {
  --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v6h6'/%3E%3Cpath d='M8 13h8'/%3E%3Cpath d='M8 17h5'/%3E%3C/svg%3E");
}

.icon-chevron-up {
  --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m18 15-6-6-6 6'/%3E%3C/svg%3E");
}

.icon-spinner {
  --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-6.2-8.6'/%3E%3C/svg%3E");
}

.icon-warning-sign,
.icon-exclamation-sign {
  --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.7 18-8-14a2 2 0 0 0-3.4 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.7-3Z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

/* Dirty Looks pass 2: stronger nav geometry and remaining legacy icon sprites */
#container #nav,
#container #sub_nav,
body #container #nav,
body #container #sub_nav {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#container #nav > li > a,
#container #sub_nav > li > a,
body #container #nav > li > a,
body #container #sub_nav > li > a {
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 8px 8px 0 0 !important;
  background: transparent !important;
}

#container #nav > li.active > a,
#container #sub_nav > li.active > a,
#container #nav > li > a.active,
#container #sub_nav > li > a.active,
body #container #nav > li.active > a,
body #container #sub_nav > li.active > a,
body #container #nav > li > a.active,
body #container #sub_nav > li > a.active {
  height: 42px !important;
  min-height: 42px !important;
  border-radius: 8px 8px 0 0 !important;
  background: rgba(217,27,131,.16) !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 var(--dl-final-pink) !important;
}

i[class^="icon-"]::before,
i[class*=" icon-"]::before {
  content: "" !important;
  display: none !important;
}

i.icon-comments-alt {
  --dl-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a4 4 0 0 1-4 4H8l-5 3V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4Z'/%3E%3Cpath d='M8 9h8'/%3E%3Cpath d='M8 13h5'/%3E%3C/svg%3E");
}

span.Icon {
  display: inline-block !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  margin-right: 5px !important;
  vertical-align: -3px !important;
  background-color: currentColor !important;
  background-image: none !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 16px 16px !important;
  color: #64748b !important;
  -webkit-mask: var(--dl-ticket-source-icon) center / contain no-repeat !important;
  mask: var(--dl-ticket-source-icon) center / contain no-repeat !important;
}

span.Icon.webTicket {
  --dl-ticket-source-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15 15 0 0 1 0 20'/%3E%3Cpath d='M12 2a15 15 0 0 0 0 20'/%3E%3C/svg%3E");
}

span.Icon.apiTicket {
  --dl-ticket-source-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9a3 3 0 0 0 0 6v3a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-3a3 3 0 0 0 0-6V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z'/%3E%3Cpath d='M13 5v2'/%3E%3Cpath d='M13 17v2'/%3E%3Cpath d='M13 11v2'/%3E%3C/svg%3E");
}

span.Icon.emailTicket {
  --dl-ticket-source-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E");
}

table.list td,
table.list th {
  vertical-align: middle !important;
}

table.list td .pull-right small {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #94a3b8 !important;
}

table.list td .pull-right small i[class^="icon-"],
table.list td .pull-right small i[class*=" icon-"],
table.list td i.small[class^="icon-"],
table.list td i.small[class*=" icon-"] {
  width: 14px !important;
  height: 14px !important;
  min-width: 14px !important;
  background-size: 14px 14px !important;
  margin-right: 0 !important;
  color: #64748b !important;
  vertical-align: -2px !important;
}

i.icon-fixed-width {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
}

/* Dirty Looks pass 3: final navigation width and ticket-row optical alignment */
#container #sub_nav,
body #container #sub_nav,
ul#sub_nav.jb-overflowmenu-menu,
body ul#sub_nav.jb-overflowmenu-menu {
  width: 1160px !important;
  min-width: 1160px !important;
  max-width: min(1160px, calc(100vw - 40px)) !important;
}

table.list td:nth-child(2) > div {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

table.list td:nth-child(2) > div > a.preview {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1.1 !important;
}

table.list td:nth-child(2) span.Icon {
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  vertical-align: middle !important;
}

#content table.list {
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

#content table.list tr:hover td {
  background: #fbfcff !important;
}

#content table.list tr:hover td[style*="#FFFFF0"],
#content table.list tr:hover td[style*="#fffff0"] {
  background: #fbfcff !important;
}

#content table.list td a.preview,
#content table.list td a[href*="tickets.php?id="] {
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

#content table.list td a.preview:hover,
#content table.list td a[href*="tickets.php?id="]:hover {
  color: var(--dl-final-pink-dark) !important;
}

#clientLogin,
#content form,
#content .login-box,
#content .dialog,
.ui-dialog {
  border-color: #dbe3ef !important;
}

#content .error,
#content .warning,
#content .notice {
  border-radius: 8px !important;
}

/* Dirty Looks pass 4: remove osTicket hover/search/dropdown artifacts */
#container #nav > li,
#container #nav > li.inactive,
#container #nav > li.inactive:hover,
#container #nav > li:hover,
#container #nav > li:focus-within,
#container #sub_nav > li,
#container #sub_nav > li:hover,
#container #sub_nav > li:focus-within {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

#container #nav > li.inactive:hover > ul,
#container #nav > li:hover > ul {
  background: #0f1724 !important;
  border: 1px solid rgba(148,163,184,.2) !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 48px rgba(2,6,23,.32) !important;
  overflow: hidden !important;
}

#container #nav .inactive li a:hover,
#container #nav li li a:hover,
#container #sub_nav li li a:hover {
  background: rgba(217,27,131,.14) !important;
  color: #fff !important;
}

#basic_search {
  min-height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

#basic_search .attached.input {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#basic_search .pull-right {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  height: auto !important;
}

.action-dropdown,
.action-dropdown.anchor-right,
.customQ-dropdown,
#sort-dropdown,
#category-dropdown,
#topic-dropdown {
  margin-top: 0 !important;
  padding: 6px !important;
  border: 1px solid #dbe3ef !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #172033 !important;
  box-shadow:
    0 0 0 1px rgba(15,23,42,.035),
    0 18px 44px rgba(15,23,42,.14) !important;
  z-index: 20 !important;
}

.action-dropdown ul,
.action-dropdown .bleed-left,
.customQ-dropdown ul,
.customQ-dropdown .bleed-left {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.action-dropdown li,
.customQ-dropdown li {
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.action-dropdown li a,
.customQ-dropdown li a {
  display: flex !important;
  align-items: center !important;
  min-height: 34px !important;
  gap: 8px !important;
  padding: 8px 10px !important;
  border-radius: 6px !important;
  color: #334155 !important;
  background: transparent !important;
  text-decoration: none !important;
}

.action-dropdown li a:hover,
.customQ-dropdown li a:hover,
.action-dropdown li.active a,
.customQ-dropdown li.active a {
  color: var(--dl-final-pink) !important;
  background: rgba(217,27,131,.10) !important;
}

.action-dropdown li.active a,
.customQ-dropdown li.active a {
  font-weight: 800 !important;
  box-shadow: inset 2px 0 0 var(--dl-final-pink) !important;
}

.action-button.dropdown-open,
.action-button:hover,
.action-button:focus {
  border-color: rgba(217,27,131,.38) !important;
  color: var(--dl-final-pink) !important;
  box-shadow:
    0 0 0 3px rgba(217,27,131,.10),
    0 10px 24px rgba(15,23,42,.08) !important;
}

#content button.action-button,
#content .button.action-button {
  width: auto !important;
  min-width: max-content !important;
  padding: 0 14px !important;
  gap: 8px !important;
  overflow: visible !important;
}

#content button.action-button:has(i:only-child),
#content .button.action-button:has(i:only-child),
#content .attached.button:has(i:only-child) {
  width: 38px !important;
  min-width: 38px !important;
  padding: 0 !important;
}

#content .action-button,
#content .button,
#content button {
  white-space: nowrap !important;
}

#content td,
#content th,
#content label,
#content p,
#content .hint,
#content .faded,
#content .faded-more {
  overflow-wrap: anywhere !important;
}

/* Dirty Looks pass 4b: kill native blue search focus shape */
#basic_search input,
#basic_search button,
#basic_search .attached.input,
#basic_search .attached.button,
#content input#query,
#content button#searchSubmit {
  outline: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

#basic_search .attached.input {
  display: inline-flex !important;
  align-items: stretch !important;
  height: 38px !important;
  border: 1px solid #d7dfec !important;
  border-radius: 7px !important;
  background: #fff !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

#basic_search input#query,
#content #basic_search input#query {
  height: 38px !important;
  min-height: 38px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#basic_search button#searchSubmit,
#content #basic_search button#searchSubmit,
#basic_search .attached.button {
  height: 38px !important;
  min-height: 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  border: 0 !important;
  border-left: 1px solid #e2e8f0 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

#basic_search .attached.input:focus-within {
  border-color: rgba(217,27,131,.55) !important;
  box-shadow: 0 0 0 3px rgba(217,27,131,.12) !important;
}

#basic_search input#query:focus,
#basic_search button#searchSubmit:focus,
#content #basic_search input#query:focus,
#content #basic_search button#searchSubmit:focus {
  outline: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Dirty Looks pass 4c: top tabs should not spawn oversized hover flyouts */
#container #nav > li > ul,
#container #nav > li.inactive:hover > ul,
#container #nav > li:hover > ul,
#container #nav > li:focus-within > ul {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#container #nav > li > a:hover,
#container #nav > li > a:focus {
  width: auto !important;
  min-width: 120px !important;
  max-width: 180px !important;
  transform: none !important;
}

/* Dirty Looks pass 4d: remove second-row overflow divider */
#customQ_nav,
#container #customQ_nav,
nav#customQ_nav.jb-overflowmenu {
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  border: 0 !important;
  box-shadow: none !important;
}

#container #sub_nav,
body #container #sub_nav,
ul#sub_nav.jb-overflowmenu-menu {
  border: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
}

#customQ_nav::before,
#customQ_nav::after,
#sub_nav::before,
#sub_nav::after,
.jb-overflowmenu::before,
.jb-overflowmenu::after,
.jb-overflowmenu-helper-postion::before,
.jb-overflowmenu-helper-postion::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Dirty Looks pass 5: replace legacy two-row tabs with a modern grouped menu */
#container #nav {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 6px !important;
  width: 100% !important;
  min-height: 52px !important;
  padding: 8px 22px !important;
  border: 0 !important;
  background: #0b111a !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow: visible !important;
}

#container #nav > li {
  display: block !important;
  min-width: 0 !important;
  height: 36px !important;
}

#container #nav > li > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 12px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: rgba(226,232,240,.72) !important;
  box-shadow: none !important;
}

#container #nav > li > a:hover,
#container #nav > li > a:focus {
  border-color: rgba(217,27,131,.22) !important;
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

#container #nav > li.active > a,
#container #nav > li > a.active {
  border-color: rgba(217,27,131,.32) !important;
  background: rgba(217,27,131,.18) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

#customQ_nav,
#container #customQ_nav,
nav#customQ_nav.jb-overflowmenu {
  display: block !important;
  width: 100% !important;
  min-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: #0b111a !important;
}

#container #sub_nav,
body #container #sub_nav,
ul#sub_nav.jb-overflowmenu-menu {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  min-height: 46px !important;
  height: auto !important;
  padding: 6px 22px 10px !important;
  background: #0b111a !important;
  border: 0 !important;
  box-shadow: inset 0 1px 0 rgba(148,163,184,.12) !important;
  overflow: visible !important;
}

#container #sub_nav > li {
  display: block !important;
  flex: 0 0 auto !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#container #sub_nav > li > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 104px !important;
  max-width: none !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(148,163,184,.14) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.025) !important;
  color: rgba(226,232,240,.72) !important;
  box-shadow: none !important;
}

#container #sub_nav > li > a:hover,
#container #sub_nav > li > a:focus {
  border-color: rgba(217,27,131,.28) !important;
  background: rgba(217,27,131,.10) !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
}

#container #sub_nav > li.active > a,
#container #sub_nav > li > a.active {
  border-color: rgba(217,27,131,.38) !important;
  background: rgba(217,27,131,.18) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

#container #sub_nav .pull-right,
#container #sub_nav i.pull-right {
  float: none !important;
}

/* Dirty Looks pass 5b: final pill sizing wins over earlier tab rules */
body #container #nav > li > a,
#container #nav > li > a {
  height: 36px !important;
  min-height: 36px !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

body #container #nav > li.active > a,
#container #nav > li.active > a,
body #container #nav > li > a.active,
#container #nav > li > a.active {
  height: 36px !important;
  min-height: 36px !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

body #container #sub_nav > li > a,
#container #sub_nav > li > a {
  height: 32px !important;
  min-height: 32px !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

body #container #sub_nav > li.active > a,
#container #sub_nav > li.active > a,
body #container #sub_nav > li > a.active,
#container #sub_nav > li > a.active {
  height: 32px !important;
  min-height: 32px !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

/* Dirty Looks pass 5c: queue heading and action toolbar alignment */
#content h2,
#content h2:first-of-type,
#content h2.pull-left {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 38px !important;
  gap: 8px !important;
  margin: 0 !important;
  line-height: 1 !important;
}

#content h2 i[class^="icon-"],
#content h2 i[class*=" icon-"],
#content h2 a,
#content h2 .configureQ {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

#content .pull-right.flush-right,
#content .pull-right:has(.action-button),
#content .pull-right:has(button),
#content .pull-right:has(a.button) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  min-height: 38px !important;
}

#content .action-button,
#content button.action-button,
#content .button.action-button,
#content a.action-button,
#content .pull-right .action-button,
#content .pull-right button,
#content .pull-right a.button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  height: 38px !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

#content .action-button > span,
#content button.action-button > span,
#content .button.action-button > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  line-height: 1 !important;
}

/* Dirty Looks pass 5d: breathing room below modern nav */
#container #content {
  margin-top: 14px !important;
}

#basic_search {
  margin-bottom: 18px !important;
}

/* Dirty Looks pass 6: make the modern secondary menu reserve layout space */
#customQ_nav,
#container #customQ_nav,
nav#customQ_nav.jb-overflowmenu {
  position: relative !important;
  display: block !important;
  height: auto !important;
  min-height: 46px !important;
}

#container #sub_nav,
body #container #sub_nav,
ul#sub_nav.jb-overflowmenu-menu {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
}

#container #content {
  margin-top: 0 !important;
}

#container #nav > li.active > a,
#container #nav > li > a.active,
#container #sub_nav > li.active > a,
#container #sub_nav > li > a.active,
body #container #nav > li.active > a,
body #container #nav > li > a.active,
body #container #sub_nav > li.active > a,
body #container #sub_nav > li > a.active {
  border-radius: 999px !important;
}

/* Dirty Looks pass 6b: readable secondary nav queue dropdowns */
#sub_nav .customQ-dropdown,
#customQ_nav .customQ-dropdown,
#sub_nav .customQ-dropdown ul,
#customQ_nav .customQ-dropdown ul {
  color: #172033 !important;
}

#sub_nav .customQ-dropdown li,
#customQ_nav .customQ-dropdown li,
#sub_nav .customQ-dropdown li.active,
#customQ_nav .customQ-dropdown li.active {
  color: #172033 !important;
  background: transparent !important;
}

#sub_nav .customQ-dropdown a,
#customQ_nav .customQ-dropdown a,
#sub_nav .customQ-dropdown .truncate,
#customQ_nav .customQ-dropdown .truncate,
#sub_nav .customQ-dropdown .full-width,
#customQ_nav .customQ-dropdown .full-width {
  min-width: 0 !important;
  width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;
  justify-content: flex-start !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #334155 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

#sub_nav .customQ-dropdown li.active a,
#customQ_nav .customQ-dropdown li.active a,
#sub_nav .customQ-dropdown a:hover,
#customQ_nav .customQ-dropdown a:hover {
  background: rgba(217,27,131,.10) !important;
  color: var(--dl-final-pink) !important;
  box-shadow: inset 2px 0 0 var(--dl-final-pink) !important;
}

#sub_nav .customQ-dropdown .queue-count,
#customQ_nav .customQ-dropdown .queue-count,
#sub_nav .customQ-dropdown .faded-more,
#customQ_nav .customQ-dropdown .faded-more {
  color: var(--dl-final-pink) !important;
  font-weight: 800 !important;
}

/* Dirty Looks pass 7: replace residual osTicket blue chrome with neutral/pink */
:root {
  --dl-final-border: #e5e7eb;
  --dl-final-line: #eef2f7;
  --dl-final-blue-head: #f8fafc;
}

#content .tabs,
#content ul.tabs,
#content .tabs.clean,
#content .tabs.alt,
#content .thread-tabs,
#content .tab-content,
#content .tabber,
#content .tabberlive {
  border-color: #e5e7eb !important;
  background: #f8fafc !important;
  background-image: none !important;
  box-shadow: none !important;
}

#content .tabs li,
#content .tabs a,
#content ul.tabs li,
#content ul.tabs a,
#content .tabbernav li,
#content .tabbernav a {
  border-color: #e5e7eb !important;
  background: #f8fafc !important;
  background-image: none !important;
  color: #334155 !important;
  box-shadow: none !important;
}

#content .tabs li.active,
#content .tabs li.active a,
#content .tabs a.active,
#content ul.tabs li.active,
#content ul.tabs li.active a,
#content .tabbernav li.tabberactive a,
#content .tabbernav a.active {
  border-color: rgba(217,27,131,.38) !important;
  background: #fff7fb !important;
  color: var(--dl-final-pink) !important;
  box-shadow: inset 0 -2px 0 var(--dl-final-pink) !important;
}

#content .tabs a:hover,
#content ul.tabs a:hover,
#content .tabbernav a:hover {
  border-color: rgba(217,27,131,.26) !important;
  background: rgba(217,27,131,.08) !important;
  color: var(--dl-final-pink) !important;
}

#content .attached,
#content .attached.input,
#content .attached.button,
#content .action-button,
#content .button,
#content button,
#content input,
#content select,
#content textarea,
.select2-container .select2-selection,
.select2-drop,
.select2-dropdown {
  border-color: #d8dee9 !important;
}

#content th,
#content table.list th,
#content table.form_table th,
#content .section-break,
#content .flush-left,
#content .flush-right {
  border-color: #e5e7eb !important;
  background-color: #f8fafc !important;
  background-image: none !important;
}

#content .flush-left,
#content .flush-right,
#content .thread-entry,
#content .thread-body,
#content .message,
#content .response,
#content .note,
#content .post {
  border-color: #e5e7eb !important;
}

#content .faded,
#content .faded-more,
#content .muted {
  color: #64748b !important;
}

#content .info-banner,
#content .notice-banner,
#content #msg_notice,
#content .message.message-info,
#content .tip,
#content .help-tip {
  border-color: rgba(217,27,131,.20) !important;
  background: #fff7fb !important;
  color: #7a174d !important;
}

.blue.button,
#content .blue.button,
#content input.blue.button,
#content button.blue.button {
  border-color: rgba(217,27,131,.38) !important;
  background: linear-gradient(180deg, rgba(217,27,131,.96), rgba(184,23,114,.96)) !important;
  color: #fff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 10px 22px rgba(120,18,70,.18) !important;
}

.ui-widget-header,
.ui-dialog-titlebar,
.ui-datepicker .ui-datepicker-header {
  border-color: rgba(217,27,131,.28) !important;
  background: #fff7fb !important;
  background-image: none !important;
  color: var(--dl-final-pink) !important;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
.ui-datepicker .ui-state-active {
  border-color: rgba(217,27,131,.44) !important;
  background: var(--dl-final-pink) !important;
  color: #fff !important;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-datepicker .ui-state-hover {
  border-color: rgba(217,27,131,.28) !important;
  background: rgba(217,27,131,.10) !important;
  color: var(--dl-final-pink) !important;
}

/* Dirty Looks pass 8: seamless modern menu rows */
#container #nav,
body #container #nav {
  min-height: 56px !important;
  padding: 10px 22px !important;
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

#customQ_nav,
#container #customQ_nav,
body #container #customQ_nav,
nav#customQ_nav.jb-overflowmenu {
  min-height: 54px !important;
  padding: 0 !important;
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#container #sub_nav,
body #container #sub_nav,
ul#sub_nav.jb-overflowmenu-menu,
body ul#sub_nav.jb-overflowmenu-menu {
  min-height: 54px !important;
  padding: 10px 22px 12px !important;
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#container #nav::before,
#container #nav::after,
#customQ_nav::before,
#customQ_nav::after,
#container #customQ_nav::before,
#container #customQ_nav::after,
#container #sub_nav::before,
#container #sub_nav::after {
  content: none !important;
  display: none !important;
}

.jb-overflowmenu-container.jb-overflowmenu-helper-postion,
#customQ_nav .jb-overflowmenu-container.jb-overflowmenu-helper-postion,
#container .jb-overflowmenu-container.jb-overflowmenu-helper-postion {
  width: 0 !important;
  min-width: 0 !important;
  border: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  overflow: hidden !important;
}

/* Dirty Looks pass 9: shared control/table/chart polish */
:root {
  --dl-final-pink-soft: rgba(217,27,131,.10);
  --dl-final-pink-ring: rgba(217,27,131,.24);
  --dl-final-ink: #111827;
  --dl-final-muted: #475569;
  --dl-final-panel: #ffffff;
  --dl-final-panel-soft: #f8fafc;
}

#content {
  color: var(--dl-final-ink) !important;
}

#content a,
#content a:visited {
  color: var(--dl-final-pink) !important;
}

#content a:hover {
  color: #b81772 !important;
}

#content form,
#content .table,
#content table.list,
#content table.form_table,
#content .chart,
#content #line-chart,
#content #ticket-stats,
#content .pull-right.flush-right,
#content .flush-left {
  border-color: #e4e8f0 !important;
  background: var(--dl-final-panel) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#content #line-chart,
#content .chart {
  border-radius: 6px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.96)),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(217,27,131,.08) 32px) !important;
  overflow: hidden !important;
}

#content .legendLabel,
#content .legendColorBox,
#content .flot-tick-label,
#content .tickLabel {
  color: #334155 !important;
  font-weight: 650 !important;
}

#content .legend table,
#content .legend > div {
  border: 1px solid rgba(217,27,131,.18) !important;
  border-radius: 6px !important;
  background: #fff7fb !important;
  box-shadow: 0 8px 18px rgba(120,18,70,.10) !important;
}

#content table.list {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

#content table.list th,
#content table.form_table th,
#content table.list thead th,
#content table.list thead td {
  height: 42px !important;
  padding: 0 14px !important;
  border-color: #e5e7eb !important;
  background: #f8fafc !important;
  color: #334155 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
}

#content table.list td,
#content table.form_table td {
  border-color: #edf1f7 !important;
  color: #334155 !important;
}

#content table.list tbody tr:nth-child(even) td {
  background: #f8fafc !important;
}

#content table.list tbody tr:hover td {
  background: #fff7fb !important;
}

#content input[type="text"],
#content input[type="email"],
#content input[type="password"],
#content input[type="search"],
#content input[type="number"],
#content textarea,
#content select,
#content .attached.input {
  min-height: 36px !important;
  border: 1px solid #d7deea !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #172033 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#content input:focus,
#content textarea:focus,
#content select:focus,
#content .attached.input:focus,
#content #basic_search input:focus,
#content #basic_search input[type="text"]:focus {
  border-color: var(--dl-final-pink) !important;
  box-shadow: 0 0 0 3px var(--dl-final-pink-ring) !important;
  outline: 0 !important;
}

#content input[type="radio"]:checked,
#content input[type="checkbox"]:checked {
  accent-color: var(--dl-final-pink) !important;
}

#content .button,
#content button,
#content input[type="button"],
#content input[type="submit"],
#content .action-button,
#content .attached.button,
#content a.button {
  min-height: 36px !important;
  border: 1px solid #d8dee9 !important;
  border-radius: 6px !important;
  background: #fff !important;
  background-image: none !important;
  color: #334155 !important;
  font-weight: 750 !important;
  box-shadow: 0 8px 18px rgba(15,23,42,.06) !important;
  text-shadow: none !important;
}

#content .button:hover,
#content button:hover,
#content input[type="button"]:hover,
#content input[type="submit"]:hover,
#content .action-button:hover,
#content .attached.button:hover,
#content a.button:hover {
  border-color: rgba(217,27,131,.38) !important;
  background: #fff7fb !important;
  color: var(--dl-final-pink) !important;
}

#content .primary.button,
#content input[type="submit"].button,
#content input[type="button"].primary,
#content button.primary {
  border-color: rgba(217,27,131,.44) !important;
  background: linear-gradient(180deg, #e91e8f, #c9167c) !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(120,18,70,.18) !important;
}

#content #basic_search {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  height: 38px !important;
  margin: 0 12px 18px 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#content #basic_search input[type="text"],
#content #basic_search input[type="search"] {
  width: 280px !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: 6px 0 0 6px !important;
  border-right: 0 !important;
}

#content #basic_search button,
#content #basic_search input[type="submit"],
#content #basic_search .attached.button {
  width: 40px !important;
  min-width: 40px !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: 0 6px 6px 0 !important;
  border-left: 1px solid #d7deea !important;
  background: #fff !important;
  color: #334155 !important;
  box-shadow: none !important;
}

#content #basic_search:focus-within input,
#content #basic_search:focus-within button,
#content #basic_search:focus-within .attached.button {
  border-color: var(--dl-final-pink) !important;
}

#content #basic_search:focus-within {
  border-radius: 7px !important;
  box-shadow: 0 0 0 3px var(--dl-final-pink-ring) !important;
}

#content h2,
#content h3 {
  color: #111827 !important;
  letter-spacing: 0 !important;
}

#content hr {
  border: 0 !important;
  border-top: 1px solid #e5e7eb !important;
}

#content .sticky.bar,
#content .toolbar,
#content .action-bar,
#content .pull-right {
  border-color: transparent !important;
}

#content .pull-right .button,
#content .pull-right button,
#content .action-bar .button,
#content .sticky.bar .button,
#content .sticky.bar a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}

.ui-datepicker-trigger,
#content .calendar,
#content .icon-calendar,
#content .datepicker {
  border-color: rgba(217,27,131,.28) !important;
  background-color: #fff7fb !important;
  color: var(--dl-final-pink) !important;
  box-shadow: none !important;
}

.select2-container--default .select2-selection--single,
.select2-container .select2-choice {
  min-height: 36px !important;
  border-color: #d7deea !important;
  border-radius: 6px !important;
  background: #fff !important;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container-active .select2-choice {
  border-color: var(--dl-final-pink) !important;
  box-shadow: 0 0 0 3px var(--dl-final-pink-ring) !important;
}

/* Dirty Looks pass 10: repair action-button width and ticket search layout */
#content a.action-button,
#content span.action-button,
#content .green.button.action-button,
#content .action-button.popup-dialog {
  width: auto !important;
  min-width: 92px !important;
  max-width: none !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-indent: 0 !important;
}

#content .green.button.action-button,
#content .green.button,
#content button.green,
#content input.green {
  border-color: rgba(217,27,131,.44) !important;
  background: linear-gradient(180deg, #e91e8f, #c9167c) !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(120,18,70,.18) !important;
}

#content .action-button.icon-only,
#content .toolbar a.action-button,
#content .sticky.bar a.action-button,
#content .sticky.bar span.action-button {
  min-width: 40px !important;
  width: 40px !important;
  padding: 0 !important;
}

#content #basic_search {
  display: block !important;
  width: 100% !important;
  min-height: 40px !important;
  height: auto !important;
  margin: 0 0 24px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#content #basic_search > .pull-right {
  float: right !important;
  display: flex !important;
  align-items: center !important;
  height: 40px !important;
  margin: 0 !important;
}

#content #basic_search > form {
  display: inline-flex !important;
  align-items: center !important;
  height: 40px !important;
  margin: 0 !important;
  border-radius: 7px !important;
}

#content #basic_search > form input[type="text"],
#content #basic_search > form input[type="search"] {
  width: 280px !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: 6px 0 0 6px !important;
  border-right: 0 !important;
}

#content #basic_search > form button,
#content #basic_search > form input[type="submit"],
#content #basic_search > form .attached.button {
  width: 40px !important;
  min-width: 40px !important;
  height: 38px !important;
  min-height: 38px !important;
  border-radius: 0 6px 6px 0 !important;
  border-left: 1px solid #d7deea !important;
  padding: 0 !important;
}

#content #basic_search > form:focus-within {
  box-shadow: 0 0 0 3px var(--dl-final-pink-ring) !important;
}

#content #basic_search:focus-within {
  box-shadow: none !important;
}

/* Dirty Looks pass 11: remove framed header border */
#container,
#header,
#container #header,
body #container,
body #container #header {
  border: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#container #header,
body #container #header {
  border-bottom: 0 !important;
}

#container {
  overflow: visible !important;
}

/* Dirty Looks pass 12: distinguish text action buttons from icon-only toolbar buttons */
#content .sticky.bar,
#content .sticky.bar .content,
#content .sticky.bar .pull-right {
  min-height: 44px !important;
  height: auto !important;
  overflow: visible !important;
}

#content .sticky.bar .pull-right {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

#content .sticky.bar .pull-right a.action-button,
#content .sticky.bar .pull-right span.action-button,
#content .pull-right a.action-button.popup-dialog,
#content .pull-right .green.button.action-button {
  width: auto !important;
  min-width: 86px !important;
  max-width: none !important;
  padding: 0 16px !important;
  white-space: nowrap !important;
}

#content .sticky.bar .pull-right a.action-button:empty,
#content .sticky.bar .pull-right span.action-button:empty,
#content .pull-right a.action-button[title]:empty,
#content .pull-right span.action-button[title]:empty {
  width: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
}

/* Dirty Looks pass 13: remove form slabs and make action headers responsive */
#content form {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#content #basic_search,
#content #basic_search > form {
  background: transparent !important;
  border: 0 !important;
}

#content .sticky.bar .content {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  min-height: 44px !important;
  width: 100% !important;
  overflow: visible !important;
}

#content .sticky.bar .content h2,
#content .sticky.bar .content h3 {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}

#content .sticky.bar .content .pull-right {
  float: none !important;
  position: static !important;
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  width: auto !important;
  max-width: min(100%, 440px) !important;
  margin-left: auto !important;
}

#content .sticky.bar .pull-right a.action-button,
#content .sticky.bar .pull-right span.action-button,
#content .pull-right a.action-button.popup-dialog,
#content .pull-right .green.button.action-button {
  min-width: max-content !important;
  width: auto !important;
  padding: 0 14px !important;
}

#content .sticky.bar .pull-right span.action-button span,
#content .sticky.bar .pull-right a.action-button span {
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
}

/* Dirty Looks pass 14: even header/nav/content spacing */
#header,
#container #header,
body #container #header {
  min-height: 112px !important;
  padding: 28px 34px 24px !important;
  box-sizing: border-box !important;
}

#header #logo,
#header a#logo {
  margin: 0 !important;
}

#header #info,
#header .pull-right,
#header .header-links {
  margin-top: 10px !important;
}

#container #nav,
body #container #nav {
  min-height: 62px !important;
  padding: 12px 22px 14px !important;
}

#container #sub_nav,
body #container #sub_nav,
ul#sub_nav.jb-overflowmenu-menu,
body ul#sub_nav.jb-overflowmenu-menu {
  min-height: 56px !important;
  padding: 11px 22px 15px !important;
}

#container #content,
body #container #content {
  margin-top: 10px !important;
}

#sub_nav > li > a,
#sub_nav .jb-overflowmenu-menu-primary a,
#sub_nav .jb-overflowmenu-menu-secondary a {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Dirty Looks pass 15: white content canvas */
#content,
#container #content,
body #container #content,
#pjax-container,
#content .sticky.bar,
#content .sticky.bar .content,
#content .clear,
#content > div {
  background: #fff !important;
}

#content::before,
#content::after,
#container #content::before,
#container #content::after {
  content: none !important;
  display: none !important;
}

/* Dirty Looks pass 16: clip white canvas to rounded content panel */
#container #content,
body #container #content {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  background: #fff !important;
}

#pjax-container {
  border-radius: inherit !important;
  overflow: hidden !important;
}

/* Dirty Looks pass 17: center secondary navigation row */
#container #sub_nav,
body #container #sub_nav,
ul#sub_nav.jb-overflowmenu-menu,
body ul#sub_nav.jb-overflowmenu-menu {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
}

#sub_nav > li,
#sub_nav .jb-overflowmenu-menu-primary,
#sub_nav .jb-overflowmenu-menu-secondary {
  float: none !important;
  display: inline-flex !important;
  margin: 0 !important;
}

/* Dirty Looks pass 18: align ticket queue title/action bar */
#content .sticky.bar .content {
  display: grid !important;
  grid-template-columns: auto auto 1fr auto !important;
  align-items: center !important;
  column-gap: 10px !important;
  min-height: 52px !important;
}

#content .sticky.bar .pull-left.flush-left {
  float: none !important;
  display: flex !important;
  align-items: center !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#content .sticky.bar .pull-left.flush-left h2 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 40px !important;
  margin: 0 !important;
  line-height: 1 !important;
}

#content .sticky.bar .pull-left.flush-left h2 a {
  display: inline-flex !important;
  align-items: center !important;
  height: 40px !important;
  line-height: 1 !important;
}

#content .sticky.bar .configureQ {
  float: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 40px !important;
  margin: 0 !important;
  color: rgba(15,23,42,.28) !important;
}

#content .sticky.bar .pull-right.flush-right {
  grid-column: 4 !important;
  float: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 12px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#content .sticky.bar .pull-right.flush-right .action-button,
#content .sticky.bar .pull-right.flush-right a.action-button,
#content .sticky.bar .pull-right.flush-right span.action-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 7px !important;
}

/* Dirty Looks pass 19: correct panel corner ownership */
#container,
#header,
#container #header,
#container #nav,
#container #customQ_nav,
#container #sub_nav {
  border-radius: 0 !important;
  overflow: visible !important;
}

#container #content,
body #container #content {
  margin-top: 10px !important;
  border-radius: 8px 8px 0 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

#container #content > :first-child,
#pjax-container > :first-child {
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
}

#content a.only.sticky.scroll-up,
a.only.sticky.scroll-up {
  display: none !important;
}

/* Dirty Looks pass 20: explicit outer shell and content corner model */
#container,
body #container {
  border-radius: 8px 8px 0 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

#header,
#container #header,
body #container #header {
  border-radius: 8px 8px 0 0 !important;
  overflow: hidden !important;
  background: #0b111c !important;
}

#container #nav,
#container #customQ_nav,
#container #sub_nav {
  background: #080f18 !important;
}

#container #content,
body #container #content {
  border-radius: 8px 8px 0 0 !important;
  border-top: 1px solid rgba(15,23,42,.10) !important;
  overflow: hidden !important;
  background: #fff !important;
}

#container #content > :first-child,
#pjax-container > :first-child {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}

/* Dirty Looks pass 21: unified shell width and clean corner stack */
#container,
body #container {
  border-radius: 8px 8px 0 0 !important;
  overflow: hidden !important;
  background: #080f18 !important;
}

#header,
#container #header,
body #container #header,
#container #nav,
#container #customQ_nav,
#container #sub_nav {
  border-radius: 0 !important;
}

#header,
#container #header,
body #container #header {
  border-radius: 8px 8px 0 0 !important;
}

#container #content,
body #container #content {
  width: 100% !important;
  box-sizing: border-box !important;
  margin-top: 10px !important;
  border-radius: 8px 8px 0 0 !important;
  border: 0 !important;
  outline: 0 !important;
  overflow: hidden !important;
  background: #fff !important;
}

/* Dirty Looks pass 22: final corner stack from annotated review */
#container,
body #container {
  overflow: visible !important;
  background: transparent !important;
  border-radius: 0 !important;
}

#header,
#container #header,
body #container #header {
  border-radius: 8px 8px 0 0 !important;
  overflow: hidden !important;
}

#container #nav,
#container #customQ_nav,
#container #sub_nav,
body #container #nav,
body #container #customQ_nav,
body #container #sub_nav {
  border-radius: 0 !important;
  overflow: visible !important;
}

#container #customQ_nav,
body #container #customQ_nav {
  background: #080f18 !important;
}

#container #content,
body #container #content {
  margin-top: 10px !important;
  border: 0 !important;
  border-top: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  background: #fff !important;
}

#container #content::before,
body #container #content::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: -10px !important;
  height: 10px !important;
  background: #080f18 !important;
  pointer-events: none !important;
}