@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: #FEF9F3;
  color: #1D1B1B;
  font-family: QuiltSans, Inter, system-ui, 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: QuiltSerif, 'STIX Two Text', Georgia, 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: #2293A1;
  text-decoration: none;
}
a:visited {
  color: #6F6C6C;
}
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 #1D1B1B;
}
.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 #1D1B1B;
}
.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 #1D1B1B;
}

.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 #1D1B1B;
  border-radius: 4px;
  color: #1D1B1B;
  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: #1D1B1B;
}
.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: #1D1B1B;
  color: #FFFFFF;
  text-decoration: none;
}
.button.button-primary:hover, .button-primary.pagination-next-link:hover, .button-primary.pagination-prev-link:hover, .button-primary.pagination-first-link:hover, .button-primary.pagination-last-link:hover, .subscriptions-subscribe button.button-primary:hover, .subscriptions-subscribe button[data-selected=true]:hover, .requests-table-toolbar .organization-subscribe button.button-primary:hover, .requests-table-toolbar .organization-subscribe button[data-selected=true]:hover, .community-follow button.button-primary:hover, .article-subscribe button.button-primary:hover, .article-subscribe button[data-selected=true]:hover, .section-subscribe button.button-primary:hover, .section-subscribe button[data-selected=true]:hover, .split-button button:hover, .button.button-primary:focus, .button-primary.pagination-next-link:focus, .button-primary.pagination-prev-link:focus, .button-primary.pagination-first-link:focus, .button-primary.pagination-last-link:focus, .subscriptions-subscribe button.button-primary:focus, .subscriptions-subscribe button[data-selected=true]:focus, .requests-table-toolbar .organization-subscribe button.button-primary:focus, .requests-table-toolbar .organization-subscribe button[data-selected=true]:focus, .community-follow button.button-primary:focus, .article-subscribe button.button-primary:focus, .article-subscribe button[data-selected=true]:focus, .section-subscribe button.button-primary:focus, .section-subscribe button[data-selected=true]:focus, .split-button button.button-primary:focus, .button.button-primary:active, .button-primary.pagination-next-link:active, .button-primary.pagination-prev-link:active, .button-primary.pagination-first-link:active, .button-primary.pagination-last-link:active, .subscriptions-subscribe button.button-primary:active, .subscriptions-subscribe button[data-selected=true]:active, .requests-table-toolbar .organization-subscribe button.button-primary:active, .requests-table-toolbar .organization-subscribe button[data-selected=true]:active, .community-follow button.button-primary:active, .article-subscribe button.button-primary:active, .article-subscribe button[data-selected=true]:active, .section-subscribe button.button-primary:active, .section-subscribe button[data-selected=true]:active, .split-button button.button-primary:active {
  background-color: #000;
  border-color: #000;
}
.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: #1D1B1B;
  border: 0;
  border-radius: 4px;
  color: #FFFFFF;
  font-size: 14px;
  line-height: 2.72;
  min-width: 190px;
  padding: 0 1.9286em;
  width: 100%;
}
@media (min-width: 768px) {
  .button-large, .hbs-form input[type=submit] {
    width: auto;
  }
}
.button-large:visited, .hbs-form input[type=submit]:visited {
  color: #FFFFFF;
}
.button-large:hover, .button-large:active, .button-large:focus, .hbs-form input[type=submit]:hover, .hbs-form input[type=submit]:active, .hbs-form input[type=submit]:focus {
  background-color: #000;
}
.button-large[disabled], .hbs-form input[type=submit][disabled] {
  background-color: #ddd;
}

.button-secondary {
  color: #524c4c;
  border: 1px solid #848F99;
  background-color: transparent;
}
.button-secondary:visited {
  color: #524c4c;
}
.button-secondary:hover, .button-secondary:focus, .button-secondary:active {
  color: #1D1B1B;
  border: 1px solid #848F99;
  background-color: #fdf2e5;
}

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

.split-button button {
  background-color: #1D1B1B;
  border: 0;
  color: #FFFFFF;
  height: 32px;
  line-height: 16px;
  outline-color: #1D1B1B;
}

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

/***** Tables *****/
.table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}
@media (min-width: 768px) {
  .table {
    table-layout: auto;
  }
}
.table th,
.table th a {
  color: #524c4c;
  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 #1D1B1B;
}

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

.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 #1D1B1B;
  text-decoration: none;
}

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

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

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

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

.form-field .optional {
  color: #524c4c;
  margin-left: 4px;
}

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

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

.form footer a {
  color: #524c4c;
  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: #6F6C6C;
}

/***** 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: #1D1B1B;
}

.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: #2293A1;
  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: #2293A1;
  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: #1D1B1B;
  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: #1D1B1B;
}
.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;
}

/***** 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: #2293A1;
  min-width: 0;
  padding: 0;
  white-space: nowrap;
}
.user-info > button:hover, .user-info > button:focus {
  color: #2293A1;
  background-color: transparent;
}
.user-info > button::after {
  color: #2293A1;
  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: #1D1B1B;
  border: 2px solid #fff;
  border-radius: 50%;
  bottom: -4px;
  background-color: #FFFFFF;
  font-size: 17px;
  height: 17px;
  line-height: 17px;
  position: absolute;
  right: -2px;
  text-align: center;
  width: 17px;
}

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

.powered-by-zendesk a,
.powered-by-zendesk a:visited {
  color: #524c4c;
}

/***** Breadcrumbs *****/
.breadcrumbs {
  margin: 0 0 15px 0;
  padding: 0;
  display: flex;
}
@media (min-width: 768px) {
  .breadcrumbs {
    margin: 0;
  }
}
.breadcrumbs li {
  color: #524c4c;
  font-size: 13px;
  max-width: 450px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.breadcrumbs li + li::before {
  content: ">";
  margin: 0 4px;
}
.breadcrumbs li a:visited {
  color: #2293A1;
}

/***** 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: #1D1B1B;
}
.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: #1D1B1B;
  color: #fff;
}
.search .clear-button:focus {
  outline: 0;
  box-shadow: 0 0 0 3px #1D1B1B;
}
.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: #1D1B1B;
}
[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: #1D1B1B;
}

[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: #1D1B1B;
}
[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: #1D1B1B;
}

.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/01KN6EDGD1VKP9RV3BF6A55JP3);
  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 #1D1B1B;
  border-radius: 4px;
  box-sizing: border-box;
  color: #1D1B1B;
  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: #1D1B1B;
}
.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
  color: #FFFFFF;
  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: #1D1B1B;
}
.blocks-item-link {
  color: #1D1B1B;
  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 #1D1B1B;
  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/01KN6DAD1JA48RF9PSXFFNT3HD);
  background-position: center;
  background-repeat: no-repeat;
  max-width: 100%;
}
.community a {
  color: #2293A1;
  text-decoration: underline;
}
.community a:visited {
  color: #6F6C6C;
}
.community a:hover, .community a:active, .community a:focus {
  color: #1B7A87;
}

.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: #1D1B1B;
  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: #2293A1;
  text-decoration: underline;
}
.recent-activity-controls a:visited {
  color: #6F6C6C;
}
.recent-activity-controls a:hover, .recent-activity-controls a:active, .recent-activity-controls a:focus {
  color: #1B7A87;
}
.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: #1D1B1B;
  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: #1D1B1B;
}
.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: #1D1B1B;
}

.icon-star {
  color: #1D1B1B;
  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: #1D1B1B;
  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: #2293A1;
  text-decoration: underline;
}
.article-body a:visited {
  color: #6F6C6C;
}
.article-body a:hover, .article-body a:active, .article-body a:focus {
  color: #1B7A87;
}
.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: #fceddb;
}
.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: #fdf2e5;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.article-body pre {
  background: #fdf2e5;
  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: #524c4c;
  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: #524c4c;
}
.article-comment-count:hover {
  text-decoration: none;
}
.article-comment-count-icon {
  vertical-align: middle;
  color: #1D1B1B;
  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: #2293A1;
  text-decoration: underline;
}
.article-more-questions a:visited {
  color: #6F6C6C;
}
.article-more-questions a:hover, .article-more-questions a:active, .article-more-questions a:focus {
  color: #1B7A87;
}
.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: #1D1B1B;
  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: #1D1B1B;
  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: #524c4c;
}

/***** 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: #524c4c;
}
.share a:hover {
  text-decoration: none;
  color: #1D1B1B;
}
.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: #524c4c;
  display: inline-block;
  font-size: 13px;
  margin-bottom: 0;
}
.comment-callout a {
  color: #2293A1;
  text-decoration: underline;
}
.comment-callout a:visited {
  color: #6F6C6C;
}
.comment-callout a:hover, .comment-callout a:active, .comment-callout a:focus {
  color: #1B7A87;
}
.comment-sorter {
  display: inline-block;
  float: right;
}
.comment-sorter .dropdown-toggle {
  color: #524c4c;
  font-size: 13px;
}
[dir=rtl] .comment-sorter {
  float: left;
}
.comment-wrapper {
  display: flex;
  position: relative;
}
.comment-wrapper.comment-official {
  border: 1px solid #1D1B1B;
  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: #1D1B1B;
}
.comment-body {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  display: flow-root;
  font-family: QuiltSans, Inter, system-ui, sans-serif;
  line-height: 1.6;
  overflow-x: auto;
}
.comment-body a {
  color: #2293A1;
  text-decoration: underline;
}
.comment-body a:visited {
  color: #6F6C6C;
}
.comment-body a:hover, .comment-body a:active, .comment-body a:focus {
  color: #1B7A87;
}
.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: #fceddb;
}
.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: #fdf2e5;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.comment-body pre {
  background: #fdf2e5;
  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: #524c4c;
  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: #524c4c;
  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: #1D1B1B;
}

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

.vote-voted {
  color: #1D1B1B;
}

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

/***** 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/01KN5H7J071NCPP0225R73BHHQ);
  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: #1D1B1B;
}
.community-follow button:hover::after, .community-follow button:focus::after {
  border-color: #FFFFFF;
  color: #FFFFFF;
}
.community-follow button[data-selected=true] {
  background-color: #1D1B1B;
  color: #FFFFFF;
}
.community-follow button[data-selected=true]::after {
  border-left: 1px solid #FFFFFF;
  color: #FFFFFF;
}
.community-follow button[data-selected=true]:hover {
  background-color: #000;
  border-color: #000;
}
.community-follow button::after {
  border-left: 1px solid #1D1B1B;
  content: attr(data-follower-count);
  color: #1D1B1B;
  display: inline-block;
  font-family: QuiltSerif, 'STIX Two Text', Georgia, 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 #1D1B1B;
  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: #2293A1;
  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: #6F6C6C;
}
.striped-list .meta-group {
  margin: 5px 0;
}
.striped-list-count {
  color: #524c4c;
  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: #1D1B1B;
    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: #1D1B1B;
}
.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: #524c4c;
}
.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: QuiltSans, Inter, system-ui, 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: #2293A1;
  text-decoration: underline;
}
.post-body a:visited {
  color: #6F6C6C;
}
.post-body a:hover, .post-body a:active, .post-body a:focus {
  color: #1B7A87;
}
.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: #fceddb;
}
.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: #fdf2e5;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.post-body pre {
  background: #fdf2e5;
  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: #524c4c;
  font-style: italic;
  padding: 0 15px;
}
.post-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}
.post-comment-count {
  color: #524c4c;
}
.post-comment-count:hover {
  text-decoration: none;
}
.post-comment-count .icon-comments {
  color: #1D1B1B;
  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 #1D1B1B;
}

.collapsible-nav-list {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .collapsible-nav-list {
    flex-direction: row;
  }
}
.collapsible-nav-list li {
  color: #1D1B1B;
  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: #1D1B1B;
  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 #1D1B1B;
    order: 1;
  }
}
.collapsible-nav-list li[aria-selected=true] a,
.collapsible-nav-list li.current a {
  color: #1D1B1B;
}

.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 #1D1B1B;
}
.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: #fceddb;
  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: #524c4c;
  font-size: 13px;
}
@media (min-width: 768px) {
  .contributions-table td:last-child {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
  }
}

.no-activities {
  color: #524c4c;
}

/***** Request *****/
.request-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 1024px) {
  .request-container {
    align-items: flex-start;
    flex-direction: row;
  }
}
.request-container .comment-container {
  min-width: 0;
}
.request-breadcrumbs {
  margin-bottom: 40px;
}
@media (min-width: 1024px) {
  .request-breadcrumbs {
    margin-bottom: 60px;
  }
}
.request-main {
  flex: 1 0 auto;
  order: 1;
}
.request-main .comment-fields, .request-main .request-submit-comment {
  display: none;
}
.request-main .comment-fields.shown {
  display: block;
}
.request-main .request-submit-comment.shown {
  display: inline;
}
@media (min-width: 1024px) {
  .request-main {
    flex: 0 0 66%;
    order: 0;
    min-width: 0;
  }
}
.request-main .comment-form-controls {
  display: block;
}
.request-main .comment-ccs {
  display: block;
}
.request-main .comment-show-container {
  border-radius: 2px;
  border: 1px solid #ddd;
  color: #524c4c;
  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 #1D1B1B;
}
.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 #1D1B1B;
}
.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: #fdf2e5;
    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: #524c4c;
  width: 40%;
}
.request-details .request-collaborators {
  display: inline-block;
}
.request-attachments dt, .request-attachments dd {
  width: 100%;
}
.request-attachments dd {
  margin: 10px 0 0 0;
}
.request-form textarea {
  min-height: 120px;
}
.request-follow-up {
  padding-top: 20px;
}

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

/***** Metadata *****/
.meta-group {
  display: block;
}

.meta-group-opposite {
  float: right;
}

[dir=rtl] .meta-group-opposite {
  float: left;
}

.meta-group * {
  display: inline;
}

.meta-data {
  color: #524c4c;
  font-size: 13px;
}
.meta-data:not(:last-child)::after {
  content: "·";
  margin: 0 5px;
}

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

.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: #524c4c;
  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 #1D1B1B;
  border-radius: 4px;
  color: #1D1B1B;
  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: #fceddb;
  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: #524c4c;
  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: #524c4c;
  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: #fdf2e5;
}
@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: #FEF9F3;
  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: #1D1B1B;
}
.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: #2293A1;
}
.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: #2293A1;
}
.search-results .no-results .action-prompt a:visited {
  color: #2293A1;
}

.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: #524c4c;
  font-size: 13px;
}
.search-result-votes-icon, .search-result-meta-count-icon {
  color: #1D1B1B;
  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/01KN5H7KEFDJ0S5WDZPTJZ6KHQ);
  margin-bottom: 10px;
  height: 320px;
}
.service-catalog-description {
  display: flow-root;
}
.service-catalog-description a {
  color: #2293A1;
  text-decoration: underline;
}
.service-catalog-description a:visited {
  color: #6F6C6C;
}
.service-catalog-description a:hover, .service-catalog-description a:active, .service-catalog-description a:focus {
  color: #1B7A87;
}
.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: #fceddb;
}
.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: #fdf2e5;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.service-catalog-description pre {
  background: #fdf2e5;
  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: #524c4c;
  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;
}

/* ======================================================
   Quilt Brand Theme overrides
   Colors, type, and shape aligned to the Quilt design system
   (source of truth: ds/tokens.css, Figma file feAHABjxkuT1QLjNlQY8XS —
   snapshot 2026-04-13). Keep this block in sync with that file when
   the design system changes; re-copy the values below rather than
   hand-tweaking individual hex codes here.
   ====================================================== */

/* ---------- QuiltSerif (display / headings) ---------- */
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G0CCRX0WAA6E5X67RR7HQ) format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G0E117ZCJ4WP676NR46P6) format("woff2"); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G09APP73NR6KTX2R0P05E) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G0AT4QTSW0QYKVZZR723Q) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G0FNPQ1RYES18Y8SYGS56) format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G0H5WWRFFWC309QG512PE) format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G0648ENMQ3NCHJS3JMY5P) format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSerif"; src: url(/hc/theming_assets/01KX2G07XYQ3RKZJ90BYBG4JS1) format("woff2"); font-weight: 700; font-style: italic; font-display: swap; }

/* ---------- QuiltSans (body / UI) ---------- */
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2FZZVEXQBQP4VEWW761CXM) format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2G019SAYJ7SCSH7FVNNVDZ) format("woff2"); font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2FZXM8WVXJZ9RBZGBYTFH8) format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2FZYCD45S388RRZ64RAXD6) format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2G0350Z08N85RSMPHMMNA4) format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2G04JWKYE2KY1Z9F64XMEA) format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2FZTP8580H1QTRW73G5PZ6) format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "QuiltSans"; src: url(/hc/theming_assets/01KX2FZW6V7MZC44T088HR8WXC) format("woff2"); font-weight: 700; font-style: italic; font-display: swap; }

:root {
  /* Surface + background */
  --quilt-surface-page:      #FEF9F3;
  --quilt-surface-raised:    #FFFFFF;
  --quilt-surface-subtle:    #EDE7E0;
  --quilt-surface-sunken:    #D8D1C9;
  --quilt-bg-brand:          #1D1B1B;
  --quilt-bg-brand-hover:    #272525;
  --quilt-bg-brand-pressed:  #4A4848;
  --quilt-bg-cool-subtle:    #F0FAFB;
  --quilt-bg-heat-subtle:    #FFF2EF;

  /* Text */
  --quilt-text-default:      #1D1B1B;
  --quilt-text-on-brand:     #FFFFFF;
  --quilt-text-soft:         #6F6C6C;
  --quilt-text-muted:        #A3998E;
  --quilt-text-cool:         #2293A1;
  --quilt-text-cool-hover:   #1B7A87;
  --quilt-text-heat:         #FF8368;
  --quilt-text-heat-strong:  #CE4A2C;  /* 4.53:1 on white, 4.32:1 on cream */


  /* Border / icon */
  --quilt-border-default:    #D8D1C9;
  --quilt-border-subtle:     #EDE7E0;
  --quilt-icon-cool:         #2293A1;
  --quilt-icon-subtle:       #897E72;

  /* Shape */
  --quilt-radius-control:    8px;
  --quilt-radius-pill:       9999px;

  /* Spacing on quilt.com's scale (4/8/12/16/24/32/48/64). */
  --quilt-space-2xs:  4px;
  --quilt-space-xs:   8px;
  --quilt-space-sm:  12px;
  --quilt-space-md:  16px;
  --quilt-space-lg:  24px;
  --quilt-space-xl:  32px;
  --quilt-space-2xl: 48px;
  --quilt-space-3xl: 64px;
  --quilt-radius-card:       16px;
  --quilt-radius-card-lg:    24px;
  --quilt-shadow-sm:         0 1px 2px 0 rgb(0 0 0 / 0.05);
  --quilt-shadow-focus:      0 0 0 3px rgb(34 147 161 / 0.15);

  /* Type */
  --quilt-font-serif: "QuiltSerif", "STIX Two Text", Georgia, serif;
  --quilt-font-sans:  "QuiltSans", Inter, system-ui, sans-serif;
}

body {
  background-color: var(--quilt-surface-page) !important;
  color: var(--quilt-text-default) !important;
  font-family: var(--quilt-font-sans) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--quilt-font-serif) !important;
  font-weight: 400 !important;
  color: var(--quilt-text-default) !important;
  letter-spacing: -0.01em;
}

a {
  color: var(--quilt-text-cool);
}
a:hover, a:active {
  color: var(--quilt-text-cool-hover);
}
a:visited {
  color: var(--quilt-text-soft);
}

strong, b, .strong {
  font-weight: 500;
}

/* Header */
.header {
  background-color: var(--quilt-surface-raised) !important;
  border-bottom: 1px solid var(--quilt-border-subtle);
}
.logo .wordmark {
  font-family: var(--quilt-font-serif) !important;
  font-size: 24px;
  font-weight: 400;
  color: var(--quilt-text-default) !important;
  letter-spacing: -0.01em;
  line-height: 1;
  display: inline-block;
}
.user-nav-list a,
.user-nav-list button {
  font-family: var(--quilt-font-sans);
  color: var(--quilt-text-default);
  font-weight: 400;
}

/* Footer */
.footer {
  background-color: var(--quilt-surface-page) !important;
  border-top: 1px solid var(--quilt-border-subtle);
  color: var(--quilt-text-soft);
}
.footer a {
  color: var(--quilt-text-soft);
}

/* Buttons — rounded controls (matches ds/tokens.css radius-control-sm),
   not the old pill shape */
.button,
.button-primary,
.button-secondary,
.button-large,
input[type="submit"] {
  font-family: var(--quilt-font-sans) !important;
  border-radius: var(--quilt-radius-control) !important;
  font-weight: 500 !important;
  border: none;
  padding: 12px 24px;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.button,
.button-primary {
  background-color: var(--quilt-bg-brand) !important;
  color: var(--quilt-text-on-brand) !important;
}
.button:hover,
.button-primary:hover {
  background-color: var(--quilt-bg-brand-hover) !important;
  color: var(--quilt-text-on-brand) !important;
}
.button:active,
.button-primary:active {
  background-color: var(--quilt-bg-brand-pressed) !important;
}
.button-secondary {
  background-color: transparent !important;
  color: var(--quilt-text-default) !important;
  border: 1px solid var(--quilt-border-default) !important;
}
.button-secondary:hover {
  background-color: var(--quilt-bg-brand) !important;
  border-color: var(--quilt-bg-brand) !important;
  color: var(--quilt-text-on-brand) !important;
}

/* Search field — rounded control, not the stock 30px pill */
.search {
  border-color: var(--quilt-border-default);
  border-radius: var(--quilt-radius-control);
}
.search:focus-within {
  border-color: var(--quilt-text-cool);
  box-shadow: var(--quilt-shadow-focus);
}
.search input[type=search],
.search .clear-button {
  border-radius: var(--quilt-radius-control);
  background-color: var(--quilt-surface-raised);
}
.search input[type=search] {
  color: var(--quilt-text-default);
}
.search-icon {
  color: var(--quilt-icon-subtle);
}
.search .clear-button:hover {
  background-color: var(--quilt-bg-brand);
}
.search .clear-button:focus {
  box-shadow: 0 0 0 3px var(--quilt-bg-brand);
}

/* Home-page tiles. NOTE: .category-container and .section-container were
   originally in this selector, but those are the page-level wrappers on the
   category and section pages — it turned each whole page into a card with a
   hover glow. Scoped back to the tile this was written for. */
.blocks-item {
  background-color: var(--quilt-surface-raised) !important;
  border: 1px solid var(--quilt-border-default) !important;
  border-radius: var(--quilt-radius-card-lg) !important;
  box-shadow: var(--quilt-shadow-sm);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.blocks-item:hover {
  border-color: var(--quilt-text-cool) !important;
  box-shadow: var(--quilt-shadow-sm), 0 0 0 3px rgb(34 147 161 / 0.08);
}
.blocks-item-link {
  border-radius: var(--quilt-radius-card-lg) !important;
}


/* Home page hero rebuild — mirrors the Support & Knowledge Base mockup */
.hero {
  background-image: none !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 72px 24px 24px !important;
  margin-bottom: 0 !important;
  text-align: center;
}
.hero-inner {
  position: static !important;
  top: auto !important;
  transform: none !important;
  max-width: 640px !important;
  margin: 0 auto !important;
}
.search-row {
  position: relative;
}
.hero-eyebrow {
  font-family: var(--quilt-font-sans);
  font-size: clamp(0.688rem, 0.089vw + 0.67rem, 0.75rem);
  font-weight: 700;
  letter-spacing: 0.175rem;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--quilt-text-default);
  margin: 0 0 clamp(2rem, 1.714rem + 1.429vw, 3rem);
}
.hero-title {
  font-family: var(--quilt-font-serif) !important;
  font-weight: 400 !important;
  font-size: 56px;
  line-height: 1.05;
  margin: 0 0 40px;
  color: var(--quilt-text-default);
  letter-spacing: -0.01em;
}
@media (max-width: 640px) {
  .hero-title {
    font-size: 36px;
  }
}

.contact-cta {
  text-align: center;
  padding: 0 24px 56px;
}
.contact-cta-text {
  font-family: var(--quilt-font-sans);
  font-size: 18px;
  color: var(--quilt-text-default);
  margin: 0 0 24px;
}
.contact-cta-text a {
  color: var(--quilt-text-cool);
  text-decoration: underline;
}
.contact-cta-buttons {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}
.contact-cta-buttons .button {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  font-size: 15px !important;
}


/* Single "Visit the Knowledge Base" CTA replacing category tiles */
.kb-cta {
  margin-top: 24px;
  padding: 12px 32px !important;
  font-size: 16px !important;
  border-radius: var(--quilt-radius-control) !important;
}


/* Knowledge Base category page — single-column accordion of sections */
.category-container {
  display: block !important;
  width: 100%;
}
.category-content {
  max-width: 720px;
  margin: 0 auto;
  width: 100%;
}
.section-tree--accordion {
  display: block !important;
  flex-wrap: nowrap !important;
}

.section-accordion {
  border-bottom: 1px solid var(--quilt-border-default);
}
.section-accordion:first-child {
  border-top: 1px solid var(--quilt-border-default);
}

.section-accordion-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 4px;
  cursor: pointer;
  list-style: none;
}
.section-accordion-summary::-webkit-details-marker {
  display: none;
}
.section-accordion-title {
  font-family: var(--quilt-font-serif);
  font-size: 22px;
  font-weight: 400;
  color: var(--quilt-text-default);
  letter-spacing: -0.01em;
}
.section-accordion-chevron {
  flex-shrink: 0;
  color: var(--quilt-text-soft);
  transition: transform 0.15s ease;
}
.section-accordion[open] > .section-accordion-summary .section-accordion-chevron {
  transform: rotate(180deg);
}

.section-accordion-body {
  padding: 0 4px 24px;
}
.section-accordion-body .article-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.section-accordion-body .article-list-item {
  padding: 10px 0;
  font-size: 16px;
  border-top: 1px solid var(--quilt-border-default);
}
.section-accordion-body .article-list-item:first-child {
  border-top: none;
}
.section-accordion-body .article-list-link {
  font-family: var(--quilt-font-sans);
  color: var(--quilt-text-cool);
  text-decoration: none;
}
.section-accordion-body .article-list-link:hover {
  color: var(--quilt-text-cool-hover);
  text-decoration: underline;
}
.section-accordion-empty {
  font-family: var(--quilt-font-sans);
  font-size: 15px;
  color: var(--quilt-text-soft);
  margin: 8px 0 0;
}
.see-all-articles {
  display: inline-block;
  margin-top: 12px;
  font-family: var(--quilt-font-sans);
  font-size: 15px;
  color: var(--quilt-text-cool);
}

/* Nested subsection accordions */
.section-accordion--sub {
  margin: 4px 0 4px 4px;
  border-bottom: none;
  border-top: 1px solid var(--quilt-border-default);
}
.section-accordion--sub .section-accordion-summary {
  padding: 14px 4px;
}
.section-accordion--sub .section-accordion-title {
  font-family: var(--quilt-font-sans);
  font-size: 16px;
  font-weight: 500;
}

/* Article page — inline callouts (e.g. "Before you start" boxes editors
   add via the rich-text editor's highlight/quote block) pick up the cool
   accent instead of the stock Zendesk yellow */
.article-body blockquote {
  background-color: var(--quilt-bg-cool-subtle);
  border-left: none;
  border-radius: var(--quilt-radius-card);
  padding: 16px 20px;
  color: var(--quilt-text-default);
}

/* "Was this article helpful?" — selected vote (Copenhagen swaps in
   .button-primary via the {{vote}} helper's selected_class, already
   styled above); tint yes/no differently once selected */
/* Selected: the tint and border carry the state, the label stays readable.
   Colouring the label instead gave 3.43:1 (teal) and 2.21:1 (coral) on these
   backgrounds, both under 4.5:1. */
.article-vote-up.button-primary {
  background-color: var(--quilt-bg-cool-subtle) !important;
  border: 1px solid var(--quilt-text-cool) !important;
  color: var(--quilt-text-default) !important;
}
.article-vote-down.button-primary {
  background-color: var(--quilt-bg-heat-subtle) !important;
  border: 1px solid var(--quilt-text-heat-strong) !important;
  color: var(--quilt-text-default) !important;
}

/* Chat-choice prompt shown when the search bar detects an existing
   Messaging conversation (see script.js: showChoicePrompt) */
.js-chat-choice {
  background-color: #FFFFFF;
  border: 1px solid var(--quilt-border-default);
  border-radius: var(--quilt-radius-card);
  box-shadow: 0 4px 16px rgba(29, 27, 27, 0.12);
  padding: 16px;
  z-index: 9999;
}
.js-chat-choice-text {
  margin: 0 0 12px;
  font-size: 14px;
  color: var(--quilt-text-default);
}
.js-chat-choice .button {
  margin-right: 8px;
  margin-bottom: 0;
}
/* =============================================================================
   Quilt — Zendesk Guide: iframe support + optional site parity
   Append to the END of style.css.

   PREREQUISITE: delete the earlier "Quilt brand layer" block first. It starts
   at the banner `Quilt brand layer — Zendesk Guide ("Quilt KB v1")` and runs
   to the end of the file. This patch assumes it is gone.

   This deliberately adds NO tokens, fonts or colors: the theme's existing
   --quilt-* layer already covers those correctly.
   ============================================================================= */

/* -----------------------------------------------------------------------------
   1. Embedded mode
   document_head.hbs sets data-embedded on <html> when the help center renders
   inside an iframe. quilt.com supplies the chrome, so hide ours and let the
   host background show through.
   -------------------------------------------------------------------------- */
:root[data-embedded] .header,
:root[data-embedded] .footer,
:root[data-embedded] .skip-navigation{display:none}

:root[data-embedded] body{background:transparent}
:root[data-embedded] main{padding-top:0}

/* -----------------------------------------------------------------------------
   2. Embedded type parity
   Standalone, the theme's 56px/1.05 hero is its own identity and stays as-is.
   Inside quilt.com it drops to the site's display scale so it doesn't compete
   with the host page's typography.
   Values from quilt.com: --ds-display 48/56/-.8, eyebrow 11px/.08em.
   -------------------------------------------------------------------------- */
:root[data-embedded] .hero-title{
  font-size:48px;
  line-height:56px;
  letter-spacing:-.8px;
}
:root[data-embedded] .hero-eyebrow{
  font-size:11px;
  letter-spacing:.08em;
}

@media (max-width:600px){
  :root[data-embedded] .hero-title{
    font-size:36px;
    line-height:44px;
    letter-spacing:-.4px;
  }
}

/* -----------------------------------------------------------------------------
   3. OPTIONAL — pill buttons, matching quilt.com
   The theme sets 8px via --quilt-radius-control with !important, so this needs
   !important too, and must name .kb-cta explicitly to match that rule's reach.
   Delete this block to keep the theme's 8px.

   Alternative, if you'd rather every control go pill (inputs and selects
   included): drop this block and instead redefine the token —
       :root{ --quilt-radius-control:9999px; }
   which flows through the existing rules with no !important needed.
   -------------------------------------------------------------------------- */
.button,
.button-primary,
.button-secondary,
.button-large,
.kb-cta,
input[type="submit"]{
  border-radius:var(--quilt-radius-pill) !important;
}


/* -----------------------------------------------------------------------------
   5. Browse + Docs (home page)
   Built on the theme's existing --quilt-* tokens; adds no new tokens.
   Browse cards render from real Zendesk sections. Docs cards are hand-authored
   in home_page.hbs, since those PDFs aren't Guide content.
   -------------------------------------------------------------------------- */
.browse,
.docs{
  margin-block:var(--quilt-space-2xl);
}

.browse-heading,
.docs-heading{
  /* font-family inherited from the theme's h1-h6 rule (--quilt-font-serif) */
  font-size:30px;
  line-height:38px;
  margin:0 0 var(--quilt-space-md);
}

/* Shared grid so Docs cards line up with the Browse columns above them. */
.browse-grid,
.docs-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--quilt-space-md);
}
@media (max-width:900px){
  .browse-grid,
  .docs-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .browse-grid,
  .docs-grid{grid-template-columns:1fr}
}

.browse-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--quilt-space-xs);
  padding:var(--quilt-space-lg);
  background:var(--quilt-surface-raised);
  border:1px solid var(--quilt-border-subtle);
  border-radius:var(--quilt-radius-card);
  color:inherit;
  text-decoration:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.browse-card:hover{
  border-color:var(--quilt-border-default);
  box-shadow:var(--quilt-shadow-sm);
}
.browse-card:focus-visible{
  outline:2px solid var(--quilt-text-cool);
  outline-offset:2px;
}

/* Icons are masks, so colour comes from a token instead of being baked into
   each SVG. Swapping one is a single declaration at the bottom of this file. */
.browse-card-icon{
  display:block;
  width:24px;
  height:24px;
  margin-bottom:4px;
  background-color:var(--quilt-icon-cool);
  -webkit-mask-repeat:no-repeat;   mask-repeat:no-repeat;
  -webkit-mask-position:center;    mask-position:center;
  -webkit-mask-size:24px 24px;     mask-size:24px 24px;
}

.browse-card-title{
  display:flex;
  align-items:center;
  gap:6px;
  font-family:var(--quilt-font-sans);
  font-weight:500;
  font-size:16px;
  line-height:24px;
}
.browse-card-text{
  font-family:var(--quilt-font-sans);
  font-size:14px;
  line-height:20px;
  color:var(--quilt-text-soft);
}

/* Docs cards open PDFs in a new tab, so they carry an outbound marker.
   .visibility-hidden (already in the theme) announces it to screen readers. */
.docs-card-ext{
  width:14px;
  height:14px;
  flex:none;
  background-color:var(--quilt-text-muted);
  -webkit-mask-repeat:no-repeat;   mask-repeat:no-repeat;
  -webkit-mask-position:center;    mask-position:center;
  -webkit-mask-size:14px 14px;     mask-size:14px 14px;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7'/%3E%3Cpath d='M8.5 7H17v8.5'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7'/%3E%3Cpath d='M8.5 7H17v8.5'/%3E%3C/svg%3E");
}
.browse-card:hover .docs-card-ext{
  background-color:var(--quilt-text-default);
}

/* --- icon mapping -------------------------------------------------------- */
.docs-card .browse-card-icon{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2.8H6.8a1.8 1.8 0 0 0-1.8 1.8v14.8a1.8 1.8 0 0 0 1.8 1.8h10.4a1.8 1.8 0 0 0 1.8-1.8V7.8z'/%3E%3Cpath d='M14 2.8V8h5'/%3E%3Cpath d='M8.6 13h6.8M8.6 16.6h6.8'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2.8H6.8a1.8 1.8 0 0 0-1.8 1.8v14.8a1.8 1.8 0 0 0 1.8 1.8h10.4a1.8 1.8 0 0 0 1.8-1.8V7.8z'/%3E%3Cpath d='M14 2.8V8h5'/%3E%3Cpath d='M8.6 13h6.8M8.6 16.6h6.8'/%3E%3C/svg%3E");
}

/* General */
.browse-card[data-section-id="50471969059731"] .browse-card-icon{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.2 12 3.2l9 7'/%3E%3Cpath d='M5.4 9.6V20a1 1 0 0 0 1 1h11.2a1 1 0 0 0 1-1V9.6'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.2 12 3.2l9 7'/%3E%3Cpath d='M5.4 9.6V20a1 1 0 0 0 1 1h11.2a1 1 0 0 0 1-1V9.6'/%3E%3C/svg%3E");
}
/* Troubleshooting */
.browse-card[data-section-id="50472136703635"] .browse-card-icon{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18.7 3.6a4.6 4.6 0 0 0-6 6l-8 8a1.9 1.9 0 1 0 2.7 2.7l8-8a4.6 4.6 0 0 0 6-6l-2.8 2.8-2.4-.6-.6-2.4z'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18.7 3.6a4.6 4.6 0 0 0-6 6l-8 8a1.9 1.9 0 1 0 2.7 2.7l8-8a4.6 4.6 0 0 0 6-6l-2.8 2.8-2.4-.6-.6-2.4z'/%3E%3C/svg%3E");
}
/* Installation */
.browse-card[data-section-id="50472002705811"] .browse-card-icon{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6.5V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v1.5'/%3E%3Crect x='2.5' y='6.5' width='19' height='13' rx='2'/%3E%3Cpath d='M2.5 12.6h19'/%3E%3Cpath d='M10 12.6v2.6h4v-2.6'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6.5V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v1.5'/%3E%3Crect x='2.5' y='6.5' width='19' height='13' rx='2'/%3E%3Cpath d='M2.5 12.6h19'/%3E%3Cpath d='M10 12.6v2.6h4v-2.6'/%3E%3C/svg%3E");
}
/* Maintenance and Cleaning */
.browse-card[data-section-id="50471852390163"] .browse-card-icon{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16 22-1-4'/%3E%3Cpath d='M19 14a1 1 0 0 0 1-1v-1a2 2 0 0 0-2-2h-3a1 1 0 0 1-1-1V4a2 2 0 0 0-4 0v5a1 1 0 0 1-1 1H6a2 2 0 0 0-2 2v1a1 1 0 0 0 1 1'/%3E%3Cpath d='M19 14H5l-1.973 6.767A1 1 0 0 0 4 22h16a1 1 0 0 0 .973-1.233z'/%3E%3Cpath d='m8 22 1-4'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m16 22-1-4'/%3E%3Cpath d='M19 14a1 1 0 0 0 1-1v-1a2 2 0 0 0-2-2h-3a1 1 0 0 1-1-1V4a2 2 0 0 0-4 0v5a1 1 0 0 1-1 1H6a2 2 0 0 0-2 2v1a1 1 0 0 0 1 1'/%3E%3Cpath d='M19 14H5l-1.973 6.767A1 1 0 0 0 4 22h16a1 1 0 0 0 .973-1.233z'/%3E%3Cpath d='m8 22 1-4'/%3E%3C/svg%3E");
}
/* Hardware */
.browse-card[data-section-id="50472076016147"] .browse-card-icon{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='2.75' y='6.75' width='18.5' height='7.5' rx='1.25' stroke='black' stroke-width='1.5'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 16.5C15 16.0858 15.3358 15.75 15.75 15.75L19.75 15.75C20.1642 15.75 20.5 16.0858 20.5 16.5C20.5 16.9142 20.1642 17.25 19.75 17.25L15.75 17.25C15.3358 17.25 15 16.9142 15 16.5Z' fill='black'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='2.75' y='6.75' width='18.5' height='7.5' rx='1.25' stroke='black' stroke-width='1.5'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M15 16.5C15 16.0858 15.3358 15.75 15.75 15.75L19.75 15.75C20.1642 15.75 20.5 16.0858 20.5 16.5C20.5 16.9142 20.1642 17.25 19.75 17.25L15.75 17.25C15.3358 17.25 15 16.9142 15 16.5Z' fill='black'/%3E%3C/svg%3E");
}
/* Pricing and Rebates */
.browse-card[data-section-id="50472039483155"] .browse-card-icon{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12.4V4.2a1.2 1.2 0 0 1 1.2-1.2h8.2a1.2 1.2 0 0 1 .85.35l7.6 7.6a1.2 1.2 0 0 1 0 1.7l-8.2 8.2a1.2 1.2 0 0 1-1.7 0l-7.6-7.6A1.2 1.2 0 0 1 3 12.4z'/%3E%3Ccircle cx='8' cy='8' r='1.5'/%3E%3C/svg%3E");
          mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12.4V4.2a1.2 1.2 0 0 1 1.2-1.2h8.2a1.2 1.2 0 0 1 .85.35l7.6 7.6a1.2 1.2 0 0 1 0 1.7l-8.2 8.2a1.2 1.2 0 0 1-1.7 0l-7.6-7.6A1.2 1.2 0 0 1 3 12.4z'/%3E%3Ccircle cx='8' cy='8' r='1.5'/%3E%3C/svg%3E");
}

/* -----------------------------------------------------------------------------
   6. Row cards — section and category listings
   One component for anything that lists things to pick from: child sections,
   articles, and (later) sections on the category page. Uses the theme's
   existing --quilt-* tokens.
   -------------------------------------------------------------------------- */
.row-card-list{
  list-style:none;
  margin:0 0 var(--quilt-space-xl);
  padding:0;
  display:flex;
  flex-direction:column;
  gap:var(--quilt-space-sm);
}
.row-card-list li{
  margin:0;
  padding:0;
  border:none;
}

.row-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--quilt-space-md);
  padding:var(--quilt-space-md) var(--quilt-space-lg);
  background:var(--quilt-surface-raised);
  border:1px solid var(--quilt-border-subtle);
  border-radius:var(--quilt-radius-card);
  color:inherit;
  text-decoration:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.row-card:hover{
  border-color:var(--quilt-border-default);
  box-shadow:var(--quilt-shadow-sm);
}
.row-card:focus-visible{
  outline:2px solid var(--quilt-text-cool);
  outline-offset:2px;
}

.row-card-body{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.row-card-title{
  font-family:var(--quilt-font-sans);
  font-weight:500;
  font-size:18px;
  line-height:26px;
  color:var(--quilt-text-cool);
}
.row-card-meta{
  font-family:var(--quilt-font-sans);
  font-size:14px;
  line-height:20px;
  color:var(--quilt-text-soft);
}
.row-card-chevron{
  flex:none;
  width:16px;
  height:16px;
  color:var(--quilt-icon-subtle);
  transition:color .15s ease;
}
.row-card:hover .row-card-chevron{
  color:var(--quilt-text-default);
}

/* Eyebrow above a page title, matching the home hero's treatment. */
.page-header-eyebrow{
  /* .page-header becomes a baseline-aligned row at >=768px, so without this
     the eyebrow sits on the same line as the title and Follow button. */
  flex:0 0 100%;
  font-family: var(--quilt-font-sans);
  font-size: clamp(0.688rem, 0.089vw + 0.67rem, 0.75rem);
  font-weight: 700;
  letter-spacing: 0.175rem;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--quilt-text-default);
  margin: 0 0 clamp(2rem, 1.714rem + 1.429vw, 3rem);
}

/* This theme's section_page.hbs renders no sidebar, but Copenhagen's layout
   still reserves 20% for one and right-aligns the content, leaving an empty
   left gutter. Reclaim the full width. */
.section-container{
  justify-content:flex-start;
}
@media (min-width:1024px){
  .section-content{
    flex:1 1 100%;
    max-width:100%;
  }
}

/* -----------------------------------------------------------------------------
   7. Search results
   Brings results into the same card language as Browse, Docs and section pages.
   -------------------------------------------------------------------------- */
.search-results-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:var(--quilt-space-sm);
}
.search-results-list > li{
  margin:0;
  padding:0;
  border:none;
}
.search-results-list > li > article{
  padding:var(--quilt-space-md) var(--quilt-space-lg);
  background:var(--quilt-surface-raised);
  border:1px solid var(--quilt-border-subtle);
  border-radius:var(--quilt-radius-card);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.search-results-list > li > article:hover{
  border-color:var(--quilt-border-default);
  box-shadow:var(--quilt-shadow-sm);
}

.search-result-title{
  margin:0;
}
.search-result-title a{
  font-family:var(--quilt-font-sans);
  font-weight:500;
  font-size:18px;
  line-height:26px;
  color:var(--quilt-text-cool);
  text-decoration:none;
}
.search-result-title a:hover{
  color:var(--quilt-text-cool-hover);
  text-decoration:underline;
  text-underline-offset:2px;
}

.search-result-breadcrumbs{
  margin:2px 0 0;
  font-family:var(--quilt-font-sans);
  font-size:13px;
  line-height:18px;
  color:var(--quilt-text-muted);
}
.search-result-breadcrumbs a{
  color:var(--quilt-text-muted);
}
.search-result-breadcrumbs a:hover{
  color:var(--quilt-text-soft);
}

.search-result-description{
  margin:var(--quilt-space-xs) 0 0;
  font-family:var(--quilt-font-sans);
  font-size:15px;
  line-height:22px;
  color:var(--quilt-text-soft);
}

/* A public vote tally on a help article reads as a rating, and a negative one
   ("-1") undermines the answer without telling the reader anything useful.
   Delete this rule to bring it back. */
.search-result-votes{
  display:none;
}

/* Sidebar filters */
.search-results-sidebar .sidenav-item.current{
  color:var(--quilt-text-cool);
  font-weight:500;
}

/* -----------------------------------------------------------------------------
   8. Article page
   The only screen here that gets read rather than scanned, so it follows
   quilt.com's long-form settings rather than Copenhagen's defaults.
   -------------------------------------------------------------------------- */
.article-title{
  font-size:36px;
  line-height:44px;
  letter-spacing:-.4px;
}

/* Was 15px/24px at roughly 94 characters per line. quilt.com's body-lg is
   18/28; the measure cap keeps lines near 65-70 characters so the eye finds
   the next line reliably. */
.article-body{
  font-size:18px;
  line-height:28px;
  color:var(--quilt-text-default);
  /* 34em = ~612px at 18px, which measures out to ~68 characters. Set in em
     rather than ch: Quilt Sans's zero glyph is wider than its average
     character, so 68ch actually rendered 78 characters per line. */
  max-width:34em;
}
.article-body p,
.article-body li{
  font-size:18px;
  line-height:28px;
}
.article-body li + li{
  margin-top:var(--quilt-space-xs);
}

/* "Articles in this section" */
.article-sidebar .sidenav-item{
  font-family:var(--quilt-font-sans);
  font-size:15px;
  line-height:22px;
}
.article-sidebar .sidenav-item:hover,
.article-sidebar .sidenav-item.current{
  color:var(--quilt-text-cool);
}

/* -----------------------------------------------------------------------------
   9. Header logo
   The wordmark is now the Quilt logo from quilt.com rather than the help
   center's name as text, so .logo .wordmark and .logo span above are inert.
   -------------------------------------------------------------------------- */
.logo .wordmark-logo{
  display:block;
  width:auto;
  height:22px;
  color:var(--quilt-text-default);
}
.logo a:hover .wordmark-logo{
  color:var(--quilt-text-soft);
}

/* Header geometry mirrors quilt.com so the transition from the main site is
   seamless. Theirs is `grid-template-columns: 1fr minmax(0, 87.67%) 1fr` at
   80px tall on desktop (60px below lg), i.e. a percentage column with no
   max-width - not a fixed band. --quilt-site-gutter is (100 - 87.67) / 2. */
:root{
  /* quilt.com nests two constraints: an outer grid column of 87.67% (so a
     6.165% gutter each side), and inside it .inner--content capped at
     --width-content: 68rem (1088px) with margin-inline:auto. The effective
     content edge is whichever is larger, which is the cap on wide screens and
     the percentage on narrow ones. */
  --quilt-site-gutter: max(6.165%, calc((100% - 68rem) / 2));
  --quilt-header-height: 80px;
}
.header{
  max-width:none;
  width:100%;
  margin-inline:0;
  box-sizing:border-box;
  height:var(--quilt-header-height);
  padding-inline:var(--quilt-site-gutter);
}
@media (max-width:1023px){
  :root{ --quilt-header-height:60px; }
}

/* Page content follows the same column, so the logo, nav and everything below
   share one left edge. Without this the header would match quilt.com but stop
   lining up with the page it sits above. */
.container{
  max-width:none;
  width:100%;
  margin-inline:0;
  box-sizing:border-box;
  padding-inline:var(--quilt-site-gutter);
}

/* -----------------------------------------------------------------------------
   10. Hero
   Left-aligned onto the same 1160px band as the header and page content, and
   given a white background so header + hero read as one top zone against the
   cream content below — which is what keeps the white cards legible.
   -------------------------------------------------------------------------- */
.hero{
  box-sizing:border-box;
  background:transparent;
  text-align:left;
  padding:72px var(--quilt-site-gutter) 48px !important;
}
.hero-inner{
  max-width:640px !important;
  margin:0 !important;
}

/* -----------------------------------------------------------------------------
   11. Colour blocking, flipped
   Cream hero band between a white header and a white content area. Cards are
   cream so they still read as surfaces; the page background is set on the body
   rule above, which carries !important.
   -------------------------------------------------------------------------- */

/* -----------------------------------------------------------------------------
   12. Contact path — article CTA, request form, contact disclosure
   -------------------------------------------------------------------------- */

/* Article footer: "Still having trouble? / Contact support" */
.contact-cta-band{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--quilt-space-md);
  flex-wrap:wrap;
  margin:var(--quilt-space-2xl) 0 0;
  padding:var(--quilt-space-lg) var(--quilt-space-xl);
  background:var(--quilt-bg-cool-subtle);
  border-radius:var(--quilt-radius-card);
}
.contact-cta-band-text{
  margin:0;
  font-family:var(--quilt-font-sans);
  font-size:18px;
  line-height:26px;
  color:var(--quilt-text-default);
}

/* Request form page */
.request-headline{
  margin:0 0 var(--quilt-space-xl);
}

/* The form is rendered by Zendesk's React bundle with styled-components, whose
   class hashes change on their deploys. These selectors lean on element types
   and the stable component-name prefix, not the hash. */
/* Values taken from quilt.com's form (.fui-label / .fui-input / .fui-submit). */
#new-request-form label,
#new-request-form [class*="StyledLabel"]{
  font-family:var(--quilt-font-sans);
  font-size:14px;
  line-height:20px;
  font-weight:500;
  color:var(--quilt-text-default);
  margin-bottom:6px;
}
#new-request-form input[type="text"],
#new-request-form input[type="email"],
#new-request-form input[type="tel"],
#new-request-form textarea,
#new-request-form [class*="StyledTextInput"],
#new-request-form [class*="StyledTextarea"]{
  font-family:var(--quilt-font-sans);
  font-size:16px;
  line-height:24px;
  color:var(--quilt-text-default);
  background:var(--quilt-surface-raised);
  border:1px solid var(--quilt-border-default);
  border-radius:var(--quilt-radius-control);
  padding:12px 16px;
}
#new-request-form input:hover,
#new-request-form textarea:hover,
#new-request-form [class*="StyledTextInput"]:hover,
#new-request-form [class*="StyledTextarea"]:hover{
  box-shadow:var(--quilt-shadow-hover-ring, 0 0 0 3px rgb(216 209 201 / .4), 0 1px 2px 0 rgb(0 0 0 / .05));
}
#new-request-form input:focus,
#new-request-form textarea:focus{
  border-color:var(--quilt-text-cool);
  box-shadow:var(--quilt-shadow-focus);
  outline:none;
}
#new-request-form [class*="StyledHint"]{
  font-family:var(--quilt-font-sans);
  font-size:14px;
  color:var(--quilt-text-soft);
}
#new-request-form button[type="submit"]{
  width:auto;
  padding:18px 40px;
  border:none;
  border-radius:var(--quilt-radius-pill);
  background:var(--quilt-bg-brand);
  color:var(--quilt-text-on-brand);
  font-family:var(--quilt-font-sans);
  font-weight:400;
  font-size:clamp(0.875rem, 0.089vw + 0.857rem, 0.938rem);
  line-height:1.5;
  letter-spacing:normal;
}
#new-request-form button[type="submit"]:hover{
  background:var(--quilt-bg-brand-hover);
}

/* Contact disclosure */
/* .form is capped at 650px, so the note and disclosure match it rather than
   running the full 1160px container. */
.request-form-note{
  max-width:650px;
  margin:var(--quilt-space-sm) 0 0;
  font-family:var(--quilt-font-sans);
  font-size:14px;
  line-height:21px;
  color:var(--quilt-text-muted);
}
.contact-disclosure{
  max-width:650px;
  margin:var(--quilt-space-xl) 0 var(--quilt-space-3xl);
}
.contact-disclosure-summary{
  display:inline-block;
  cursor:pointer;
  font-family:var(--quilt-font-sans);
  font-size:15px;
  line-height:22px;
  color:var(--quilt-text-soft);
  text-decoration:underline;
  text-underline-offset:2px;
}
.contact-disclosure-summary:hover{
  color:var(--quilt-text-default);
}
.contact-disclosure-summary:focus-visible{
  outline:2px solid var(--quilt-text-cool);
  outline-offset:2px;
}
.contact-disclosure-body{
  margin-top:var(--quilt-space-md);
  padding:var(--quilt-space-lg);
  background:var(--quilt-surface-raised);
  border:1px solid var(--quilt-border-subtle);
  border-radius:var(--quilt-radius-card);
  color:var(--quilt-text-default);
  font-family:var(--quilt-font-sans);
}
.contact-disclosure-body p{
  margin:0 0 var(--quilt-space-sm);
}
.contact-disclosure-body p:last-child{
  margin-bottom:0;
}
.contact-disclosure-lead{
  display:flex;
  align-items:center;
  gap:var(--quilt-space-xs);
  font-weight:700;
}
.contact-disclosure-icon{
  flex:none;
  color:var(--quilt-text-cool);
}
.contact-disclosure-label{
  margin-top:var(--quilt-space-lg) !important;
  font-size:clamp(0.688rem, 0.089vw + 0.67rem, 0.75rem);
  font-weight:700;
  letter-spacing:0.175rem;
  text-transform:uppercase;
  color:var(--quilt-text-default);
}
.contact-disclosure-phone{
  font-size:18px;
  font-weight:700;
  letter-spacing:0.02em;
}
.contact-disclosure-phone a{
  color:var(--quilt-text-cool);
  text-decoration:none;
}
.contact-disclosure-phone a:hover{
  text-decoration:underline;
}
.contact-disclosure-note{
  font-size:15px;
  color:var(--quilt-text-soft);
}
.contact-disclosure-hours{
  font-size:14px;
  line-height:21px;
  color:var(--quilt-text-soft);
}

/* -----------------------------------------------------------------------------
   13. Article vote control
   .button and .button-primary share a fill rule, so the base class renders as
   a primary button. The vote controls use plain .button, which made Yes and No
   two competing solid-black pills. Give the unselected state secondary weight
   so the selected state above actually reads as selected.
   -------------------------------------------------------------------------- */
.article-vote:not(.button-primary){
  background-color:transparent !important;
  color:var(--quilt-text-default) !important;
  border:1px solid var(--quilt-border-default) !important;
}
.article-vote:not(.button-primary):hover{
  background-color:var(--quilt-hover-subtle, rgb(29 27 27 / .06)) !important;
  border-color:var(--quilt-text-default) !important;
}

/* -----------------------------------------------------------------------------
   14. Site nav in the header
   Mirrors quilt.com's header links. The header is a flex row with
   space-between, so this sits centred between the logo and the user nav.
   -------------------------------------------------------------------------- */
/* quilt.com centres its nav in the viewport (lg:absolute lg:left-0 lg:right-0
   lg:m-auto) rather than letting it sit in flow, so its position does not
   depend on the width of whatever is to its right. Matching that is what makes
   the logo-to-nav distance line up. */
.site-nav{
  position:absolute;
  left:0;
  right:0;
  margin-inline:auto;
  width:max-content;
  top:50%;
  transform:translateY(-50%);
}
.site-nav-list{
  display:flex;
  align-items:center;
  /* quilt.com uses lg:space-x-m, i.e. --space-m */
  gap:clamp(1.5rem, 1.2857rem + 1.0714vw, 2.25rem);
  list-style:none;
  margin:0;
  padding:0;
}
.site-nav-list a{
  font-family:var(--quilt-font-sans);
  /* quilt.com's .type-nav: 28px in the mobile menu, overridden to a flat 14px
     at min-width 1024px. These links only show above 920px, so 14px it is. */
  font-size:14px;
  line-height:1.5;
  font-weight:400;
  color:var(--quilt-text-default);
  text-decoration:none;
  white-space:nowrap;
  transition:color .3s ease;
}
.site-nav-list a:hover,
.site-nav-list a:focus-visible{
  color:#3A3A3A;  /* quilt.com's "tungsten" hover */
}
.site-nav-list a:focus-visible{
  outline:2px solid var(--quilt-text-cool);
  outline-offset:2px;
}

/* Copenhagen's header collapses to a mobile menu below 768px; these links are
   not in that menu, so hide them rather than let them wrap under the logo. */
@media (max-width:920px){
  .site-nav{display:none}
}