/* Adapt the approved skin to native osTicket markup without changing form behavior. */
@media screen {
.mxs-support #container.support-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.mxs-support #content {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 350px;
  scroll-margin-top: 80px;
}
.mxs-support :is(h1, h2, h3) { color: inherit; }
.mxs-support a { margin-bottom: 0; }
.mxs-support a:not(.support-button):hover { border-bottom: 0; }
.mxs-support a.support-button:hover { border-style: solid; }
.mxs-support .support-side-list { list-style: none; }
.mxs-support .support-accountbar { border-bottom: 1px solid var(--support-border); background: #f6f9fc; }
.mxs-support .support-accountbar nav { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 24px; padding-block: 8px; color: var(--support-text); font-size: 13px; }
.mxs-support .support-accountbar a { display: inline-flex; align-items: center; min-height: 44px; color: var(--support-blue); }
.mxs-support :is(#msg_error, #msg_warning, #msg_notice, .error_bar, .warning_bar, .notice_bar) {
  width: min(1140px, calc(100% - 32px));
  height: auto;
  margin: 20px auto;
  padding-block: 14px;
  border-radius: 10px;
  line-height: 1.6;
}
.mxs-support .support-native-panel { min-width: 0; }
.mxs-support .support-native-panel #ticketForm { margin-top: 24px; }
.mxs-support .support-native-panel #ticketForm > table { width: 100%; max-width: 100%; table-layout: fixed; }
.mxs-support .support-native-panel #ticketForm > table td { width: auto; }
.mxs-support .support-native-panel .form-header { color: #273541; }
.mxs-support .support-native-panel .form-header h3 { margin-bottom: 8px; font-size: 18px; }
.mxs-support .support-native-panel .form-header div { color: var(--support-muted); font-size: 13px; }
.mxs-support .support-native-panel hr { margin-block: 24px; border-color: var(--support-border); }
.mxs-support .support-native-panel :is(#ticketForm, #clientLogin) label { color: #273541; font-size: 13px; font-weight: 600; }
.mxs-support .support-native-panel :is(#ticketForm, #clientLogin) :is(input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="url"], input[type="number"], input[type="search"], input[type="date"], select, textarea:not(.richtext)) {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 50px;
  margin-top: 8px;
  margin-bottom: 0;
  padding: 12px 14px;
  border: 1px solid #c8d3de;
  border-radius: 10px;
  background: #fff;
  color: var(--support-ink);
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}
.mxs-support .support-native-panel :is(input, select, textarea, [contenteditable]) { scroll-margin-top: 90px; }
.mxs-support .support-native-panel textarea.richtext { max-width: 100%; font-size: 16px; }
.mxs-support .support-native-panel .redactor-box { max-width: 100%; border-color: #c8d3de; border-radius: 10px; }
.mxs-support .support-native-panel .redactor-in { font-family: inherit; font-size: 16px; font-weight: 400; line-height: 1.65; }
.mxs-support .support-native-panel #ticketForm .captchaRow td { padding-top: 20px; }
.mxs-support .support-native-panel #ticketForm .captchaRow td:first-child { width: 150px; }
.mxs-support .support-native-panel #ticketForm .captcha { float: none; margin-bottom: 10px; }
.mxs-support .support-native-panel #ticketForm .captcha img { max-width: none; }
.mxs-support .support-native-panel #ticketForm #captcha { width: 160px; max-width: 100%; }
.mxs-support .support-native-panel #ticketForm .captchaRow em { display: block; margin-top: 8px; font-size: 12px; }
.mxs-support .support-native-panel .support-form-actions { text-align: left; }
.mxs-support .support-native-panel :is(#ticketForm, #clientLogin) input.support-button {
  width: auto;
  padding: 12px 22px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: var(--support-blue);
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
}
.mxs-support .support-native-panel :is(#ticketForm, #clientLogin) input.support-button:hover { background: var(--support-blue-dark); }
/* Native changed-form tracking sets an inline red color; keep the blue submit label readable. */
.mxs-support .support-native-panel #ticketForm input[type="submit"] { color: #fff !important; }
.mxs-support .support-native-panel #ticketForm input.support-button--outline { border-color: #cbd5df; background: #fff; color: var(--support-ink); }
.mxs-support .support-native-panel #ticketForm input.support-form-cancel { border: 0; background: transparent; font-family: inherit; cursor: pointer; }
.mxs-support .support-native-panel #clientLogin { margin-top: 26px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.mxs-support .support-native-panel #clientLogin .login-box { display: grid; width: 100%; padding: 0; border: 0; box-shadow: none; }
.mxs-support .support-native-panel #clientLogin .instructions { display: block; padding: 0; margin-top: 20px; color: var(--support-text); font-size: 13px; }
.mxs-support .support-native-panel #clientLogin .instructions:empty { display: none; }
.mxs-support .support-native-panel #clientLogin .support-native-error strong { color: #a00; font-size: 14px; }
.mxs-support .support-native-panel #clientLogin .support-native-error:not(:has(strong:not(:empty))) { display: none; }
.mxs-support .support-native-panel #clientLogin input.support-button { width: 100%; }
.mxs-support .support-native-panel #clientLogin .support-field__hint { margin-top: 8px; }
.mxs-support .support-form-actions--stacked { flex-wrap: nowrap; }
.mxs-support .support-knowledgebase { padding-block: 40px; }
.mxs-support .support-knowledgebase input { max-width: 100%; min-height: 44px; font-size: 16px; }
.mxs-support .support-knowledgebase .featured-category { max-width: 100%; }
.mxs-support .support-ticket-sidebar a:not(.support-text-link) { color: var(--support-blue); text-decoration: underline; }

@media (max-width: 900px) {
  .mxs-support .support-native-panel #clientLogin .login-box { display: grid !important; }
}
@media (max-width: 560px) {
  .mxs-support .support-native-panel #ticketForm .captchaRow > td { display: block; width: 100%; }
  .mxs-support .support-native-panel #ticketForm .captchaRow > td + td { padding-top: 0; }
  .mxs-support .support-native-panel #ticketForm input.support-button { width: 100%; }
}
}

@media print {
  .mxs-support { padding-top: 0; }
  .mxs-support .support-header, .mxs-support .support-footer, .mxs-support .support-skip { display: none; }
}