@charset "UTF-8";
/***** 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: #FAFAF8;
  color: #1A1E23;
  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;
}

h1 {
  font-size: 32px;
}

h2 {
  font-size: 22px;
}

h3 {
  font-size: 18px;
  font-weight: 600;
}

h4 {
  font-size: 16px;
}

a {
  color: #147A62;
  text-decoration: none;
}
a:visited {
  color: #147A62;
}
a:hover, a:active, a:focus {
  text-decoration: underline;
}

.hbs-form input,
.hbs-form textarea, .search input,
.search textarea {
  color: #000;
  font-size: 14px;
}
.hbs-form input, .search input {
  max-width: 100%;
  box-sizing: border-box;
  transition: border 0.12s ease-in-out;
  /* We use the :where selector to not increase the specificity of the selector */
}
.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 #3ED3B0;
}
.hbs-form input[disabled], .search input[disabled] {
  background-color: #ddd;
}
.hbs-form select, .search select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23CCC' d='M0 0h10L5 6 0 0z'/%3E%3C/svg%3E%0A") no-repeat #fff;
  background-position: right 10px center;
  border: 1px solid #848F99;
  border-radius: 4px;
  padding: 8px 30px 8px 10px;
  outline: none;
  color: #555;
  width: 100%;
}
.hbs-form select:focus, .search select:focus {
  border: 1px solid #3ED3B0;
}
.hbs-form select::-ms-expand, .search select::-ms-expand {
  display: none;
}
.hbs-form textarea, .search textarea {
  border: 1px solid #848F99;
  border-radius: 2px;
  resize: vertical;
  width: 100%;
  outline: none;
  padding: 10px;
}
.hbs-form textarea:focus, .search textarea:focus {
  border: 1px solid #3ED3B0;
}

.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 #ddd;
  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 #3ED3B0;
  border-radius: 4px;
  color: #3ED3B0;
  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: #3ED3B0;
}
.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: #3ED3B0;
  color: #0F1216;
  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: #208b72;
  border-color: #208b72;
}
.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: #3ED3B0;
  border: 0;
  border-radius: 4px;
  color: #0F1216;
  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: #0F1216;
}
.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: #208b72;
}
.button-large[disabled], .hbs-form input[type=submit][disabled] {
  background-color: #ddd;
}

.button-secondary {
  color: #45505e;
  border: 1px solid #848F99;
  background-color: transparent;
}
.button-secondary:visited {
  color: #45505e;
}
.button-secondary:hover, .button-secondary:focus, .button-secondary:active {
  color: #1A1E23;
  border: 1px solid #848F99;
  background-color: #f4f4ef;
}

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

.split-button button {
  background-color: #3ED3B0;
  border: 0;
  color: #0F1216;
  height: 32px;
  line-height: 16px;
  outline-color: #3ED3B0;
}

[dir=rtl] .split-button button:not(:only-child):first-child {
  border-left: 1px solid #0F1216;
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}
[dir=ltr] .split-button button:not(:only-child):first-child {
  border-right: 1px solid #0F1216;
  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: #45505e;
  font-size: 13px;
  text-align: left;
}
[dir=rtl] .table th,
[dir=rtl] .table th a {
  text-align: right;
}
.table tr {
  border-bottom: 1px solid #ddd;
  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 #848F99;
  border-radius: 4px;
  padding: 10px;
  width: 100%;
}
.form-field input:focus {
  border: 1px solid #3ED3B0;
}

.form-field input[type=text] {
  border: 1px solid #848F99;
  border-radius: 4px;
}
.form-field input[type=text]:focus {
  border: 1px solid #3ED3B0;
}

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

.form-field .nesty-input {
  border-radius: 4px;
  border: 1px solid #848F99;
  height: 40px;
  line-height: 40px;
  outline: none;
  vertical-align: middle;
}
.form-field .nesty-input:focus {
  border: 1px solid #3ED3B0;
  text-decoration: none;
}

.form-field .hc-multiselect-toggle {
  border: 1px solid #848F99;
}

.form-field .hc-multiselect-toggle:focus {
  outline: none;
  border: 1px solid #3ED3B0;
  text-decoration: none;
}

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

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

.form-field .optional {
  color: #45505e;
  margin-left: 4px;
}

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

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

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

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

/***** 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: #3ED3B0;
}

.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: #fff;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15), 0 4px 10px 0 rgba(0, 0, 0, 0.1);
  border: solid 1px #ddd;
  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: #147A62;
  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: #147A62;
  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: #f3f3f3;
}
.nav-wrapper-mobile .menu-list-mobile {
  position: absolute;
  background-color: #fff;
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.15);
  border-top: solid 1px #ddd;
  border-bottom: solid 1px #ddd;
  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 #ddd;
  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: #1A1E23;
  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: #f3f3f3;
  text-decoration: underline;
}
.nav-wrapper-mobile .menu-list-mobile-items a {
  display: block;
  padding: 8px 24px;
  width: 100%;
  height: 100%;
  color: #1A1E23;
}
.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: #f3f3f3;
}
.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: #68737D;
}
.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;
}

.ask-ai {
  align-items: center;
  background-color: #147A62;
  border: 1px solid #147A62;
  border-radius: 4px;
  color: #0F1216;
  display: inline-flex;
  font-size: 14px;
  font-weight: 600;
  gap: 6px;
  line-height: 1.4286;
  padding: 6px 14px;
}
.ask-ai:visited {
  color: #0F1216;
}
.ask-ai .ask-ai-icon {
  flex-shrink: 0;
}

.nav-wrapper-desktop .ask-ai {
  margin-inline-end: 16px;
  padding: 6px 14px;
}
.nav-wrapper-desktop .ask-ai, .nav-wrapper-desktop .ask-ai:visited {
  color: #0F1216;
}
.nav-wrapper-desktop .ask-ai:hover, .nav-wrapper-desktop .ask-ai:focus, .nav-wrapper-desktop .ask-ai:active {
  background-color: #0F1216;
  border-color: #0F1216;
  color: #0F1216;
  text-decoration: none;
}

.nav-wrapper-mobile .ask-ai {
  margin: 4px 24px;
  padding: 6px 14px;
  width: auto;
  height: auto;
}
.nav-wrapper-mobile .ask-ai, .nav-wrapper-mobile .ask-ai:visited {
  color: #0F1216;
}
.nav-wrapper-mobile .ask-ai:hover, .nav-wrapper-mobile .ask-ai:focus, .nav-wrapper-mobile .ask-ai:active {
  background-color: #0F1216;
  border-color: #0F1216;
  color: #0F1216;
  text-decoration: 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: #147A62;
  min-width: 0;
  padding: 0;
  white-space: nowrap;
}
.user-info > button:hover, .user-info > button:focus {
  color: #147A62;
  background-color: transparent;
}
.user-info > button::after {
  color: #147A62;
  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: #3ED3B0;
  border: 2px solid #fff;
  border-radius: 50%;
  bottom: -4px;
  background-color: #0F1216;
  font-size: 17px;
  height: 17px;
  line-height: 17px;
  position: absolute;
  right: -2px;
  text-align: center;
  width: 17px;
}

/***** Footer *****/
.footer {
  border-top: 1px solid #ddd;
  margin-top: 60px;
  padding: 30px 0;
}
.footer a {
  color: #45505e;
}
.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: #45505e;
  display: inline-block;
}

.powered-by-zendesk a,
.powered-by-zendesk a:visited {
  color: #45505e;
}

/***** Breadcrumbs *****/
.breadcrumbs {
  margin: 0 0 15px 0;
  padding: 0;
  display: flex;
}
@media (min-width: 768px) {
  .breadcrumbs {
    margin: 0;
  }
}
.breadcrumbs li {
  display: inline-block;
  color: #45505e;
  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: #147A62;
}

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

.search {
  border-color: #848F99;
  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: #3ED3B0;
}
.search input[type=search],
.search .clear-button {
  background-color: #fff;
  border-radius: 30px;
  border: none;
}
.search-full input[type=search], .search-full .clear-button {
  border-color: #fff;
}
.search input[type=search] {
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
  color: #666;
  flex: 1 1 auto;
  height: 40px;
  width: 100%;
}
.search input[type=search]:focus {
  color: #555;
}
.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 #fff inset;
}
.search .clear-button {
  align-items: center;
  box-sizing: border-box;
  color: #777;
  cursor: pointer;
  display: none;
  flex: none;
  justify-content: center;
  padding: 0 15px;
}
.search .clear-button:hover {
  background-color: #3ED3B0;
  color: #fff;
}
.search .clear-button:focus {
  outline: 0;
  box-shadow: 0 0 0 3px #3ED3B0;
}
.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: #3ED3B0;
}
[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: #3ED3B0;
}

[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: #3ED3B0;
}
[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: #3ED3B0;
}

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

/***** Hero component *****/
.hero {
  background-image: url(/hc/theming_assets/01KF12ZZ3BMC4JXNBXFKGAB0KK);
  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 *****/
/* Used in Homepage#categories and Community#topics */
.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 #3ED3B0;
  border-radius: 4px;
  box-sizing: border-box;
  color: #3ED3B0;
  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: #3ED3B0;
}
.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
  color: #0F1216;
  text-decoration: none;
}
.blocks-item-internal {
  background-color: transparent;
  border: 1px solid #ddd;
}
.blocks-item-internal .icon-lock {
  height: 15px;
  width: 15px;
  bottom: 5px;
  position: relative;
}
.blocks-item-internal a {
  color: #1A1E23;
}
.blocks-item-link {
  color: #3ED3B0;
  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 #3ED3B0;
  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%; /* Three columns on desktop */
  }
  [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 #ddd;
  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 #ddd;
  }
}

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

.community,
.activity {
  border-top: 1px solid #ddd;
  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 #ddd;
  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: #1A1E23;
  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: #147A62;
  text-decoration: underline;
}
.recent-activity-controls a:visited {
  color: #147A62;
}
.recent-activity-controls a:hover, .recent-activity-controls a:active, .recent-activity-controls a:focus {
  color: #0F1216;
}
.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: #3ED3B0;
  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%; /* Two columns for tablet and desktop. Leaving 5% separation between columns */
  }
}
.section-tree-title {
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 600;
}
.section-tree-title a {
  color: #1A1E23;
}
.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: #1A1E23;
}

.icon-star {
  color: #3ED3B0;
  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 #ddd;
  font-size: 16px;
  padding: 15px 0;
}
.section-list-item:first-child {
  border-top: 1px solid #ddd;
}
.section-list-item a {
  align-items: center;
  color: #1A1E23;
  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 {
  /*
  * The article grid is defined this way to optimize readability:
  * Sidebar | Content | Free space
  * 17%     | 66%     | 17%
  */
  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%; /* Take entire row */
  }
}
.article-title .icon-lock {
  position: relative;
  left: -5px;
  vertical-align: baseline;
}
.article [role=button] {
  flex-shrink: 0; /*Avoid collapsing elements in Safari (https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored)*/
  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: #147A62;
  text-decoration: underline;
}
.article-body a:visited {
  color: #147A62;
}
.article-body a:hover, .article-body a:active, .article-body a:focus {
  color: #0F1216;
}
.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: #efefe9;
}
.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: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.article-body pre {
  background: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.article-body blockquote {
  border-left: 1px solid #ddd;
  color: #45505e;
  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: #45505e;
}
.article-comment-count:hover {
  text-decoration: none;
}
.article-comment-count-icon {
  vertical-align: middle;
  color: #3ED3B0;
  width: 18px;
  height: 18px;
}
.article-sidebar {
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  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 #ddd;
  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 #ddd;
  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: #147A62;
  text-decoration: underline;
}
.article-more-questions a:visited {
  color: #147A62;
}
.article-more-questions a:hover, .article-more-questions a:active, .article-more-questions a:focus {
  color: #0F1216;
}
.article-return-to-top {
  border-top: 1px solid #848F99;
}
@media (min-width: 1024px) {
  .article-return-to-top {
    display: none;
  }
}
.article-return-to-top a {
  color: #1A1E23;
  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 *****/
/* Styles attachments inside posts, articles and comments */
.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: #1A1E23;
  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: #45505e;
}

/***** 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: #45505e;
}
.share a:hover {
  text-decoration: none;
  color: #3ED3B0;
}
.share a svg {
  height: 18px;
  width: 18px;
  display: block;
}

/***** Comments *****/
/* Styles comments inside articles, posts and requests */
.comment {
  border-bottom: 1px solid #ddd;
  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 #ddd;
  border-top: 1px solid #ddd;
  padding: 20px 0;
}
.comment-overview p {
  margin-top: 0;
}
.comment-callout {
  color: #45505e;
  display: inline-block;
  font-size: 13px;
  margin-bottom: 0;
}
.comment-callout a {
  color: #147A62;
  text-decoration: underline;
}
.comment-callout a:visited {
  color: #147A62;
}
.comment-callout a:hover, .comment-callout a:active, .comment-callout a:focus {
  color: #0F1216;
}
.comment-sorter {
  display: inline-block;
  float: right;
}
.comment-sorter .dropdown-toggle {
  color: #45505e;
  font-size: 13px;
}
[dir=rtl] .comment-sorter {
  float: left;
}
.comment-wrapper {
  display: flex;
  position: relative;
}
.comment-wrapper.comment-official {
  border: 1px solid #3ED3B0;
  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: #3ED3B0;
}
.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: #147A62;
  text-decoration: underline;
}
.comment-body a:visited {
  color: #147A62;
}
.comment-body a:hover, .comment-body a:active, .comment-body a:focus {
  color: #0F1216;
}
.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: #efefe9;
}
.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: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.comment-body pre {
  background: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.comment-body blockquote {
  border-left: 1px solid #ddd;
  color: #45505e;
  font-style: italic;
  padding: 0 15px;
}
.comment-mark-as-solved {
  display: inline-block;
}

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

.vote-sum {
  color: #45505e;
  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: #3ED3B0;
}

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

.vote-voted {
  color: #3ED3B0;
}

.vote-voted:hover {
  color: #208b72;
}

/***** Actions *****/
/* Styles admin and en user actions(edit, delete, change status) in comments and posts */
.actions {
  text-align: center;
  flex-shrink: 0; /*Avoid collapsing elements in Safari*/
}
.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/01KF12ZZFARBTAKYJAXT2YM11Z);
  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;
  }
}

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

/* Community topic page */
.topic-header {
  border-bottom: 1px solid #ddd;
  font-size: 13px;
}
@media (min-width: 768px) {
  .topic-header {
    padding-bottom: 10px;
  }
}
.topic-header .dropdown {
  display: block;
  border-top: 1px solid #ddd;
  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;
}

/* Topic, post and user follow button */
.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: #3ED3B0;
}
.community-follow button:hover::after, .community-follow button:focus::after {
  border-color: #0F1216;
  color: #0F1216;
}
.community-follow button[data-selected=true] {
  background-color: #3ED3B0;
  color: #0F1216;
}
.community-follow button[data-selected=true]::after {
  border-left: 1px solid #0F1216;
  color: #0F1216;
}
.community-follow button[data-selected=true]:hover {
  background-color: #208b72;
  border-color: #208b72;
}
.community-follow button::after {
  border-left: 1px solid #3ED3B0;
  content: attr(data-follower-count);
  color: #3ED3B0;
  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 #3ED3B0;
  margin: 0 10px 0 0;
  padding: 0 10px 0 0;
}

/***** Striped list *****/
/* Used in community posts list and requests list */
.striped-list {
  padding: 0;
}
.striped-list-item {
  align-items: flex-start;
  border-bottom: 1px solid #ddd;
  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: #147A62;
  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: #147A62;
}
.striped-list .meta-group {
  margin: 5px 0;
}
.striped-list-count {
  color: #45505e;
  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: #1A1E23;
    display: block;
  }
}

/***** Status labels *****/
/* Styles labels used in posts, articles and requests */
.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: #3ED3B0;
}
.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: #e9ebed;
  color: #45505e;
}
.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 *****/
/*
* The post grid is defined this way:
* Content | Sidebar
* 70%     | 30%
*/
.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: #147A62;
  text-decoration: underline;
}
.post-body a:visited {
  color: #147A62;
}
.post-body a:hover, .post-body a:active, .post-body a:focus {
  color: #0F1216;
}
.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: #efefe9;
}
.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: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.post-body pre {
  background: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.post-body blockquote {
  border-left: 1px solid #ddd;
  color: #45505e;
  font-style: italic;
  padding: 0 15px;
}
.post-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}
.post-comment-count {
  color: #45505e;
}
.post-comment-count:hover {
  text-decoration: none;
}
.post-comment-count .icon-comments {
  color: #3ED3B0;
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 5px;
  vertical-align: middle;
}
.post-sidebar {
  border-top: 1px solid #ddd;
  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 *****/
/* Styles labels used next to the authors of article comments, community posts, and community comments */
.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;
}

/* Navigation element that collapses on mobile */
.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 #ddd;
  border-top: 1px solid #ddd;
}
@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 #3ED3B0;
}

.collapsible-nav-list {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .collapsible-nav-list {
    flex-direction: row;
  }
}
.collapsible-nav-list li {
  color: #1A1E23;
  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: #1A1E23;
  display: block;
}
@media (min-width: 768px) {
  .collapsible-nav-list li:hover {
    border-bottom: 4px solid #ddd;
  }
  .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 #3ED3B0;
    order: 1;
  }
}
.collapsible-nav-list li[aria-selected=true] a,
.collapsible-nav-list li.current a {
  color: #1A1E23;
}

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

/* Sidebar navigation that collapses on mobile */
.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 #3ED3B0;
}
.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: #efefe9;
  margin-bottom: 20px;
}
.my-activities-sub-nav {
  margin-bottom: 30px;
}
.my-activities-table .striped-list-title { /* My activities tables */
  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;
}

/* Following table */
@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 */
.contributions-table td:last-child {
  color: #45505e;
  font-size: 13px;
}
@media (min-width: 768px) {
  .contributions-table td:last-child {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
  }
}

.no-activities {
  color: #45505e;
}

/***** 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;
  max-width: 100%;
  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 #ddd;
  color: #45505e;
  text-align: inherit;
  padding: 8px 25px;
  width: 100%;
}
.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 #3ED3B0;
}
.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 #3ED3B0;
}
.request-main input#mark_as_solved {
  display: none;
}
.request-title {
  width: 100%;
}
@media (min-width: 1024px) {
  .request-title {
    border-bottom: 1px solid #ddd;
    margin-bottom: 0;
    max-width: 66%;
    padding-bottom: 20px;
  }
}
.request-sidebar {
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  flex: 1 0 auto;
  order: 0;
}
@media (min-width: 1024px) {
  .request-sidebar {
    background-color: #f4f4ef;
    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 #ddd;
  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: #45505e;
  width: 40%;
  overflow-wrap: break-word;
}
.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: #45505e;
  font-size: 13px;
}
.meta-data:not(:last-child)::after {
  content: "·";
  margin: 0 5px;
}

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

.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: #45505e;
  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 #ddd;
  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 #ddd;
}
@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 #3ED3B0;
  border-radius: 4px;
  color: #3ED3B0;
  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: #efefe9;
  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: #45505e;
  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 #eee;
  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 #ddd;
  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: #45505e;
  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 #eee;
}
@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 #eee;
}

.profile-contribution-icon {
  left: 0;
  position: absolute;
  color: #ccc;
  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: #999;
}

.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 #ddd;
  }
  [dir=rtl] .profile-activity:not(:last-child) {
    border-left: 0;
    border-right: 1px solid #ddd;
  }
}

.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: #f4f4ef;
}
@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: #FAFAF8;
  background-position: 50% 50%;
  text-align: center;
  color: #ccc;
}
[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 #ddd;
  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: #1A1E23;
}
.search-results-sidebar .sidenav-item:hover, .search-results-sidebar .sidenav-item.current {
  background-color: #e9ebed;
  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: #E9EBED;
  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: #49545C;
  flex-grow: 0;
  vertical-align: middle;
  display: inline-block;
}
.search-results-sidebar .sidenav-tag .content-tag .close-icon {
  color: #555555;
  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: #666;
}
.search-results-sidebar .see-all-filters {
  background: none;
  border: none;
  cursor: pointer;
  display: block;
  padding: 10px;
  color: #147A62;
}
.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 #ddd;
}
.search-results .no-results {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 4rem;
}
.search-results .no-results .headline {
  color: #2F3941;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
  letter-spacing: -0.45px;
}
.search-results .no-results .action-prompt {
  color: #68737D;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.154px;
}
.search-results .no-results .action-prompt a {
  color: #147A62;
}
.search-results .no-results .action-prompt a:visited {
  color: #147A62;
}

.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: #45505e;
  font-size: 13px;
}
.search-result-votes-icon, .search-result-meta-count-icon {
  color: #3ED3B0;
  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: #666;
  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;
}

/* By default use bold instead of italic to highlight */
.search-results-description em {
  font-style: normal;
  font-weight: bold;
}

/* Add a yellow background for Chinese */
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: #555;
}

.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;
}

/* Error */
.notification-error {
  background: #ffeded;
  border-color: #f7cbcb;
}

.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");
}

/* Notice */
.notification-notice {
  background: #dbf3ff;
  border-color: #b5e0f5;
}

.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");
}

/* Alert / Lock */
.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;
}

/* Dismiss button */
.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;
}

/* Inline notifications */
.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;
}

.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: #fff;
  border: 1px solid #d8dcde;
  border-radius: 3px;
  box-shadow: 0px 20px 30px 0px rgba(23, 73, 77, 0.15);
  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 #e9ebed;
  margin: 4px 0;
}
.dropdown-menu [role=menuitem],
.dropdown-menu [role=menuitemradio] {
  color: #2f3941;
  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(31, 115, 183, 0.08);
  text-decoration: none;
  color: #2f3941;
}
.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 > p {
  color: #68737D;
  margin-top: 32px;
  margin-bottom: 4px;
}
.content-tags-add-hint {
  color: #68737D;
  font-size: 14px;
}

.content-tag-list {
  display: flex;
  flex-wrap: wrap;
  word-break: break-word;
}
.content-tag-list li {
  border-right: 1px solid #C2C8CC;
  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 #848F99;
}

/***** Upload Dropzone *****/
.upload-dropzone {
  border: 1px solid #848F99;
}

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

.service-catalog-hero {
  background-image: url(/hc/theming_assets/01KF13008HM3M7AXRHPBR0NZKF);
  margin-bottom: 10px;
  height: 320px;
}
.service-catalog-description {
  display: flow-root;
}
.service-catalog-description a {
  color: #147A62;
  text-decoration: underline;
}
.service-catalog-description a:visited {
  color: #147A62;
}
.service-catalog-description a:hover, .service-catalog-description a:active, .service-catalog-description a:focus {
  color: #0F1216;
}
.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: #efefe9;
}
.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: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.service-catalog-description pre {
  background: #f4f4ef;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.service-catalog-description blockquote {
  border-left: 1px solid #ddd;
  color: #45505e;
  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;
}

.is-service-catalog-preview #navbar-container,
.is-service-catalog-preview .navbar-container,
.is-service-catalog-preview .assembly-bar,
.is-service-catalog-preview [data-garden-id="chrome.subnav"] {
  display: none !important;
}
/* ==================================================================
   SAUNDERS NETWORKS THEME LAYER
   Everything above this banner is the untouched Copenhagen 4.44.1
   build. Everything below restyles it to the Saunders Networks brand
   (brand pack v3, October 2026). Edit values here, not in the
   Copenhagen layer.
   Brand rules: Geist. Ink does most of the work.
   Mint is the only accent and is never used as text on light
   backgrounds. One soft corner (bottom-right) on buttons, cards,
   fields and images. No pills, no shadows. Headings in sentence case
   with no trailing full stops.
   ================================================================== */

:root {
  --sn-ink: #0A0A0A;
  --sn-mint: #9EE6B8;
  --sn-paper: #F4F4F2;
  --sn-white: #FFFFFF;
  --sn-carbon: #161618;
  --sn-line: #E2E2DE;
  --sn-grey: #6B6B6B;
  --sn-silver: #A3A3A3;
  --sn-ink-hover: #222224; /* hover states only */
  --sn-mint-hover: #B5EDC8; /* hover states only */
  /* Containers are content-box with 24px side padding */
  --sn-maxw: 1136px;
  /* The signature soft corner: bottom-right only, never all four */
  --sn-radius-sm: 0 0 8px 0;
  --sn-radius-md: 0 0 14px 0;
  --sn-radius-lg: 0 0 24px 0;
  --sn-radius-xl: 0 0 40px 0;
  --sn-font: "Geist", Arial, sans-serif;
  --sn-ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ---------- Base ---------- */
html {
  scroll-padding-top: 96px;
}

/* Anchors inherit their text colour. Zendesk's link_color would paint
   every anchor otherwise. Inline body links get a Ink underline */
a {
  color: inherit;
}

body {
  font-family: var(--sn-font);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--sn-ink);
  background: var(--sn-paper);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.article-title, .blocks-item-title, .search-results-subheading,
.collapsible-sidebar-title, .section-tree-title, .request-title {
  font-family: var(--sn-font);
  color: var(--sn-ink);
  font-weight: 600;
  letter-spacing: -0.025em;
}

h1 { line-height: 1.02; letter-spacing: -0.045em; }

input, textarea, select, button {
  font-family: var(--sn-font);
}

/* Focus (web kit v2): 3px Ink outline on light surfaces, Mint on
   Ink surfaces */
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 3px solid var(--sn-ink);
  outline-offset: 2px;
}

.header a:focus-visible, .header button:focus-visible,
.hero a:focus-visible, .hero button:focus-visible,
.footer a:focus-visible, .footer button:focus-visible {
  outline: 3px solid var(--sn-mint);
  outline-offset: 2px;
}

.container, .container-divider {
  box-sizing: content-box;
  max-width: var(--sn-maxw);
  width: auto;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
}

/* Copenhagen sets width 90% and padding 0 at this breakpoint; keep our grid */
@media (min-width: 1160px) {
  .container, .container-divider {
    width: auto;
    padding-left: 24px;
    padding-right: 24px;
  }
}

/* ---------- Header ---------- */
/* Ink bar, logo top-left, Mint primary action (buttons on Ink are
   Mint per the brand guidelines) */
.header {
  background: var(--sn-ink);
  border-bottom: 0;
  max-width: none;
  width: auto;
  margin: 0;
  padding: 0 max(24px, calc(50% - 568px));
  height: 80px;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 100;
}

/* Copenhagen anchors the expanded mobile menus to its old 71px header */
.user-nav[aria-expanded=true],
.nav-wrapper-mobile .menu-list-mobile {
  top: 80px;
}

@media (min-width: 1160px) {
  .header {
    width: auto;
    margin: 0;
    padding: 0 max(24px, calc(50% - 568px));
  }
}

.logo {
  display: flex;
  align-items: center;
}

.logo a {
  display: flex;
  align-items: center;
  gap: 14px;
  text-decoration: none;
}

/* Brand v3: Main logo 24px tall on desktop, 20px on mobile */
.logo img {
  display: block;
  height: 24px;
  width: auto;
  max-height: none;
}

.sn-logo-label {
  color: var(--sn-silver);
  font-size: 15px;
  font-weight: 500;
  padding-left: 14px;
  border-left: 1px solid var(--sn-grey);
  line-height: 24px;
  white-space: nowrap;
}

/* Main stays on mobile at 20px (still over the 140px minimum width);
   the label drops out to make room */
@media (max-width: 720px) {
  .logo img { height: 20px; }
}

@media (max-width: 560px) {
  .sn-logo-label { display: none; }
}

.user-nav-list {
  align-items: center;
  gap: 6px;
}

.nav-wrapper-desktop .user-nav a, .sn-back-link {
  font-size: 15px;
  font-weight: 500;
  color: var(--sn-white);
  padding: 10px 12px;
  border-radius: var(--sn-radius-md);
  transition: color 0.15s, background 0.15s, border-color 0.15s;
}

.nav-wrapper-desktop .user-nav a:hover, .sn-back-link:hover {
  color: var(--sn-mint);
  text-decoration: none;
}

/* Submit a request: the primary action, Mint on Ink */
.nav-wrapper-desktop .user-nav a.submit-a-request {
  background: var(--sn-mint);
  color: var(--sn-ink);
  border: 1px solid transparent;
  padding: 10px 20px;
  margin-left: 8px;
}

.nav-wrapper-desktop .user-nav a.submit-a-request:hover {
  background: var(--sn-mint-hover);
  color: var(--sn-ink);
}

/* Sign in: secondary on Ink (White text, Grey border) */
.nav-wrapper-desktop .user-nav a.sign-in {
  background: transparent;
  color: var(--sn-white);
  border: 1px solid var(--sn-white);
  padding: 10px 20px;
}

.nav-wrapper-desktop .user-nav a.sign-in:hover {
  background: var(--sn-white);
  border-color: var(--sn-white);
  color: var(--sn-ink);
  text-decoration: none;
}

.header .ask-ai,
.header .ask-ai:visited {
  color: var(--sn-white);
}

.header .ask-ai:hover {
  color: var(--sn-mint);
}

.user-info .dropdown-toggle {
  font-family: var(--sn-font);
  font-weight: 500;
  color: var(--sn-white);
}

.user-info .dropdown-toggle:hover,
.user-info .dropdown-toggle:focus {
  color: var(--sn-white);
}

.menu-button-mobile {
  color: var(--sn-white);
}

/* The mobile menu panel opens on a light surface, so its links stay Ink */
.menu-list-mobile {
  background: var(--sn-white);
  border-bottom: 1px solid var(--sn-line);
}

.menu-list-mobile a {
  color: var(--sn-ink);
}

/* ---------- Signed-in header chip ---------- */
.sn-avatar-chip {
  width: 36px;
  height: 36px;
  border-radius: var(--sn-radius-sm);
  background: transparent;
  border: 1px solid var(--sn-grey);
  color: var(--sn-white);
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 13px;
  flex: none;
}

.user-info .dropdown-toggle.sn-compact {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border-radius: var(--sn-radius-sm);
}

.user-info .dropdown-toggle.sn-compact .user-avatar {
  display: none;
}

/* Hide the name text but keep it for screen readers; the chevron svg has
   explicit width/height attributes so it survives the font-size 0 */
.user-info .dropdown-toggle.sn-compact > span:not(.sn-avatar-chip) {
  font-size: 0;
  display: inline-flex;
  align-items: center;
}

.user-info .dropdown-toggle.sn-compact > .sn-avatar-chip {
  font-size: 13px;
}

.user-info .dropdown-toggle.sn-compact .dropdown-chevron-icon {
  margin-left: 2px;
}

.menu-button-mobile.sn-compact .user-avatar {
  display: none;
}

.menu-button-mobile .sn-avatar-chip {
  width: 30px;
  height: 30px;
  font-size: 12px;
  margin-right: 8px;
}

/* ---------- Dropdown menus ---------- */
/* No shadows in the brand: a Line hairline separates the panel */
.dropdown-menu {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-md);
  box-shadow: none;
  padding: 8px;
  font-family: var(--sn-font);
  font-size: 15px;
  min-width: 220px;
}

.dropdown-menu [role=menuitem],
.dropdown-menu [role=menuitemradio] {
  border-radius: var(--sn-radius-sm);
  padding: 11px 14px;
  font-weight: 500;
  color: var(--sn-ink);
  transition: background 0.12s, color 0.12s;
}

.dropdown-menu [role=menuitem]:hover,
.dropdown-menu [role=menuitem]:focus,
.dropdown-menu [role=menuitemradio]:hover,
.dropdown-menu [role=menuitemradio]:focus {
  background: var(--sn-paper);
  color: var(--sn-ink);
  text-decoration: none;
}

.dropdown-menu .separator {
  border-top: 1px solid var(--sn-line);
  margin: 8px 4px;
}

/* ---------- Hero ---------- */
/* Every page opens on Ink, continuing the header. The !important beats
   Copenhagen's url(/hc/theming_assets/01KF12ZZ3BMC4JXNBXFKGAB0KK) hero photo */
.hero {
  background-color: var(--sn-ink);
  background-image: none !important;
  color: var(--sn-white);
  height: auto;
  min-height: 0;
  text-align: left;
  padding: clamp(48px, 6vw, 80px) 24px clamp(64px, 7vw, 96px);
  /* the hero carries Copenhagen's .section class, which adds margin-bottom */
  margin-bottom: 0;
}

.hero-inner {
  box-sizing: content-box;
  position: static;
  transform: none;
  max-width: var(--sn-maxw);
  margin: 0 auto;
}

.sn-eyebrow {
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  color: var(--sn-grey);
  margin-bottom: 16px;
}

.sn-eyebrow-dark,
.hero .sn-eyebrow {
  color: var(--sn-mint);
}

.hero h1, .hero h2, .hero .sn-hero-title,
.hero .article-title, .hero .request-title, .hero .sn-title-page {
  color: var(--sn-white);
}

.sn-hero-title {
  font-size: clamp(44px, 5.5vw, 72px);
  font-weight: 600;
  line-height: 0.98;
  letter-spacing: -0.05em;
  margin: 0;
  max-width: 18ch;
}

/* "help?" picks up the accent, like "Networks" in the logo */
.sn-hl {
  color: var(--sn-mint);
  white-space: nowrap;
}

.sn-hero-lede {
  font-size: 19px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--sn-silver);
  margin: 20px 0 0;
  max-width: 58ch;
}

.sn-hero-lede strong {
  color: var(--sn-white);
  font-weight: 500;
}

.hero .breadcrumbs,
.hero .breadcrumbs li,
.hero .breadcrumbs a {
  color: var(--sn-silver);
}

.hero .breadcrumbs a:hover {
  color: var(--sn-white);
}

.hero .breadcrumbs li:last-child {
  color: var(--sn-white);
  font-weight: 500;
}

.hero .sn-hero-author .article-meta a,
.hero .sn-hero-author .article-meta {
  color: var(--sn-white);
}

.hero .sn-hero-author .meta-data,
.hero .meta-data {
  color: var(--sn-silver);
}

/* Hero search: a white field with the soft corner */
.hero .search-icon {
  display: none;
}

.hero .search {
  margin-top: 36px;
  max-width: 680px;
}

/* Copenhagen puts the border on the form wrapper, not the input */
.search {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-md);
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hero .search {
  border-color: transparent;
}

.search:focus-within {
  border-color: var(--sn-ink);
  box-shadow: 0 0 0 1px var(--sn-ink);
}

.hero .search:focus-within {
  border-color: transparent;
  box-shadow: 0 0 0 3px var(--sn-mint);
}

/* The wrapper carries the visible focus ring; the inner input must not */
.search input[type=search]:focus,
.search input[type=search]:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

.search .clear-button {
  color: var(--sn-grey);
  border: none !important;
  outline: none !important;
}

.search .clear-button:hover {
  color: var(--sn-ink);
}

.search .clear-button:focus-visible {
  outline: 2px solid var(--sn-ink) !important;
  outline-offset: -4px;
  border-radius: 50%;
}

.hero .search input:where(:not([type=checkbox])),
.search-full input:where(:not([type=checkbox])) {
  border: none;
  border-radius: var(--sn-radius-md);
  background-color: transparent;
  color: var(--sn-ink);
  font-size: 17px;
  font-weight: 400;
  height: auto;
  padding: 18px 20px;
}

.hero .search input:where(:not([type=checkbox])):focus,
.search-full input:where(:not([type=checkbox])):focus {
  border: none;
  box-shadow: none;
  outline: none;
}

.hero .search input::placeholder {
  color: var(--sn-grey);
  font-weight: 400;
}

.sn-popular {
  margin-top: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.sn-popular-label {
  font-size: 14px;
  color: var(--sn-silver);
}

/* Tags on Ink: Grey outline, White text */
.sn-chip {
  background: transparent;
  border: 1px solid var(--sn-grey);
  border-radius: var(--sn-radius-sm);
  padding: 6px 12px;
  font-weight: 500;
  color: var(--sn-white);
  font-size: 14px;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.sn-chip:hover {
  background: var(--sn-white);
  border-color: var(--sn-white);
  color: var(--sn-ink);
  text-decoration: none;
}

/* ---------- Home: signed-out hint and signed-in requests strip ---------- */
.sn-strip {
  padding: clamp(40px, 5vw, 64px) 0 0;
}

.sn-strip[hidden] {
  display: none;
}

.sn-hint {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: var(--sn-white);
  border: 0;
  border-radius: var(--sn-radius-lg);
  padding: 24px 28px;
}

.sn-hint-title {
  font-weight: 600;
  color: var(--sn-ink);
  font-size: 18px;
}

.sn-hint p {
  font-size: 16px;
  color: var(--sn-grey);
  margin: 3px 0 0;
}

.sn-hint-btn {
  flex: none;
}

.sn-strip-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}

.sn-strip-head h2 {
  font-size: clamp(28px, 3vw, 36px);
  letter-spacing: -0.04em;
  line-height: 1.05;
  margin: 0;
}

/* Secondary button on light: Ink outline, fills Ink on hover */
.sn-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  background: transparent;
  color: var(--sn-ink);
  border: 1px solid var(--sn-ink);
  border-radius: var(--sn-radius-md);
  padding: 0 20px;
  font-size: 15px;
  font-weight: 500;
  white-space: nowrap;
  flex: none;
  transition: color 0.15s, background 0.15s;
}

.sn-btn-outline:hover {
  background: var(--sn-ink);
  color: var(--sn-white);
  text-decoration: none;
}

.sn-req-list {
  background: var(--sn-white);
  border: 0;
  border-radius: var(--sn-radius-lg);
  overflow: hidden;
}

.sn-req {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  border-bottom: 1px solid var(--sn-line);
  transition: background 0.12s;
}

.sn-req:last-child {
  border-bottom: 0;
}

.sn-req:hover {
  background: var(--sn-paper);
  text-decoration: none;
}

.sn-req-title {
  font-weight: 500;
  font-size: 17px;
  color: var(--sn-ink);
}

.sn-req-meta {
  font-size: 14px;
  color: var(--sn-grey);
  margin-top: 2px;
}

/* Status tags: soft corner, sentence case */
.sn-req-status {
  margin-left: auto;
  flex: none;
  font-size: 13px;
  font-weight: 500;
  border-radius: var(--sn-radius-sm);
  padding: 6px 10px;
}

.sn-req-status.is-open {
  background: var(--sn-mint);
  color: var(--sn-ink);
}

.sn-req-status.is-waiting {
  background: var(--sn-ink);
  color: var(--sn-white);
}

@media (max-width: 640px) {
  .sn-hint {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ---------- Home: bands ---------- */
/* The homepage sits on Paper throughout; white cards give the depth */
.sn-band-white,
.sn-band-off {
  background: var(--sn-paper);
  border: 0;
  padding: clamp(48px, 5vw, 72px) 0 0;
  margin-top: 0;
}

.sn-band-white .blocks {
  margin-bottom: 0;
}

.sn-band-promoted {
  padding-bottom: clamp(64px, 7vw, 96px);
}

/* ---------- Home: quick action cards ---------- */
.sn-qa {
  padding: 0;
}

.sn-qa-title {
  font-size: clamp(28px, 3vw, 36px);
  letter-spacing: -0.04em;
  line-height: 1.05;
  margin: 0 0 24px;
}

.sn-qa-grid {
  /* auto-fill keeps a lone card at one third width, ready for more cards */
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
}

.sn-qa-card {
  display: flex;
  flex-direction: column;
  background: var(--sn-white);
  border: 0;
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  padding: 28px;
  color: inherit;
  transition: outline-color 0.15s;
  outline: 2px solid transparent;
  outline-offset: -2px;
}

.sn-qa-card[hidden] {
  /* our display flex would otherwise override the hidden attribute */
  display: none;
}

/* Hover: the brand's selected-card outline, no lift or shadow */
.sn-qa-card:hover {
  outline-color: var(--sn-ink);
  text-decoration: none;
}

.sn-qa-ico {
  /* Brand v3: line icons in Ink, never on a coloured background */
  width: 24px;
  height: 24px;
  color: var(--sn-ink);
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sn-qa-card-title {
  /* card titles are Ink */
  display: block;
  font-family: var(--sn-font);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.15;
  color: var(--sn-ink);
  margin-bottom: 10px;
}

.sn-qa-desc {
  display: block;
  font-size: 16px;
  color: var(--sn-grey);
  line-height: 1.5;
}

.sn-qa-go {
  margin-top: auto;
  padding-top: 16px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
  font-size: 15px;
  color: var(--sn-ink);
}

.sn-qa-go svg {
  display: none;
}

.sn-qa-go {
  text-decoration: underline;
  text-decoration-color: var(--sn-ink);
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
  align-self: flex-start;
}

.sn-qa-card:hover .sn-qa-go {
  text-decoration-thickness: 3px;
}

/* ---------- Home: knowledge base blocks ---------- */
.sn-kb-head {
  margin: 0;
}

.sn-kb-title {
  font-size: clamp(28px, 3vw, 36px);
  letter-spacing: -0.04em;
  line-height: 1.05;
  margin: 0 0 24px;
}

.blocks-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  /* Copenhagen pulls the list out with negative side margins */
  margin: 0;
  padding: 0;
}

@media (max-width: 860px) {
  .blocks-list { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 520px) {
  .blocks-list { grid-template-columns: 1fr; }
}

.blocks-item {
  background: var(--sn-white);
  border: 0;
  border-top: 4px solid var(--sn-ink);
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  margin: 0;
  max-width: none;
  min-width: 0;
  width: auto;
  flex: none;
  outline: 2px solid transparent;
  outline-offset: -2px;
  transition: outline-color 0.15s;
}

.blocks-item:hover {
  outline-color: var(--sn-ink);
}

.blocks-item-link {
  padding: 28px;
  text-align: left;
  color: inherit;
}

.blocks-item-link:hover {
  text-decoration: none;
}

.blocks-item-title {
  font-size: 22px;
  letter-spacing: -0.025em;
  line-height: 1.15;
  margin-bottom: 8px;
  color: var(--sn-ink);
}

.blocks-item-description {
  font-size: 16px;
  color: var(--sn-grey);
  line-height: 1.5;
}

/* ---------- Home: promoted articles ---------- */
.articles {
  padding: 0;
}

.articles h2 {
  font-size: clamp(28px, 3vw, 36px);
  letter-spacing: -0.04em;
  line-height: 1.05;
  margin: 0 0 24px;
}

/* On the homepage the list becomes a Ink panel with the large soft corner */
.sn-band-promoted .articles {
  background: var(--sn-ink);
  color: var(--sn-white);
  border-radius: var(--sn-radius-xl);
  padding: clamp(28px, 4vw, 48px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: 24px 48px;
  align-items: start;
}

.sn-band-promoted .articles h2 {
  color: var(--sn-white);
  margin: 0;
}

@media (max-width: 860px) {
  .sn-band-promoted .articles {
    grid-template-columns: 1fr;
  }
}

.promoted-articles {
  display: block;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin: 0;
}

.promoted-articles-item {
  /* Copenhagen desktop keeps width 33% + padding-right 30px per item */
  width: auto;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--sn-grey);
}

.promoted-articles-item:last-child {
  border-bottom: 1px solid var(--sn-grey);
}

.promoted-articles-item a,
.promoted-articles-item:last-child a {
  border: 0;
}

.promoted-articles-item a {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 0;
  font-weight: 500;
  font-size: 17px;
  color: var(--sn-white);
  transition: color 0.12s;
}

.promoted-articles-item a::after {
  content: "\2192";
  color: var(--sn-mint);
  flex: none;
}

.promoted-articles-item a:hover {
  color: var(--sn-mint);
  text-decoration: none;
}

/* ---------- Final CTA band and brand buttons ---------- */
.sn-final {
  background: var(--sn-ink);
  color: var(--sn-white);
  border-radius: var(--sn-radius-xl);
  padding: 64px 48px;
  text-align: center;
  margin: 64px 0 80px;
}

.sn-final h2 {
  color: var(--sn-white);
  font-size: clamp(28px, 3vw, 40px);
  letter-spacing: -0.04em;
  max-width: 22ch;
  margin: 0 auto 14px;
}

.sn-final p {
  color: var(--sn-silver);
  max-width: 520px;
  margin: 0 auto 28px;
}

.sn-final-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Primary on light: Ink fill, White text */
.sn-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  border: 1px solid transparent;
  background: var(--sn-ink);
  color: var(--sn-white);
  padding: 0 24px;
  border-radius: var(--sn-radius-md);
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.sn-btn:hover {
  background: var(--sn-ink-hover);
  color: var(--sn-white);
  text-decoration: none;
}

/* Primary on Ink: Mint fill, Ink text */
.hero .sn-btn, .footer .sn-btn, .sn-final .sn-btn {
  background: var(--sn-mint);
  color: var(--sn-ink);
}

.hero .sn-btn:hover, .footer .sn-btn:hover, .sn-final .sn-btn:hover {
  background: var(--sn-mint-hover);
  color: var(--sn-ink);
}

/* Secondary on light: Ink outline */
.sn-btn-ghost {
  background: transparent;
  color: var(--sn-ink);
  border-color: var(--sn-ink);
}

.sn-btn-ghost:hover {
  background: var(--sn-ink);
  border-color: var(--sn-ink);
  color: var(--sn-white);
}

/* Secondary on Ink: White text, Grey outline, fills Paper on hover */
.hero .sn-btn-ghost, .footer .sn-btn-ghost, .sn-final .sn-btn-ghost {
  background: transparent;
  color: var(--sn-white);
  border-color: var(--sn-white);
}

.hero .sn-btn-ghost:hover, .footer .sn-btn-ghost:hover, .sn-final .sn-btn-ghost:hover {
  background: var(--sn-white);
  border-color: var(--sn-white);
  color: var(--sn-ink);
}

/* ---------- Buttons (Copenhagen classes) ---------- */
.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,
.button-large, .hbs-form input[type=submit], .button-secondary {
  border-radius: var(--sn-radius-md);
  font-family: var(--sn-font);
  font-weight: 500;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}

/* Primary on light: Ink fill, White text */
.button-large, .hbs-form input[type=submit] {
  background: var(--sn-ink);
  border-color: transparent;
  color: var(--sn-white);
  /* Copenhagen gives these min-width 190px and line-height 2.72 */
  min-width: 0;
  min-height: 48px;
  line-height: 1.4;
  font-size: 16px;
  padding: 13px 24px;
}

.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: var(--sn-ink-hover);
  border-color: transparent;
  color: var(--sn-white);
  box-shadow: none;
}

/* Secondary on light: Ink outline. The double selector out-guns the
   .button-large:hover rule above */
.button-secondary,
.button-large.button-secondary {
  background: transparent;
  border: 1px solid var(--sn-ink);
  color: var(--sn-ink);
  box-shadow: none;
}

.button-secondary:hover, .button-secondary:focus, .button-secondary:active,
.button-large.button-secondary:hover,
.button-large.button-secondary:focus,
.button-large.button-secondary:active {
  background: var(--sn-ink);
  border: 1px solid var(--sn-ink);
  color: var(--sn-white);
  box-shadow: none;
}

/* ---------- Forms ---------- */
/* Fields: white, Line border, soft corner. Focus: Ink border, 2px */
.hbs-form input:where(:not([type=checkbox])):where(:not([type=submit])),
.hbs-form textarea, .hbs-form select {
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-md);
  background-color: var(--sn-white);
  color: var(--sn-ink);
  padding: 14px 16px;
  font-size: 16px;
}

.hbs-form input:where(:not([type=checkbox])):focus,
.hbs-form textarea:focus, .hbs-form select:focus {
  border-color: var(--sn-ink);
  box-shadow: 0 0 0 1px var(--sn-ink);
}

.hbs-form label {
  font-size: 14px;
  font-weight: 500;
  color: var(--sn-ink);
}

/* ---------- Article and section pages ---------- */
.article-title {
  font-size: clamp(30px, 3.6vw, 40px);
  letter-spacing: -0.025em;
}

.article-body {
  font-size: 16.5px;
  line-height: 1.7;
  color: var(--sn-ink);
}

.article-body h2, .article-body h3 {
  color: var(--sn-ink);
  letter-spacing: -0.01em;
}

.article-meta, .article-author .article-updated, .meta-data {
  color: var(--sn-grey);
}

.breadcrumbs a {
  color: var(--sn-grey);
}

.breadcrumbs a:hover {
  color: var(--sn-ink);
}

.breadcrumbs li:last-child {
  color: var(--sn-ink);
  font-weight: 500;
}

.collapsible-sidebar, .article-sidebar {
  border-radius: var(--sn-radius-lg);
}

.sidenav-item, .section-tree .article-list-item a, .collapsible-nav-list a {
  border-radius: var(--sn-radius-sm);
  color: var(--sn-grey);
}

.sidenav-item:hover, .section-tree .article-list-item a:hover {
  background: var(--sn-paper);
  color: var(--sn-ink);
  text-decoration: none;
}

.sidenav-item.current-article, .section-tree .article-list-item.current-article a {
  background: var(--sn-mint);
  color: var(--sn-ink);
  font-weight: 600;
}

.article-vote {
  border-radius: var(--sn-radius-md);
  border: 1px solid var(--sn-ink);
  background: transparent;
  color: var(--sn-ink);
}

.article-vote:hover {
  border-color: var(--sn-ink);
  background: var(--sn-ink);
  color: var(--sn-white);
}

.article-vote.vote-voted {
  background: var(--sn-ink);
  border-color: transparent;
  color: var(--sn-white);
}

/* Notes and callouts inside article content: a quiet Paper panel */
.article-body blockquote {
  border-left: 4px solid var(--sn-ink);
  background: var(--sn-paper);
  border-radius: var(--sn-radius-md);
  padding: 16px 20px;
  color: var(--sn-ink);
}

/* ---------- Request page ---------- */
.request-container h1, .request-title {
  font-size: clamp(28px, 3.4vw, 38px);
  letter-spacing: -0.025em;
}

/* Status tags: customer-facing wording of colour. Open means "we are on
   it", so it gets the Mint tag rather than Zendesk's alert red */
.status-label {
  border-radius: var(--sn-radius-md);
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
}

.status-label-open, .status-label-new, .status-label-hold {
  background-color: var(--sn-mint);
  color: var(--sn-ink);
}

.status-label-pending, .status-label-pending-moderation {
  background-color: var(--sn-ink);
  color: var(--sn-white);
}

.status-label-solved {
  background-color: var(--sn-line);
  color: var(--sn-ink);
}

/* Sidebar: white card instead of the darkened beige panel */
.request-sidebar {
  background-color: var(--sn-white) !important;
  border: 1px solid var(--sn-line) !important;
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
}

.request-sidebar table, .request-sidebar td, .request-sidebar th,
.request-container table, .request-container td, .request-container th {
  border-color: var(--sn-line);
}

.request-sidebar th {
  color: var(--sn-grey);
  font-weight: 500;
}

/* Comment thread */
.comment {
  border-color: var(--sn-line);
}

.comment-author, .comment-author a {
  color: var(--sn-ink);
  font-weight: 600;
}

.comment-meta, .comment-info .meta-data {
  color: var(--sn-grey);
}

.comment-avatar img, .comment .user-avatar {
  border-radius: var(--sn-radius-sm);
}

/* Reply box: white card with the brand focus ring instead of the grey slab */
.request-container textarea,
.comment-form textarea,
.comment-form [role=textbox] {
  background-color: var(--sn-white) !important;
  border: 1px solid var(--sn-line) !important;
  border-radius: var(--sn-radius-md) !important;
  padding: 12px 14px;
  font-family: var(--sn-font);
  font-size: 16px;
  color: var(--sn-ink);
  transition: border-color 0.15s, box-shadow 0.15s;
}

.request-container textarea:focus,
.comment-form textarea:focus,
.comment-form [role=textbox]:focus {
  border-color: var(--sn-ink) !important;
  box-shadow: 0 0 0 1px var(--sn-ink);
  outline: none;
}

.comment-form-controls {
  gap: 12px;
}

/* ---------- Request page: layout rhythm ---------- */
.container .breadcrumbs {
  margin-top: 28px;
}

.request-breadcrumbs {
  margin-bottom: 0;
}

.request-container {
  margin-top: clamp(16px, 2vw, 28px);
}

/* Reply composer: a white card, titled with a quiet sub */
.sn-composer {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  padding: 26px 28px;
  margin-top: 24px;
}

.sn-composer-title {
  font-size: 20px;
  letter-spacing: -0.01em;
  margin: 0 0 4px;
}

.sn-composer-sub {
  font-size: 15px;
  color: var(--sn-grey);
  margin: 0 0 6px;
}

.sn-composer .comment-form {
  padding-top: 12px;
  margin-top: 0;
}

.sn-composer .request-follow-up {
  padding-top: 4px;
}

@media (max-width: 640px) {
  .comment,
  .sn-composer {
    padding: 20px 18px;
  }
}

/* Sidebar card tops align with the title now it shares the columns row */
@media (min-width: 1024px) {
  .request-sidebar {
    margin-top: 0;
    align-self: flex-start;
  }
}

/* On mobile the ticket details drop below the conversation instead of
   sitting between the breadcrumbs and the title */
@media (max-width: 1023px) {
  .request-container {
    display: flex;
    flex-direction: column;
  }
  .request-main {
    order: 0;
  }
  .request-sidebar {
    order: 1;
    margin-top: 32px;
    padding: 16px 20px;
  }
  .request-sidebar .collapsible-sidebar-title {
    font-size: 17px;
  }
  .request-sidebar .collapsible-sidebar-toggle {
    right: 16px;
    top: 32px;
  }
  /* collapsed state shows just the "Ticket details" bar inside the card */
  .request-sidebar.collapsible-sidebar {
    max-height: 58px;
  }
  .request-sidebar.collapsible-sidebar[aria-expanded=true] {
    max-height: none;
  }
}

/* Reply trigger: it is a BUTTON, so it needs its background set explicitly
   or it renders with the browser's default grey */
.request-main .comment-show-container {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-md);
  color: var(--sn-grey);
  font-family: var(--sn-font);
  font-size: 16px;
  font-weight: 400;
  padding: 15px 26px;
  cursor: text;
  box-shadow: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.request-main .comment-show-container:hover {
  border-color: var(--sn-ink);
}

/* Each message is a white card. Team replies carry a Ink spine so
   customers can scan for our responses */
.comment-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.comment {
  position: relative;
  overflow: hidden;
  background: var(--sn-white);
  border: 1px solid var(--sn-line) !important;
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  padding: 26px 28px;
}

.comment:has(.icon-agent)::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--sn-ink);
}

.comment-avatar .user-avatar {
  border-radius: var(--sn-radius-sm);
}

.comment-body {
  font-size: 16.5px;
  line-height: 1.7;
}

.comment-form {
  margin-top: 24px;
}

/* Optically centre the 40px avatar on the ~56px collapsed reply field */
.comment-form > .comment-avatar {
  align-self: flex-start;
  margin-top: 8px;
}

/* Expanded reply editor: retheme CKEditor through its own CSS variables so
   toolbar and writing area share coherent borders instead of doubling up */
:root {
  --ck-border-radius: 0;
  --ck-color-base-border: var(--sn-line);
  --ck-color-toolbar-border: var(--sn-line);
  --ck-color-toolbar-background: var(--sn-paper);
  --ck-color-focus-border: var(--sn-ink);
  --ck-focus-ring: 1px solid var(--sn-ink);
  --ck-color-focus-outer-shadow: transparent;
  --ck-inner-shadow: none;
}

/* One frame: the wrapper owns the border and focus ring; every part inside
   is borderless so nothing doubles up or mis-seams */
.comment-form .ck.ck-editor,
#new-request-form .ck.ck-editor {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-md);
  overflow: hidden;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.comment-form .ck.ck-editor:focus-within,
#new-request-form .ck.ck-editor:focus-within {
  border-color: var(--sn-ink);
  box-shadow: 0 0 0 1px var(--sn-ink);
}

.comment-form .ck.ck-editor .ck-toolbar,
#new-request-form .ck.ck-editor .ck-toolbar {
  background: var(--sn-paper);
  border: 0 !important;
  border-bottom: 1px solid var(--sn-line) !important;
  border-radius: 0 !important;
}

/* CKEditor wraps the toolbar in a sticky panel that draws its own square
   border, which pokes out behind the frame's rounded corners */
.comment-form .ck.ck-editor .ck-editor__top,
.comment-form .ck.ck-editor .ck-sticky-panel,
.comment-form .ck.ck-editor .ck-sticky-panel .ck-sticky-panel__content,
#new-request-form .ck.ck-editor .ck-editor__top,
#new-request-form .ck.ck-editor .ck-sticky-panel,
#new-request-form .ck.ck-editor .ck-sticky-panel .ck-sticky-panel__content {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent;
}

.comment-form .ck.ck-editor .ck-editor__editable,
#new-request-form .ck.ck-editor .ck-editor__editable {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  min-height: 140px;
}

.comment-form .ck.ck-editor .ck-editor__editable.ck-focused,
#new-request-form .ck.ck-editor .ck-editor__editable.ck-focused {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Attachment dropzone: soft dashed card instead of the hard grey box */
.upload-dropzone {
  border: 1px dashed var(--sn-grey) !important;
  border-radius: var(--sn-radius-md);
  background: var(--sn-white);
  margin-top: 12px;
}

.upload-dropzone span {
  color: var(--sn-grey);
}

/* ---------- Submit a request page ---------- */
/* Kill the redundant second hairline under the header */
.container-divider {
  border-top: 0;
  margin-bottom: 0;
}

.sub-nav {
  margin: 28px 0 44px;
  align-items: center;
}

.sub-nav .breadcrumbs {
  margin-top: 0;
}

.container > h1 {
  font-size: clamp(28px, 3.4vw, 38px);
  letter-spacing: -0.025em;
  margin-bottom: 8px;
}

#main-content.form {
  max-width: 720px;
  margin-bottom: clamp(48px, 6vw, 80px);
}

/* Garden (Zendesk's React UI kit) components carry stable data-garden-id
   attributes; restyle the form controls through them */
[data-garden-id="forms.input"],
[data-garden-id="forms.textarea"],
[data-garden-id="forms.select"],
[data-garden-id="dropdowns.combobox"],
[data-garden-id="dropdowns.combobox.trigger"] {
  font-family: var(--sn-font) !important;
  border-color: var(--sn-line) !important;
  border-radius: var(--sn-radius-md) !important;
  background-color: var(--sn-white) !important;
  color: var(--sn-ink) !important;
  font-size: 16px !important;
  transition: border-color 0.15s, box-shadow 0.15s;
}

[data-garden-id="forms.input"],
[data-garden-id="forms.textarea"],
[data-garden-id="forms.select"] {
  padding: 12px 14px !important;
}

/* The combobox trigger is a Garden-managed grid (it reserves room for tag
   chips). Do not override its display; centre the content within it and
   match the text inputs' 48px height */
[data-garden-id="dropdowns.combobox.trigger"] {
  min-height: 48px !important;
  padding: 0 14px !important;
  align-items: center !important;
  align-content: center !important;
}

[data-garden-id="dropdowns.combobox.input"],
[data-garden-id="dropdowns.combobox.value"] {
  font-size: 16px !important;
  font-family: var(--sn-font) !important;
  padding: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  line-height: 1.4 !important;
  align-self: center !important;
}

/* Garden darkens the brand colour and uses white text on its primary
   button; brand primary on light is Ink fill + White text, so force it */
#new-request-form button[type=submit],
#new-request-form input[type=submit],
#main-content.form button[type=submit] {
  background-color: var(--sn-ink) !important;
  border-color: transparent !important;
  color: var(--sn-white) !important;
  font-size: 17px !important;
  padding: 13px 26px !important;
  height: auto !important;
  transition: transform 0.15s ease, background-color 0.15s, box-shadow 0.15s !important;
}

#new-request-form button[type=submit]:hover,
#new-request-form input[type=submit]:hover,
#main-content.form button[type=submit]:hover {
  background-color: var(--sn-ink-hover) !important;
  color: var(--sn-white) !important;
  box-shadow: none !important;
}

[data-garden-id="forms.input"]:focus,
[data-garden-id="forms.textarea"]:focus,
[data-garden-id="forms.select"]:focus,
[data-garden-id="dropdowns.combobox.trigger"]:focus-within,
[data-garden-id="forms.input"][data-garden-focus-visible],
[data-garden-id="forms.textarea"][data-garden-focus-visible] {
  border-color: var(--sn-ink) !important;
  box-shadow: 0 0 0 1px var(--sn-ink) !important;
}

[data-garden-id="forms.label"],
[data-garden-id="dropdowns.combobox.label"] {
  font-family: var(--sn-font) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--sn-ink) !important;
  margin-bottom: 8px;
}

[data-garden-id="forms.hint"],
[data-garden-id="forms.message"],
[data-garden-id="dropdowns.combobox.hint"],
[data-garden-id="dropdowns.combobox.message"] {
  font-family: var(--sn-font) !important;
  color: var(--sn-grey) !important;
}

[data-garden-id="buttons.button"] {
  font-family: var(--sn-font) !important;
  font-weight: 600 !important;
  border-radius: var(--sn-radius-md) !important;
  letter-spacing: -0.01em;
}

/* Attachments dropzone (Garden file upload): dashed card, Ink link text */
[data-garden-id="forms.file_upload"] {
  font-family: var(--sn-font) !important;
  color: var(--sn-grey) !important;
  background: var(--sn-white) !important;
  border: 1px dashed var(--sn-grey) !important;
  border-radius: var(--sn-radius-md) !important;
  font-size: 15px !important;
}

[data-garden-id="forms.file_upload"]:hover {
  border-color: var(--sn-ink) !important;
}

#new-request-form [data-garden-id="buttons.anchor"],
[data-garden-id="forms.file_upload"] [data-garden-id="buttons.anchor"],
#new-request-form a {
  color: var(--sn-ink) !important;
}

#new-request-form [data-garden-id="buttons.anchor"]:hover,
#new-request-form a:hover {
  color: var(--sn-ink) !important;
}

[data-garden-id="forms.file"],
[data-garden-id="forms.file_list"] {
  font-family: var(--sn-font) !important;
}

/* Dropdown panels: same recipe as the user menu (Line hairline, no shadow) */
[data-garden-id="dropdowns.combobox.listbox"],
[data-garden-id="dropdowns.menu.floating"] {
  font-family: var(--sn-font) !important;
  background: var(--sn-white) !important;
  border: 1px solid var(--sn-line) !important;
  border-radius: var(--sn-radius-md) !important;
  box-shadow: none !important;
  padding: 8px !important;
}

[data-garden-id="dropdowns.combobox.option"],
[data-garden-id="dropdowns.menu.item"] {
  border-radius: var(--sn-radius-sm) !important;
  border-left: 0 !important;
  box-shadow: none !important;
  color: var(--sn-grey) !important;
  font-weight: 500 !important;
  font-size: 15.5px !important;
  transition: background 0.12s, color 0.12s;
}

/* Hover / keyboard focus */
[data-garden-id="dropdowns.combobox.option"]:hover,
[data-garden-id="dropdowns.combobox.option"][data-garden-focus-visible],
[data-garden-id="dropdowns.menu.item"]:hover {
  background: var(--sn-paper) !important;
  color: var(--sn-ink) !important;
}

/* Selected option: Mint fill with Ink text, no dark spine */
[data-garden-id="dropdowns.combobox.option"][aria-selected="true"] {
  background: var(--sn-mint) !important;
  color: var(--sn-ink) !important;
  font-weight: 600 !important;
}

[data-garden-id="dropdowns.combobox.option.selection_icon"] {
  color: var(--sn-ink) !important;
}

/* ---------- Flash notifications (toasts) ---------- */
[data-garden-id="notifications.notification"],
[data-garden-id="notifications.alert"] {
  font-family: var(--sn-font) !important;
  background: var(--sn-white) !important;
  border: 1px solid var(--sn-line) !important;
  border-radius: var(--sn-radius-lg) !important;
  box-shadow: none !important;
  color: var(--sn-ink) !important;
  padding: 20px 48px 20px 52px !important;
}

[data-garden-id="notifications.title"] {
  font-family: var(--sn-font) !important;
  font-weight: 600 !important;
  color: var(--sn-ink) !important;
  font-size: 16px !important;
}

[data-garden-id="notifications.paragraph"] {
  color: var(--sn-grey) !important;
  font-size: 15px !important;
}

/* Success tick in the brand text green */
[data-garden-id="notifications.notification"] svg,
[data-garden-id="notifications.icon"] {
  color: var(--sn-ink) !important;
}

[data-garden-id="notifications.close"] {
  color: var(--sn-grey) !important;
}

[data-garden-id="notifications.close"]:hover {
  color: var(--sn-ink) !important;
}

/* ---------- Requests list page (React) ---------- */
/* Inner-page hero band: same grammar as the homepage, slightly tighter */
.sn-page-hero {
  padding: clamp(28px, 3.5vw, 44px) 24px clamp(22px, 2.8vw, 34px);
}

/* Inner pages: Ink hero, then the page body on WHITE
   separated by a hairline. The off-white base only shows around bands */
.sn-page-body {
  background: var(--sn-white);
  border-top: 1px solid var(--sn-line);
  padding: clamp(22px, 2.8vw, 40px) 0 clamp(48px, 6vw, 80px);
}

.sn-page-body .article-container,
.sn-page-body .request-container {
  margin-top: 0;
}

.sn-page-body #main-content {
  margin-top: 0;
}

.sn-page-hero .sn-title-page {
  font-size: clamp(32px, 4vw, 44px);
  letter-spacing: -0.025em;
  margin: 0;
}

.sn-page-hero .sn-hero-lede {
  margin-top: 12px;
}

.sn-page-hero .breadcrumbs {
  margin: 0 0 14px;
}

.sn-page-hero .request-title {
  font-size: clamp(30px, 3.6vw, 40px);
  margin: 6px 0 0;
  max-width: none;
  /* Copenhagen draws a full-width border under the title at >=1024px */
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.sn-requests-page #main-content {
  margin-top: 4px;
}

/* Tabs as soft-corner chips: no full-width rule under them, active state
   uses the Mint fill that marks selection everywhere else */
[data-garden-id="tabs.tablist"] {
  border-bottom: 0 !important;
  display: flex;
  gap: 10px;
  margin-bottom: 8px;
}

[data-garden-id="tabs.tab"] {
  font-family: var(--sn-font) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--sn-grey) !important;
  background: var(--sn-white) !important;
  border: 1px solid var(--sn-line) !important;
  border-radius: var(--sn-radius-md) !important;
  padding: 9px 18px !important;
  margin: 0 12px 0 0 !important;
  box-shadow: none !important;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}

[data-garden-id="tabs.tab"]:last-child {
  margin-right: 0 !important;
}

/* Hover follows the ghost recipe: ink text, ink border */
[data-garden-id="tabs.tab"]:hover {
  color: var(--sn-ink) !important;
  border-color: var(--sn-ink) !important;
}

[data-garden-id="tabs.tab"][aria-selected="true"] {
  background: var(--sn-mint) !important;
  border-color: transparent !important;
  color: var(--sn-ink) !important;
  font-weight: 600 !important;
}

/* Pin the toolbar-to-table rhythm regardless of which Copenhagen margin
   path (with or without the count line) is in play */
.sn-requests-page .requests {
  margin-top: 18px !important;
}

.sn-requests-page .requests-table-toolbar {
  margin-bottom: 0 !important;
}

/* The list search box is a media input (icon + faux input wrapper) */
[data-garden-id="forms.faux_input"],
[data-garden-id="forms.media_input"] {
  font-family: var(--sn-font) !important;
  border-color: var(--sn-line) !important;
  border-radius: var(--sn-radius-md) !important;
  background-color: var(--sn-white) !important;
  min-height: 44px;
}

/* On the requests list the search matches every other search field */
.sn-requests-page [data-garden-id="forms.faux_input"],
.sn-requests-page [data-garden-id="forms.media_input"] {
  border-radius: var(--sn-radius-md) !important;
  padding-left: 10px !important;
  box-shadow: none;
}

[data-garden-id="forms.faux_input"]:focus-within {
  border-color: var(--sn-ink) !important;
  box-shadow: 0 0 0 1px var(--sn-ink) !important;
}

/* Table: a white card, like every list in the theme. Bare tables on the
   page background read as stock Zendesk */
[data-garden-id="tables.table"] {
  font-family: var(--sn-font) !important;
  background: var(--sn-white) !important;
  border: 1px solid var(--sn-line) !important;
  border-radius: var(--sn-radius-lg) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

/* Copenhagen puts 40px between the toolbar and the table; tighten it */
.requests-table-toolbar + .requests {
  margin-top: 20px;
}

[data-garden-id="tables.header_cell"] {
  /* Brand v3 tables: Medium header on Paper, Ink rules above and below */
  color: var(--sn-ink) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  padding: 14px 20px !important;
  border-top: 1px solid var(--sn-ink) !important;
  border-bottom: 1px solid var(--sn-ink) !important;
  background: var(--sn-paper) !important;
  white-space: nowrap !important;
}

[data-garden-id="tables.row"] {
  border-bottom: 1px solid var(--sn-line) !important;
}

[data-garden-id="tables.row"]:last-child [data-garden-id="tables.cell"] {
  border-bottom: 0 !important;
}

[data-garden-id="tables.row"]:hover {
  background: var(--sn-paper) !important;
}

[data-garden-id="tables.cell"] {
  color: var(--sn-grey) !important;
  font-size: 15px !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid var(--sn-line) !important;
  vertical-align: middle !important;
}

[data-garden-id="tables.header_cell"] {
  vertical-align: middle !important;
}

/* List titles are Ink; the underline appears on hover */
[data-garden-id="tables.cell"] a {
  color: var(--sn-ink) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

[data-garden-id="tables.cell"] a:hover {
  color: var(--sn-ink) !important;
  text-decoration: none !important;
}

/* Status tags: shape here, colours applied by the observer in script.js
   (Garden sets tag colours inline, so classes are added from the text) */
[data-garden-id="tags.tag_view"] {
  font-family: var(--sn-font) !important;
  border-radius: var(--sn-radius-md) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 4px 12px !important;
  height: auto !important;
}

[data-garden-id="tags.tag_view"].sn-tag-open {
  background: var(--sn-mint) !important;
  color: var(--sn-ink) !important;
}

[data-garden-id="tags.tag_view"].sn-tag-waiting {
  background: var(--sn-ink) !important;
  color: var(--sn-white) !important;
}

[data-garden-id="tags.tag_view"].sn-tag-solved {
  background: var(--sn-line) !important;
  color: var(--sn-ink) !important;
}

/* ---------- Garden modals (filters etc) ---------- */
[data-garden-id="modals.modal"] {
  font-family: var(--sn-font) !important;
  border-radius: var(--sn-radius-lg) !important;
  border: 1px solid var(--sn-line) !important;
  box-shadow: none !important;
}

[data-garden-id="modals.header"] {
  font-family: var(--sn-font) !important;
  font-weight: 600 !important;
  color: var(--sn-ink) !important;
  border-bottom: 1px solid var(--sn-line) !important;
}

[data-garden-id="modals.close"] {
  color: var(--sn-grey) !important;
}

[data-garden-id="modals.close"]:hover {
  color: var(--sn-ink) !important;
}

/* Primary action: Ink fill with White text (Garden auto-darkens otherwise).
   Secondary/basic actions: quiet Grey text */
[data-garden-id="modals.footer"] [data-garden-id="buttons.button"] {
  color: var(--sn-grey) !important;
}

[data-garden-id="modals.footer"] [data-garden-id="buttons.button"]:hover {
  color: var(--sn-ink) !important;
  background: var(--sn-paper) !important;
}

[data-garden-id="modals.footer"] [data-garden-id="modals.footer_item"]:last-child [data-garden-id="buttons.button"],
[data-garden-id="modals.footer"] [data-garden-id="buttons.button"]:last-child {
  background-color: var(--sn-ink) !important;
  border-color: transparent !important;
  color: var(--sn-white) !important;
  padding: 10px 22px !important;
  height: auto !important;
}

[data-garden-id="modals.footer"] [data-garden-id="modals.footer_item"]:last-child [data-garden-id="buttons.button"]:hover,
[data-garden-id="modals.footer"] [data-garden-id="buttons.button"]:last-child:hover {
  background-color: var(--sn-ink-hover) !important;
  color: var(--sn-white) !important;
  box-shadow: none !important;
}

/* The Filter trigger: proper ghost (ink text, warm hairline), not the
   Garden-derived dark green outline. Scoped to the requests app; Garden
   modals render in a body-level portal so their buttons are unaffected */
.request-table-filter [data-garden-id="buttons.button"],
.sn-requests-page [data-garden-id="buttons.button"] {
  color: var(--sn-ink) !important;
  border: 1px solid var(--sn-line) !important;
  background: transparent !important;
  font-weight: 600 !important;
}

.request-table-filter [data-garden-id="buttons.button"]:hover,
.sn-requests-page [data-garden-id="buttons.button"]:hover {
  background: var(--sn-white) !important;
  border-color: var(--sn-ink) !important;
  color: var(--sn-ink) !important;
}

/* The wrapper is the field; the inner input must not draw its own box */
[data-garden-id="forms.faux_input"] input,
[data-garden-id="forms.faux_input"] [data-garden-id="forms.input"],
[data-garden-id="forms.media_input"] input {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 8px !important;
  min-height: 0 !important;
  outline: none !important;
}

/* ---------- Article and search hero variants ---------- */
.sn-hero-topline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-bottom: 10px;
}

.sn-hero-topline .breadcrumbs {
  margin: 0;
}

.sn-hero-minisearch {
  flex: 0 1 260px;
}

.sn-hero-minisearch .search input:where(:not([type=checkbox])) {
  padding: 10px 20px;
  font-size: 15px;
}

.sn-hero-search {
  margin-top: 22px;
  max-width: 620px;
}

.sn-article-hero-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}

.sn-page-hero .article-title {
  font-size: clamp(30px, 3.6vw, 40px);
  letter-spacing: -0.025em;
  margin: 0;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.sn-hero-author {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

.sn-hero-author .user-avatar {
  width: 34px;
  height: 34px;
  border-radius: var(--sn-radius-sm);
}

.sn-hero-author .article-meta a {
  color: var(--sn-ink);
  font-weight: 600;
  font-size: 15px;
}

.sn-hero-author .meta-data {
  color: var(--sn-grey);
  font-size: 13px;
}

/* ---------- Article page ---------- */
.article-container {
  margin-top: clamp(16px, 2vw, 28px);
}

/* Article prose flows on the page as a plain
   reading column, no card. Cards are for lists and objects, not prose */
.article-container {
  display: block;
}

.article {
  /* Copenhagen's 17/66/17 grid gives the article 66% width and 30px side
     padding, which knocks it out of line with the container edge */
  max-width: 720px !important;
  min-width: 0 !important;
  width: 100%;
  padding: 0 !important;
  flex: none !important;
}

.article-info {
  background: transparent;
  border: 0;
  padding: 0;
}

/* Section nav lives below the article as a quiet hairline block */
.article-sidebar {
  width: 100%;
  max-width: 720px;
  flex: none;
  border-top: 1px solid var(--sn-line);
  margin-top: 28px;
  padding-top: 20px;
}

.article-sidebar .collapsible-sidebar {
  max-height: none;
  padding: 0;
}

.article-sidebar .collapsible-sidebar-toggle {
  display: none;
}

.article-sidebar .collapsible-sidebar-body {
  display: block !important;
}

.article-sidebar .sidenav-item {
  border-radius: 0;
  padding: 11px 0;
  border-bottom: 1px solid var(--sn-line);
  color: var(--sn-ink);
  font-weight: 500;
  font-size: 15.5px;
  background: transparent !important;
}

.article-sidebar li:last-child .sidenav-item {
  border-bottom: 0;
}

.article-sidebar .sidenav-item:hover {
  color: var(--sn-ink);
  background: transparent !important;
}

.article-sidebar .sidenav-item.current-article {
  color: var(--sn-ink) !important;
  font-weight: 600;
}

.article-content {
  max-width: 720px;
}

.article-body {
  font-size: 17px;
  line-height: 1.7;
}

.article-body p {
  color: var(--sn-ink);
  margin-bottom: 16px;
}

.article-body h2, .article-body h3, .article-body h4 {
  color: var(--sn-ink);
  margin: 30px 0 10px;
}

.article-body li {
  color: var(--sn-ink);
  margin-bottom: 8px;
}

/* Inline links: Ink text, normal weight, 2px Ink underline */
.article-body a {
  color: var(--sn-ink);
  font-weight: inherit;
  text-decoration: underline;
  text-decoration-color: var(--sn-ink);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.article-body a:hover {
  color: var(--sn-ink);
}

/* Votes and callout as a quiet hairline section, not a card */
.article > footer {
  border-top: 1px solid var(--sn-line);
  margin-top: 36px;
  padding-top: 24px;
  max-width: 720px;
}

.article-votes {
  text-align: center;
  padding: 4px 0;
}

.article-votes-question {
  font-size: 18px;
  letter-spacing: -0.01em;
}

.article-more-questions {
  text-align: center;
  color: var(--sn-grey);
  font-size: 15px;
}

.article-more-questions a {
  color: var(--sn-ink);
  font-weight: inherit;
  text-decoration: underline;
  text-decoration-color: var(--sn-ink);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.article-return-to-top {
  border-top: 1px solid var(--sn-line);
  margin-top: 18px;
  padding-top: 14px;
}

.article-return-to-top a {
  color: var(--sn-ink);
  font-weight: 600;
  font-size: 14px;
}

.article-relatives {
  max-width: 720px;
  margin-top: 28px;
  border-top: 1px solid var(--sn-line);
  padding: 20px 0 0;
}

.article-comments {
  max-width: 720px;
  margin-top: 28px;
}

.article-comments .comment-overview {
  border-top: 1px solid var(--sn-line);
  padding-top: 20px;
}

.comment-heading {
  font-size: 18px !important;
  letter-spacing: -0.01em;
}

.comment-callout {
  color: var(--sn-grey);
  font-size: 13px;
}

.article-share a {
  color: var(--sn-grey);
}

.article-share a:hover {
  color: var(--sn-ink);
}

.article-votes {
  padding: 10px 0 2px;
}

.article-votes-count {
  color: var(--sn-grey);
  font-size: 13px;
}

.article-relatives h3 {
  font-size: 18px;
  margin-bottom: 10px;
}

.article-relatives a {
  color: var(--sn-ink);
  font-weight: 500;
}

.article-relatives a:hover {
  color: var(--sn-ink);
}

/* Article comments reuse the message-card conversation grammar; give the
   form the composer treatment */
.article-comments .comment-form {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  padding: 20px 24px;
  margin-top: 16px;
}



/* In the below-article section list the current item is green text only;
   the generic Mint fill has no horizontal padding to sit in here */
.article-sidebar .sidenav-item.current-article,
.article-sidebar a.sidenav-item[aria-current="page"] {
  background: transparent !important;
  color: var(--sn-ink) !important;
  font-weight: 600;
  padding: 11px 0 !important;
  border-radius: 0 !important;
}

/* ---------- Category and section pages ---------- */
/* Copenhagen reserves a phantom left column (content at 80%, pushed right);
   the grid should span the full container */
.category-container {
  display: block;
}

.category-content {
  flex: none !important;
  width: 100%;
  max-width: none;
}

.section-container {
  max-width: none;
}

.section-tree {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  column-count: auto;
}

.section-tree .section {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  padding: 26px 28px;
  margin: 0;
  break-inside: avoid;
}

.section-tree-title {
  margin-bottom: 8px;
}

.section-tree-title a {
  font-size: 20px;
  color: var(--sn-ink);
  font-weight: 600;
  letter-spacing: -0.01em;
}

.section-tree-title a:hover {
  color: var(--sn-ink);
  text-decoration: none;
}

.article-list {
  margin: 0;
}

.article-list-item {
  border-bottom: 1px solid var(--sn-line);
  padding: 11px 0;
  margin: 0;
}

.article-list-item:last-child {
  border-bottom: 0;
}

.article-list-link {
  color: var(--sn-ink);
  font-weight: 500;
  font-size: 15.5px;
}

.article-list-link:hover {
  color: var(--sn-ink);
  text-decoration: none;
}

.see-all-articles {
  display: inline-block;
  margin-top: 12px;
  color: var(--sn-ink);
  font-weight: 600;
  font-size: 15px;
}

.see-all-articles:hover {
  color: var(--sn-ink);
  text-decoration: none;
}

/* Section page: subsection links and the article list as card lists */
.section-list,
.section-content > .article-list {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  padding: 4px 26px;
  margin-bottom: 20px;
}

.section-list-item a {
  color: var(--sn-ink);
  font-weight: 500;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
}

.section-list-item {
  border-bottom: 1px solid var(--sn-line);
}

.section-list-item:last-child {
  border-bottom: 0;
}

.section-list-item a:hover {
  color: var(--sn-ink);
  text-decoration: none;
}

@media (max-width: 860px) {
  .section-tree {
    grid-template-columns: 1fr;
  }
}

/* ---------- Search results page ---------- */
.search-results-subheading {
  font-size: 20px;
  font-weight: 600;
  color: var(--sn-ink);
  letter-spacing: -0.01em;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
  margin: 4px 0 18px;
}

.search-results-list > li {
  background: var(--sn-white);
  border: 1px solid var(--sn-line);
  border-radius: var(--sn-radius-lg);
  box-shadow: none;
  padding: 22px 26px;
  margin-bottom: 14px;
}

.search-result-title {
  font-size: 17px;
  margin-bottom: 2px;
}

.search-result-description {
  font-size: 15px;
  color: var(--sn-grey);
  line-height: 1.6;
  margin-top: 10px;
}

/* Query highlights: Mint fill instead of italics */
.search-result-description em {
  font-style: normal;
  background: var(--sn-mint);
  border-radius: 0;
  padding: 0 3px;
}

.search-result-meta-container {
  font-size: 13px;
  color: var(--sn-grey);
}

.search-result-breadcrumbs li,
.search-result-breadcrumbs li a {
  color: var(--sn-grey);
  font-size: 13px;
}

.search-result-breadcrumbs li a:hover {
  color: var(--sn-ink);
}

/* Filter sidebar */
.sidenav-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--sn-grey);
}

.sidenav-item {
  border-radius: var(--sn-radius-sm);
  padding: 9px 14px;
  color: var(--sn-grey);
  font-weight: 500;
}

.sidenav-item:hover {
  background: var(--sn-paper);
  color: var(--sn-ink);
  text-decoration: none;
}

.sidenav-item.current,
.sidenav-item[aria-current="page"] {
  background: var(--sn-mint) !important;
  color: var(--sn-ink) !important;
  font-weight: 600;
}

.sidenav-item .doc-count {
  color: var(--sn-grey);
  font-weight: 400;
}

/* ---------- Search results ---------- */
/* Result titles are Ink too, underlined on hover */
.search-result-title a {
  color: var(--sn-ink);
  font-weight: 500;
}

.search-result-title a:hover {
  color: var(--sn-ink);
}

/* ---------- Footer ---------- */
.footer {
  background: var(--sn-ink);
  color: var(--sn-silver);
  border-top: 0;
  margin-top: 0;
  padding: 0;
}

.footer-inner {
  display: none;
}

.sn-foot-main {
  box-sizing: content-box;
  max-width: var(--sn-maxw);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  padding: 48px 24px 40px;
}

/* Secondary on Ink per the brand guide. Specificity pinned so the
   footer's dimmed link colour cannot bleed into it */
.footer .sn-foot-btn {
  background: transparent;
  color: var(--sn-white) !important;
  border: 1px solid var(--sn-white);
}

.footer .sn-foot-btn:hover {
  background: var(--sn-white);
  color: var(--sn-ink) !important;
  border-color: var(--sn-white);
  text-decoration: none;
}

.sn-foot-logo {
  height: 24px;
  width: auto;
  display: block;
}

.sn-foot-tag {
  margin: 16px 0 0;
  font-size: 15px;
  color: var(--sn-silver);
  max-width: 30ch;
  line-height: 1.55;
}

.sn-foot-contact {
  margin-top: 16px;
  font-size: 15px;
  line-height: 1.8;
}

.sn-foot-contact a,
.sn-foot-col a {
  color: var(--sn-silver);
}

.sn-foot-contact a:hover,
.sn-foot-col a:hover {
  color: var(--sn-mint);
  text-decoration: none;
}

.sn-foot-h {
  font-size: 14px;
  font-weight: 500;
  color: var(--sn-silver);
  margin: 0 0 14px;
}

.sn-foot-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sn-foot-col li {
  margin-bottom: 10px;
}

.sn-foot-col a {
  font-size: 15px;
}

.sn-foot-bottom {
  box-sizing: content-box;
  max-width: var(--sn-maxw);
  margin: 0 auto;
  border-top: 1px solid var(--sn-grey);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 24px 24px 32px;
  font-size: 14px;
  color: var(--sn-silver);
}

.sn-foot-legal a {
  color: var(--sn-silver);
  margin-left: 20px;
}

.sn-foot-legal a:first-child {
  margin-left: 0;
}

.sn-foot-legal a:hover {
  color: var(--sn-mint);
  text-decoration: none;
}

.footer-language-selector .dropdown-toggle {
  color: var(--sn-silver);
}

/* ---------- Links on light: Ink text, Ink underline ---------- */
/* Titles-as-links stay Ink and gain the underline on hover */
.article-list-link:hover, .section-tree-title a:hover,
.search-result-title a:hover, .article-relatives a:hover,
.section-list-item a:hover, .see-all-articles:hover,
[data-garden-id="tables.cell"] a:hover,
.sn-page-body .breadcrumbs a:hover {
  color: var(--sn-ink) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--sn-ink) !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 5px;
}

.see-all-articles,
.article-return-to-top a {
  text-decoration: underline;
  text-decoration-color: var(--sn-ink);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.article-body a:hover,
.article-more-questions a:hover,
.comment-body a:hover {
  color: var(--sn-ink);
  text-decoration-thickness: 3px;
}

.comment-body a {
  color: var(--sn-ink);
  text-decoration: underline;
  text-decoration-color: var(--sn-ink);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

/* ---------- Pins against Guide colour settings ---------- */
/* Copenhagen paints many elements from the theme's colour settings
   (#3ED3B0, #147A62, #147A62, #0F1216).
   Guide keeps saved setting values across theme updates, so old values
   (mint #3ED3B0, green #147A62) would bleed through. Everything below
   pins those elements to the brand regardless of the settings. */

/* Header: Copenhagen's .logo span and .nav-wrapper-desktop a:hover
   out-rank our plain class rules */
.logo .sn-logo-label {
  color: var(--sn-silver);
}

.nav-wrapper-desktop .user-nav a:visited,
.nav-wrapper-desktop .user-nav a:focus,
.nav-wrapper-desktop .user-nav a:active {
  color: var(--sn-white);
}

.nav-wrapper-desktop .user-nav a:hover {
  color: var(--sn-mint);
}

.nav-wrapper-desktop .user-nav a.submit-a-request,
.nav-wrapper-desktop .user-nav a.submit-a-request:visited,
.nav-wrapper-desktop .user-nav a.submit-a-request:hover,
.nav-wrapper-desktop .user-nav a.submit-a-request:focus,
.nav-wrapper-desktop .user-nav a.submit-a-request:active {
  color: var(--sn-ink);
}

.nav-wrapper-desktop .user-nav a.sign-in:hover,
.nav-wrapper-desktop .user-nav a.sign-in:focus {
  color: var(--sn-ink);
}

.nav-wrapper-desktop .user-nav a.sign-in:visited {
  color: var(--sn-white);
}

/* Ask AI: secondary on Ink instead of a #147A62 block */
.ask-ai,
.nav-wrapper-desktop .ask-ai,
.nav-wrapper-desktop .ask-ai:visited,
.nav-wrapper-mobile .ask-ai,
.nav-wrapper-mobile .ask-ai:visited {
  background-color: transparent;
  border: 1px solid var(--sn-white);
  border-radius: var(--sn-radius-md);
  color: var(--sn-white);
}

.nav-wrapper-desktop .ask-ai:hover,
.nav-wrapper-desktop .ask-ai:focus,
.nav-wrapper-desktop .ask-ai:active,
.nav-wrapper-mobile .ask-ai:hover,
.nav-wrapper-mobile .ask-ai:focus,
.nav-wrapper-mobile .ask-ai:active {
  background-color: var(--sn-white);
  border-color: var(--sn-white);
  color: var(--sn-ink);
}

/* The mobile panel is light, so its Ask AI is secondary on light */
.nav-wrapper-mobile .menu-list-mobile .ask-ai,
.nav-wrapper-mobile .menu-list-mobile .ask-ai:visited {
  border-color: var(--sn-ink);
  color: var(--sn-ink);
}

.user-info > button,
.user-info > button:hover,
.user-info > button:focus,
.user-info > button::after {
  color: var(--sn-white);
}

/* Visited links never change colour */
a:visited {
  color: inherit;
}

/* Inline links in rich content: Ink text with a 2px Ink underline */
.article-body a, .article-body a:visited,
.comment-body a, .comment-body a:visited,
.post-body a, .post-body a:visited,
.service-catalog-description a, .service-catalog-description a:visited,
.article-more-questions a, .article-more-questions a:visited,
.comment-callout a, .comment-callout a:visited,
.search-results .no-results .action-prompt a,
.search-results .no-results .action-prompt a:visited {
  color: var(--sn-ink);
  text-decoration: underline;
  text-decoration-color: var(--sn-ink);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}

.article-body a:hover, .article-body a:active, .article-body a:focus,
.comment-body a:hover, .comment-body a:active, .comment-body a:focus,
.post-body a:hover, .post-body a:active, .post-body a:focus,
.service-catalog-description a:hover, .service-catalog-description a:active,
.service-catalog-description a:focus,
.article-more-questions a:hover, .article-more-questions a:focus,
.comment-callout a:hover, .comment-callout a:focus {
  color: var(--sn-ink);
  text-decoration-thickness: 3px;
}

/* Titles and nav links that Copenhagen paints with #147A62 */
.community a, .community a:visited, .community a:hover,
.recent-activity-controls a, .recent-activity-controls a:visited,
.recent-activity-controls a:hover,
.striped-list-title, .striped-list-title:visited,
.search-results-sidebar .see-all-filters,
.breadcrumbs li a:visited,
.form .suggestion-list li a:visited {
  color: var(--sn-ink);
}

.hero .breadcrumbs li a:visited {
  color: var(--sn-silver);
}

/* Topic cards: Copenhagen fills them with #3ED3B0 on hover */
.blocks-item:hover, .blocks-item:focus, .blocks-item:active,
.blocks-item:focus-within {
  background-color: var(--sn-white);
  outline-color: var(--sn-ink);
}

.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
  color: inherit;
}

.blocks-item:hover .blocks-item-title {
  color: var(--sn-ink);
}

.blocks-item:hover .blocks-item-description {
  color: var(--sn-grey);
}

.blocks-item-link:focus {
  box-shadow: none;
}

/* Search clear button */
.search .clear-button:hover {
  background-color: var(--sn-white);
}

.search .clear-button:focus {
  box-shadow: none;
}

[dir=ltr] .search-has-value input[type=search]:focus,
[dir=ltr] .search .clear-button:focus,
[dir=rtl] .search-has-value input[type=search]:focus,
[dir=rtl] .search .clear-button:focus {
  border-left-color: transparent;
  border-right-color: transparent;
}

/* Field focus borders */
.form-field input:focus,
.form-field input[type=text]:focus,
.form-field .nesty-input:focus,
.form-field .hc-multiselect-toggle:focus,
.collapsible-nav-toggle:focus,
.collapsible-sidebar-toggle:focus,
.request-main .form-field.comment-ccs > ul[data-hc-focus=true] {
  border-color: var(--sn-ink);
}

.request-main .comment-ccs + textarea:focus {
  border-top-color: var(--sn-ink);
}

/* Follow, subscribe and split buttons: secondary on light, Ink when on */
.subscriptions-subscribe button,
.requests-table-toolbar .organization-subscribe button,
.community-follow button, .article-subscribe button,
.section-subscribe button,
.subscriptions-subscribe button:visited,
.article-subscribe button:visited, .section-subscribe button:visited {
  border: 1px solid var(--sn-ink);
  color: var(--sn-ink);
  background-color: transparent;
}

.subscriptions-subscribe button:hover,
.community-follow button:hover,
.article-subscribe button:hover,
.section-subscribe button:hover,
.article-subscribe button.button-primary,
.section-subscribe button[data-selected=true],
.community-follow button[data-selected=true],
.split-button button,
.split-button button.button-primary {
  background-color: var(--sn-ink);
  border-color: var(--sn-ink);
  color: var(--sn-white);
  outline-color: var(--sn-ink);
}

.article-subscribe button.button-primary:hover,
.section-subscribe button[data-selected=true]:hover,
.community-follow button[data-selected=true]:hover,
.split-button button:hover {
  background-color: var(--sn-ink-hover);
  border-color: var(--sn-ink-hover);
}

.community-follow button::after,
.community-follow button:hover::after,
.community-follow button:focus::after,
.community-follow button[data-selected=true]::after {
  border-color: currentColor;
  color: inherit;
}

/* Votes, icons and section tabs */
.vote-up:hover, .vote-down:hover, .vote-voted, .vote-voted:hover,
.share a:hover, .comment-attachments a,
.icon-star, .article-comment-count-icon, .post-comment-count .icon-comments,
.search-result-votes-icon, .search-result-meta-count-icon,
.recent-activity-comment-icon svg {
  color: var(--sn-ink);
}

.avatar .icon-agent {
  color: var(--sn-mint);
  background-color: var(--sn-ink);
}

.collapsible-nav-list li[aria-selected=true],
.collapsible-nav-list li.current {
  border-bottom-color: var(--sn-ink);
}

.status-label-pinned, .status-label-featured, .status-label-official {
  background-color: var(--sn-ink);
  color: var(--sn-white);
}

.comment-wrapper.comment-official {
  border-color: var(--sn-line);
}

.profile-private-badge {
  border-color: var(--sn-ink);
  color: var(--sn-ink);
}

/* ---------- Tables in articles (brand v3) ---------- */
/* Header row Medium on Paper with Ink rules; Line row lines; no
   vertical lines, boxes or zebra striping */
.article-body table {
  border-collapse: collapse;
  border: 0;
  width: 100%;
}

.article-body th {
  background: var(--sn-paper);
  color: var(--sn-ink);
  font-weight: 500;
  text-align: left;
  border: 0;
  border-top: 1px solid var(--sn-ink);
  border-bottom: 1px solid var(--sn-ink);
  padding: 12px 14px;
}

.article-body td {
  border: 0;
  border-bottom: 1px solid var(--sn-line);
  padding: 12px 14px;
  color: var(--sn-ink);
}

.article-body tr:nth-child(even) td {
  background: transparent;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .blocks-item, .sn-qa-card, .sn-btn, .sn-chip,
  .nav-wrapper-desktop .user-nav a {
    transition: none;
  }
}