@charset "UTF-8";

/* ==========================================================================
   SUL DARK THEME — Versión completa del CSS de Zendesk con tema oscuro.
   Solo se cambiaron VALORES DE COLOR. Estructura, padding, márgenes,
   layout y media queries son idénticos al original.

   PALETA (basada en el login de Sul):
     --sul-bg:        #0a0e14   (fondo principal)
     --sul-surface:   #131820   (inputs, tarjetas)
     --sul-surface-2: #1a2030   (variante)
     --sul-border:    #2a3340   (bordes visibles)
     --sul-border-soft:#1e2530  (bordes sutiles)
     --sul-text:      #e6edf3   (texto principal)
     --sul-text-muted:#8b95a3   (texto secundario)
     Brand (teal):    rgba(37, 150, 190, 1) (se respeta el del tema Zendesk)
   ========================================================================== */

/***** Normalize.css *****/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html { line-height: 1.15; -webkit-text-size-adjust: 100%; }
body { margin: 0; }
main { display: block; }
h1 { font-size: 2em; margin: 0.67em 0; }
hr { box-sizing: content-box; height: 0; overflow: visible; }
pre { font-family: monospace, monospace; font-size: 1em; }
a { background-color: transparent; }
abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp { font-family: monospace, monospace; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
img { border-style: none; }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; }
button, input { overflow: visible; }
button, select { text-transform: none; }
button, [type=button], [type=reset], [type=submit] { -webkit-appearance: button; }
button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { border-style: none; padding: 0; }
button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring { outline: 1px dotted ButtonText; }
fieldset { padding: 0.35em 0.75em 0.625em; }
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; }
progress { vertical-align: baseline; }
textarea { overflow: auto; }
[type=checkbox], [type=radio] { box-sizing: border-box; padding: 0; }
[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; }
[type=search] { -webkit-appearance: textfield; outline-offset: -2px; }
[type=search]::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }
details { display: block; }
summary { display: list-item; }
template { display: none; }
[hidden] { display: none; }

/***** Base *****/
* { box-sizing: border-box; }

body {
  background-color: #0a0e14;
  color: #e6edf3;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
@media (min-width: 1024px) {
  body > main { min-height: 65vh; }
}

h1, h2, h3, h4, h5, h6 {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  margin-top: 0;
  color: #e6edf3;
}

h1 { font-size: 32px; }
h2 { font-size: 22px; }
h3 { font-size: 18px; font-weight: 600; }
h4 { font-size: 16px; }

a { color: #06b6d4; text-decoration: none; }
a:visited { color: #67e8f9; }
a:hover, a:active, a:focus { text-decoration: underline; }

.hbs-form input,
.hbs-form textarea,
.search input,
.search textarea {
  color: #e6edf3;
  font-size: 14px;
  background-color: #131820;
}
.hbs-form input::placeholder,
.search input::placeholder,
.hbs-form textarea::placeholder,
.search textarea::placeholder { color: #8b95a3; opacity: 1; }

.hbs-form input,
.search input {
  max-width: 100%;
  box-sizing: border-box;
  transition: border 0.12s ease-in-out;
}
.hbs-form input:where(:not([type=checkbox])),
.search input:where(:not([type=checkbox])) { outline: none; }
.hbs-form input:where(:not([type=checkbox])):focus,
.search input:where(:not([type=checkbox])):focus { border: 1px solid rgba(37, 150, 190, 1); }
.hbs-form input[disabled],
.search input[disabled] { background-color: #1a2030; }

.hbs-form select, .search select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%238b95a3' d='M0 0h10L5 6 0 0z'/%3E%3C/svg%3E") no-repeat #131820;
  background-position: right 10px center;
  border: 1px solid #2a3340;
  border-radius: 4px;
  padding: 8px 30px 8px 10px;
  outline: none;
  color: #e6edf3;
  width: 100%;
}
.hbs-form select:focus, .search select:focus { border: 1px solid rgba(37, 150, 190, 1); }
.hbs-form select::-ms-expand, .search select::-ms-expand { display: none; }

.hbs-form textarea, .search textarea {
  border: 1px solid #2a3340;
  border-radius: 2px;
  resize: vertical;
  width: 100%;
  outline: none;
  padding: 10px;
  background-color: #131820;
  color: #e6edf3;
}
.hbs-form textarea:focus, .search textarea:focus { border: 1px solid rgba(37, 150, 190, 1); }

.container {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
}
@media (min-width: 1160px) {
  .container { padding: 0; width: 90%; }
}

.container-divider {
  border-top: 1px solid #2a3340;
  margin-bottom: 20px;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.error-page {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
}
@media (min-width: 1160px) {
  .error-page { padding: 0; width: 90%; }
}

.visibility-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

/***** Buttons *****/
.button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link, .subscriptions-subscribe button, .requests-table-toolbar .organization-subscribe button, .community-follow button, .article-subscribe button, .section-subscribe button, .split-button button {
  background-color: transparent;
  border: 1px solid rgba(37, 150, 190, 1);
  border-radius: 4px;
  color: rgba(37, 150, 190, 1);
  cursor: pointer;
  display: inline-block;
  font-size: 12px;
  line-height: 2.34;
  margin: 0;
  padding: 0 20px;
  text-align: center;
  transition: background-color 0.12s ease-in-out, border-color 0.12s ease-in-out, color 0.15s ease-in-out;
  user-select: none;
  white-space: nowrap;
  width: 100%;
  -webkit-touch-callout: none;
}
@media (min-width: 768px) {
  .button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link, .subscriptions-subscribe button, .requests-table-toolbar .organization-subscribe button, .community-follow button, .article-subscribe button, .section-subscribe button, .split-button button { width: auto; }
}
.button:visited, .pagination-next-link:visited, .pagination-prev-link:visited, .pagination-first-link:visited, .pagination-last-link:visited, .subscriptions-subscribe button:visited, .requests-table-toolbar .organization-subscribe button:visited, .community-follow button:visited, .article-subscribe button:visited, .section-subscribe button:visited, .split-button button:visited {
  color: rgba(37, 150, 190, 1);
}
.button:hover, .pagination-next-link:hover, .pagination-prev-link:hover, .pagination-first-link:hover, .pagination-last-link:hover, .subscriptions-subscribe button:hover, .requests-table-toolbar .organization-subscribe button:hover, .community-follow button:hover, .article-subscribe button:hover, .section-subscribe button:hover, .split-button button:hover, .button:active, .pagination-next-link:active, .pagination-prev-link:active, .pagination-first-link:active, .pagination-last-link:active, .subscriptions-subscribe button:active, .requests-table-toolbar .organization-subscribe button:active, .community-follow button:active, .article-subscribe button:active, .section-subscribe button:active, .split-button button:active, .button:focus, .pagination-next-link:focus, .pagination-prev-link:focus, .pagination-first-link:focus, .pagination-last-link:focus, .subscriptions-subscribe button:focus, .requests-table-toolbar .organization-subscribe button:focus, .community-follow button:focus, .article-subscribe button:focus, .section-subscribe button:focus, .split-button button:focus, .button.button-primary, .button-primary.pagination-next-link, .button-primary.pagination-prev-link, .button-primary.pagination-first-link, .button-primary.pagination-last-link, .subscriptions-subscribe button.button-primary, .subscriptions-subscribe button[data-selected=true], .requests-table-toolbar .organization-subscribe button.button-primary, .requests-table-toolbar .organization-subscribe button[data-selected=true], .community-follow button.button-primary, .article-subscribe button.button-primary, .article-subscribe button[data-selected=true], .section-subscribe button.button-primary, .section-subscribe button[data-selected=true], .split-button button.button-primary {
  background-color: rgba(37, 150, 190, 1);
  color: #FFFFFF;
  text-decoration: none;
}
.button.button-primary:hover, .button-primary.pagination-next-link:hover, .button-primary.pagination-prev-link:hover, .button-primary.pagination-first-link:hover, .button-primary.pagination-last-link:hover, .subscriptions-subscribe button.button-primary:hover, .subscriptions-subscribe button[data-selected=true]:hover, .requests-table-toolbar .organization-subscribe button.button-primary:hover, .requests-table-toolbar .organization-subscribe button[data-selected=true]:hover, .community-follow button.button-primary:hover, .article-subscribe button.button-primary:hover, .article-subscribe button[data-selected=true]:hover, .section-subscribe button.button-primary:hover, .section-subscribe button[data-selected=true]:hover, .split-button button:hover, .button.button-primary:focus, .button-primary.pagination-next-link:focus, .button-primary.pagination-prev-link:focus, .button-primary.pagination-first-link:focus, .button-primary.pagination-last-link:focus, .subscriptions-subscribe button.button-primary:focus, .subscriptions-subscribe button[data-selected=true]:focus, .requests-table-toolbar .organization-subscribe button.button-primary:focus, .requests-table-toolbar .organization-subscribe button[data-selected=true]:focus, .community-follow button.button-primary:focus, .article-subscribe button.button-primary:focus, .article-subscribe button[data-selected=true]:focus, .section-subscribe button.button-primary:focus, .section-subscribe button[data-selected=true]:focus, .split-button button.button-primary:focus, .button.button-primary:active, .button-primary.pagination-next-link:active, .button-primary.pagination-prev-link:active, .button-primary.pagination-first-link:active, .button-primary.pagination-last-link:active, .subscriptions-subscribe button.button-primary:active, .subscriptions-subscribe button[data-selected=true]:active, .requests-table-toolbar .organization-subscribe button.button-primary:active, .requests-table-toolbar .organization-subscribe button[data-selected=true]:active, .community-follow button.button-primary:active, .article-subscribe button.button-primary:active, .article-subscribe button[data-selected=true]:active, .section-subscribe button.button-primary:active, .section-subscribe button[data-selected=true]:active, .split-button button.button-primary:active {
  background-color: #145369;
  border-color: #145369;
}
.button[data-disabled], [data-disabled].pagination-next-link, [data-disabled].pagination-prev-link, [data-disabled].pagination-first-link, [data-disabled].pagination-last-link, .subscriptions-subscribe button[data-disabled], .requests-table-toolbar .organization-subscribe button[data-disabled], .community-follow button[data-disabled], .article-subscribe button[data-disabled], .section-subscribe button[data-disabled], .split-button button[data-disabled] {
  cursor: default;
}

.button-large, .hbs-form input[type=submit] {
  cursor: pointer;
  background-color: rgba(37, 150, 190, 1);
  border: 0;
  border-radius: 4px;
  color: #FFFFFF;
  font-size: 14px;
  line-height: 2.72;
  min-width: 190px;
  padding: 0 1.9286em;
  width: 100%;
}
@media (min-width: 768px) {
  .button-large, .hbs-form input[type=submit] { width: auto; }
}
.button-large:visited, .hbs-form input[type=submit]:visited { color: #FFFFFF; }
.button-large:hover, .button-large:active, .button-large:focus, .hbs-form input[type=submit]:hover, .hbs-form input[type=submit]:active, .hbs-form input[type=submit]:focus {
  background-color: #145369;
}
.button-large[disabled], .hbs-form input[type=submit][disabled] { background-color: #1a2030; }

.button-secondary {
  color: #8b95a3;
  border: 1px solid #2a3340;
  background-color: transparent;
}
.button-secondary:visited { color: #8b95a3; }
.button-secondary:hover, .button-secondary:focus, .button-secondary:active {
  color: #e6edf3;
  border: 1px solid #2a3340;
  background-color: #1e2530;
}

/***** Split button *****/
.split-button { display: flex; }

.split-button button {
  background-color: rgba(37, 150, 190, 1);
  border: 0;
  color: #FFFFFF;
  height: 32px;
  line-height: 16px;
  outline-color: rgba(37, 150, 190, 1);
}

[dir=rtl] .split-button button:not(:only-child):first-child {
  border-left: 1px solid #FFFFFF;
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}
[dir=ltr] .split-button button:not(:only-child):first-child {
  border-right: 1px solid #FFFFFF;
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}
.split-button button:not(:only-child):last-child {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 26px;
  min-width: 26px;
  max-width: 26px;
  padding: 0;
}
[dir=rtl] .split-button button:not(:only-child):last-child {
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}
[dir=ltr] .split-button button:not(:only-child):last-child {
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

/***** Tables *****/
.table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}
@media (min-width: 768px) { .table { table-layout: auto; } }
.table th,
.table th a { color: #8b95a3; font-size: 13px; text-align: left; }
[dir=rtl] .table th,
[dir=rtl] .table th a { text-align: right; }
.table tr {
  border-bottom: 1px solid #2a3340;
  display: block;
  padding: 20px 0;
}
@media (min-width: 768px) { .table tr { display: table-row; } }
.table td { display: block; }
@media (min-width: 768px) { .table td { display: table-cell; } }
@media (min-width: 1024px) { .table td, .table th { padding: 20px 30px; } }
@media (min-width: 768px) { .table td, .table th { padding: 10px 20px; height: 60px; } }

/***** Forms *****/
.form { max-width: 650px; }

.form-field ~ .form-field { margin-top: 25px; }

.form-field label { display: block; font-size: 13px; margin-bottom: 5px; }

.form-field input {
  border: 1px solid #2a3340;
  border-radius: 4px;
  padding: 10px;
  width: 100%;
  background-color: #131820;
  color: #e6edf3;
}
.form-field input:focus { border: 1px solid rgba(37, 150, 190, 1); }

.form-field input[type=text] {
  border: 1px solid #2a3340;
  border-radius: 4px;
  background-color: #131820;
  color: #e6edf3;
}
.form-field input[type=text]:focus { border: 1px solid rgba(37, 150, 190, 1); }

.form-field input[type=checkbox] { width: auto; }

.form-field .nesty-input {
  border-radius: 4px;
  border: 1px solid #2a3340;
  height: 40px;
  line-height: 40px;
  outline: none;
  vertical-align: middle;
  background-color: #131820;
  color: #e6edf3;
}
.form-field .nesty-input:focus {
  border: 1px solid rgba(37, 150, 190, 1);
  text-decoration: none;
}

.form-field .hc-multiselect-toggle {
  border: 1px solid #2a3340;
  background-color: #131820;
  color: #e6edf3;
}

.form-field .hc-multiselect-toggle:focus {
  outline: none;
  border: 1px solid rgba(37, 150, 190, 1);
  text-decoration: none;
}

.form-field textarea {
  vertical-align: middle;
}

.form-field input[type=checkbox] + label { margin: 0 0 0 10px; }

.form-field .optional { color: #8b95a3; margin-left: 4px; }

.form-field p { color: #8b95a3; font-size: 12px; margin: 5px 0; }

.form footer { margin-top: 40px; padding-top: 30px; }

.form footer a { color: #8b95a3; cursor: pointer; margin-right: 15px; }

.form .suggestion-list { font-size: 13px; margin-top: 30px; }
.form .suggestion-list label {
  border-bottom: 1px solid #2a3340;
  display: block;
  padding-bottom: 5px;
}
.form .suggestion-list li { padding: 10px 0; }
.form .suggestion-list li a:visited { color: #67e8f9; }

/***** Header *****/
.header {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
  position: relative;
  align-items: center;
  display: flex;
  height: 71px;
  justify-content: space-between;
}
@media (min-width: 1160px) { .header { padding: 0; width: 90%; } }

.logo img { max-height: 37px; vertical-align: middle; }
.logo span { margin: 0 10px; color: rgba(37, 150, 190, 1); }
.logo a { display: inline-block; }
.logo a:hover, .logo a:focus, .logo a:active { text-decoration: none; }

.user-nav {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
}
@media (min-width: 768px) { .user-nav { position: relative; } }
.user-nav[aria-expanded=true] {
  background-color: #131820;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.4), 0 4px 10px 0 rgba(0, 0, 0, 0.5);
  border: solid 1px #2a3340;
  right: 0;
  left: 0;
  top: 71px;
  z-index: 1;
}
.user-nav[aria-expanded=true] > a { display: block; margin: 20px; }
.user-nav[aria-expanded=true] > .user-nav-list li { display: block; }
.user-nav[aria-expanded=true] > .user-nav-list a { display: block; margin: 20px; }

.user-nav-list { display: block; list-style: none; }
.user-nav-list > li { display: inline-block; }

@media (max-width: 768px) { .nav-wrapper-desktop { display: none; } }
@media (min-width: 768px) { .nav-wrapper-desktop { display: none; } }
@media (min-width: 1024px) { .nav-wrapper-desktop { display: inline-block; } }
.nav-wrapper-desktop a {
  border: 0;
  color: #06b6d4;
  display: none;
  font-size: 14px;
  padding: 0 20px 0 0;
  width: auto;
}
@media (min-width: 768px) { .nav-wrapper-desktop a { display: inline-block; } }
[dir=rtl] .nav-wrapper-desktop a { padding: 0 0 0 20px; }
.nav-wrapper-desktop a:hover, .nav-wrapper-desktop a:focus, .nav-wrapper-desktop a:active {
  background-color: transparent;
  color: #06b6d4;
  text-decoration: underline;
}

@media (min-width: 1024px) { .nav-wrapper-mobile { display: none; } }
.nav-wrapper-mobile .menu-button-mobile {
  background: none;
  border: 0;
  width: auto;
  min-width: 71px;
  cursor: pointer;
}
.nav-wrapper-mobile .menu-button-mobile .icon-menu {
  padding: 7px;
  vertical-align: middle;
  width: 30px;
  height: 30px;
  border-radius: 50%;
}
.nav-wrapper-mobile .menu-button-mobile[aria-expanded=true] .icon-menu { background: #1e2530; }
.nav-wrapper-mobile .menu-list-mobile {
  position: absolute;
  background-color: #131820;
  box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.6);
  border-top: solid 1px #2a3340;
  border-bottom: solid 1px #2a3340;
  right: 0;
  left: 0;
  top: 71px;
  z-index: 2;
}
.nav-wrapper-mobile .menu-list-mobile[aria-expanded=false] { display: none; }
.nav-wrapper-mobile .menu-list-mobile[aria-expanded=true] { display: block; }
.nav-wrapper-mobile .menu-list-mobile-items .item { margin: 4px 0; }
.nav-wrapper-mobile .menu-list-mobile-items li:empty:not(.nav-divider) { display: none; }
.nav-wrapper-mobile .menu-list-mobile-items .nav-divider {
  border-bottom: 0.1px solid #2a3340;
  padding: 0;
}
.nav-wrapper-mobile .menu-list-mobile-items .nav-divider:last-child { display: none; }
.nav-wrapper-mobile .menu-list-mobile-items button {
  background: none;
  border: none;
  padding: 8px 24px;
  width: 100%;
  height: 100%;
  color: #e6edf3;
  cursor: pointer;
  text-align: start;
}
.nav-wrapper-mobile .menu-list-mobile-items button:active,
.nav-wrapper-mobile .menu-list-mobile-items button:focus,
.nav-wrapper-mobile .menu-list-mobile-items button:hover {
  background-color: #1e2530;
  text-decoration: underline;
}
.nav-wrapper-mobile .menu-list-mobile-items a {
  display: block;
  padding: 8px 24px;
  width: 100%;
  height: 100%;
  color: #e6edf3;
}
.nav-wrapper-mobile .menu-list-mobile-items a:active,
.nav-wrapper-mobile .menu-list-mobile-items a:focus,
.nav-wrapper-mobile .menu-list-mobile-items a:hover {
  background-color: #1e2530;
}
.nav-wrapper-mobile .menu-list-mobile-items .my-profile {
  display: flex;
  line-height: 1.5;
}
.nav-wrapper-mobile .menu-list-mobile-items .my-profile .my-profile-tooltip {
  font-size: 12px;
  color: #8b95a3;
}
.nav-wrapper-mobile .menu-list-mobile-items .menu-profile-avatar {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
  margin-top: 1px;
}
[dir=rtl] .nav-wrapper-mobile .menu-list-mobile-items .menu-profile-avatar {
  margin-right: 0;
  margin-left: 8px;
}

.skip-navigation {
  align-items: center;
  background-color: black;
  color: white;
  display: flex;
  font-size: 14px;
  justify-content: center;
  left: -999px;
  margin: 20px;
  padding: 20px;
  overflow: hidden;
  position: absolute;
  top: auto;
  z-index: -999;
}
[dir=rtl] .skip-navigation { left: initial; right: -999px; }
.skip-navigation:focus, .skip-navigation:active {
  left: auto;
  overflow: auto;
  text-align: center;
  text-decoration: none;
  top: auto;
  z-index: 999;
}
[dir=rtl] .skip-navigation:focus, [dir=rtl] .skip-navigation:active { left: initial; right: auto; }

#zd-modal-container ~ .skip-navigation { display: none; }

/***** User info in header *****/
.user-info { display: inline-block; }
.user-info .dropdown-toggle::after { display: none; }
@media (min-width: 768px) { .user-info .dropdown-toggle::after { display: inline-block; } }
.user-info > button {
  border: 0;
  color: #06b6d4;
  min-width: 0;
  padding: 0;
  white-space: nowrap;
}
.user-info > button:hover, .user-info > button:focus {
  color: #06b6d4;
  background-color: transparent;
}
.user-info > button::after { color: #06b6d4; padding-right: 15px; }
[dir=rtl] .user-info > button::after { padding-left: 15px; padding-right: 0; }

#user #user-name { display: none; font-size: 14px; }
@media (min-width: 768px) { #user #user-name { display: inline-block; } }
#user #user-name:hover { text-decoration: underline; }

/***** User avatar *****/
.user-avatar {
  height: 25px;
  width: 25px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
}

.avatar { display: inline-block; position: relative; }
.avatar img { height: 40px; width: 40px; }
.avatar .icon-agent {
  color: rgba(37, 150, 190, 1);
  border: 2px solid #0a0e14;
  border-radius: 50%;
  bottom: -4px;
  background-color: #FFFFFF;
  font-size: 17px;
  height: 17px;
  line-height: 17px;
  position: absolute;
  right: -2px;
  text-align: center;
  width: 17px;
}

/***** Footer *****/
.footer {
  border-top: 1px solid #2a3340;
  margin-top: 60px;
  padding: 30px 0;
}
.footer a { color: #8b95a3; }
.footer-inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
  display: flex;
  justify-content: space-between;
}
@media (min-width: 1160px) { .footer-inner { padding: 0; width: 90%; } }
.footer-language-selector button { color: #8b95a3; display: inline-block; }

.powered-by-zendesk a,
.powered-by-zendesk a:visited { color: #8b95a3; }

/***** Breadcrumbs *****/
.breadcrumbs {
  margin: 0 0 15px 0;
  padding: 0;
  display: flex;
}
@media (min-width: 768px) { .breadcrumbs { margin: 0; } }
.breadcrumbs li {
  display: inline-block;
  color: #8b95a3;
  font-size: 13px;
  max-width: 450px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.breadcrumbs li + li::before {
  content: ">";
  margin: 0 4px;
}
.breadcrumbs li a:visited { color: #06b6d4; }

/***** Search field *****/
.search-container { position: relative; }

.search {
  border-color: #2a3340;
  border-radius: 30px;
  border-style: solid;
  border-width: 1px;
  display: flex;
  position: relative;
  transition: border 0.12s ease-in-out;
}
.search:focus-within { border-color: rgba(37, 150, 190, 1); }
.search input[type=search],
.search .clear-button {
  background-color: #131820;
  border-radius: 30px;
  border: none;
  color: #e6edf3;
}
.search-full input[type=search], .search-full .clear-button { border-color: #131820; }
.search input[type=search] {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  color: #e6edf3;
  flex: 1 1 auto;
  height: 40px;
  width: 100%;
}
.search input[type=search]:focus { color: #e6edf3; }
.search input[type=search]::-webkit-search-decoration,
.search input[type=search]::-webkit-search-cancel-button,
.search input[type=search]::-webkit-search-results-button,
.search input[type=search]::-webkit-search-results-decoration { -webkit-appearance: none; }
.search input[type=search]:-webkit-autofill,
.search input[type=search]:-webkit-autofill:hover,
.search input[type=search]:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #131820 inset;
  -webkit-text-fill-color: #e6edf3;
}
.search .clear-button {
  align-items: center;
  box-sizing: border-box;
  color: #8b95a3;
  cursor: pointer;
  display: none;
  flex: none;
  justify-content: center;
  padding: 0 15px;
}
.search .clear-button:hover { background-color: rgba(37, 150, 190, 1); color: #fff; }
.search .clear-button:focus { outline: 0; box-shadow: 0 0 0 3px rgba(37, 150, 190, 1); }
.search-has-value .clear-button { display: flex; }

[dir=ltr] .search input[type=search] { padding-left: 40px; padding-right: 20px; }
[dir=ltr] .search-has-value input[type=search] {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-right-color: transparent;
}
[dir=ltr] .search-has-value input[type=search]:focus { border-right-color: rgba(37, 150, 190, 1); }
[dir=ltr] .search .clear-button {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  border-left-color: transparent;
}
[dir=ltr] .search .clear-button:focus { border-left-color: rgba(37, 150, 190, 1); }

[dir=rtl] .search input[type=search] { padding-left: 20px; padding-right: 40px; }
[dir=rtl] .search-has-value input[type=search] {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  border-left-color: transparent;
}
[dir=rtl] .search-has-value input[type=search]:focus { border-left-color: rgba(37, 150, 190, 1); }
[dir=rtl] .search .clear-button {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
  border-right-color: transparent;
}
[dir=rtl] .search .clear-button:focus { border-right-color: rgba(37, 150, 190, 1); }

.search-icon {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  position: absolute;
  left: 15px;
  z-index: 1;
  width: 18px;
  height: 18px;
  color: #8b95a3;
  pointer-events: none;
}
[dir=rtl] .search-icon { left: auto; right: 15px; }

/***** Hero component *****/
.hero {
  background-image: url(/hc/theming_assets/01KQZ7GBH1T0FT6BAHZCC4AZQR);
  background-position: center;
  background-size: cover;
  height: 300px;
  padding: 0 20px;
  text-align: center;
  width: 100%;
}
.hero-inner {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  max-width: 610px;
  margin: 0 auto;
}

.page-header {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 10px 0;
}
@media (min-width: 768px) {
  .page-header {
    align-items: baseline;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
    margin: 0;
  }
}
.page-header .section-subscribe { flex-shrink: 0; margin-bottom: 10px; }
@media (min-width: 768px) { .page-header .section-subscribe { margin-bottom: 0; } }
.page-header h1 { flex-grow: 1; margin-bottom: 10px; }
.page-header-description { font-style: italic; margin: 0 0 30px 0; word-break: break-word; }
@media (min-width: 1024px) { .page-header-description { flex-basis: 100%; } }
.page-header .icon-lock {
  height: 20px;
  width: 20px;
  position: relative;
  left: -5px;
  vertical-align: baseline;
}

.sub-nav {
  align-items: baseline;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 15px 30px;
  justify-content: space-between;
  margin-bottom: 55px;
}
@media (min-width: 768px) { .sub-nav { flex-direction: row; } }
.sub-nav .breadcrumbs { margin: 0; }
.sub-nav .search-container { max-width: 300px; width: 100%; }
@media (min-width: 768px) { .sub-nav .search-container { flex: 0 1 300px; } }
.sub-nav input[type=search]::after { font-size: 15px; }

/***** Blocks *****/
.blocks-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  list-style: none;
  padding: 0;
}
@media (min-width: 768px) { .blocks-list { margin: 0 -15px; } }
.blocks-item {
  border: 1px solid rgba(37, 150, 190, 1);
  border-radius: 4px;
  box-sizing: border-box;
  color: rgba(37, 150, 190, 1);
  display: flex;
  flex: 1 0 340px;
  margin: 0 0 30px;
  max-width: 100%;
  text-align: center;
}
@media (min-width: 768px) { .blocks-item { margin: 0 15px 30px; } }
.blocks-item:hover, .blocks-item:focus, .blocks-item:active { background-color: rgba(37, 150, 190, 1); }
.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
  color: #FFFFFF;
  text-decoration: none;
}
.blocks-item-internal {
  background-color: #131820;
  border: 1px solid #2a3340;
}
.blocks-item-internal .icon-lock {
  height: 15px;
  width: 15px;
  bottom: 5px;
  position: relative;
}
.blocks-item-internal a { color: #e6edf3; }
.blocks-item-link {
  color: rgba(37, 150, 190, 1);
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  border-radius: inherit;
}
.blocks-item-link:visited, .blocks-item-link:hover, .blocks-item-link:active {
  color: inherit;
  text-decoration: none;
}
.blocks-item-link:focus {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(37, 150, 190, 1);
  text-decoration: none;
}
.blocks-item-title { margin-bottom: 0; font-size: 16px; }
.blocks-item-description { margin: 0; }
.blocks-item-description:not(:empty) { margin-top: 10px; }

/***** Homepage *****/
.section { margin-bottom: 40px; }
@media (min-width: 768px) { .section { margin-bottom: 60px; } }

.home-section h2 { margin-bottom: 10px; text-align: center; }

/***** Promoted articles *****/
.promoted-articles {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
@media (min-width: 1024px) { .promoted-articles { flex-direction: row; } }
.promoted-articles-item { flex: 1 0 auto; }
@media (min-width: 1024px) {
  .promoted-articles-item {
    align-self: flex-end;
    flex: 0 0 auto;
    padding-right: 30px;
    width: 33%;
  }
  [dir=rtl] .promoted-articles-item { padding: 0 0 0 30px; }
}
.promoted-articles-item:nth-child(3n) { padding-right: 0; }
.promoted-articles-item a {
  display: block;
  border-bottom: 1px solid #2a3340;
  padding: 15px 0;
}
.promoted-articles-item .icon-lock { vertical-align: baseline; }
.promoted-articles-item:last-child a { border: 0; }
@media (min-width: 1024px) { .promoted-articles-item:last-child a { border-bottom: 1px solid #2a3340; } }

/***** Community section in homepage *****/
.community { text-align: center; }
.community-image {
  min-height: 300px;
  margin-top: 32px;
  background-image: url(/hc/theming_assets/01KQZ8SRD4EEHZZ9EHD5G8CDRM);
  background-position: center;
  background-repeat: no-repeat;
  max-width: 100%;
}
.community a { color: #06b6d4; text-decoration: underline; }
.community a:visited { color: #67e8f9; }
.community a:hover, .community a:active, .community a:focus { color: #22d3ee; }

.community,
.activity {
  border-top: 1px solid #2a3340;
  padding: 30px 0;
}

/***** Recent activity *****/
.recent-activity-header { margin-bottom: 10px; text-align: center; }
.recent-activity-list { padding: 0; }
.recent-activity-item {
  border-bottom: 1px solid #2a3340;
  overflow: auto;
  padding: 20px 0;
}
.recent-activity-item h3 { margin: 0; }
.recent-activity-item-parent { font-size: 16px; font-weight: 600; }
.recent-activity-item-parent, .recent-activity-item-link {
  margin: 6px 0;
  display: inline-block;
  width: 100%;
}
@media (min-width: 768px) {
  .recent-activity-item-parent, .recent-activity-item-link {
    width: 70%;
    margin: 0;
  }
}
.recent-activity-item-link {
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.recent-activity-item-meta {
  color: #e6edf3;
  margin: 15px 0 0 0;
  float: none;
}
@media (min-width: 768px) {
  .recent-activity-item-meta { margin: 0; float: right; }
  [dir=rtl] .recent-activity-item-meta { float: left; }
}
.recent-activity-item-time, .recent-activity-item-comment {
  display: inline-block;
  font-size: 13px;
}
.recent-activity-item-comment { padding-left: 5px; }
[dir=rtl] .recent-activity-item-comment { padding: 0 5px 0 0; }
.recent-activity-item-comment::before { display: inline-block; }
.recent-activity-controls { padding-top: 15px; }
.recent-activity-controls a { color: #06b6d4; text-decoration: underline; }
.recent-activity-controls a:visited { color: #67e8f9; }
.recent-activity-controls a:hover, .recent-activity-controls a:active, .recent-activity-controls a:focus { color: #22d3ee; }
.recent-activity-accessibility-label {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}
.recent-activity-comment-icon svg {
  vertical-align: middle;
  color: rgba(37, 150, 190, 1);
  width: 16px;
  height: 16px;
}
.recent-activity-comment-icon:after { content: attr(data-comment-count); margin-left: 3px; }
[dir=rtl] .recent-activity-comment-icon:after { margin-left: 0; margin-right: 3px; }

/***** Category pages *****/
.category-container {
  display: flex;
  justify-content: flex-end;
}
.category-content { flex: 1; max-width: 100%; }
@media (min-width: 1024px) { .category-content { flex: 0 0 80%; } }

.section-tree {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) { .section-tree { flex-direction: row; } }
.section-tree .section { flex: initial; max-width: 100%; }
@media (min-width: 768px) { .section-tree .section { flex: 0 0 45%; } }
.section-tree-title { margin-bottom: 0; font-size: 18px; font-weight: 600; }
.section-tree-title a { color: #e6edf3; }
.section-tree .see-all-articles { display: block; padding: 15px 0; }

.article-list-item {
  font-size: 16px;
  padding: 15px 0;
  text-overflow: ellipsis;
  overflow: hidden;
}
.article-list-item a { color: #e6edf3; }

.icon-star { color: rgba(37, 150, 190, 1); font-size: 18px; }

/***** Section pages *****/
.section-container {
  display: flex;
  justify-content: flex-end;
}
.section-content { flex: 1; max-width: 100%; }
@media (min-width: 1024px) { .section-content { flex: 0 0 80%; } }
.section-list { margin: 40px 0; }

.section-list-item {
  border-bottom: 1px solid #2a3340;
  font-size: 16px;
  padding: 15px 0;
}
.section-list-item:first-child { border-top: 1px solid #2a3340; }
.section-list-item a {
  align-items: center;
  color: #e6edf3;
  display: flex;
  justify-content: space-between;
}

.see-all-sections-trigger {
  cursor: pointer;
  display: block;
  padding: 15px;
  text-align: center;
}
.see-all-sections-trigger[aria-hidden=true] { display: none; }

/***** Article *****/
.article {
  flex: 1 0 auto;
}
@media (min-width: 1024px) {
  .article {
    flex: 1 0 66%;
    max-width: 66%;
    min-width: 640px;
    padding: 0 30px;
  }
}
.article-container {
  display: flex;
  flex-direction: column;
}
@media (min-width: 1024px) { .article-container { flex-direction: row; } }
.article-header {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 40px;
  margin-top: 20px;
}
@media (min-width: 768px) { .article-header { flex-direction: row; margin-top: 0; } }
.article-avatar { margin-right: 10px; }
.article-author { margin-bottom: 10px; }
.article-title {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
@media (min-width: 768px) { .article-title { flex-basis: 100%; } }
.article-title .icon-lock {
  position: relative;
  left: -5px;
  vertical-align: baseline;
}
.article [role=button] { flex-shrink: 0; width: 100%; }
@media (min-width: 768px) { .article [role=button] { width: auto; } }
.article-info { max-width: 100%; }
.article-meta { display: inline-block; vertical-align: middle; }
.article-body { display: flow-root; }
.article-body a { color: #06b6d4; text-decoration: underline; }
.article-body a:visited { color: #67e8f9; }
.article-body a:hover, .article-body a:active, .article-body a:focus { color: #22d3ee; }
.article-body img { height: auto; max-width: 100%; }
.article-body p > img.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.article-body p > img.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.article-body p > img.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.article-body p > img.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.article-body figure.image { display: table; margin: 0 auto; }
.article-body figure.image > img { display: block; width: 100%; }
.article-body figure.image.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.article-body figure.image.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.article-body figure.image.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.article-body figure.image.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.article-body figcaption {
  padding: 10px 0;
  font-size: 12px;
  text-align: center;
  background-color: #1a2030;
}
.article-body ul,
.article-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}
[dir=rtl] .article-body ul,
[dir=rtl] .article-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}
.article-body ul > ul,
.article-body ol > ol,
.article-body ol > ul,
.article-body ul > ol,
.article-body li > ul,
.article-body li > ol { margin: 0; }
.article-body ul { list-style-type: disc; }
.article-body :not(pre) > code {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.article-body pre {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.article-body blockquote {
  border-left: 1px solid #2a3340;
  color: #8b95a3;
  font-style: italic;
  padding: 0 15px;
}
.article-body > p:last-child { margin-bottom: 0; }
.article-content {
  line-height: 1.6;
  margin: 40px 0;
  word-wrap: break-word;
}
.article-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}
.article-comment-count { color: #8b95a3; }
.article-comment-count:hover { text-decoration: none; }
.article-comment-count-icon {
  vertical-align: middle;
  color: rgba(37, 150, 190, 1);
  width: 18px;
  height: 18px;
}
.article-sidebar {
  border-bottom: 1px solid #2a3340;
  border-top: 1px solid #2a3340;
  flex: 1 0 auto;
  margin-bottom: 20px;
  padding: 0;
}
@media (min-width: 1024px) {
  .article-sidebar {
    border: 0;
    flex: 0 0 17%;
    height: auto;
    max-width: 17%;
  }
}
.article-relatives {
  border-top: 1px solid #2a3340;
  display: flex;
  flex-direction: column;
  padding: 20px 0;
}
@media (min-width: 768px) { .article-relatives { flex-direction: row; } }
.article-relatives > * {
  flex: 1 0 50%;
  min-width: 50%;
  overflow-wrap: break-word;
  margin-right: 0;
}
.article-relatives > *:last-child { padding: 0; }
@media (min-width: 768px) { .article-relatives > * { padding-right: 20px; } }
.article-votes {
  border-top: 1px solid #2a3340;
  padding: 30px 0;
  text-align: center;
}
.article-votes-question {
  font-size: 15px;
  font-weight: normal;
  margin-bottom: 0;
}
.article-vote {
  margin: 10px 5px;
  min-width: 90px;
  width: auto;
}
.article-more-questions {
  margin: 10px 0 20px;
  text-align: center;
}
.article-more-questions a { color: #06b6d4; text-decoration: underline; }
.article-more-questions a:visited { color: #67e8f9; }
.article-more-questions a:hover, .article-more-questions a:active, .article-more-questions a:focus { color: #22d3ee; }
.article-return-to-top {
  border-top: 1px solid #2a3340;
}
@media (min-width: 1024px) { .article-return-to-top { display: none; } }
.article-return-to-top a {
  color: #e6edf3;
  display: block;
  padding: 20px 0;
}
.article-return-to-top a:hover, .article-return-to-top a:focus { text-decoration: none; }
.article-return-to-top-icon { transform: rotate(0.5turn); }
.article td > p:first-child,
.article th > p:first-child { margin-top: 0; }
.article td > p:last-child,
.article th > p:last-child { margin-bottom: 0; }

.sidenav-title {
  font-size: 15px;
  position: relative;
  font-weight: 600;
}
.sidenav-item {
  display: block;
  margin-top: 10px;
  margin-bottom: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.recent-articles li,
.related-articles li { margin-bottom: 15px; }

/***** Attachments *****/
.attachments .attachment-item {
  padding-left: 20px;
  position: relative;
  margin-bottom: 10px;
}
.attachments .attachment-item:last-child { margin-bottom: 0; }
.attachments .attachment-item .attachment-icon {
  color: #e6edf3;
  left: 0;
  position: absolute;
  top: 5px;
}
[dir=rtl] .attachments .attachment-item { padding-left: 0; padding-right: 20px; }
[dir=rtl] .attachments .attachment-item .attachment-icon { left: auto; right: 0; }

.upload-dropzone span { color: #8b95a3; }

/***** Social share links *****/
.share { padding: 0; white-space: nowrap; }
.share li, .share a { display: inline-block; }
.share li { height: 25px; width: 25px; }
.share a { color: #8b95a3; }
.share a:hover { text-decoration: none; color: rgba(37, 150, 190, 1); }
.share a svg { height: 18px; width: 18px; display: block; }

/***** Comments *****/
.comment {
  border-bottom: 1px solid #2a3340;
  padding: 20px 0;
}
.comment-heading, .recent-articles-title,
.related-articles-title {
  margin-bottom: 5px;
  margin-top: 0;
  font-size: 18px;
  font-weight: 600;
}
.comment-overview {
  border-bottom: 1px solid #2a3340;
  border-top: 1px solid #2a3340;
  padding: 20px 0;
}
.comment-overview p { margin-top: 0; }
.comment-callout {
  color: #8b95a3;
  display: inline-block;
  font-size: 13px;
  margin-bottom: 0;
}
.comment-callout a { color: #06b6d4; text-decoration: underline; }
.comment-callout a:visited { color: #67e8f9; }
.comment-callout a:hover, .comment-callout a:active, .comment-callout a:focus { color: #22d3ee; }
.comment-sorter {
  display: inline-block;
  float: right;
}
.comment-sorter .dropdown-toggle { color: #8b95a3; font-size: 13px; }
[dir=rtl] .comment-sorter { float: left; }
.comment-wrapper {
  display: flex;
  position: relative;
}
.comment-wrapper.comment-official {
  border: 1px solid rgba(37, 150, 190, 1);
  padding: 40px 20px 20px;
}
@media (min-width: 768px) { .comment-wrapper.comment-official { padding-top: 20px; } }
.comment-info {
  min-width: 0;
  padding-right: 20px;
  width: 100%;
}
[dir=rtl] .comment-info { padding-right: 0; padding-left: 20px; }
.comment-author {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
@media (min-width: 768px) { .comment-author { justify-content: space-between; } }
.comment-avatar { margin-right: 10px; }
[dir=rtl] .comment-avatar { margin-left: 10px; margin-right: 0; }
.comment-meta { flex: 1 1 auto; }
.comment-labels { flex-basis: 100%; }
@media (min-width: 768px) { .comment-labels { flex-basis: auto; } }
.comment .status-label:not(.status-label-official) { margin-top: 10px; }
@media (min-width: 768px) { .comment .status-label:not(.status-label-official) { margin-top: 0; } }
.comment-form {
  display: flex;
  padding-top: 30px;
  word-wrap: break-word;
}
.comment-container { width: 100%; }
.comment-form-controls {
  display: none;
  margin-top: 10px;
  text-align: left;
}
@media (min-width: 768px) { [dir=ltr] .comment-form-controls { text-align: right; } }
.comment-form-controls input[type=submit] { margin-top: 15px; }
@media (min-width: 1024px) {
  .comment-form-controls input[type=submit] { margin-left: 15px; }
  [dir=rtl] .comment-form-controls input[type=submit] { margin-left: 0; margin-right: 15px; }
}
.comment-form-controls input[type=checkbox] { margin-right: 5px; }
.comment-form-controls input[type=checkbox] [dir=rtl] { margin-left: 5px; }
.comment-ccs { display: none; }
.comment-ccs + textarea { margin-top: 10px; }
.comment-attachments { margin-top: 10px; }
.comment-attachments a { color: rgba(37, 150, 190, 1); }
.comment-body {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  display: flow-root;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  line-height: 1.6;
  overflow-x: auto;
}
.comment-body a { color: #06b6d4; text-decoration: underline; }
.comment-body a:visited { color: #67e8f9; }
.comment-body a:hover, .comment-body a:active, .comment-body a:focus { color: #22d3ee; }
.comment-body img { height: auto; max-width: 100%; }
.comment-body p > img.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.comment-body p > img.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.comment-body p > img.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.comment-body p > img.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.comment-body figure.image { display: table; margin: 0 auto; }
.comment-body figure.image > img { display: block; width: 100%; }
.comment-body figure.image.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.comment-body figure.image.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.comment-body figure.image.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.comment-body figure.image.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.comment-body figcaption {
  padding: 10px 0;
  font-size: 12px;
  text-align: center;
  background-color: #1a2030;
}
.comment-body ul,
.comment-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}
[dir=rtl] .comment-body ul,
[dir=rtl] .comment-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}
.comment-body ul > ul,
.comment-body ol > ol,
.comment-body ol > ul,
.comment-body ul > ol,
.comment-body li > ul,
.comment-body li > ol { margin: 0; }
.comment-body ul { list-style-type: disc; }
.comment-body :not(pre) > code {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.comment-body pre {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.comment-body blockquote {
  border-left: 1px solid #2a3340;
  color: #8b95a3;
  font-style: italic;
  padding: 0 15px;
}
.comment-mark-as-solved { display: inline-block; }

/***** Vote *****/
.vote {
  display: flex;
  flex-direction: column;
  text-align: center;
}
.vote a:active, .vote a:hover, .vote a:focus { text-decoration: none; }

.vote-sum {
  color: #8b95a3;
  display: block;
  margin: 3px 0;
}
[dir=rtl] .vote-sum { direction: ltr; unicode-bidi: bidi-override; }

.vote-up svg { transform: scale(1, -1); }

.vote-up:hover,
.vote-down:hover { color: rgba(37, 150, 190, 1); }

.vote-up, .vote-down {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  border: none;
  color: #8b95a3;
  cursor: pointer;
  min-height: 35px;
  min-width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vote-voted { color: rgba(37, 150, 190, 1); }

.vote-voted:hover { color: #145369; }

/***** Actions *****/
.actions {
  text-align: center;
  flex-shrink: 0;
}
.actions button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  border: none;
  cursor: pointer;
  min-height: 35px;
  min-width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/***** Community *****/
.community-hero {
  background-image: url(/hc/theming_assets/01KQZ8SRD4EEHZZ9EHD5G8CDRM);
  margin-bottom: 10px;
}
.community-footer {
  padding-top: 50px;
  text-align: center;
}
.community-footer-title { font-size: 16px; margin-bottom: 20px; }
.community-featured-posts .title { font-size: 18px; font-weight: 600; }
.community-featured-posts, .community-activity {
  padding-top: 40px;
  width: 100%;
}
.community-header { margin-bottom: 30px; }
.community-header .title { margin-bottom: 0; font-size: 16px; }

.post-to-community { margin-top: 10px; }
@media (min-width: 768px) { .post-to-community { margin: 0; } }

.topics { max-width: none; width: 100%; }
.topics-item .meta-group {
  justify-content: center;
  margin-top: 20px;
}

.topic-header {
  border-bottom: 1px solid #2a3340;
  font-size: 13px;
}
@media (min-width: 768px) { .topic-header { padding-bottom: 10px; } }
.topic-header .dropdown {
  display: block;
  border-top: 1px solid #2a3340;
  padding: 10px 0;
}
@media (min-width: 768px) {
  .topic-header .dropdown {
    border-top: 0;
    display: inline-block;
    margin-right: 20px;
    padding: 0;
  }
}

.no-posts-with-filter {
  margin-top: 20px;
  margin-bottom: 20px;
}

.community-follow {
  margin-bottom: 10px;
  width: 100%;
}
@media (min-width: 768px) { .community-follow { margin-bottom: 0; width: auto; } }
.community-follow button {
  line-height: 30px;
  padding: 0 10px 0 15px;
  position: relative;
  width: 100%;
}
@media (min-width: 768px) { .community-follow button { width: auto; } }
.community-follow button:hover { background-color: rgba(37, 150, 190, 1); }
.community-follow button:hover::after, .community-follow button:focus::after {
  border-color: #FFFFFF;
  color: #FFFFFF;
}
.community-follow button[data-selected=true] {
  background-color: rgba(37, 150, 190, 1);
  color: #FFFFFF;
}
.community-follow button[data-selected=true]::after {
  border-left: 1px solid #FFFFFF;
  color: #FFFFFF;
}
.community-follow button[data-selected=true]:hover {
  background-color: #145369;
  border-color: #145369;
}
.community-follow button::after {
  border-left: 1px solid rgba(37, 150, 190, 1);
  content: attr(data-follower-count);
  color: rgba(37, 150, 190, 1);
  display: inline-block;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  margin-left: 15px;
  padding-left: 10px;
  position: absolute;
  right: 10px;
}
@media (min-width: 768px) { .community-follow button::after { position: static; } }
[dir=rtl] .community-follow button::after {
  border-left: 0;
  border-right: 1px solid rgba(37, 150, 190, 1);
  margin: 0 10px 0 0;
  padding: 0 10px 0 0;
}

/***** Striped list *****/
.striped-list { padding: 0; }
.striped-list-item {
  align-items: flex-start;
  border-bottom: 1px solid #2a3340;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 20px 0;
}
@media (min-width: 768px) { .striped-list-item { align-items: center; flex-direction: row; } }
.striped-list-info { flex: 2; }
.striped-list-title {
  color: #06b6d4;
  margin-bottom: 10px;
  margin-right: 5px;
}
.striped-list-title:hover, .striped-list-title:focus, .striped-list-title:active { text-decoration: underline; }
.striped-list-title:visited { color: #67e8f9; }
.striped-list .meta-group { margin: 5px 0; }
.striped-list-count {
  color: #8b95a3;
  font-size: 13px;
  justify-content: flex-start;
  text-transform: capitalize;
}
@media (min-width: 768px) { .striped-list-count { display: flex; flex: 1; justify-content: space-around; } }
.striped-list-count-item::after {
  content: "·";
  display: inline-block;
  padding: 0 5px;
}
@media (min-width: 768px) { .striped-list-count-item::after { display: none; } }
.striped-list-count-item:last-child::after { display: none; }
.striped-list-number { text-align: center; }
@media (min-width: 768px) { .striped-list-number { color: #e6edf3; display: block; } }

/***** Status labels *****/
.status-label {
  background-color: #038153;
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  margin-right: 2px;
  padding: 3px 10px;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-block;
}
.status-label:hover, .status-label:active, .status-label:focus { text-decoration: none; }
.status-label-pinned, .status-label-featured, .status-label-official { background-color: rgba(37, 150, 190, 1); }
.status-label-official {
  border-radius: 0;
  margin-right: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  width: 100%;
}
@media (min-width: 768px) {
  .status-label-official {
    border-radius: 0 0 4px 4px;
    right: 30px;
    width: auto;
  }
}
[dir=rtl] .status-label-official { left: 30px; right: auto; }
.status-label-not-planned, .status-label-closed {
  background-color: #1a2030;
  color: #8b95a3;
}
.status-label-pending, .status-label-pending-moderation {
  background-color: #1f73b7;
  text-align: center;
}
.status-label-open { background-color: #c72a1c; }
.status-label-solved { background-color: #68737d; }
.status-label-new { background-color: #ffb648; color: #703b15; }
.status-label-hold { background-color: #000; }
.status-label-request {
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 768px) { .status-label-request { max-width: 150px; } }

/***** Post *****/
.post { flex: 1; margin-bottom: 10px; }
@media (min-width: 1024px) { .post { flex: 1 0 70%; max-width: 70%; } }
.post-container { display: flex; flex-direction: column; }
@media (min-width: 1024px) { .post-container { flex-direction: row; } }
.post-header {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 10px;
}
@media (min-width: 768px) { .post-header { align-items: baseline; flex-direction: row; } }
.post-header .status-label { vertical-align: super; }
.post-title { margin-bottom: 20px; width: 100%; }
@media (min-width: 768px) { .post-title { margin-bottom: 0; padding-right: 10px; } }
.post-title h1 { display: inline; vertical-align: middle; }
@media (min-width: 768px) { .post-title h1 { margin-right: 5px; } }
.post-author {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
}
.post-avatar { margin-bottom: 30px; }
.post-content {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  line-height: 1.6;
  word-break: break-word;
}
.post-info-container { display: flex; margin-bottom: 40px; }
.post-info {
  min-width: 0;
  padding-right: 20px;
  width: 100%;
}
[dir=rtl] .post-info { padding-right: 0; padding-left: 20px; }
.post-meta {
  display: inline-block;
  flex: 1;
  margin-left: 10px;
  vertical-align: middle;
}
[dir=rtl] .post-meta { margin-left: 0; margin-right: 10px; }
.post-body { display: flow-root; }
.post-body a { color: #06b6d4; text-decoration: underline; }
.post-body a:visited { color: #67e8f9; }
.post-body a:hover, .post-body a:active, .post-body a:focus { color: #22d3ee; }
.post-body img { height: auto; max-width: 100%; }
.post-body p > img.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.post-body p > img.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.post-body p > img.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.post-body p > img.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.post-body figure.image { display: table; margin: 0 auto; }
.post-body figure.image > img { display: block; width: 100%; }
.post-body figure.image.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.post-body figure.image.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.post-body figure.image.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.post-body figure.image.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.post-body figcaption {
  padding: 10px 0;
  font-size: 12px;
  text-align: center;
  background-color: #1a2030;
}
.post-body ul,
.post-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}
[dir=rtl] .post-body ul,
[dir=rtl] .post-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}
.post-body ul > ul,
.post-body ol > ol,
.post-body ol > ul,
.post-body ul > ol,
.post-body li > ul,
.post-body li > ol { margin: 0; }
.post-body ul { list-style-type: disc; }
.post-body :not(pre) > code {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.post-body pre {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.post-body blockquote {
  border-left: 1px solid #2a3340;
  color: #8b95a3;
  font-style: italic;
  padding: 0 15px;
}
.post-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}
.post-comment-count { color: #8b95a3; }
.post-comment-count:hover { text-decoration: none; }
.post-comment-count .icon-comments {
  color: rgba(37, 150, 190, 1);
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 5px;
  vertical-align: middle;
}
.post-sidebar {
  border-top: 1px solid #2a3340;
  flex: 1;
  padding: 30px 0;
  text-align: center;
}
@media (min-width: 1024px) {
  .post-sidebar {
    border: 0;
    flex: 1 0 30%;
    padding: 0 0 0 50px;
    text-align: initial;
  }
  [dir=rtl] .post-sidebar { padding: 0 50px 0 0; }
}
.post-sidebar-title { font-size: 18px; font-weight: 600; }
.post-comments { margin-bottom: 20px; }
@media (min-width: 1024px) { .post-comments { margin-bottom: 0; } }

/***** Community Badges *****/
.community-badge-title {
  background-color: #04444d;
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 0px 8px;
  vertical-align: top;
  white-space: nowrap;
  display: inline-block;
  line-height: 18px;
  vertical-align: middle;
}

.community-badge-titles { display: inline; }

.community-badge-achievement {
  display: block;
  height: 16px;
  white-space: nowrap;
  width: 16px;
}
.community-badge-achievement img { width: 100%; height: 100%; }

.community-badge-achievements { display: flex; }

.community-badge-achievements-rest {
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
  vertical-align: top;
}

.community-badge { margin: 2px; }

.profile-info .community-badge-title {
  padding: 2px 8px;
  line-height: 20px;
}
.profile-info .community-badge-achievement {
  height: 40px;
  width: 40px;
}
.profile-info .community-badge-achievements-rest {
  line-height: 40px;
  font-size: 20px;
}

.collapsible-nav {
  flex-direction: column;
  font-size: 14px;
  position: relative;
}
@media (min-width: 768px) { .collapsible-nav { flex-direction: row; } }

.collapsible-nav-border {
  border-bottom: 1px solid #2a3340;
  border-top: 1px solid #2a3340;
}
@media (min-width: 768px) { .collapsible-nav-border { border-top: 0; } }

.collapsible-nav-toggle {
  top: 22.5px;
  transform: translateY(-50%);
  position: absolute;
  right: 0;
  padding: 0;
  border: 0;
  background: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}
@media (min-width: 768px) { .collapsible-nav-toggle { display: none; } }
[dir=rtl] .collapsible-nav-toggle { left: 0; right: auto; }
.collapsible-nav-toggle-icon { display: none; }
.collapsible-nav-toggle[aria-expanded=false] .chevron-icon { display: inline-block; }
.collapsible-nav-toggle[aria-expanded=true] .x-icon { display: inline-block; }
.collapsible-nav-toggle:focus {
  outline: none;
  border: 1px solid rgba(37, 150, 190, 1);
}

.collapsible-nav-list {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) { .collapsible-nav-list { flex-direction: row; } }
.collapsible-nav-list li {
  color: #e6edf3;
  line-height: 45px;
  order: 1;
}
@media (min-width: 768px) {
  .collapsible-nav-list li {
    line-height: normal;
    margin-right: 30px;
  }
  [dir=rtl] .collapsible-nav-list li {
    margin-left: 30px;
    margin-right: 0;
  }
  .collapsible-nav-list li a {
    text-decoration: none;
    padding: 15px 0;
  }
}
.collapsible-nav-list li a {
  color: #e6edf3;
  display: block;
}
@media (min-width: 768px) {
  .collapsible-nav-list li:hover {
    border-bottom: 4px solid #2a3340;
  }
  .collapsible-nav-list li:hover a:not([aria-current=page]) {
    padding: 15px 0 11px 0;
    text-decoration: none;
  }
}
.collapsible-nav-list li:not([aria-selected=true]),
.collapsible-nav-list li:not(.current) { display: none; }
@media (min-width: 768px) {
  .collapsible-nav-list li:not([aria-selected=true]),
  .collapsible-nav-list li:not(.current) { display: block; }
}
@media (min-width: 768px) {
  .collapsible-nav-list li[aria-selected=true] { padding: 15px 0 11px 0; }
}
.collapsible-nav-list li[aria-selected=true],
.collapsible-nav-list li.current {
  order: 0;
  position: relative;
}
@media (min-width: 768px) {
  .collapsible-nav-list li[aria-selected=true],
  .collapsible-nav-list li.current {
    border-bottom: 4px solid rgba(37, 150, 190, 1);
    order: 1;
  }
}
.collapsible-nav-list li[aria-selected=true] a,
.collapsible-nav-list li.current a { color: #e6edf3; }

.collapsible-nav[aria-expanded=true] li:not([aria-selected=true]),
.collapsible-nav[aria-expanded=true] li:not(.current) { display: block; }

.collapsible-sidebar {
  flex: 1;
  max-height: 45px;
  overflow: hidden;
  padding: 10px 0;
  position: relative;
}
@media (min-width: 1024px) {
  .collapsible-sidebar {
    max-height: none;
    padding: 0;
  }
}
.collapsible-sidebar-title { margin-top: 0; }
.collapsible-sidebar-toggle {
  position: absolute;
  top: 22.5px;
  transform: translateY(-50%);
  right: 0;
  padding: 0;
  border: 0;
  background: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}
@media (min-width: 1024px) { .collapsible-sidebar-toggle { display: none; } }
[dir=rtl] .collapsible-sidebar-toggle { left: 0; right: auto; }
.collapsible-sidebar-toggle-icon { display: none; }
.collapsible-sidebar-toggle[aria-expanded=false] .chevron-icon { display: inline-block; }
.collapsible-sidebar-toggle[aria-expanded=true] .x-icon { display: inline-block; }
.collapsible-sidebar-toggle:focus {
  outline: none;
  border: 1px solid rgba(37, 150, 190, 1);
}
.collapsible-sidebar-body { display: none; }
@media (min-width: 1024px) { .collapsible-sidebar-body { display: block; } }
.collapsible-sidebar[aria-expanded=true] { max-height: none; }
.collapsible-sidebar[aria-expanded=true] .collapsible-sidebar-body { display: block; }

/***** My activities *****/
.my-activities-nav {
  background-color: #131820;
  margin-bottom: 20px;
}
.my-activities-sub-nav { margin-bottom: 30px; }
.my-activities-table .striped-list-title {
  display: block;
  margin-bottom: 10px;
  max-width: 350px;
  white-space: normal;
}
@media (min-width: 1024px) {
  .my-activities-table .striped-list-title {
    margin-bottom: 0;
    max-width: 500px;
    min-width: 350px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
.my-activities-table thead { display: none; }
@media (min-width: 768px) { .my-activities-table thead { display: table-header-group; } }
.my-activities-table th:first-child,
.my-activities-table td:first-child { padding-left: 0; }
@media (min-width: 1024px) {
  .my-activities-table th:first-child,
  .my-activities-table td:first-child { width: 500px; }
}
.my-activities-table th:last-child,
.my-activities-table td:last-child { padding-right: 0; }
.my-activities-table td:not(:first-child) { display: none; }
@media (min-width: 768px) { .my-activities-table td:not(:first-child) { display: table-cell; } }

/* Requests table */
.requests-search { width: 100%; }
.requests-table-toolbar {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) { .requests-table-toolbar { flex-direction: row; } }
.requests-table-toolbar .search { flex: 1; width: 100%; }
.requests-table-toolbar .request-table-filter { width: 100%; }
@media (min-width: 768px) { .requests-table-toolbar .request-table-filter { width: auto; } }
.requests-table-toolbar .request-filter { display: block; }
@media (min-width: 768px) {
  .requests-table-toolbar .request-filter { margin: 0 0 0 30px; }
  [dir=rtl] .requests-table-toolbar .request-filter { margin: 0 30px 0 0; }
}
.requests-table-toolbar .request-filter-label { font-size: 13px; margin-top: 30px; }
@media (min-width: 768px) { .requests-table-toolbar .request-filter-label { margin-top: 0; } }
.requests-table-toolbar select {
  max-height: 40px;
  margin-bottom: 30px;
  width: 100%;
}
@media (min-width: 768px) {
  .requests-table-toolbar select {
    margin-bottom: 0;
    max-width: 300px;
    width: auto;
  }
}
@media (min-width: 768px) {
  .requests-table-toolbar .organization-subscribe { margin-left: 10px; }
  [dir=rtl] .requests-table-toolbar .organization-subscribe { margin: 0 10px 0 0; }
}
.requests-table-toolbar .organization-subscribe button {
  line-height: 40px;
  max-height: 40px;
  padding: 0 20px;
}
.requests-table-toolbar + .requests-search-info { margin-top: 15px; }
.requests-table-toolbar + .requests-search-info.meta-data::after {
  content: "";
  margin: 0;
}
.requests-table-toolbar + .requests-search-info + .requests { margin-top: 20px; }
.requests-table-toolbar + .requests { margin-top: 40px; }
.requests .requests-table-meta { display: block; }
@media (min-width: 768px) { .requests .requests-table-meta { display: none; } }
.requests .requests-table thead { display: none; }
@media (min-width: 768px) { .requests .requests-table thead { display: table-header-group; } }
.requests .requests-table-info { display: block; }
@media (min-width: 768px) {
  .requests .requests-table-info {
    display: table-cell;
    vertical-align: middle;
    width: auto;
  }
}
.requests .requests-table .requests-link { position: relative; }
.requests .requests-table .requests-sort-symbol {
  position: absolute;
  left: calc(100% + 3px);
  bottom: 0;
  font-size: 10px;
}

@media (min-width: 768px) {
  .subscriptions-subscribe button { width: auto; }
}
.subscriptions-table td:last-child { display: block; }
@media (min-width: 768px) { .subscriptions-table td:last-child { display: table-cell; } }
.subscriptions-table td:first-child {
  display: flex;
  align-items: center;
}
.subscriptions-table .user-avatar { margin-right: 10px; }
.subscriptions .striped-list-title {
  display: inline-block;
  vertical-align: middle;
}

.contributions-table td:last-child {
  color: #8b95a3;
  font-size: 13px;
}
@media (min-width: 768px) {
  .contributions-table td:last-child {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
  }
}

.no-activities { color: #8b95a3; }

/***** Request *****/
.request-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 1024px) {
  .request-container {
    align-items: flex-start;
    flex-direction: row;
  }
}
.request-container .comment-container { min-width: 0; }
.request-breadcrumbs { margin-bottom: 40px; }
@media (min-width: 1024px) { .request-breadcrumbs { margin-bottom: 60px; } }
.request-main {
  flex: 1 0 auto;
  order: 1;
}
.request-main .comment-fields, .request-main .request-submit-comment { display: none; }
.request-main .comment-fields.shown { display: block; }
.request-main .request-submit-comment.shown { display: inline; }
@media (min-width: 1024px) {
  .request-main {
    flex: 0 0 66%;
    order: 0;
    min-width: 0;
  }
}
.request-main .comment-form-controls { display: block; }
.request-main .comment-ccs { display: block; }
.request-main .comment-show-container {
  border-radius: 2px;
  border: 1px solid #2a3340;
  color: #8b95a3;
  text-align: inherit;
  padding: 8px 25px;
  width: 100%;
  background-color: #131820;
}
.request-main .comment-show-container.hidden { display: none; }
.request-main .form-field.comment-ccs > ul {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}
.request-main .form-field.comment-ccs > ul[data-hc-focus=true] { border: 1px solid rgba(37, 150, 190, 1); }
.request-main .form-field.comment-ccs > input[type=text] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}
.request-main .comment-ccs + textarea {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  margin-top: 0;
}
.request-main .comment-ccs + textarea:focus { border-top: 1px solid rgba(37, 150, 190, 1); }
.request-main input#mark_as_solved { display: none; }
.request-title { width: 100%; }
@media (min-width: 1024px) {
  .request-title {
    border-bottom: 1px solid #2a3340;
    margin-bottom: 0;
    max-width: 66%;
    padding-bottom: 20px;
  }
}
.request-sidebar {
  border-bottom: 1px solid #2a3340;
  border-top: 1px solid #2a3340;
  flex: 1 0 auto;
  order: 0;
}
@media (min-width: 1024px) {
  .request-sidebar {
    background-color: #131820;
    border: 0;
    font-size: 13px;
    flex: 0 0 auto;
    padding: 0 20px;
    width: 30%;
  }
}
.request-sidebar h2 {
  font-size: 15px;
  font-weight: 600;
  position: relative;
}
@media (min-width: 1024px) { .request-sidebar h2 { display: none; } }
.request-details {
  border-bottom: 1px solid #2a3340;
  font-size: 0;
  margin: 0;
  padding-bottom: 20px;
}
.request-details:last-child { border: 0; }
.request-details dt, .request-details dd {
  display: inline-block;
  vertical-align: top;
  font-size: 13px;
  margin: 20px 0 0 0;
}
.request-details dd {
  padding: 0 10px;
  width: 60%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.request-details dd::after { content: "\a"; white-space: pre; }
.request-details dt {
  line-break: strict;
  color: #8b95a3;
  width: 40%;
}
.request-details .request-collaborators { display: inline-block; }
.request-attachments dt, .request-attachments dd { width: 100%; }
.request-attachments dd { margin: 10px 0 0 0; }
.request-form textarea { min-height: 120px; }
.request-follow-up { padding-top: 20px; }

/***** Pagination *****/
.pagination { margin: 20px 0; text-align: center; }
.pagination-next, .pagination-prev, .pagination-first, .pagination-last { display: inline-block; }
.pagination-first-link, .pagination-last-link { padding: 0 10px; }
.pagination-first-text, .pagination-last-text {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}
.pagination-next-link { padding-right: 10px; }
.pagination-next-text { margin-right: 10px; }
[dir=rtl] .pagination-next-link { padding-left: 10px; }
[dir=rtl] .pagination-next-text { margin-left: 10px; }
.pagination-prev-link { padding-left: 10px; }
.pagination-prev-text { margin-left: 10px; }
[dir=rtl] .pagination-prev-link { padding-right: 10px; }
[dir=rtl] .pagination-prev-text { margin-right: 10px; }

/***** Metadata *****/
.meta-group { display: block; }
.meta-group-opposite { float: right; }
[dir=rtl] .meta-group-opposite { float: left; }
.meta-group * { display: inline; }
.meta-data {
  color: #8b95a3;
  font-size: 13px;
}
.meta-data:not(:last-child)::after { content: "·"; margin: 0 5px; }

/* User Profiles */
.profile-header {
  padding: 30px 0;
  background-color: #131820;
}

.profile-header .container {
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 768px) { .profile-header .container { flex-wrap: nowrap; } }

.profile-header .profile-info {
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  min-width: 0;
}

.profile-avatar {
  position: relative;
  line-height: 0;
  align-self: center;
  margin-right: 10px;
}
[dir=rtl] .profile-avatar { margin-left: 10px; margin-right: 0; }

.profile-avatar .user-avatar { width: 80px; height: 80px; }
.profile-avatar .icon-agent { bottom: 0; right: 0; }

.profile-header .basic-info {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
  flex-basis: 0;
  min-width: 0;
}
.profile-header .basic-info .name {
  margin: 0;
  line-height: 25px;
  vertical-align: middle;
  display: inline;
}

.profile-header .options {
  display: flex;
  flex-basis: 100%;
  margin-top: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .profile-header .options {
    flex-wrap: nowrap;
    flex-basis: auto;
    margin-top: 0;
    margin-left: 10px;
  }
  [dir=rtl] .profile-header .options { margin-left: 0; margin-right: 10px; }
  .profile-header .options > :not(:last-child) { margin-bottom: 0; margin-right: 10px; }
  [dir=rtl] .profile-header .options > :not(:last-child) { margin-left: 10px; margin-right: 0; }
}

.user-profile-actions {
  width: 100%;
  margin-bottom: 15px;
}

.profile-header .description {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  margin: 15px 0;
  flex-basis: 100%;
}

.profile-stats {
  font-size: 13px;
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
}
.profile-stats .stat { display: flex; margin-bottom: 10px; }
.profile-stats .stat-label {
  color: #8b95a3;
  flex: 0 0 100px;
  margin-right: 10px;
}
[dir=rtl] .profile-stats .stat-label { margin-left: 10px; margin-right: 0; }

.profile-stats-activity {
  border-top: solid 1px #2a3340;
  margin-top: 15px;
}
@media (min-width: 768px) { .profile-stats-activity { border-top: 0; flex-direction: row; } }
@media (min-width: 768px) { .profile-stats-activity .stat { flex-direction: column; } }
.profile-stats-activity .stat:first-child { margin-top: 10px; }
@media (min-width: 768px) { .profile-stats-activity .stat:first-child { margin-top: 0; } }
@media (min-width: 768px) {
  .profile-stats-activity .stat:not(:last-child) { margin-right: 40px; }
  [dir=rtl] .profile-stats-activity .stat:not(:last-child) { margin-left: 40px; margin-right: 0; }
}
@media (min-width: 768px) { .profile-stats-activity .stat-label { flex: 0 1 auto; } }

.profile-stats-counters {
  border-bottom: solid 1px #2a3340;
}
@media (min-width: 768px) {
  .profile-stats-counters {
    flex: 0 0 200px;
    border-bottom: 0;
    margin-left: 40px;
  }
  [dir=rtl] .profile-stats-counters { margin-left: 0; margin-right: 40px; }
}
@media (min-width: 1024px) {
  .profile-stats-counters { flex: 0 0 270px; margin-left: 60px; }
  [dir=rtl] .profile-stats-counters { margin-right: 60px; margin-left: 0; }
}
@media (min-width: 768px) { .profile-stats-counters .stat { flex-direction: column; } }
@media (min-width: 1024px) { .profile-stats-counters .stat { flex-direction: row; } }
@media (min-width: 768px) { .profile-stats-counters .stat:not(:last-child) { margin-bottom: 15px; } }
@media (min-width: 768px) { .profile-stats-counters .stat-label { flex: 0 1 auto; } }
@media (min-width: 1024px) { .profile-stats-counters .stat-label { flex: 0 0 100px; } }

.profile-private-badge {
  flex-basis: 100%;
  border: solid 1px rgba(37, 150, 190, 1);
  border-radius: 4px;
  color: rgba(37, 150, 190, 1);
  padding: 5px 20px;
  font-size: 12px;
  text-align: center;
}
.profile-private-badge .profile-private-icon { margin-left: 5px; line-height: 15px; }
@media (min-width: 768px) { .profile-private-badge { flex-basis: auto; } }

.profile-nav {
  background-color: #131820;
  margin-bottom: 37px;
}

.profile-section { width: 100%; }
@media (min-width: 1024px) { .profile-section { width: calc(100% - 330px); } }

.profile-section-header {
  display: flex;
  flex-wrap: wrap;
}

.profile-section-title { flex-basis: 100%; margin-bottom: 0; }

.profile-section-description {
  flex-basis: 100%;
  padding: 10px 0;
  color: #8b95a3;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (min-width: 768px) {
  .profile-section-description { flex: 1 0 50%; padding-bottom: 0; }
}

.profile-section-sorter {
  flex-basis: 100%;
  border-top: solid 1px #1e2530;
  font-size: 13px;
}
.profile-section-sorter .dropdown-toggle {
  padding: 10px 0;
  width: 100%;
}
.profile-section-sorter .dropdown-toggle::after {
  position: absolute;
  right: 0;
}
[dir=rtl] .profile-section-sorter .dropdown-toggle::after { left: 0; right: initial; }
@media (min-width: 768px) {
  .profile-section-sorter .dropdown-toggle::after { position: relative; }
}
@media (min-width: 768px) {
  .profile-section-sorter {
    flex: 0 1 auto;
    padding-top: 0;
    border-top: 0;
    margin-left: 20px;
  }
  [dir=rtl] .profile-section-sorter { margin-left: 0; margin-right: 20px; }
}

.profile-badges-items { margin-top: 25px; }
.profile-badges-item {
  border-top: 1px solid #2a3340;
  display: flex;
  flex: 1;
  flex-direction: row;
  justify-content: flex-start;
  padding: 27px 12px;
}
.profile-badges-item > div { padding-right: 12px; padding-left: 12px; }
.profile-badges-item-image {
  height: 40px;
  width: 40px;
  margin-right: 12px;
}
.profile-badges-item-image img { max-height: 40px; }
[dir=rtl] .profile-badges-item-image { margin-left: 12px; margin-right: 0; }
.profile-badges-item-title, .profile-badges-item-metadata-title {
  font-size: 15px;
  margin-bottom: 10px;
}
.profile-badges-item-title { font-weight: 600; }
.profile-badges-item-description, .profile-badges-item-metadata-description {
  color: #8b95a3;
  font-size: 13px;
  margin: 0;
}
.profile-badges-item-metadata { margin-left: auto; text-align: right; }
[dir=rtl] .profile-badges-item-metadata { margin-left: 0; margin-right: auto; text-align: left; }

.profile-contribution {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  padding: 20px 0;
  position: relative;
}

.profile-contribution-header { margin-bottom: 5px; }
.profile-contribution-title {
  margin: 0 0 5px 0;
  display: inline;
  line-height: 21px;
  font-size: 15px;
  vertical-align: middle;
}
.profile-contribution-body { margin: 10px 0; }

.profile-contribution-list > .profile-contribution {
  border-top: 1px solid #1e2530;
}
@media (min-width: 768px) {
  .profile-contribution-list > .profile-contribution { padding-left: 30px; }
  [dir=rtl] .profile-contribution-list > .profile-contribution { padding-right: 30px; padding-left: 0; }
}

.profile-contribution-list > .profile-contribution:last-child {
  border-bottom: 1px solid #1e2530;
}

.profile-contribution-icon {
  left: 0;
  position: absolute;
  color: #8b95a3;
  line-height: 25px;
}
[dir=rtl] .profile-contribution-icon { right: 0; }
.profile-contribution-icon svg { vertical-align: middle; }

.profile-contribution-list .profile-contribution-header { margin-left: 30px; }
[dir=rtl] .profile-contribution-list .profile-contribution-header { padding-right: 30px; padding-left: 0; }
@media (min-width: 768px) {
  .profile-contribution-list .profile-contribution-header { margin-left: 0; }
  [dir=rtl] .profile-contribution-list .profile-contribution-header { padding-right: 0; }
}

.profile-comments .profile-contribution-breadcrumbs { margin-left: 30px; }
[dir=rtl] .profile-comments .profile-contribution-breadcrumbs { padding-right: 30px; padding-left: 0; }
@media (min-width: 768px) {
  .profile-comments .profile-contribution-breadcrumbs { margin-left: 0; }
  [dir=rtl] .profile-comments .profile-contribution-breadcrumbs { padding-right: 0; }
}

.profile-section .no-activity,
.profile-section .private-activity {
  display: block;
  margin-top: 40px;
  color: #8b95a3;
}

.private-activity-icon { margin-right: 10px; }
[dir=rtl] .private-activity-icon { margin-right: 0; margin-left: 10px; }

.profile-activity-list { margin-top: 25px; }

.profile-activity {
  position: relative;
  padding-bottom: 30px;
}
@media (min-width: 768px) {
  .profile-activity { padding-left: 20px; }
  [dir=rtl] .profile-activity { padding-right: 20px; padding-left: 0; }
}

@media (min-width: 768px) {
  .profile-activity:not(:last-child) { border-left: 1px solid #2a3340; }
  [dir=rtl] .profile-activity:not(:last-child) { border-left: 0; border-right: 1px solid #2a3340; }
}

.profile-activity-header {
  display: flex;
  align-items: center;
  margin-left: 35px;
}
[dir=rtl] .profile-activity-header { margin-left: 0; margin-right: 35px; }
@media (min-width: 768px) {
  .profile-activity-header { margin-left: 0; }
  [dir=rtl] .profile-activity-header { margin-right: 0; }
}

.profile-activity-header .user-avatar {
  width: 40px;
  height: 40px;
  margin-right: 10px;
  min-width: 40px;
  align-self: flex-start;
}
[dir=rtl] .profile-activity-header .user-avatar { margin-left: 10px; margin-right: 0; }

.profile-activity-description {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  margin: 0;
  min-width: 0;
  width: 100%;
}

.profile-activity-description span:first-child {
  font-weight: 600;
  display: inline;
}

.profile-activity-contribution {
  padding: 20px;
  margin-top: 10px;
  border-radius: 8px;
  background-color: #131820;
}
@media (min-width: 768px) {
  .profile-activity-contribution {
    margin-top: 0;
    margin-left: 50px;
  }
  [dir=rtl] .profile-activity-contribution { margin-left: 0; margin-right: 50px; }
}

.profile-activity-icon {
  position: absolute;
  left: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-color: #0a0e14;
  background-position: 50% 50%;
  text-align: center;
  color: #8b95a3;
}
[dir=rtl] .profile-activity-icon { right: 0; }
@media (min-width: 768px) {
  .profile-activity-icon { left: -14px; }
  [dir=rtl] .profile-activity-icon { right: -14px; }
}

.profile-activity-icon svg {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  height: 1em;
  margin: auto;
}

/***** Search results *****/
.search-results {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 1024px) { .search-results { flex-direction: row; } }
.search-results-column { flex: 1; }
@media (min-width: 1024px) { .search-results-column { flex: 0 0 75%; } }
.search-results-sidebar {
  border-top: 1px solid #2a3340;
  flex: 1 0 auto;
  margin-bottom: 20px;
  padding: 0;
}
@media (min-width: 1024px) {
  .search-results-sidebar {
    border: 0;
    flex: 0 0 20%;
    height: auto;
  }
}
.search-results-sidebar .sidenav-item {
  border-radius: 4px;
  padding: 10px 36px;
  margin-bottom: 4px;
  color: #e6edf3;
}
.search-results-sidebar .sidenav-item:hover, .search-results-sidebar .sidenav-item.current {
  background-color: #1e2530;
  text-decoration: none;
}
.search-results-sidebar .sidenav-subitem { unicode-bidi: embed; }
.search-results-sidebar .sidenav-tag {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex-grow: 0;
}
.search-results-sidebar .sidenav-tag .content-tag {
  background: #1a2030;
  border-radius: 4px;
  padding: 4px 12px;
  text-decoration: none;
}
.search-results-sidebar .sidenav-tag .content-tag .label {
  font-style: normal;
  font-weight: 600;
  font-size: 12px;
  line-height: 24px;
  text-align: center;
  letter-spacing: -0.000427656px;
  color: #e6edf3;
  flex-grow: 0;
  vertical-align: middle;
  display: inline-block;
}
.search-results-sidebar .sidenav-tag .content-tag .close-icon {
  color: #8b95a3;
  vertical-align: middle;
  display: inline-block;
}
.search-results-sidebar .collapsible-sidebar { margin-bottom: 30px; }
.search-results-sidebar .collapsible-sidebar[aria-expanded=false] .multibrand-filter-list { display: none; }
@media (min-width: 1024px) {
  .search-results-sidebar .collapsible-sidebar[aria-expanded=false] .multibrand-filter-list { display: block; }
}
.search-results-sidebar .multibrand-filter-list--collapsed li:nth-child(1n+6) { display: none; }
.search-results-sidebar .multibrand-filter-list .doc-count { color: #8b95a3; }
.search-results-sidebar .see-all-filters {
  background: none;
  border: none;
  cursor: pointer;
  display: block;
  padding: 10px;
  color: #06b6d4;
}
.search-results-sidebar .see-all-filters[aria-hidden=true] { display: none; }
.search-results-sidebar .see-all-filters:hover { text-decoration: underline; }
.search-results-sidebar .see-all-filters::after { content: " ⌄"; font-weight: bold; }
.search-results-subheading { font-size: 18px; font-weight: 600; }
.search-results-list { margin-bottom: 25px; }
.search-results-list > li { padding: 20px 0; }
.search-results-list > li:first-child { border-top: 1px solid #2a3340; }
.search-results .no-results {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 4rem;
}
.search-results .no-results .headline {
  color: #e6edf3;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: -0.45px;
}
.search-results .no-results .action-prompt {
  color: #8b95a3;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.154px;
}
.search-results .no-results .action-prompt a { color: #06b6d4; }
.search-results .no-results .action-prompt a:visited { color: #06b6d4; }

.search-result-title-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.search-result-title { font-size: 16px; margin-bottom: 0; }
.search-result-votes, .search-result-meta-count {
  color: #8b95a3;
  font-size: 13px;
}
.search-result-votes-icon, .search-result-meta-count-icon {
  color: rgba(37, 150, 190, 1);
  vertical-align: middle;
  width: 13px;
  height: 13px;
}
[dir=ltr] .search-result-votes, [dir=ltr] .search-result-meta-count { margin-left: 20px; }
[dir=rtl] .search-result-votes, [dir=rtl] .search-result-meta-count { margin-right: 20px; }
.search-result-meta-container {
  color: #8b95a3;
  display: flex;
  flex-direction: column;
}
@media (min-width: 1024px) {
  .search-result-meta-container { flex-direction: row; align-items: center; }
}
@media (min-width: 1024px) { .search-result-meta-container nav { flex: 1; } }
@media (min-width: 1024px) { [dir=ltr] .search-result-meta-container .meta-data { margin-left: 20px; } }
@media (min-width: 1024px) { [dir=rtl] .search-result-meta-container .meta-data { margin-right: 20px; } }
.search-result-meta-container .meta-data::after { content: none; }
.search-result-breadcrumbs { margin: 0; }
.search-result-description {
  margin-top: 10px;
  margin-bottom: 0;
  word-break: break-word;
}

.search-results-description em { font-style: normal; font-weight: bold; }
html[lang|=zh] .search-results-description em { font-style: normal; background: yellow; }

/***** Notifications *****/
.notification {
  border: 1px solid;
  display: table;
  font-family: sans-serif;
  font-size: 12px;
  padding: 13px 15px;
  transition: height 0.2s;
  width: 100%;
  color: #e6edf3;
}

.notification a { color: #158ec2; }

.notification-inner {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 980px;
}

.notification-icon, .notification-inline.notification-error::before, .notification-text, .notification-dismiss {
  display: table-cell;
  vertical-align: middle;
}

.notification-text { padding: 0 15px; width: 100%; }

.notification + .notification {
  margin-bottom: -1px;
  position: relative;
  top: -1px;
}

/* Notificaciones — colores semánticos preservados (fondos pastel claros para que destaquen) */
.notification-error { background: #ffeded; border-color: #f7cbcb; color: #555; }
.notification-error .notification-icon::before, .notification-error .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23555555'/%3E%3C/svg%3E");
}
.notification-notice { background: #dbf3ff; border-color: #b5e0f5; color: #555; }
.notification-notice .notification-icon::before, .notification-notice .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3.5 6l2 2L9 4.5'/%3E%3Ccircle cx='6' cy='6' r='5.5'/%3E%3C/g%3E%3C/svg%3E");
}
.notification-alert {
  color: #ad5e18;
  background: #fff8ed;
  border-color: #fcdba9;
}
.notification-alert .notification-icon::before, .notification-alert .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23ad5e18' stroke-linecap='round' d='M5.06 1.27l-4.5 8.5c-.18.33.06.73.44.73h9c.38 0 .62-.4.44-.73l-4.5-8.5a.494.494 0 00-.88 0zM5.5 4v2'/%3E%3Ccircle cx='5.5' cy='8' r='.8' fill='%23ad5e18'/%3E%3C/svg%3E");
}
.notification-icon::before, .notification-inline.notification-error::before {
  background-size: cover;
  content: "";
  display: inline-block;
  height: 14px;
  width: 14px;
  vertical-align: middle;
}

.notification-dismiss, a.notification-dismiss {
  color: #555;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 100ms ease;
  text-decoration: none !important;
}
.notification-dismiss:hover { opacity: 1; }

.notification-inline {
  border-radius: 4px;
  line-height: 14px;
  margin-top: 5px;
  padding: 5px;
  position: relative;
  text-align: left;
  vertical-align: middle;
}
[dir=rtl] .notification-inline { text-align: right; }
.notification-inline[aria-hidden=true] { display: none; }
.notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23e35b66'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23e35b66'/%3E%3C/svg%3E");
  margin: -2px 5px 0 0;
}
[dir=rtl] .notification-inline.notification-error::before { margin: 0 0 0 5px; }
.notification-inline.notification-error {
  background-color: #fff0f1;
  border: 1px solid #e35b66;
  color: #cc3340;
}
.notification-inline.notification-large {
  padding: 13px 15px;
  margin-bottom: 25px;
}

.notification-left-aligned {
  text-align: left;
  padding-left: 0;
}
html[dir=rtl] .notification-left-aligned {
  text-align: right;
  padding-left: auto;
  padding-right: 0;
}

/***** Dropdowns *****/
.dropdown { position: relative; display: inline-block; }

.dropdown-toggle {
  cursor: pointer;
  background: none;
  border: 0;
  display: inline-block;
  padding: 0;
  text-align: initial;
  vertical-align: middle;
}
.dropdown-toggle:hover { text-decoration: none; }
.dropdown-toggle > * { display: inline-block; }
.dropdown-toggle[aria-expanded=true] + .dropdown-menu { display: block; }

.dropdown-menu {
  background: #131820;
  border: 1px solid #2a3340;
  border-radius: 3px;
  box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.6);
  display: none;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  left: 0;
  margin-top: 1px;
  min-width: 170px;
  padding: 10px 0;
  position: absolute;
  text-align: left;
  z-index: 1000;
}
[dir=rtl] .dropdown-menu { text-align: right; }
.dropdown-menu [role=separator] {
  border-bottom: 1px solid #1e2530;
  margin: 4px 0;
}
.dropdown-menu [role=menuitem],
.dropdown-menu [role=menuitemradio] {
  color: #e6edf3;
  cursor: pointer;
  display: block;
  padding: 7px 40px 7px 20px;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  -webkit-appearance: none;
  text-align: start;
  line-height: inherit;
  width: 100%;
}
[dir=rtl] .dropdown-menu [role=menuitem],
[dir=rtl] .dropdown-menu [role=menuitemradio] {
  padding: 7px 20px 7px 40px;
}
.dropdown-menu [role=menuitem]:hover, .dropdown-menu [role=menuitem]:focus,
.dropdown-menu [role=menuitemradio]:hover,
.dropdown-menu [role=menuitemradio]:focus {
  background: rgba(8, 145, 178, 0.18);
  text-decoration: none;
  color: #e6edf3;
}
.dropdown-menu [role=menuitem][aria-selected=true], .dropdown-menu [role=menuitem][aria-checked=true],
.dropdown-menu [role=menuitemradio][aria-selected=true],
.dropdown-menu [role=menuitemradio][aria-checked=true] {
  cursor: default;
}
.dropdown-menu [role=menuitem][aria-selected=true]::after, .dropdown-menu [role=menuitem][aria-checked=true]::after,
.dropdown-menu [role=menuitemradio][aria-selected=true]::after,
.dropdown-menu [role=menuitemradio][aria-checked=true]::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M1 7l3 3 7-7'%3E%3C/path%3E%3C/svg%3E");
  display: inline-block;
  height: 12px;
  margin-left: 10px;
  width: 12px;
}
[dir=rtl] .dropdown-menu [role=menuitem][aria-selected=true]::after, [dir=rtl] .dropdown-menu [role=menuitem][aria-checked=true]::after,
[dir=rtl] .dropdown-menu [role=menuitemradio][aria-selected=true]::after,
[dir=rtl] .dropdown-menu [role=menuitemradio][aria-checked=true]::after {
  margin-left: 0;
  margin-right: 10px;
  float: left;
}
.dropdown-menu [role=menuitem][hidden], .dropdown-menu [role=menuitem][aria-hidden=true],
.dropdown-menu [role=menuitemradio][hidden],
.dropdown-menu [role=menuitemradio][aria-hidden=true] {
  display: none !important;
}

.dropdown-menu-end { left: auto; right: 0; }
.dropdown-menu-top { bottom: 100%; margin-bottom: 1px; }

[dir=rtl] .dropdown-menu { left: auto; right: 0; text-align: right; }
[dir=rtl] .dropdown-menu-end { left: 0; right: auto; }

.dropdown-chevron-icon { vertical-align: middle; }

/***** Content tags *****/
.content-tags > p {
  color: #8b95a3;
  margin-top: 32px;
  margin-bottom: 4px;
}
.content-tags-add-hint {
  color: #8b95a3;
  font-size: 14px;
}

.content-tag-list {
  display: flex;
  flex-wrap: wrap;
  word-break: break-word;
}
.content-tag-list li {
  border-right: 1px solid #2a3340;
  margin-bottom: 4px;
}
[dir=ltr] .content-tag-list li { padding-right: 8px; margin-right: 8px; }
[dir=rtl] .content-tag-list li { padding-left: 8px; margin-left: 8px; }
.content-tag-list li:last-child { border: none; }

/***** WYSIWYG Editor *****/
#hc-wysiwyg {
  border: 1px solid #2a3340;
  background-color: #131820;
  color: #e6edf3;
}

/***** Upload Dropzone *****/
.upload-dropzone {
  border: 1px solid #2a3340;
  background-color: #131820;
}

/***** Summary block *****/
zd-summary-block {
  background: #131820;
  color: #e6edf3;
}
[dir=ltr] zd-summary-block { border-left-color: #859fa1; }
[dir=rtl] zd-summary-block { border-right-color: #859fa1; }

/***** Service catalog *****/
.service-catalog-hero {
  background-image: url(/hc/theming_assets/01KP8XZNC963BS4YEVJR9KXSTD);
  margin-bottom: 10px;
  height: 320px;
}
.service-catalog-description { display: flow-root; }
.service-catalog-description a { color: #06b6d4; text-decoration: underline; }
.service-catalog-description a:visited { color: #67e8f9; }
.service-catalog-description a:hover, .service-catalog-description a:active, .service-catalog-description a:focus { color: #22d3ee; }
.service-catalog-description img { height: auto; max-width: 100%; }
.service-catalog-description p > img.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.service-catalog-description p > img.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.service-catalog-description p > img.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.service-catalog-description p > img.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.service-catalog-description figure.image { display: table; margin: 0 auto; }
.service-catalog-description figure.image > img { display: block; width: 100%; }
.service-catalog-description figure.image.image-style-align-left { float: left; margin: 8px 20px 6px 0; }
.service-catalog-description figure.image.image-style-align-right { float: right; margin: 8px 0px 6px 20px; }
.service-catalog-description figure.image.image-style-block-align-right { margin-left: auto; margin-right: 0; }
.service-catalog-description figure.image.image-style-block-align-left { margin-left: 0; margin-right: auto; }
.service-catalog-description figcaption {
  padding: 10px 0;
  font-size: 12px;
  text-align: center;
  background-color: #1a2030;
}
.service-catalog-description ul,
.service-catalog-description ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}
[dir=rtl] .service-catalog-description ul,
[dir=rtl] .service-catalog-description ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}
.service-catalog-description ul > ul,
.service-catalog-description ol > ol,
.service-catalog-description ol > ul,
.service-catalog-description ul > ol,
.service-catalog-description li > ul,
.service-catalog-description li > ol { margin: 0; }
.service-catalog-description ul { list-style-type: disc; }
.service-catalog-description :not(pre) > code {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.service-catalog-description pre {
  background: #1a2030;
  border: 1px solid #2a3340;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.service-catalog-description blockquote {
  border-left: 1px solid #2a3340;
  color: #8b95a3;
  font-style: italic;
  padding: 0 15px;
}
.service-catalog-main-content {
  display: flex;
  gap: 32px;
}
.service-catalog-list { width: 100%; }
.service-catalog-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 20px;
}

/***** Sul Dark Theme — extras finales para inputs y autofill *****/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #131820 inset;
  -webkit-text-fill-color: #e6edf3;
  caret-color: #e6edf3;
}
::selection { background-color: rgba(37, 150, 190, 1); color: #ffffff; }
::-moz-selection { background-color: rgba(37, 150, 190, 1); color: #ffffff; }

/* Scrollbar opcional para mejor estética en oscuro */
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: #0a0e14; }
::-webkit-scrollbar-thumb { background: #2a3340; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #8b95a3; }

/* ==========================================================================
   SUL DARK THEME — Refinamiento final para fidelidad total al login.
   Esta sección va al final con selectores más específicos para garantizar
   que TODOS los campos del formulario adopten el estilo del login Sul.
   ========================================================================== */

/* ----- INPUTS: fondo oscuro, borde sutil, esquinas redondeadas tipo login ----- */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="datetime-local"],
input[type="time"],
.hbs-form input[type="text"],
.hbs-form input[type="email"],
.hbs-form input[type="password"],
.hbs-form input[type="number"],
.hbs-form input[type="tel"],
.hbs-form input[type="url"],
.hbs-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="search"]):not([type="file"]),
.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="search"]):not([type="file"]),
.form-field input[type="text"],
.request-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="search"]):not([type="file"]),
.hbs-form textarea,
.form-field textarea,
.request-form textarea,
textarea {
  background-color: #131820;
  color: #e6edf3;
  border: 1px solid #1f2937;
  border-radius: 10px;
  padding: 14px 16px;
  font-size: 14px;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* Focus state — borde teal con leve glow como el login */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="date"]:focus,
input[type="datetime-local"]:focus,
input[type="time"]:focus,
.hbs-form input[type="text"]:focus,
.hbs-form input[type="email"]:focus,
.hbs-form input[type="password"]:focus,
.hbs-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="search"]):not([type="file"]):focus,
.form-field input:not([type="checkbox"]):not([type="radio"]):not([type="search"]):not([type="file"]):focus,
.form-field input[type="text"]:focus,
.request-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="search"]):not([type="file"]):focus,
.hbs-form textarea:focus,
.form-field textarea:focus,
.request-form textarea:focus,
textarea:focus {
  background-color: #131820;
  color: #e6edf3;
  border-color: rgba(37, 150, 190, 1);
  outline: none;
  box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.15);
}

/* Disabled state */
input[disabled],
textarea[disabled],
select[disabled] {
  background-color: #0d1218 !important;
  color: #6b7280 !important;
  cursor: not-allowed;
}

/* ----- SELECT (dropdowns) ----- */
.hbs-form select,
.form-field select,
.request-form select,
select {
  background-color: #131820;
  color: #e6edf3;
  border: 1px solid #1f2937;
  border-radius: 10px;
  padding: 14px 40px 14px 16px;
  font-size: 14px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%238b95a3' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
}
.hbs-form select:focus,
.form-field select:focus,
.request-form select:focus,
select:focus {
  border-color: rgba(37, 150, 190, 1);
  outline: none;
  box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.15);
  background-color: #131820;
  color: #e6edf3;
}

/* nesty-input (multiselect dropdown) */
.form-field .nesty-input {
  background-color: #131820;
  color: #e6edf3;
  border: 1px solid #1f2937;
  border-radius: 10px;
  height: 48px;
  line-height: 46px;
  padding: 0 16px;
}
.form-field .nesty-input:focus {
  border-color: rgba(37, 150, 190, 1);
  box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.15);
}

/* hc-multiselect-toggle */
.form-field .hc-multiselect-toggle {
  background-color: #131820;
  color: #e6edf3;
  border: 1px solid #1f2937;
  border-radius: 10px;
}
.form-field .hc-multiselect-toggle:focus {
  border-color: rgba(37, 150, 190, 1);
  box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.15);
}

/* ----- LABELS: blancos brillantes como en el login ----- */
.form-field label,
.form-field > label,
.hbs-form label,
.request-form label {
  color: #ffffff;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 8px;
  display: block;
}

/* ----- DESCRIPCIÓN / HELPER TEXT: gris muted ----- */
.form-field p,
.form-field .description,
.form-field small,
.form-field .form-field-description {
  color: #8b95a3;
  font-size: 13px;
  margin-top: 4px;
  margin-bottom: 8px;
  font-weight: 400;
}

/* ----- PLACEHOLDER: gris medio para legibilidad ----- */
input::placeholder,
textarea::placeholder,
.hbs-form input::placeholder,
.hbs-form textarea::placeholder,
.form-field input::placeholder,
.form-field textarea::placeholder {
  color: #6b7280;
  opacity: 1;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { color: #6b7280; }
input::-moz-placeholder,
textarea::-moz-placeholder { color: #6b7280; opacity: 1; }
input:-ms-input-placeholder,
textarea:-ms-input-placeholder { color: #6b7280; }

/* ----- ASTERISCO de campo obligatorio ----- */
.form-field label .required,
.form-field .required {
  color: #ef4444;
  margin-left: 2px;
}

/* ----- TÍTULOS / HEADINGS de la página: blancos brillantes ----- */
.page-header h1,
.request-title h1,
h1 {
  color: #ffffff;
}

/* ----- Texto general del body más claro/legible ----- */
body, p {
  color: #e6edf3;
}

/* ----- Autofill: forzar fondo oscuro para que el navegador no lo pinte blanco ----- */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #131820 inset !important;
  -webkit-text-fill-color: #e6edf3 !important;
  caret-color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
  transition: background-color 5000s ease-in-out 0s;
}

/* ==========================================================================
   SUL DARK THEME — Ajustes adicionales (selects, WYSIWYG, legibilidad)
   ========================================================================== */

/* ----- SELECT: forzar oscuro con máxima especificidad ----- */
select,
.hbs-form select,
.form-field select,
.request-form select,
.form select,
form select,
div select {
  background-color: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%238b95a3' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  padding: 14px 40px 14px 16px !important;
  font-size: 14px !important;
}
select:focus, .form-field select:focus, .request-form select:focus {
  border-color: rgba(37, 150, 190, 1) !important;
  box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.15) !important;
}

/* Las opciones del menú desplegable */
select option,
select optgroup {
  background-color: #131820 !important;
  color: #e6edf3 !important;
}

/* ----- CKEDITOR 5 (WYSIWYG): forzar tema oscuro completo ----- */
/* Wrapper general */
#hc-wysiwyg,
.ck.ck-editor,
.ck-editor {
  background-color: #131820 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

/* Toolbar (la barra de B I @ , etc) */
.ck.ck-toolbar,
.ck.ck-toolbar.ck-toolbar_grouping,
.ck-editor__top .ck-toolbar,
.ck.ck-reset_all .ck-toolbar {
  background-color: #1a2030 !important;
  border-color: #1f2937 !important;
  border-bottom: 1px solid #1f2937 !important;
  color: #e6edf3 !important;
}

/* Botones de la toolbar */
.ck.ck-button,
.ck.ck-toolbar .ck-button,
.ck.ck-button.ck-off,
.ck.ck-button:not(.ck-disabled) {
  color: #e6edf3 !important;
  background-color: transparent !important;
  border: none !important;
}
.ck.ck-button:not(.ck-disabled):hover,
.ck.ck-button.ck-on,
.ck.ck-toolbar .ck-button:not(.ck-disabled):hover {
  background-color: rgba(8, 145, 178, 0.18) !important;
  color: #ffffff !important;
}
.ck.ck-button .ck-button__label,
.ck.ck-button .ck-button__icon,
.ck.ck-icon,
.ck.ck-icon * {
  color: #e6edf3 !important;
}
.ck.ck-button.ck-disabled,
.ck.ck-button.ck-disabled .ck-button__label,
.ck.ck-button.ck-disabled .ck-button__icon {
  color: #6b7280 !important;
  opacity: 0.5 !important;
}

/* Área de edición (donde escribes el contenido) */
.ck.ck-content,
.ck.ck-editor__main,
.ck.ck-editor__editable,
.ck.ck-editor__editable_inline,
.ck-editor__editable {
  background-color: #131820 !important;
  color: #e6edf3 !important;
  border-color: #1f2937 !important;
  min-height: 200px !important;
}
.ck.ck-editor__editable:focus,
.ck.ck-editor__editable_inline:focus {
  border-color: rgba(37, 150, 190, 1) !important;
  box-shadow: none !important;
}

/* Placeholder dentro del editor */
.ck.ck-content .ck-placeholder::before,
.ck.ck-editor__editable .ck-placeholder::before,
.ck-editor__editable .ck-placeholder::before {
  color: #6b7280 !important;
}

/* Dropdowns dentro del editor (ej. "Párrafo") */
.ck.ck-dropdown__panel,
.ck.ck-list,
.ck.ck-balloon-panel {
  background-color: #131820 !important;
  border-color: #1f2937 !important;
  color: #e6edf3 !important;
}
.ck.ck-list__item .ck-button,
.ck.ck-list__item button {
  color: #e6edf3 !important;
}
.ck.ck-list__item .ck-button:hover,
.ck.ck-list__item .ck-button.ck-on {
  background-color: rgba(8, 145, 178, 0.18) !important;
}

/* Inputs dentro del editor (ej. cuando insertas link) */
.ck.ck-input,
.ck.ck-input-text,
.ck.ck-labeled-field-view input {
  background-color: #0d1218 !important;
  color: #e6edf3 !important;
  border-color: #1f2937 !important;
}
.ck.ck-input:focus {
  border-color: rgba(37, 150, 190, 1) !important;
}

/* Separadores en la toolbar */
.ck.ck-toolbar__separator {
  background: #1f2937 !important;
}

/* ----- LABELS y DESCRIPCIONES en BLANCO + títulos 20% más grandes ----- */
.form-field label,
.form-field > label,
.hbs-form label,
.request-form label,
.form label {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 17px !important;       /* 14px × 1.2 = 16.8 ≈ 17px */
  margin-bottom: 8px !important;
  display: block !important;
}

.form-field p,
.form-field .description,
.form-field small,
.form-field .form-field-description {
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  opacity: 0.92;
}

/* Asterisco de campo obligatorio */
.form-field label .required,
.form-field .required,
label .required {
  color: #ef4444 !important;
}

/* Asegurar que los inputs (no select, no wysiwyg) sigan oscuros */
.form-field input[type="text"],
.form-field input[type="email"],
.form-field input[type="password"],
.form-field input[type="number"],
.form-field input[type="tel"],
.form-field input[type="url"],
.form-field textarea,
.request-form input[type="text"],
.request-form input[type="email"],
.request-form textarea {
  background-color: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
}

/* ==========================================================================
   SUL DARK THEME — Refinamiento final (round 4)
   Override máximamente agresivo para forzar TODOS los campos a oscuro
   sin excepción y mejorar legibilidad de descripciones.
   ========================================================================== */

/* ============================================================
   1. INPUTS y TEXTAREAS — siempre oscuros, sin importar el contexto
   ============================================================ */
html body textarea,
html body input[type="text"],
html body input[type="email"],
html body input[type="password"],
html body input[type="number"],
html body input[type="tel"],
html body input[type="url"],
html body input[type="date"],
html body input[type="datetime-local"],
html body input[type="time"],
html body textarea:not(:focus),
html body input:not(:focus):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="search"]):not([type="file"]) {
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
}

html body textarea:focus,
html body input[type="text"]:focus,
html body input[type="email"]:focus,
html body input[type="password"]:focus,
html body input[type="number"]:focus,
html body input[type="tel"]:focus,
html body input[type="url"]:focus {
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
  border-color: rgba(37, 150, 190, 1) !important;
  outline: none !important;
}

/* ============================================================
   2. SELECT — !important en background shorthand para vencer JS/widgets
   ============================================================ */
html body select {
  background: #131820 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%238b95a3' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 16px center !important;
  background-color: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
  padding: 14px 40px 14px 16px !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}
html body select:hover,
html body select:focus,
html body select:active {
  background-color: #131820 !important;
}
html body select option,
html body select optgroup {
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
}

/* ============================================================
   3. CKEDITOR — el texto QUE EL USUARIO ESCRIBE debe ser blanco
   ============================================================ */
.ck.ck-content,
.ck.ck-content p,
.ck.ck-content span,
.ck.ck-content strong,
.ck.ck-content em,
.ck.ck-content li,
.ck.ck-content ul,
.ck.ck-content ol,
.ck.ck-content blockquote,
.ck.ck-content h1,
.ck.ck-content h2,
.ck.ck-content h3,
.ck.ck-content h4,
.ck.ck-editor__editable,
.ck.ck-editor__editable p,
.ck.ck-editor__editable span,
.ck.ck-editor__editable strong,
.ck.ck-editor__editable em,
.ck.ck-editor__editable li,
.ck.ck-editor__editable_inline,
.ck.ck-editor__editable_inline p,
.ck-content,
.ck-content p,
.ck-editor__editable,
.ck-editor__editable p {
  color: #e6edf3 !important;
  background-color: transparent !important;
}
.ck.ck-content,
.ck.ck-editor__editable,
.ck.ck-editor__editable_inline,
.ck-editor__main {
  background-color: #131820 !important;
}

/* ============================================================
   4. Ocultar label "Rich Text Editor"
   ============================================================ */
.ck-voice-label,
.ck.ck-voice-label,
[class*="ck-voice-label"],
.ck-editor > h2,
.ck-editor > h3,
.ck.ck-editor > label,
.ck.ck-editor > h2,
.ck.ck-editor > h3,
[id^="ck-editor__aria-label"],
.ck.ck-reset_all label.ck-voice-label,
.ck-editor__top > .ck-voice-label,
.ck-editor__top > h2,
.ck-editor__top > h3 {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  clip: rect(0,0,0,0) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ============================================================
   5. DESCRIPCIONES de campos — gris claro legible (no transparencia)
   ============================================================ */
.form-field p,
.form-field .description,
.form-field small,
.form-field .form-field-description,
.form-field > p,
.form-field > .description,
.request-form .form-field p,
.request-form p.description,
form .form-field p,
form .description {
  color: #d1d5db !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  opacity: 1 !important;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}

/* ============================================================
   6. PLACEHOLDER en CKEditor: gris medio
   ============================================================ */
.ck.ck-editor__editable .ck-placeholder::before,
.ck.ck-content .ck-placeholder::before,
.ck-editor__editable .ck-placeholder::before {
  color: #6b7280 !important;
}

/* ==========================================================================
   SUL DARK THEME — Round 5: ataque final a widgets custom y CKEditor
   ========================================================================== */

/* ============================================================
   color-scheme: dark fuerza al navegador a renderizar controles
   nativos (select, scrollbar, etc.) con paleta oscura
   ============================================================ */
html, body {
  color-scheme: dark !important;
}

/* ============================================================
   1. Catch-all para widgets custom de dropdown/combobox/tagger
   (el campo "Tipo de afectación" es uno de estos)
   ============================================================ */
.form-field [role="combobox"],
.form-field [role="textbox"][aria-haspopup],
.form-field [role="listbox"],
.form-field [aria-haspopup="listbox"],
.form-field [aria-haspopup="menu"],
.form-field [aria-haspopup="true"],
.form-field [aria-autocomplete],
.form-field .nesty-container,
.form-field .nesty-input,
.form-field .hc-multiselect-toggle,
.form-field .field-input,
.form-field .field-tagger,
.form-field .tagger-container,
.form-field [class*="tagger"],
.form-field [class*="dropdown-select"]:not(.dropdown-menu),
.form-field [class*="select-wrapper"],
.form-field [class*="combobox"],
.form-field input[type="hidden"] ~ div,
.form-field input[type="hidden"] + div {
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
}

/* Inputs internos de widgets combobox (texto que escribes para filtrar) */
.form-field [role="combobox"] input,
.form-field [aria-autocomplete] input,
.form-field [class*="combobox"] input,
.form-field [class*="tagger"] input {
  background-color: transparent !important;
  background: transparent !important;
  color: #e6edf3 !important;
  border: none !important;
}

/* El menú desplegable que aparece al abrir un combobox */
.form-field [role="listbox"] [role="option"],
.form-field [class*="dropdown-menu"] [role="option"],
.form-field .nesty-container ul,
.form-field .nesty-container li {
  background-color: #131820 !important;
  color: #e6edf3 !important;
}
.form-field [role="listbox"] [role="option"]:hover,
.form-field [role="listbox"] [role="option"][aria-selected="true"],
.form-field .nesty-container li:hover {
  background-color: rgba(8, 145, 178, 0.18) !important;
}

/* ============================================================
   2. CKEditor: texto blanco con MÁXIMA especificidad (html body)
   ============================================================ */
html body .ck.ck-content,
html body .ck.ck-content p,
html body .ck.ck-content span,
html body .ck.ck-content strong,
html body .ck.ck-content em,
html body .ck.ck-content li,
html body .ck.ck-content ul,
html body .ck.ck-content ol,
html body .ck.ck-content blockquote,
html body .ck.ck-content h1,
html body .ck.ck-content h2,
html body .ck.ck-content h3,
html body .ck.ck-content h4,
html body .ck.ck-content h5,
html body .ck.ck-content h6,
html body .ck.ck-content div,
html body .ck.ck-content a,
html body .ck.ck-editor__editable,
html body .ck.ck-editor__editable p,
html body .ck.ck-editor__editable span,
html body .ck.ck-editor__editable div,
html body .ck.ck-editor__editable a,
html body .ck.ck-editor__editable_inline,
html body .ck.ck-editor__editable_inline p,
html body .ck-content,
html body .ck-content p,
html body .ck-content span,
html body .ck-content div,
html body .ck-editor__editable,
html body .ck-editor__editable p,
html body .ck-editor__editable span,
html body .ck-editor__editable div {
  color: #e6edf3 !important;
}

/* Asegurar fondo oscuro */
html body .ck.ck-content,
html body .ck.ck-editor__editable,
html body .ck.ck-editor__editable_inline,
html body .ck-content,
html body .ck-editor__editable {
  background-color: #131820 !important;
  background: #131820 !important;
}

/* Links dentro del editor */
html body .ck.ck-content a,
html body .ck-content a {
  color: #06b6d4 !important;
}

/* ============================================================
   3. Descripciones de campos: 40% más claras (casi blanco)
   ============================================================ */
.form-field p,
.form-field .description,
.form-field small,
.form-field .form-field-description,
.form-field > p,
.form-field > .description,
.request-form .form-field p,
.request-form p.description,
form .form-field p,
form .description,
.hbs-form .form-field p,
.hbs-form p.description {
  color: #e8ebef !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  opacity: 1 !important;
}

/* ==========================================================================
   SUL DARK THEME — Round 6: Zendesk Garden Combobox + descripciones más claras
   ========================================================================== */

/* ============================================================
   Zendesk Garden Combobox (componentes React de Zendesk)
   Usa data-garden-id porque las clases CSS-in-JS son dinámicas
   ============================================================ */

/* Trigger — la "caja" visible del dropdown que estaba blanca */
[data-garden-id="dropdowns.combobox.trigger"] {
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
  padding: 14px 40px 14px 16px !important;
  min-height: 50px !important;
}
[data-garden-id="dropdowns.combobox.trigger"]:hover {
  background-color: #131820 !important;
  border-color: #2a3340 !important;
}
[data-garden-id="dropdowns.combobox.trigger"]:focus,
[data-garden-id="dropdowns.combobox.trigger"]:focus-visible,
[data-garden-id="dropdowns.combobox.trigger"][aria-expanded="true"] {
  background-color: #131820 !important;
  border-color: rgba(37, 150, 190, 1) !important;
  box-shadow: 0 0 0 3px rgba(8, 145, 178, 0.15) !important;
  outline: none !important;
}

/* Wrapper general */
[data-garden-id="dropdowns.combobox"],
[data-garden-id="dropdowns.combobox.container"],
[data-garden-id="dropdowns.combobox.input_group"] {
  background-color: transparent !important;
  background: transparent !important;
  color: #e6edf3 !important;
  border: none !important;
}

/* Texto del valor seleccionado (lo que se ve dentro del dropdown) */
[data-garden-id="dropdowns.combobox.value"] {
  color: #e6edf3 !important;
  background: transparent !important;
}
[data-garden-id="dropdowns.combobox.value"]:empty::before {
  content: attr(data-placeholder);
  color: #6b7280;
}

/* Input interno (oculto pero por si se hace visible al filtrar) */
[data-garden-id="dropdowns.combobox.input"] {
  background-color: transparent !important;
  background: transparent !important;
  color: #e6edf3 !important;
  border: none !important;
}

/* Icono chevron */
[data-garden-id="dropdowns.combobox.input_icon"] {
  color: #8b95a3 !important;
  fill: #8b95a3 !important;
}
[data-garden-id="dropdowns.combobox.input_icon"] path {
  fill: #8b95a3 !important;
}

/* Listbox flotante (el menú que se abre al hacer click) */
[data-garden-id="dropdowns.combobox.floating"] {
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
  overflow: hidden !important;
}

[data-garden-id="dropdowns.combobox.listbox"] {
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
  padding: 4px 0 !important;
}

/* Opciones individuales del listbox */
[data-garden-id="dropdowns.combobox.listbox"] li,
[data-garden-id="dropdowns.combobox.listbox"] [role="option"],
[data-garden-id^="dropdowns.combobox.option"] {
  background-color: transparent !important;
  color: #e6edf3 !important;
  padding: 10px 16px !important;
  cursor: pointer !important;
}
[data-garden-id="dropdowns.combobox.listbox"] li:hover,
[data-garden-id="dropdowns.combobox.listbox"] [role="option"]:hover,
[data-garden-id^="dropdowns.combobox.option"]:hover {
  background-color: rgba(8, 145, 178, 0.18) !important;
  color: #ffffff !important;
}
[data-garden-id="dropdowns.combobox.listbox"] li[aria-selected="true"],
[data-garden-id="dropdowns.combobox.listbox"] [role="option"][aria-selected="true"],
[data-garden-id^="dropdowns.combobox.option"][aria-selected="true"] {
  background-color: rgba(8, 145, 178, 0.25) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* ============================================================
   Catch-all para CUALQUIER componente Garden de tipo dropdown/select/input
   ============================================================ */
[data-garden-id^="dropdowns."]:not([data-garden-id*="icon"]):not([data-garden-id*="value"]):not([data-garden-id*="container"]):not([data-garden-id*="input_group"]) {
  color: #e6edf3 !important;
}

[data-garden-id*=".trigger"],
[data-garden-id*=".select"],
[data-garden-id*=".input"]:not([data-garden-id*="icon"]):not([data-garden-id*="label"]):not([data-garden-id*="hint"]):not([data-garden-id*="group"]):not([data-garden-id*="container"]) {
  background-color: #131820 !important;
}

/* ============================================================
   Descripciones de campos: 40% más cercanas al blanco
   (con html body para máxima especificidad)
   ============================================================ */
html body .form-field p,
html body .form-field .description,
html body .form-field small,
html body .form-field .form-field-description,
html body .form-field [class*="description"],
html body .form-field span.description,
html body .request-form .form-field p,
html body .request-form p.description,
html body form .form-field p,
html body .hbs-form .form-field p,
html body div.form-field > p,
html body div.form-field > .description {
  color: #f0f3f5 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  opacity: 1 !important;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}

/* ==========================================================================
   SUL DARK THEME — Round 7: Garden listbox flotante + labels/hints Garden
   ========================================================================== */

/* ============================================================
   LABELS de cualquier componente Garden (no solo combobox)
   ============================================================ */
html body [data-garden-id$=".label"],
html body [data-garden-container-id$=".label"],
html body label[data-garden-id*="label"] {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 17px !important;
  margin-bottom: 8px !important;
  display: block !important;
}

/* Asterisco rojo dentro del label Garden */
html body [data-garden-id*="label"] [data-garden-id="typography.font"] {
  color: #ef4444 !important;
}

/* ============================================================
   HINTS/descripciones de Garden (texto debajo del label)
   ============================================================ */
html body [data-garden-id$=".hint"],
html body [data-garden-container-id$=".hint"],
html body [data-garden-id*="combobox.hint"],
html body [data-garden-id*="select.hint"],
html body div[data-garden-id*="hint"] {
  color: #f0f3f5 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  margin-bottom: 10px !important;
  margin-top: 0 !important;
  opacity: 1 !important;
}

/* ============================================================
   LISTBOX FLOTANTE — el menú blanco que se abre con las opciones
   Especificidad nuclear: html body + selector de elemento + atributo
   ============================================================ */
html body div[data-garden-id="dropdowns.combobox.floating"],
html body ul[data-garden-id="dropdowns.combobox.listbox"],
html body div[data-garden-id="dropdowns.combobox.floating"] > ul,
html body div[data-garden-id="dropdowns.combobox.floating"] [role="listbox"],
html body [data-garden-container-id="containers.combobox.listbox"],
html body [role="listbox"][data-garden-id*="combobox"] {
  background: #131820 !important;
  background-color: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
  padding: 4px 0 !important;
  overflow: hidden !important;
  margin-top: 4px !important;
}

/* ============================================================
   ITEMS (li) del listbox — las opciones individuales
   ============================================================ */
html body div[data-garden-id="dropdowns.combobox.floating"] li,
html body ul[data-garden-id="dropdowns.combobox.listbox"] li,
html body ul[data-garden-id="dropdowns.combobox.listbox"] > li,
html body [data-garden-container-id="containers.combobox.listbox"] li,
html body [data-garden-id^="dropdowns.combobox.option"],
html body [data-garden-id^="dropdowns.menu.item"],
html body div[data-garden-id="dropdowns.combobox.floating"] [role="option"],
html body ul[role="listbox"] > li,
html body [role="listbox"] [role="option"] {
  background: transparent !important;
  background-color: transparent !important;
  color: #e6edf3 !important;
  padding: 12px 16px !important;
  cursor: pointer !important;
  border: none !important;
  list-style: none !important;
}

/* Hover de opciones */
html body div[data-garden-id="dropdowns.combobox.floating"] li:hover,
html body ul[data-garden-id="dropdowns.combobox.listbox"] li:hover,
html body [role="listbox"] [role="option"]:hover,
html body ul[role="listbox"] > li:hover,
html body [data-garden-id^="dropdowns.combobox.option"]:hover {
  background: rgba(8, 145, 178, 0.20) !important;
  background-color: rgba(8, 145, 178, 0.20) !important;
  color: #ffffff !important;
}

/* Opción con cursor activo (teclado) */
html body div[data-garden-id="dropdowns.combobox.floating"] li[aria-current="true"],
html body ul[data-garden-id="dropdowns.combobox.listbox"] li[aria-current="true"],
html body [role="listbox"] [role="option"][aria-current="true"],
html body [role="listbox"] li[aria-current="true"] {
  background: rgba(8, 145, 178, 0.25) !important;
  background-color: rgba(8, 145, 178, 0.25) !important;
  color: #ffffff !important;
}

/* Opción seleccionada */
html body div[data-garden-id="dropdowns.combobox.floating"] li[aria-selected="true"],
html body ul[data-garden-id="dropdowns.combobox.listbox"] li[aria-selected="true"],
html body [role="listbox"] [role="option"][aria-selected="true"],
html body [role="listbox"] li[aria-selected="true"] {
  background: rgba(8, 145, 178, 0.30) !important;
  background-color: rgba(8, 145, 178, 0.30) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* ============================================================
   Catch-all final: cualquier child del floating debe ser oscuro
   ============================================================ */
html body div[data-garden-id="dropdowns.combobox.floating"] *:not(svg):not(path) {
  background-color: transparent !important;
}
html body div[data-garden-id="dropdowns.combobox.floating"] {
  background-color: #131820 !important;
}

/* ==========================================================================
   SUL DARK THEME — Round 8: dimensiones exactas del login + asterisco teal
   ========================================================================== */

/* ============================================================
   1. Eliminar cualquier fondo/sombra detrás de labels y hints
   ============================================================ */
html body [data-garden-id$=".label"],
html body [data-garden-id$=".hint"],
html body [data-garden-id$=".field"],
html body [data-garden-container-id$=".label"],
html body [data-garden-container-id$=".hint"],
html body [data-garden-container-id$=".field"],
html body label[data-garden-id*="label"],
html body div[data-garden-id*="hint"],
html body div[data-garden-id$=".field"] {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* ============================================================
   2. Altura de inputs = 43px (igual al login Sul)
   ============================================================ */
html body input[type="text"],
html body input[type="email"],
html body input[type="password"],
html body input[type="number"],
html body input[type="tel"],
html body input[type="url"],
html body input[type="date"],
html body input[type="datetime-local"],
html body input[type="time"],
html body .form-field input[type="text"],
html body .form-field input[type="email"],
html body .request-form input[type="text"],
html body .request-form input[type="email"] {
  height: 43px !important;
  min-height: 43px !important;
  max-height: 43px !important;
  padding: 8px 14px !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  border-radius: 8px !important;
}

/* Combobox Garden — misma altura */
html body [data-garden-id="dropdowns.combobox.trigger"] {
  height: 43px !important;
  min-height: 43px !important;
  max-height: 43px !important;
  padding: 8px 40px 8px 14px !important;
  font-size: 14px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
}

/* Selects nativos */
html body select {
  height: 43px !important;
  min-height: 43px !important;
  max-height: 43px !important;
  padding: 8px 40px 8px 14px !important;
  font-size: 14px !important;
  border-radius: 8px !important;
}

/* Textareas mantienen tamaño mayor (multilinea) */
html body textarea {
  height: auto !important;
  min-height: 100px !important;
  max-height: none !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  border-radius: 8px !important;
  line-height: 1.5 !important;
}

/* ============================================================
   3. Asteriscos requeridos: color TEAL del brand (botón Enviar)
   ============================================================ */
html body [data-garden-id*="label"] [data-garden-id="typography.font"],
html body label [data-garden-id="typography.font"],
html body [data-garden-id*=".label"] span[aria-hidden="true"],
html body label .required,
html body .form-field label .required,
html body .form-field .required,
html body span.required,
html body strong.required,
html body .required,
html body .required-fields-asterisk,
html body p span.required,
html body p strong {
  color: rgba(37, 150, 190, 1) !important;
  font-weight: 600 !important;
}

/* ============================================================
   4. Border-radius más pequeño para coincidir con el login
   (el login usa rounded-md = 6px aprox)
   ============================================================ */
html body input,
html body textarea,
html body select,
html body [data-garden-id="dropdowns.combobox.trigger"] {
  border-radius: 8px !important;
}

/* El listbox flotante puede mantener border-radius mayor */
html body div[data-garden-id="dropdowns.combobox.floating"],
html body ul[data-garden-id="dropdowns.combobox.listbox"] {
  border-radius: 8px !important;
}

/* ==========================================================================
   SUL DARK THEME — Round 9: forms.input_label, forms.input_hint, layout combobox
   ========================================================================== */

/* ============================================================
   1. Quitar background/borde/sombra de TODOS los labels y hints
      (con *= para agarrar tanto .label como _label, .hint como _hint)
   ============================================================ */
html body [data-garden-id*="label"],
html body [data-garden-id*="hint"],
html body [data-garden-container-id*="label"],
html body [data-garden-container-id*="hint"],
html body label[data-garden-id*="label"],
html body div[data-garden-id*="hint"],
html body [data-garden-id="forms.input_label"],
html body [data-garden-id="forms.input_hint"],
html body [data-garden-id="forms.field"],
html body [data-garden-container-id="containers.field.label"],
html body [data-garden-container-id="containers.field.hint"] {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
}

/* ============================================================
   2. Estilos uniformes para labels Garden (forms.input_label + dropdowns.*.label)
   ============================================================ */
html body [data-garden-id="forms.input_label"],
html body [data-garden-id*="input_label"],
html body [data-garden-id$=".label"],
html body label[data-garden-id*="label"] {
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 17px !important;
  margin-bottom: 8px !important;
  display: block !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* ============================================================
   3. Estilos uniformes para hints Garden (forms.input_hint + dropdowns.*.hint)
   ============================================================ */
html body [data-garden-id="forms.input_hint"],
html body [data-garden-id*="input_hint"],
html body [data-garden-id$=".hint"],
html body div[data-garden-id*="hint"] {
  color: #f0f3f5 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  margin-bottom: 10px !important;
  margin-top: 0 !important;
  opacity: 1 !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* ============================================================
   4. Asteriscos teal para forms.input_label también
   ============================================================ */
html body [data-garden-id="forms.input_label"] [data-garden-id="typography.font"],
html body [data-garden-id*="input_label"] [data-garden-id="typography.font"],
html body [data-garden-id*="input_label"] span[aria-hidden="true"],
html body [data-garden-id="forms.input_label"] span {
  color: rgba(37, 150, 190, 1) !important;
  font-weight: 600 !important;
  background: transparent !important;
}

/* ============================================================
   5. LAYOUT del combobox trigger — chevron a la derecha
   ============================================================ */
html body [data-garden-id="dropdowns.combobox.trigger"] {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-direction: row !important;
  position: relative !important;
  height: 43px !important;
  min-height: 43px !important;
  max-height: 43px !important;
  padding: 8px 14px !important;
  font-size: 14px !important;
  border-radius: 8px !important;
  background-color: #131820 !important;
  background: #131820 !important;
  color: #e6edf3 !important;
  border: 1px solid #1f2937 !important;
  box-shadow: none !important;
  overflow: hidden !important;
}

/* Container interno: flex con space-between */
html body [data-garden-id="dropdowns.combobox.container"] {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Input group: ocupa espacio disponible a la izquierda */
html body [data-garden-id="dropdowns.combobox.input_group"] {
  display: flex !important;
  align-items: center !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Value: el texto del valor seleccionado */
html body [data-garden-id="dropdowns.combobox.value"] {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #e6edf3 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Chevron icon: pegado a la derecha con margen pequeño */
html body [data-garden-id="dropdowns.combobox.input_icon"] {
  flex: 0 0 auto !important;
  margin-left: 12px !important;
  margin-right: 0 !important;
  width: 16px !important;
  height: 16px !important;
  color: #8b95a3 !important;
  fill: #8b95a3 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* ============================================================
   6. Eliminar cualquier elemento decorativo (sombras, bordes, pseudo)
      en el lado derecho del trigger
   ============================================================ */
html body [data-garden-id="dropdowns.combobox.trigger"] *:not(svg):not(path) {
  border-right: none !important;
  border-left: none !important;
  box-shadow: none !important;
}

html body [data-garden-id="dropdowns.combobox.trigger"]::before,
html body [data-garden-id="dropdowns.combobox.trigger"]::after,
html body [data-garden-id="dropdowns.combobox.container"]::before,
html body [data-garden-id="dropdowns.combobox.container"]::after,
html body [data-garden-id="dropdowns.combobox.input_group"]::before,
html body [data-garden-id="dropdowns.combobox.input_group"]::after {
  display: none !important;
  content: none !important;
  border: none !important;
  background: transparent !important;
}

/* ==========================================================================
   SUL DARK THEME — Round 10: matar definitivamente el background fantasma
   detrás de labels y hints.

   Causa raíz: la regla `[data-garden-id*=".input"]:not(...)` estaba
   aplicando background #131820 a forms.input_label y forms.input_hint
   (porque ambos contienen ".input" en su data-garden-id).
   
   Solución: chained attribute selectors con html body como prefijo para
   ganar la guerra de especificidad (0,0,3,2) > catch-all (0,0,2,0).
   ========================================================================== */

html body [data-garden-id="forms.input_label"][data-garden-id],
html body [data-garden-id="forms.input_hint"][data-garden-id],
html body [data-garden-id="dropdowns.combobox.label"][data-garden-id],
html body [data-garden-id="dropdowns.combobox.hint"][data-garden-id],
html body [data-garden-id*="input_label"][data-garden-id*="input_label"],
html body [data-garden-id*="input_hint"][data-garden-id*="input_hint"],
html body [data-garden-id*=".label"][data-garden-id*=".label"],
html body [data-garden-id*=".hint"][data-garden-id*=".hint"],
html body [data-garden-id*="label"][data-garden-container-id],
html body [data-garden-id*="hint"][data-garden-container-id],
html body label[data-garden-id*="label"][id],
html body label[data-garden-id][for],
html body div[data-garden-id*="hint"][id],
html body [data-garden-container-id="containers.field.label"][data-garden-container-id],
html body [data-garden-container-id="containers.field.hint"][data-garden-container-id] {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
}

/* También matar background en el wrapper del field por si Garden lo aplica ahí */
html body [data-garden-id="forms.field"][data-garden-id],
html body [data-garden-id="dropdowns.combobox.field"][data-garden-id],
html body [data-garden-id*="field"]:not([data-garden-id*="input_"]):not([data-garden-id*="combobox.input"]):not([data-garden-id*="trigger"]):not([data-garden-id*="textarea"]) {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* ==========================================================================
   SUL DARK THEME — Round 11: nuclear final para labels/hints
   Usando TODOS los atributos disponibles para especificidad máxima
   (0,0,5,3) — imposible de pisar.
   ========================================================================== */

html body label[data-garden-id*="label"][data-garden-container-id*="label"][id][for],
html body label[data-garden-id="forms.input_label"][data-garden-container-id="containers.field.label"][id][for],
html body div[data-garden-id*="hint"][data-garden-container-id*="hint"][id],
html body div[data-garden-id="forms.input_hint"][data-garden-container-id="containers.field.hint"][id],
html body label[data-garden-id*="combobox.label"][data-garden-container-id*="label"][id],
html body div[data-garden-id*="combobox.hint"][data-garden-container-id*="hint"][id],
html body [data-garden-id*="label"][data-garden-version],
html body [data-garden-id*="hint"][data-garden-version] {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
}

/* Por si Garden inserta algún wrapper con bg, también lo nukeamos */
html body [data-garden-id*="label"][data-garden-version]::before,
html body [data-garden-id*="label"][data-garden-version]::after,
html body [data-garden-id*="hint"][data-garden-version]::before,
html body [data-garden-id*="hint"][data-garden-version]::after {
  background: transparent !important;
  background-color: transparent !important;
  display: none !important;
  content: none !important;
}


/* ==========================================================================
   SUL DARK THEME — Round 13: Hero del formulario "Levantar un incidente"
   con el mismo estilo visual que la pantalla de "Validación de Correo
   Electrónico en Proceso" (borde superior teal + sombra fuerte).
   
   El hero del formulario está hardcoded con inline styles en
   new_request_page.hbs, así que apuntamos al div con un selector de
   atributo y sobreescribimos solo las propiedades visuales que importan.
   ========================================================================== */

/* Caja contenedora del hero ("Sigue estos pasos para una atención rápida:") */
.container > div[style*="background-color: #1a1a1a"],
.container > div[style*="background-color:#1a1a1a"] {
  background-color: #161616 !important;
  border: 1px solid #494b4c !important;
  border-top: 4px solid #0099ab !important;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.6) !important;
  border-radius: 12px !important;
}

/* Ajuste del padding del hero para que respire mejor (igual al del card de validación) */
.container > div[style*="background-color: #1a1a1a"],
.container > div[style*="background-color:#1a1a1a"] {
  padding: 40px 50px !important;
}

/* En móvil, el padding generoso se reduce */
@media (max-width: 768px) {
  .container > div[style*="background-color: #1a1a1a"],
  .container > div[style*="background-color:#1a1a1a"] {
    padding: 30px 20px !important;
  }
}

/* ==========================================================================
   SUL DARK THEME — Round 14: Reforzar el ocultamiento del chat widget
   El chat de Zendesk usa varios títulos posibles según idioma/versión
   (Web Widget Classic vs Messenger). Cubrimos todos los selectores.
   ========================================================================== */

/* Iframes del chat — todos los títulos posibles en ES e EN */
iframe[title*="messaging" i],
iframe[title*="mensajería" i],
iframe[title*="Mensajería" i],
iframe[title*="ventana de mensajería" i],
iframe[title*="window of messaging" i],
iframe[title*="messenger" i],
iframe[title*="chat" i],
iframe[title*="abrir la ventana" i],
iframe[title*="launch messaging" i],
iframe[title*="open the messaging" i],
iframe[name="Messaging window"],
iframe[name="messenger"],
iframe[name="JsdIframe"],
iframe[id*="webWidget" i],
iframe[id*="launcher" i],
iframe[id*="messenger" i],
iframe[src*="zopim"],
iframe[src*="zendesk.com/embeddable"],
iframe[src*="static.zdassets.com"],
iframe[data-product*="web_widget"],

/* Web Widget Classic (legacy) */
#webWidget,
div#webWidget,
iframe#webWidget,
[id^="webWidget"],
.zEWidget-launcher,
.zEWidget-webWidget,

/* Messenger button (data-testid) */
button[data-testid="launcher"],
div[data-testid="launcher"],
button[data-testid*="launcher"],
div[data-testid*="launcher"],
[data-testid="messenger"],
[data-testid="messaging-button"],

/* Otros wrappers comunes */
#launcher,
div[id^="launcher"],
.zopim,
#zopim,
[class*="zopim-launcher"],

/* Contenedor del messenger (a veces un div absoluto en body) */
body > iframe[style*="position: fixed"][style*="bottom"],
body > div[style*="position: fixed"][style*="bottom"][style*="right"]:has(iframe),
body > div[id*="messenger"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  max-width: 0 !important;
  max-height: 0 !important;
  z-index: -9999 !important;
  position: absolute !important;
  left: -99999px !important;
}

/* ==========================================================================
   SUL HEADER — Match validation page header (Round 15)
   Negro puro #0a0a0a, altura 80px, logo 32x32 con border-radius,
   texto "Sůl Finance" en BLANCO con tipografía system.
   ========================================================================== */

/* Reset y restyling del header principal */
html body .header,
html body header.header {
  background-color: #0a0a0a !important;
  border-bottom: 1px solid #1f2937 !important;
  height: 80px !important;
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  position: relative !important;
  box-sizing: border-box !important;
}

@media (min-width: 1160px) {
  html body .header,
  html body header.header {
    width: 100% !important;
    padding: 0 32px !important;
  }
}

/* Logo wrapper */
html body .header .logo {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
}

html body .header .logo a,
html body .header a.logo {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Logo image — 32x32 con border-radius, idéntico al header de Validación */
html body .header .logo img,
html body .header .logo a img {
  width: 32px !important;
  height: 32px !important;
  max-height: 32px !important;
  max-width: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  border-radius: 6px !important;
  object-fit: contain !important;
  vertical-align: middle !important;
  display: block !important;
  user-select: none !important;
}

/* Texto del brand — BLANCO, 16px, semibold, font system */
html body .header .logo span,
html body .header .logo a span,
html body .header a.logo span {
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: -0.025em !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji' !important;
  line-height: 1 !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* User-nav (avatar del usuario logueado, si existe) — alineado a la derecha */
html body .header .user-info,
html body .header .user-nav,
html body .header .nav-wrapper-desktop,
html body .header .nav-wrapper-mobile {
  flex-shrink: 0 !important;
}

html body .header .user-info > button,
html body .header #user > button {
  color: #ffffff !important;
  font-size: 14px !important;
}

html body .header .user-info > button:hover,
html body .header #user > button:hover {
  color: #ffffff !important;
  background-color: transparent !important;
  text-decoration: underline !important;
}

/* En mobile, el header sigue siendo 80px de alto */
@media (max-width: 767px) {
  html body .header,
  html body header.header {
    padding: 0 20px !important;
  }
}