@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-family: 'Montserrat', sans-serif;
  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-family: 'Montserrat', sans-serif;
  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-family: 'Montserrat', sans-serif;
  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;
}

/* BEGIN Life Fitness Montserrat font (added 2025-06-05 Fran) removed on 2025-06-23 as it didn't work for others.

@font-face {
   font-family: 'Montserrat';
   src: local('Montserrat');
   src: url( asset_url 'Montserrat-Regular.eot');
   src: url( asset_url 'Montserrat-Regular.eot?#iefix') format('embedded-opentype'),
          url( asset_url 'Montserrat-Regular.woff2') format('woff2'),
          url( asset_url 'Montserrat-Regular.woff') format('woff'),
          url( asset_url 'Montserrat-Regular.ttf') format('truetype'),
          url( asset_url 'Montserrat-Regular.svg#montserratregular') format('svg');
   font-weight: normal;
   font-style: normal;
 }

END Life Fitness Montserrat font */

/* BEGIN Life Fitness Montserrat font (added 2025-06-23 Fran)

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src:
    url("{{ 'Montserrat-Regular.woff2' | asset_url }}") format('woff2'),
    url("{{ 'Montserrat-Regular.woff'  | asset_url }}") format('woff');
}

END Life Fitness Montserrat font */


body {
  background-color: rgba(255, 255, 255, 1);
  color: #333333;
  /*font-family: 'Lucida Grande', 'Lucida Sans', 'Lucida Sans Unicode', sans-serif;*/
  font-family: 'Montserrat', 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: 'Arial Black', Arial, 'Helvetica Neue', Helvetica, sans-serif;*/
  font-family: 'Montserrat', sans-serif;
  margin-top: 0;
}

h1 {
  font-size: 32px;
}

h2 {
  font-size: 22px;
}

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

h4 {
  font-size: 16px;
}

a {
  color: #0072EF;
  text-decoration: none;
}
a:visited {
  color: #9358B0;
}
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 rgba(166, 25, 46, 1);
}
.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 #ddd;
  border-radius: 4px;
  padding: 8px 30px 8px 10px;
  outline: none;
  color: #555;
  width: 100%;
}
.hbs-form select:focus, .search select:focus {
  border: 1px solid rgba(166, 25, 46, 1);
}
.hbs-form select::-ms-expand, .search select::-ms-expand {
  display: none;
}
.hbs-form textarea, .search textarea {
  border: 1px solid #ddd;
  border-radius: 2px;
  resize: vertical;
  width: 100%;
  outline: none;
  padding: 10px;
}
.hbs-form textarea:focus, .search textarea:focus {
  border: 1px solid rgba(166, 25, 46, 1);
}

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

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

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

.button-secondary {
  color: #666;
  border: 1px solid #ddd;
  background-color: transparent;
}
.button-secondary:visited {
  color: #666;
}
.button-secondary:hover, .button-secondary:focus, .button-secondary:active {
  color: #333333;
  border: 1px solid #ddd;
  background-color: #f7f7f7;
}

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

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

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

/***** Tables *****/
.table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}
@media (min-width: 768px) {
  .table {
    table-layout: auto;
  }
}
.table th,
.table th a {
  color: #666;
  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 #ddd;
  border-radius: 4px;
  padding: 10px;
  width: 100%;
}
.form-field input:focus {
  border: 1px solid rgba(166, 25, 46, 1);
}

.form-field input[type=text] {
  border: 1px solid #ddd;
  border-radius: 4px;
}
.form-field input[type=text]:focus {
  border: 1px solid rgba(166, 25, 46, 1);
}

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

.form-field .nesty-input {
  border-radius: 4px;
  border: 1px solid #ddd;
  height: 40px;
  line-height: 40px;
  outline: none;
  vertical-align: middle;
}
.form-field .nesty-input:focus {
  border: 1px solid rgba(166, 25, 46, 1);
  text-decoration: none;
}

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

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

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

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

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

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

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

.form footer a {
  color: #666;
  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: #9358B0;
}

/* Limit number of suggested article results */

ul[class^="sc-"] > li:nth-of-type(n+6) {
  display: none;
}

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

.logo img {
  max-height: 37px;
  vertical-align: middle;
}

.logo span {
  margin: 0 10px;
  color: rgba(166, 25, 46, 1);
}

.logo a {
  display: inline-block;
}

.logo a:hover, .logo a:focus, .logo a:active {
  text-decoration: none;
}

.user-nav {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
}
@media (min-width: 768px) {
  .user-nav {
    position: relative;
  }
}
.user-nav[aria-expanded=true] {
  background-color: #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: #0072EF;
  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: #0072EF;
  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: #333333;
  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: #333333;
}
.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: #0072EF;
  min-width: 0;
  padding: 0;
  white-space: nowrap;
}
.user-info > button:hover, .user-info > button:focus {
  color: #0072EF;
  background-color: transparent;
}
.user-info > button::after {
  color: #0072EF;
  padding-right: 15px;
}
[dir=rtl] .user-info > button::after {
  padding-left: 15px;
  padding-right: 0;
}

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

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

.avatar {
  display: inline-block;
  position: relative;
}
.avatar img {
  height: 40px;
  width: 40px;
}
.avatar .icon-agent {
  color: rgba(166, 25, 46, 1);
  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: #666;
}
.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: #666;
  display: inline-block;
}

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

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

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

.search {
  border-color: #ddd;
  border-radius: 30px;
  border-style: solid;
  border-width: 1px;
  display: flex;
  position: relative;
  transition: border 0.12s ease-in-out;
}
.search:focus-within {
  border-color: rgba(166, 25, 46, 1);
}
.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: rgba(166, 25, 46, 1);
  color: #fff;
}
.search .clear-button:focus {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(166, 25, 46, 1);
}
.search-has-value .clear-button {
  display: flex;
}

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

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

.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/01JZWA5N17E7D5ZK1RQJ9T4GQ9);
  background-position: center;
  background-size: cover;
  height: 250px;
  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 rgba(166, 25, 46, 1);
  border-radius: 4px;
  box-sizing: border-box;
  color: rgba(166, 25, 46, 1);
  display: flex;
  flex: 1 0 340px;
  margin: 0 0 30px;
  max-width: 100%;
  text-align: center;
}
@media (min-width: 768px) {
  .blocks-item {
    margin: 0 15px 30px;
  }
}
.blocks-item:hover, .blocks-item:focus, .blocks-item:active {
  background-color: rgba(166, 25, 46, 1);
}
.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: #333333;
}
.blocks-item-link {
  color: rgba(166, 25, 46, 1);
  padding: 20px 30px;
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  border-radius: inherit;
}
.blocks-item-link:visited, .blocks-item-link:hover, .blocks-item-link:active {
  color: inherit;
  text-decoration: none;
}
.blocks-item-link:focus {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(166, 25, 46, 1);
  text-decoration: none;
}
.blocks-item-title {
  margin-bottom: 0;
  font-size: 26px;
}
.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/01JB14PKF9W42VB4P54RVEYM68);
  background-position: center;
  background-repeat: no-repeat;
  max-width: 100%;
}
.community a {
  color: #0072EF;
  text-decoration: underline;
}
.community a:visited {
  color: #9358B0;
}
.community a:hover, .community a:active, .community a:focus {
  color: #0F3554;
}

.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: #333333;
  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: #0072EF;
  text-decoration: underline;
}
.recent-activity-controls a:visited {
  color: #9358B0;
}
.recent-activity-controls a:hover, .recent-activity-controls a:active, .recent-activity-controls a:focus {
  color: #0F3554;
}
.recent-activity-accessibility-label {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}
.recent-activity-comment-icon svg {
  vertical-align: middle;
  color: rgba(166, 25, 46, 1);
  width: 16px;
  height: 16px;
}
.recent-activity-comment-icon:after {
  content: attr(data-comment-count);
  margin-left: 3px;
}
[dir=rtl] .recent-activity-comment-icon:after {
  margin-left: 0;
  margin-right: 3px;
}

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

.section-tree {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .section-tree {
    flex-direction: row;
  }
}
.section-tree .section {
  flex: initial;
  max-width: 100%;
}
@media (min-width: 768px) {
  .section-tree .section {
    flex: 0 0 45%; /* 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: #333333;
}
.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: #333333;
}

.icon-star {
  color: rgba(166, 25, 46, 1);
  font-size: 18px;
}

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

.section-list-item {
  border-bottom: 1px solid #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: #333333;
  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: 5px;
}
.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: #0072EF;
  text-decoration: underline;
}
.article-body a:visited {
  color: #9358B0;
}
.article-body a:hover, .article-body a:active, .article-body a:focus {
  color: #0F3554;
}
.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: #f2f2f2;
}
.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: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.article-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}
.article-body blockquote {
  border-left: 1px solid #ddd;
  color: #666;
  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: #666;
}
.article-comment-count:hover {
  text-decoration: none;
}
.article-comment-count-icon {
  vertical-align: middle;
  color: rgba(166, 25, 46, 1);
  width: 18px;
  height: 18px;
}
.article-sidebar {
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  flex: 1 0 auto;
  margin-bottom: 20px;
  padding: 40px;
}
@media (min-width: 1024px) {
  .article-sidebar {
    border: 0;
    flex: 0 0 30%;
    height: auto;
    max-width: 30%;
  }
}
.article-relatives {
  border-top: 1px solid #ddd;
  display: flex;
  flex-direction: column;
  padding: 10px 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: #0072EF;
  text-decoration: underline;
}
.article-more-questions a:visited {
  color: #9358B0;
}
.article-more-questions a:hover, .article-more-questions a:active, .article-more-questions a:focus {
  color: #0F3554;
}
.article-return-to-top {
  border-top: 1px solid #ddd;
}
@media (min-width: 1024px) {
  .article-return-to-top {
    display: none;
  }
}
.article-return-to-top a {
  color: #333333;
  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: #333333;
  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: #666;
}

/***** 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: #666;
}
.share a:hover {
  text-decoration: none;
  color: rgba(166, 25, 46, 1);
}
.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: #666;
  display: inline-block;
  font-size: 13px;
  margin-bottom: 0;
}
.comment-callout a {
  color: #0072EF;
  text-decoration: underline;
}
.comment-callout a:visited {
  color: #9358B0;
}
.comment-callout a:hover, .comment-callout a:active, .comment-callout a:focus {
  color: #0F3554;
}
.comment-sorter {
  display: inline-block;
  float: right;
}
.comment-sorter .dropdown-toggle {
  color: #666;
  font-size: 13px;
}
[dir=rtl] .comment-sorter {
  float: left;
}
.comment-wrapper {
  display: flex;
  position: relative;
}
.comment-wrapper.comment-official {
  border: 1px solid rgba(166, 25, 46, 1);
  padding: 40px 20px 20px;
}
@media (min-width: 768px) {
  .comment-wrapper.comment-official {
    padding-top: 20px;
  }
}
.comment-info {
  min-width: 0;
  padding-right: 20px;
  width: 100%;
}
[dir=rtl] .comment-info {
  padding-right: 0;
  padding-left: 20px;
}
.comment-author {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
@media (min-width: 768px) {
  .comment-author {
    justify-content: space-between;
  }
}
.comment-avatar {
  margin-right: 10px;
}
[dir=rtl] .comment-avatar {
  margin-left: 10px;
  margin-right: 0;
}
.comment-meta {
  flex: 1 1 auto;
}
.comment-labels {
  flex-basis: 100%;
}
@media (min-width: 768px) {
  .comment-labels {
    flex-basis: auto;
  }
}
.comment .status-label:not(.status-label-official) {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .comment .status-label:not(.status-label-official) {
    margin-top: 0;
  }
}
.comment-form {
  display: flex;
  padding-top: 30px;
  word-wrap: break-word;
}
.comment-container {
  width: 100%;
}
.comment-form-controls {
  display: none;
  margin-top: 10px;
  text-align: left;
}
@media (min-width: 768px) {
  [dir=ltr] .comment-form-controls {
    text-align: right;
  }
}
.comment-form-controls input[type=submit] {
  margin-top: 15px;
}
@media (min-width: 1024px) {
  .comment-form-controls input[type=submit] {
    margin-left: 15px;
  }
  [dir=rtl] .comment-form-controls input[type=submit] {
    margin-left: 0;
    margin-right: 15px;
  }
}
.comment-form-controls input[type=checkbox] {
  margin-right: 5px;
}
.comment-form-controls input[type=checkbox] [dir=rtl] {
  margin-left: 5px;
}
.comment-ccs {
  display: none;
}
.comment-ccs + textarea {
  margin-top: 10px;
}
.comment-attachments {
  margin-top: 10px;
}
.comment-attachments a {
  color: rgba(166, 25, 46, 1);
}
.comment-body {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  display: flow-root;
  /*font-family: 'Lucida Grande', 'Lucida Sans', 'Lucida Sans Unicode', sans-serif;*/
  font-family: 'Montserrat', sans-serif;
  line-height: 1.6;
  overflow-x: auto;
}
.comment-body a {
  color: #0072EF;
  text-decoration: underline;
}
.comment-body a:visited {
  color: #9358B0;
}
.comment-body a:hover, .comment-body a:active, .comment-body a:focus {
  color: #0F3554;
}
.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: #f2f2f2;
}
.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: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.comment-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}
.comment-body blockquote {
  border-left: 1px solid #ddd;
  color: #666;
  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: #666;
  display: block;
  margin: 3px 0;
}
[dir=rtl] .vote-sum {
  direction: ltr;
  unicode-bidi: bidi-override;
}

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

.vote-up:hover,
.vote-down:hover {
  color: rgba(166, 25, 46, 1);
}

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

.vote-voted {
  color: rgba(166, 25, 46, 1);
}

.vote-voted:hover {
  color: #4d0c15;
}

/***** 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/01JB14PKF9W42VB4P54RVEYM68);
  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: rgba(166, 25, 46, 1);
}
.community-follow button:hover::after, .community-follow button:focus::after {
  border-color: #FFFFFF;
  color: #FFFFFF;
}
.community-follow button[data-selected=true] {
  background-color: rgba(166, 25, 46, 1);
  color: #FFFFFF;
}
.community-follow button[data-selected=true]::after {
  border-left: 1px solid #FFFFFF;
  color: #FFFFFF;
}
.community-follow button[data-selected=true]:hover {
  background-color: #4d0c15;
  border-color: #4d0c15;
}
.community-follow button::after {
  border-left: 1px solid rgba(166, 25, 46, 1);
  content: attr(data-follower-count);
  color: rgba(166, 25, 46, 1);
  display: inline-block;
  /*font-family: 'Arial Black', Arial, 'Helvetica Neue', Helvetica, sans-serif;*/
  font-family: 'Montserrat', sans-serif;
  margin-left: 15px;
  padding-left: 10px;
  position: absolute;
  right: 10px;
}
@media (min-width: 768px) {
  .community-follow button::after {
    position: static;
  }
}
[dir=rtl] .community-follow button::after {
  border-left: 0;
  border-right: 1px solid rgba(166, 25, 46, 1);
  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: #0072EF;
  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: #9358B0;
}
.striped-list .meta-group {
  margin: 5px 0;
}
.striped-list-count {
  color: #666;
  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: #333333;
    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: rgba(166, 25, 46, 1);
}
.status-label-official {
  border-radius: 0;
  margin-right: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  width: 100%;
}
@media (min-width: 768px) {
  .status-label-official {
    border-radius: 0 0 4px 4px;
    right: 30px;
    width: auto;
  }
}
[dir=rtl] .status-label-official {
  left: 30px;
  right: auto;
}
.status-label-not-planned, .status-label-closed {
  background-color: #e9ebed;
  color: #666;
}
.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: 'Lucida Grande', 'Lucida Sans', 'Lucida Sans Unicode', sans-serif;*/
  font-family: 'Montserrat', 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: #0072EF;
  text-decoration: underline;
}
.post-body a:visited {
  color: #9358B0;
}
.post-body a:hover, .post-body a:active, .post-body a:focus {
  color: #0F3554;
}
.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: #f2f2f2;
}
.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: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.post-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}
.post-body blockquote {
  border-left: 1px solid #ddd;
  color: #666;
  font-style: italic;
  padding: 0 15px;
}
.post-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}
.post-comment-count {
  color: #666;
}
.post-comment-count:hover {
  text-decoration: none;
}
.post-comment-count .icon-comments {
  color: rgba(166, 25, 46, 1);
  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 rgba(166, 25, 46, 1);
}

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

.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 rgba(166, 25, 46, 1);
}
.collapsible-sidebar-body {
  display: none;
}
@media (min-width: 1024px) {
  .collapsible-sidebar-body {
    display: block;
  }
}
.collapsible-sidebar[aria-expanded=true] {
  max-height: none;
}
.collapsible-sidebar[aria-expanded=true] .collapsible-sidebar-body {
  display: block;
}

/***** My activities *****/
.my-activities-nav {
  background-color: #f2f2f2;
  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: #666;
  font-size: 13px;
}
@media (min-width: 768px) {
  .contributions-table td:last-child {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
  }
}

.no-activities {
  color: #666;
}

/***** 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: #666;
  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 rgba(166, 25, 46, 1);
}
.request-main .form-field.comment-ccs > input[type=text] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}
.request-main .comment-ccs + textarea {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  margin-top: 0;
}
.request-main .comment-ccs + textarea:focus {
  border-top: 1px solid rgba(166, 25, 46, 1);
}
.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: #f7f7f7;
    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%;
}
.request-details dd::after {
  content: "\a";
  white-space: pre;
}
.request-details dt {
  color: #666;
  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: #666;
  font-size: 13px;
}
.meta-data:not(:last-child)::after {
  content: "·";
  margin: 0 5px;
}

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

.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: #666;
  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 rgba(166, 25, 46, 1);
  border-radius: 4px;
  color: rgba(166, 25, 46, 1);
  padding: 5px 20px;
  font-size: 12px;
  text-align: center;
}
.profile-private-badge .profile-private-icon {
  margin-left: 5px;
  line-height: 15px;
}
@media (min-width: 768px) {
  .profile-private-badge {
    flex-basis: auto;
  }
}

.profile-nav {
  background-color: #f2f2f2;
  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: #666;
  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: #666;
  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: #f7f7f7;
}
@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: rgba(255, 255, 255, 1);
  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: #333333;
}
.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: #0072EF;
}
.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: #0072EF;
}
.search-results .no-results .action-prompt a:visited {
  color: #0072EF;
}

.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: #666;
  font-size: 13px;
}
.search-result-votes-icon, .search-result-meta-count-icon {
  color: rgba(166, 25, 46, 1);
  vertical-align: middle;
  width: 13px;
  height: 13px;
}
[dir=ltr] .search-result-votes, [dir=ltr] .search-result-meta-count {
  margin-left: 20px;
}
[dir=rtl] .search-result-votes, [dir=rtl] .search-result-meta-count {
  margin-right: 20px;
}
.search-result-meta-container {
  color: #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-family: 'Montserrat', 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 #ddd;
}

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

/***** 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;
}
/* Container styling to align the translate widget */
.translate-widget-container {
  text-align: left; /* Align left, similar to title */
  width: 100%; /* Full width */
  margin: 10px 0; /* Adjust vertical spacing */
}

/* Style the Google Translate widget dropdown */
#google_translate_element {
  display: inline-block;
  font-size: 0.9em;  /* Adjust font size if necessary */
}

.goog-te-combo {
  background-color: #f5f5f5; /* Background color to match theme */
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  font-size: 0.85em;
}

/*2025-11-24 (Fran) adding the below script to adjust article body width */
@media (min-width: 1024px) {
  .article {
    max-width: 100%;
  }
  
  .container,
  .header,
  .footer-inner{
    max-width:80vw;
  }
}
/* 2024-11-24 (Fran) end of the script */

.redirect-button {
  display: inline-block;
  padding: 10px 20px;
  background-color: #d32f2f;
  color: white;
  text-decoration: none;
  font-weight: bold;
  border-radius: 5px;
  transition: background 0.3s;
}

.redirect-button:hover {
  background-color: #b71c1c;
}


/* Custom Category Block Styles used to create blocks in articles Fran 2025-03-03 */
/* Custom Category Block Styles */
.custom-category-block {
  display: block;
  padding: 20px;
  margin-bottom: 20px;
  background-color: #f9f9f9; /* Block background */
  border: 1px solid #ddd;    /* Border */
  border-radius: 4px;
  text-decoration: none;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
.custom-category-block:hover {
  background-color: #ececec;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
.custom-category-block-title {
  margin: 0;
  font-size: 40px;
  color: #333;
}

/* END of Custom Category Block Styles used to create blocks in articles Fran 2025-03-03 */

/* ─────────────────────────────────────────────────────────────
   Custom “top links” container (right of logo, left of language selector) Fran 2025-06-05
───────────────────────────────────────────────────────────── */
.custom-top-links {
  display: inline-flex;
  align-items: left;
  margin-left: 24px; /* space from logo; adjust as needed */
}

.custom-top-link {
  font-family: {{settings.text_font}};
  font-size: inherit;
  color: {{settings.text_color}};
  text-decoration: none;
  margin-right: 18px; /* space between each phrase */
}

.custom-top-link:last-child {
  margin-right: 15px;
}

.custom-top-link:hover {
  color: {{settings.link_color}};
  text-decoration: underline;
}

/* added by Fran 2025-06-27 to create standard "Note" box in KBA text */
.wysiwyg-callout--note{
  background-color:#def991;   /* gentle green: #e8f5e9 */
  border-left:4px solid #2e7d32; /* darker green accent bar */
  padding:3px 30px;
  border-radius:0px;
  margin:1.25rem 0;
  color:#1b1b1b;
   /* I removed this: font-size:1rem;            normally keep text size consistent but in our case it was making the font 1 bigger*/
}
/* added by Fran 2025-06-27 to create standard "Note" box in KBA text END */

/* “Important” call-out – orange/yellow highlight */
.wysiwyg-callout--important {
  background: #fff4d6;     /* light amber */
  border-left: 4px solid #f26e3a;  /* bold orange accent initially used was #ffa500*/
  padding: 1rem;           /* keep the same inner spacing */
  font-size: inherit;      /* stays aligned with normal paragraph size */
  margin:1.25rem 0;
  color: #3d2c00;          /* dark text for good contrast */
}
 /* FINAL failsafe version */
.wysiwyg-callout.wysiwyg-callout--warning,
[data-callout-type="warning"] {
  background: #fdeaea !important;   /* light red */
  border-left: 4px solid #a6192e !important; /*oroginal color here was #d72c0d */
  color: #611a15 !important;
  padding: 1rem !important;
  font-size: inherit !important;
  margin: 1.5rem 0 !important;
}

.wysiwyg-callout.wysiwyg-callout--warning p,
[data-callout-type="warning"] p { margin: 0 !important; }

/* Fran – 2025-09-18 – User Segment icon visibility */

/* Ensure the header flows: Title → (Icons+Follow row) → Author */
.article-header {
  display: block;
}

/* Slightly tighter spacing under the title */
.article-header .article-title {
  margin-bottom: 8px;
}

/* Row that holds: user-segment icons (left side of the cluster) + Follow button (right),
   and the whole cluster is RIGHT-aligned */
.article-header-top,
.article-header-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;   /* push the whole cluster to the RIGHT edge */
  gap: 16px;
  margin: 8px 0 10px;
  flex-wrap: wrap;
}

/* Cancun any legacy float from the base theme on the follow button */
.article-header .article-subscribe {
  float: none !important;
  margin: 0;
}

/* Container that holds the icon strip (sits to the LEFT of Follow within the right-aligned cluster) */
.article-access-left {
  display: flex;
  align-items: center;
  gap: 16px;         /* whitespace between icon strip and follow button */
}

/* Icon strip */
.lf-access-icons {
  display: flex;
  align-items: center;
  gap: 16px;         /* whitespace between individual icons */
  flex-wrap: wrap;
}

/* 50% bigger icons */
.lf-access-icons .lf-access-icon img,
.lf-access-icon img {
  width: 40px;
  height: 40px;
  display: block;
}

/* Keep the author block visually below the icons+follow row */
.article-header .article-author {
  margin-top: 8px;
}

/* Single custom tooltip (we removed native title attributes in JS) */
.lf-access-icon[data-title] {
  position: relative;
}

.lf-access-icon[data-title]:hover::after,
.lf-access-icon[data-title]:focus::after {
  content: attr(data-title);
  position: absolute;
  left: 0;
  bottom: calc(100% + 8px);
  white-space: nowrap;
  background: rgba(0,0,0,0.85);
  color: #fff;
  padding: 6px 8px;
  border-radius: 4px;
  font-size: 12px;
  line-height: 1.2;
  z-index: 10;
  pointer-events: none;
}

.lf-access-icon[data-title]:hover::before,
.lf-access-icon[data-title]:focus::before {
  content: "";
  position: absolute;
  left: 10px;
  bottom: 100%;
  border: 6px solid transparent;
  border-top-color: rgba(0,0,0,0.85);
}

/* Small screens: keep it neat */
@media (max-width: 640px) {
  .article-header-top,
  .article-header-row {
    gap: 12px;
  }
}
/* Fran – 2025-09-18 – User Segment icon visibility – END */

/* Fran – 2025-09-18 – User Segment icon visibility */
.article-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin: 8px 0;
}

.article-icons-follow {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-left: auto;
}

.lf-access-icons {
  display: flex;
  gap: 12px;
}

.lf-access-icons img {
  width: 35px;
  height: 35px;
  display: block;
}
/* Fran – 2025-09-18 – User Segment icon visibility – END */

/* === Custom: two-column layout for related-article lists FRAN 2025-10-09 === */
.kb-two-col {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 16px 0;
}
.kb-two-col .zd-related-by-label {
  flex: 1 1 360px;                /* Grow but never smaller than 360px */
  max-width: calc(50% - 8px);     /* Two per row */
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .kb-two-col .zd-related-by-label {
    flex-basis: 100%;
    max-width: 100%;              /* Stack single column on smaller screens */
  }
}
/* === Custom: two-column layout for related-article lists FRAN 2025-10-09 END === */

/* KB restructure 2026 (Fran) 2026-02-19 START */
/* =========================================================
   SERIES SECTION — HEADER, HERO, 2/3 + 1/3 LAYOUT, CARDS,
   PARTNER ICON, SPACING (Copenhagen v4)
   Replaces: "Series hero section template FRAN 2025-12-10"
   ========================================================= */

/* ===== HEADER: Title + Description + Follow Button ===== */

.lf-series-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
}

.lf-series-header__main {
  max-width: 70%;
}

.lf-series-header h1 {
  margin-bottom: 4px;
}

.lf-series-header .page-header-description {
  margin-top: 0;
}

.lf-series-header .section-subscribe {
  margin-left: 16px;
}

/* ===== HERO IMAGE (Full Width) ===== */

.lf-series-hero {
  margin-bottom: 24px;
}

.lf-series-hero img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 20px; /* Keep LF rounded style */
  object-fit: cover;
}

/* ===== SERIES GRID WRAPPER ===== */

.lf-series-grid {
  margin-top: 8px;
}

/* ===== NEW: 2/3 (base products) + 1/3 (consoles) layout ===== */

.lf-series-grid__layout {
  display: grid;
  grid-template-columns: 2fr 1fr; /* left 2/3, right 1/3 */
  gap: 20px; /* align with existing card gap vibe */
  align-items: start;
}

.lf-series-grid__left {
  min-width: 0; /* prevents overflow in grid */
}

.lf-series-grid__right {
  min-width: 0;
}

.lf-series-grid__right-title {
  margin: 0 0 14px 0;
  font-size: 16px;
  font-weight: 600;
}

/* LEFT: base product type cards (grid) */
.lf-series-grid__items {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}

/* RIGHT: console cards stacked vertically (same card styling) */
.lf-series-grid__console-stack {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

/* ===== Card Container ===== */

.lf-series-card {
  position: relative; /* Needed for tiny partner icon position */
  display: flex;
  flex-direction: column;
  text-decoration: none;
  border-radius: 16px;
  border: 1px solid #e0e4e8;
  background: #ffffff;
  padding: 16px 18px;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

/* Hover effect */
.lf-series-card:hover,
.lf-series-card:focus-within {
  transform: translateY(-2px);
  border-color: #c8102e; /* LF brand red (adjust if needed) */
  box-shadow: 0 6px 18px rgba(0,0,0,0.09);
}

/* ===== Main Clickable Area ===== */

.lf-series-card__main {
  display: block;
  text-decoration: none;
  color: inherit;
}

.lf-series-card__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lf-series-card__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.lf-series-card__subtitle {
  margin: 0;
  font-size: 13px;
  color: #6b7580;
}

/* ===== Tiny Partner Icon (bottom-right) ===== */

.lf-series-card__partner-link {
  position: absolute;
  bottom: 10px;
  right: 12px;
  width: 20px;
  height: 20px;
  display: none; /* Revealed for eligible users */
  align-items: center;
  justify-content: center;
  opacity: 0.75;
}

.lf-series-card__partner-link img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}

.lf-series-card__partner-link:hover,
.lf-series-card__partner-link:focus {
  opacity: 1;
}

/* Compatibility:
   - Your existing setup likely toggles .lf-partner-only via JS
   - If you later use the shared-core approach (html.lf-partner-eligible), this also works
*/
.lf-partner-only {
  display: none;
}

html.lf-partner-eligible .lf-partner-only {
  display: inline-flex;
}

html.lf-partner-eligible .lf-series-card__partner-link.lf-partner-only {
  display: inline-flex;
}

/* ===== Big whitespace separator (~10cm) before article list ===== */

.lf-series-separator {
  height: 10cm; /* per your requirement */
}

/* ===== Responsive Adjustments ===== */

@media (max-width: 1024px) {
  /* Stack columns a bit earlier on smaller laptops/tablets if needed */
  .lf-series-grid__layout {
    grid-template-columns: 1fr;
  }

  .lf-series-grid__right-title {
    margin-top: 8px;
  }
}

@media (max-width: 768px) {
  .lf-series-header {
    flex-direction: column;
    gap: 8px;
  }

  .lf-series-header__main {
    max-width: 100%;
  }

  .lf-series-header .section-subscribe {
    margin-left: 0;
  }
}

/* KB restructure 2026 (Fran) 2026-02-19 END */


/* Fran 2026-01-15 / LF QR Autofill UI (optional) */
.lf-qr-banner {
  display: none;
  padding: 12px;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  margin: 0 0 16px;
}

.lf-qr-form .lf-field {
  margin: 12px 0;
}

.lf-qr-form label {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
}

.lf-qr-form input[type="text"] {
  width: 100%;
  max-width: 520px;
  padding: 8px;
  border: 1px solid #d8d8d8;
  border-radius: 6px;
}
/* Fran 2026-01-15 / End */

/* KB Category restructure 2026 (Fran) 2026-02-20 START */
/* =========================================================
   CARDIO CATEGORY PAGE — Product Type cards + Brand logo row
   + Brand blocks + Series card grids (Copenhagen v4)
   ========================================================= */

.lf-cardio-cat-header {
  margin-bottom: 12px;
}

.lf-cardio-cat-title {
  margin: 20px 0 12px 0;
  font-size: 18px;
  font-weight: 700;
}

.lf-cardio-cat-title--spaced {
  margin-top: 28px;
}

/* Shared grid (product type cards + series cards) */
.lf-cardio-cat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}

/* Category nav card style */
.lf-cat-card {
  border-radius: 16px;
  border: 1px solid #e0e4e8;
  background: #ffffff;
  padding: 16px 18px;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.lf-cat-card:hover,
.lf-cat-card:focus-within {
  transform: translateY(-2px);
  border-color: #c8102e;
  box-shadow: 0 6px 18px rgba(0,0,0,0.09);
}

.lf-cat-card__main {
  display: block;
  text-decoration: none;
  color: inherit;
}

.lf-cat-card__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lf-cat-card__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.lf-cat-card__subtitle {
  margin: 0;
  font-size: 13px;
  color: #6b7580;
}

/* Brand logo row (scroll-to anchors) */
.lf-cardio-brand-nav {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(84px, 1fr);
  gap: 14px;
  align-items: center;
  margin: 10px 0 18px 0;
  overflow-x: auto;
  padding-bottom: 6px;
}

.lf-cardio-brand-nav__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e0e4e8;
  border-radius: 14px;
  padding: 10px 12px;
  background: #fff;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.lf-cardio-brand-nav__item:hover,
.lf-cardio-brand-nav__item:focus {
  transform: translateY(-1px);
  border-color: #c8102e;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}

.lf-cardio-brand-nav__logo {
  max-height: 26px;
  width: auto;
  display: block;
}

/* Brand blocks (title + logo + series grid) */
.lf-cardio-brand-block {
  margin-top: 26px;
  scroll-margin-top: 90px;
}

.lf-cardio-brand-block__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.lf-cardio-brand-block__title {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
}

.lf-cardio-brand-block__logo img {
  max-height: 30px;
  width: auto;
  display: block;
}

@media (max-width: 768px) {
  .lf-cardio-brand-block__header {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* KB Category restructure 2026 (Fran) 2026-02-20 END */

/* KB Category restructure 2026 (Fran) 2026-02-20 START */
/* ===== Top Shortcut Cards ===== */

.lf-cardio-top-nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin: 10px 0 28px 0;
}

.lf-cardio-top-card {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
  border-radius: 18px;
  border: 1px solid #e0e4e8;
  background: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.lf-cardio-top-card:hover,
.lf-cardio-top-card:focus {
  transform: translateY(-2px);
  border-color: #c8102e;
  box-shadow: 0 6px 18px rgba(0,0,0,0.09);
}

/* Smooth anchor scroll */
html {
  scroll-behavior: smooth;
}

@media (max-width: 768px) {
  .lf-cardio-top-nav {
    grid-template-columns: 1fr;
  }
}
/* KB Category restructure 2026 (Fran) 2026-02-20 END */

/* KB Category restructure 2026 (Fran) 2026-02-20 START */
/* =========================================================
   CARDIO PRODUCT TYPE SECTION
   - Brand nav row
   - Brand blocks
   - Series cards with SMALL product thumbnail image
   - Partner icon (bottom-right) same behavior as Series cards
   ========================================================= */

/* ===== Header ===== */

.lf-pt-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
}

.lf-pt-header__main {
  max-width: 70%;
}

.lf-pt-header .section-subscribe {
  margin-left: 16px;
}

/* ===== Grid Layout ===== */

.lf-pt-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}

/* ===== Brand Blocks ===== */

.lf-pt-brand-block {
  margin-top: 32px;
  scroll-margin-top: 100px;
}

.lf-pt-brand-block__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.lf-pt-brand-block__title {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
}

.lf-pt-brand-block__logo img {
  max-height: 30px;
  width: auto;
  display: block;
}

/* ===== Card Styling ===== */

.lf-pt-card {
  position: relative; /* needed for partner icon positioning */
  border-radius: 16px;
  border: 1px solid #e0e4e8;
  background: #ffffff;
  overflow: hidden;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.lf-pt-card:hover,
.lf-pt-card:focus-within {
  transform: translateY(-2px);
  border-color: #c8102e;
  box-shadow: 0 6px 18px rgba(0,0,0,0.09);
}

.lf-pt-card__main {
  display: block;
  text-decoration: none;
  color: inherit;
}

/* ===== SMALL PRODUCT IMAGE (Thumbnail Style) ===== */
/* Change max-width/max-height to trial sizes */

.lf-pt-card__imgwrap {
  width: 100%;
  background: transparent;
  padding: 16px 16px 0 16px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.lf-pt-card__img {
  max-width: 200px;  /* you can tune this */
  max-height: 200px; /* you can tune this */
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

/* ===== Text Body ===== */

.lf-pt-card__body {
  padding: 10px 16px 16px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.lf-pt-card__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.lf-pt-card__subtitle {
  margin: 0;
  font-size: 13px;
  color: #6b7580;
}

/* ===== Partner Icon (bottom-right, hidden unless eligible) ===== */

.lf-pt-card__partner-link {
  position: absolute;
  bottom: 10px;
  right: 12px;
  width: 20px;
  height: 20px;
  display: none; /* revealed by JS for eligible users */
  align-items: center;
  justify-content: center;
  opacity: 0.75;
}

.lf-pt-card__partner-link img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}

.lf-pt-card__partner-link:hover,
.lf-pt-card__partner-link:focus {
  opacity: 1;
}

/* You already use .lf-partner-only + JS reveal pattern */
.lf-partner-only {
  display: none;
}

html.lf-partner-eligible .lf-partner-only {
  display: inline-flex;
}

/* ===== Responsive ===== */

@media (max-width: 1024px) {
  .lf-pt-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
}

@media (max-width: 768px) {
  .lf-pt-header {
    flex-direction: column;
    gap: 8px;
  }

  .lf-pt-header__main {
    max-width: 100%;
  }

  .lf-pt-header .section-subscribe {
    margin-left: 0;
  }

  .lf-pt-brand-block__header {
    flex-direction: column;
    align-items: flex-start;
  }

  .lf-pt-card__img {
    max-width: 160px;
    max-height: 160px;
  }
}

/* KB Category restructure 2026 (Fran) 2026-02-20 END */

/* KB Category restructure 2026 (Fran) 2026-02-20 START */
/* ===== GLOBAL CATEGORY VERTICAL SPACING ===== */

/* Space between major vertical blocks */
.lf-cardio-cat-root > * {
  margin-bottom: 100px;   /* 🔧 Adjust this value */
}

/* Optional: stronger separation between brand blocks */
.lf-cardio-brand-block {
  margin-top: 80px;      /* 🔧 Adjust this value */
}

/* More space above section titles */
.lf-cardio-cat-title {
  margin-top: 40px;      /* 🔧 Adjust this value */
  margin-bottom: 20px;
}

/* KB Category restructure 2026 (Fran) 2026-02-20 END */

/* KB Category restructure 2026 (Fran) 2026-02-20 START */
/* ===== PRODUCT TYPE VERTICAL SPACING ===== */

/* Space between brand sections */
.lf-pt-brand-block {
  margin-top: 80px;   /* 🔧 Adjust this value */
}

/* Space between brand nav and first brand block */
.lf-cardio-brand-nav {
  margin-bottom: 55px;  /* 🔧 Adjust this value */
}

/* KB Category restructure 2026 (Fran) 2026-02-20 END */

/* KB Category restructure 2026 (Fran) 2026-02-20 START */
/* ===== SERIES SECTION VERTICAL SPACING ===== */

.lf-series-header {
  margin-bottom: 32px;   /* was 16px */
}

.lf-series-hero {
  margin-bottom: 40px;   /* increase hero spacing */
}

.lf-series-grid {
  margin-top: 24px;
}

/* KB Category restructure 2026 (Fran) 2026-02-20 END */

/* ======================= START 2026-02-22 FRAN: LF Dynamic Article Groups (Option 1) =======================
   - Grid columns via --lf-dyn-cols (1..4)
   - Double spacing between rows
   - Full-width divider between rows
   - Stronger card border (not faded)
   - Bullet alignment fixed for multi-line titles
=========================================================================================================== */

.lf-dyn {
  margin: 16px 0;
}

.lf-dyn-grid{
  display: grid;
  grid-template-columns: repeat(var(--lf-dyn-cols, 1), minmax(240px, 1fr));
  column-gap: 20px;
  row-gap: 35px;              /* double-ish spacing between rows */
  align-items: start;
}

/* Responsive fallback */
@media (max-width: 1024px){
  .lf-dyn-grid{ grid-template-columns: repeat(2, minmax(240px, 1fr)); }
}
@media (max-width: 768px){
  .lf-dyn-grid{ grid-template-columns: 1fr; }
}

/* The horizontal divider inserted after each completed grid row */
.lf-dyn-row-divider{
  grid-column: 1 / -1;          /* spans all columns */
  height: 1px;                   /* the line thickness */
  background: #c2c8cc;           /* stronger grey (less faded) */

  /* ✅ Increase spacing before/after the line (adjust these two values) */
  margin: 25px 0;                /* bigger gap above & below */
}

/* If you want EVEN MORE spacing, use this instead:
.lf-dyn-row-divider{ margin: 48px 0; }
*/

/* Group card */
.lf-dyn-group{
  margin: 0;
  border: 1px solid #cfd6dd;  /* stronger border so top line is not faded */
  border-radius: 16px;
  background: #fff;
  padding: 14px 16px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

/* Group title */
.lf-dyn-title{
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 700;
}

/* List: custom bullets + top alignment */
.lf-dyn-list{
  list-style: none;
  padding: 0;
  margin: 0;
}

.lf-dyn-item{
  display: flex;
  align-items: flex-start;    /* <<< bullet aligns to first line */
  gap: 8px;
  padding: 4px 0;             /* tight spacing */
  border: 0;
}

.lf-dyn-item::before{
  content: "•";
  line-height: 1.25;
  margin-top: 0;              /* keep bullet on first line */
  flex: 0 0 auto;
}

.lf-dyn-link{
  display: inline;
  text-decoration: none;
  line-height: 1.25;
}

.lf-dyn-link:hover{
  text-decoration: underline;
}

.lf-dyn-meta{
  display: inline-block;
  margin-left: 10px;
  font-size: 12px;
  opacity: 0.7;
}

.lf-dyn-loading{
  padding: 10px 0;
  font-size: 13px;
  opacity: 0.8;
}

.lf-dyn-empty{
  padding: 8px 0;
  font-size: 13px;
  opacity: 0.75;
}

.lf-dyn-error{
  padding: 10px 12px;
  border: 1px solid #e35b66;
  background: #fff0f1;
  border-radius: 6px;
}

/* ======================= END 2026-02-22 FRAN: LF Dynamic Article Groups (Option 1) ======================= */

/* ======================= START 2026-02-24 FRAN: LF Sticky Full-Bleed Header (PROD SAFE v5) =======================
   Updates requested:
   1) Logo 2px less tall than the black area height
   2) Logo aligned to far-left edge of viewport
   3) Desktop nav hover underline 25% closer to text
   + Keeps language dropdown + mobile panels scrollable and readable
=============================================================================================================== */

:root {
  --lf-header-bg: #000;
  --lf-header-fg: #fff;
  --lf-header-height: 72px;

  /* Keep for overall layout control */
  --lf-header-max-width: 1600px;

  /* Right padding only (left should be flush) */
  --lf-header-padding-right: 18px;

  /* Bottom divider */
  --lf-header-divider: #fff;
  --lf-header-divider-thickness: 2px;

  /* LF accent red */
  --lf-accent-red: #c8102e;

  /* Optional depth */
  --lf-header-shadow: 0 10px 24px rgba(0,0,0,0.18);

  /* Desktop nav hover underline */
  --lf-hover-underline-height: 1.5px;  /* thin line */
  --lf-hover-underline-offset: 7.5px;  /* ✅ 25% closer than 10px */

  /* Language menu underline (directly under highlighted row) */
  --lf-lang-underline-height: 2px;

  /* Logo height tweak */
  --lf-logo-extra-reduction: 2px;       /* ✅ your request: 2px less tall */
}

/* --- Sticky header container --- */
/* IMPORTANT CHANGE: full-width header so logo can sit flush left */
.header {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;

  height: var(--lf-header-height) !important;
  display: flex;
  align-items: center;
  justify-content: space-between;

  /* Full width (logo flush left), but still keep the black bar consistent */
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;

  /* flush left, slight padding on right */
  padding-left: 0 !important;
  padding-right: var(--lf-header-padding-right) !important;

  background: transparent !important;
  z-index: 2000 !important;
}

/* Full-bleed black bar behind header */
.header::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;

  left: 50%;
  transform: translateX(-50%);
  width: 100vw;

  background: var(--lf-header-bg);

  /* thicker white divider line */
  border-bottom: var(--lf-header-divider-thickness) solid var(--lf-header-divider);

  box-shadow: var(--lf-header-shadow);

  z-index: -1;
  pointer-events: none;
}

/* If you ever get a tiny horizontal scrollbar because of 100vw rounding, uncomment: */
/* body { overflow-x: hidden; } */


/* --- Default header text/icons should be white (bar state) --- */
.header a,
.header a:visited,
.header button,
.header .dropdown-toggle,
.header .user-info > button,
.header .custom-top-link {
  color: var(--lf-header-fg) !important;
}

/* Arrow on user-info button was #0072EF in base CSS */
.header .user-info > button::after {
  color: var(--lf-header-fg) !important;
}

/* Icons (SVG + font icons) in header */
.header .icon,
.header [class*="icon-"],
.header svg,
.header .dropdown-chevron-icon {
  color: var(--lf-header-fg) !important;
  fill: var(--lf-header-fg) !important;
}

/* Remove default underline on hover in header (we add our own underline only for nav items) */
.header a:hover,
.header a:active,
.header a:focus {
  text-decoration: none;
  opacity: 0.88;
}

/* Clean keyboard focus on dark background */
.header a:focus-visible,
.header button:focus-visible {
  outline: 2px solid rgba(255,255,255,0.85);
  outline-offset: 4px;
  border-radius: 6px;
}


/* =========================================================================================
   LOGO: flush left + taller (but 2px less than black area)
   ========================================================================================= */

/* Ensure logo sits flush left */
.header .logo {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* Make logo container match header height (minus divider thickness and -2px) */
.header .logo a {
  display: flex !important;
  align-items: center !important;
  height: calc(var(--lf-header-height) - var(--lf-header-divider-thickness) - var(--lf-logo-extra-reduction)) !important;
}

/* Make the image tall (no max-height clamp from base CSS) */
.header .logo img {
  height: calc(var(--lf-header-height) - var(--lf-header-divider-thickness) - var(--lf-logo-extra-reduction)) !important;
  max-height: none !important; /* overrides base: max-height: 37px */
  width: auto !important;
  display: block;
}


/* =========================================================================================
   Desktop nav hover underline (fade in/out only) — ONLY for:
   - Desktop nav links (.nav-wrapper-desktop a)
   - Your custom top links (.custom-top-link)
   ========================================================================================= */

/* Ensure no all-caps */
.nav-wrapper-desktop a,
.header .custom-top-link {
  position: relative;
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* Underline element (hidden by default) */
.nav-wrapper-desktop a::after,
.header .custom-top-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;

  /* ✅ closer to text */
  bottom: calc(-1 * var(--lf-hover-underline-offset));

  height: var(--lf-hover-underline-height);
  background: var(--lf-accent-red);

  opacity: 0;
  transition: opacity 0.18s ease;
  pointer-events: none;
}

/* Fade in on hover/focus */
.nav-wrapper-desktop a:hover::after,
.nav-wrapper-desktop a:focus::after,
.header .custom-top-link:hover::after,
.header .custom-top-link:focus::after {
  opacity: 1;
}


/* =========================
   Open panels must be WHITE with DARK text + scrollable
   ========================= */

/* Language dropdown & any header dropdown menus */
.header .dropdown-menu {
  background: #fff !important;
  color: #111 !important;
  z-index: 3000 !important;

  max-height: calc(100vh - var(--lf-header-height) - 16px);
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.header .dropdown-menu a,
.header .dropdown-menu button,
.header .dropdown-menu [role="menuitem"],
.header .dropdown-menu [role="menuitemradio"] {
  color: #111 !important;
}

/* Language selector row underline directly under highlighted row */
.header .dropdown-menu [role="menuitemradio"] {
  position: relative;
}

.header .dropdown-menu [role="menuitemradio"]:hover,
.header .dropdown-menu [role="menuitemradio"]:focus {
  box-shadow: inset 0 calc(-1 * var(--lf-lang-underline-height)) 0 var(--lf-accent-red);
}

.header .dropdown-menu [role="menuitemradio"][aria-checked="true"],
.header .dropdown-menu [role="menuitemradio"][aria-selected="true"] {
  box-shadow: inset 0 calc(-1 * var(--lf-lang-underline-height)) 0 var(--lf-accent-red);
}

/* Mobile "user-nav" expanded panel: readable + scrollable */
.header .user-nav[aria-expanded="true"] {
  background-color: #fff !important;
  border: 1px solid #ddd !important;
  box-shadow: 0 0 4px 0 rgba(0,0,0,0.15), 0 4px 10px 0 rgba(0,0,0,0.1) !important;
  top: var(--lf-header-height) !important;
  z-index: 2500 !important;

  max-height: calc(100vh - var(--lf-header-height));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.header .user-nav[aria-expanded="true"] a,
.header .user-nav[aria-expanded="true"] button,
.header .user-nav[aria-expanded="true"] .dropdown-toggle,
.header .user-nav[aria-expanded="true"] svg,
.header .user-nav[aria-expanded="true"] [class*="icon-"] {
  color: #111 !important;
  fill: #111 !important;
}

/* Mobile hamburger menu panel: readable + scrollable */
.header .nav-wrapper-mobile .menu-list-mobile {
  top: var(--lf-header-height) !important;
  z-index: 2600 !important;

  max-height: calc(100vh - var(--lf-header-height));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.header .nav-wrapper-mobile .menu-list-mobile a,
.header .nav-wrapper-mobile .menu-list-mobile button,
.header .nav-wrapper-mobile .menu-list-mobile svg,
.header .nav-wrapper-mobile .menu-list-mobile [class*="icon-"] {
  color: #111 !important;
  fill: #111 !important;
}

/* Keep mobile menu button visible on black */
.header .nav-wrapper-mobile .menu-button-mobile,
.header .nav-wrapper-mobile .menu-button-mobile .icon-menu {
  color: var(--lf-header-fg) !important;
  fill: var(--lf-header-fg) !important;
}

/* ======================= END 2026-02-24 FRAN: LF Sticky Full-Bleed Header (PROD SAFE v5) ======================= */


/* ==========================================================================
   LF WIFI CONFIG TOOL – START
   Replace the full existing block for this tool in style.css with this block
   ========================================================================== */

.lf-wifi-tool-page {
  padding: 32px 0 56px;
}

.lf-wifi-tool {
  max-width: 760px;
  margin: 0 auto;
}

.lf-wifi-tool__back-row {
  margin-bottom: 18px;
}

.lf-wifi-tool__back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--brand_color, #17494d);
  font-weight: 600;
  text-decoration: none;
}

.lf-wifi-tool__back-link:hover,
.lf-wifi-tool__back-link:focus {
  text-decoration: underline;
}

.lf-wifi-tool__header {
  margin-bottom: 24px;
}

.lf-wifi-tool__title {
  margin: 0;
  font-size: 2rem;
  line-height: 1.2;
}

.lf-wifi-tool__jump-row {
  margin-top: 10px;
}

.lf-wifi-tool__jump-link {
  display: inline-flex;
  align-items: center;
  color: var(--brand_color, #17494d);
  font-weight: 600;
  text-decoration: none;
}

.lf-wifi-tool__jump-link:hover,
.lf-wifi-tool__jump-link:focus {
  text-decoration: underline;
}

.lf-wifi-tool__card,
.lf-wifi-tool__preview-card,
.lf-wifi-tool__instructions-card {
  background: #ffffff;
  border: 1px solid #d8dcde;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
  padding: 24px;
}

.lf-wifi-tool__preview-card,
.lf-wifi-tool__instructions-card {
  margin-top: 20px;
}

.lf-wifi-tool__form {
  display: block;
}

.lf-wifi-tool__mode-group {
  margin: 0 0 20px;
  padding: 16px;
  border: 1px solid #d8dcde;
  border-radius: 10px;
}

.lf-wifi-tool__legend {
  padding: 0 6px;
  font-weight: 600;
}

.lf-wifi-tool__radio-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 18px;
  cursor: pointer;
  user-select: none;
}

.lf-wifi-tool__preset-note {
  margin-bottom: 16px;
  padding: 12px 14px;
  border: 1px solid #d8dcde;
  border-radius: 8px;
  background: #f7f8f9;
  line-height: 1.5;
  color: #4b5560;
}

.lf-wifi-tool__custom-fields.is-hidden,
.lf-wifi-tool__preset-note.is-hidden,
.lf-wifi-tool__button.is-hidden {
  display: none;
}

.lf-wifi-tool__field + .lf-wifi-tool__field {
  margin-top: 18px;
}

.lf-wifi-tool__label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
  line-height: 1.4;
}

.lf-wifi-tool__input {
  width: 100%;
  display: block;
  box-sizing: border-box;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid #c2c8cc;
  border-radius: 8px;
  background: #ffffff;
  color: #1f2328;
  font: inherit;
  line-height: 1.4;
}

.lf-wifi-tool__input:focus {
  outline: none;
  border-color: var(--brand_color, #17494d);
  box-shadow: 0 0 0 3px rgba(23, 73, 77, 0.15);
}

.lf-wifi-tool__option-row {
  margin-top: 16px;
}

.lf-wifi-tool__checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}

.lf-wifi-tool__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.lf-wifi-tool__button {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 8px;
  min-height: 46px;
  padding: 0 18px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
}

.lf-wifi-tool__button--primary {
  background: var(--brand_color, #17494d);
  border-color: var(--brand_color, #17494d);
  color: #ffffff;
}

.lf-wifi-tool__button--primary:hover,
.lf-wifi-tool__button--primary:focus {
  opacity: 0.92;
}

.lf-wifi-tool__button--secondary {
  background: #ffffff;
  border-color: #c2c8cc;
  color: #1f2328;
}

.lf-wifi-tool__button--secondary:hover,
.lf-wifi-tool__button--secondary:focus {
  background: #f7f8f9;
}

.lf-wifi-tool__status {
  min-height: 24px;
  margin: 16px 0 0;
  font-size: 0.95rem;
  line-height: 1.5;
}

.lf-wifi-tool__status.is-error {
  color: #b42318;
}

.lf-wifi-tool__status.is-success {
  color: #067647;
}

.lf-wifi-tool__preview-title,
.lf-wifi-tool__instructions-title {
  margin: 0 0 12px;
  font-size: 1.15rem;
  line-height: 1.3;
}

.lf-wifi-tool__preview {
  margin: 0;
  padding: 16px;
  border-radius: 8px;
  background: #f7f8f9;
  border: 1px solid #e3e7ea;
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.95rem;
  line-height: 1.6;
  min-height: 86px;
}

.lf-wifi-tool__note,
.lf-wifi-tool__instructions-text {
  margin: 12px 0 0;
  font-size: 0.95rem;
  color: #5f6b72;
  line-height: 1.6;
}

.lf-wifi-tool__instructions-text {
  margin-top: 0;
  color: #1f2328;
}

@media (max-width: 767px) {
  .lf-wifi-tool-page {
    padding: 24px 0 40px;
  }

  .lf-wifi-tool__card,
  .lf-wifi-tool__preview-card,
  .lf-wifi-tool__instructions-card {
    padding: 18px;
  }

  .lf-wifi-tool__title {
    font-size: 1.6rem;
  }

  .lf-wifi-tool__radio-label {
    display: flex;
    margin-right: 0;
    margin-bottom: 10px;
  }

  .lf-wifi-tool__actions {
    flex-direction: column;
  }

  .lf-wifi-tool__button {
    width: 100%;
  }
}

/* ==========================================================================
   LF WIFI CONFIG TOOL – END
   ========================================================================== */

/* ================================
   SKU_SN_Config_tool START
   ================================ */

html {
  scroll-behavior: smooth;
}

.lf-sku-sn-tool {
  padding: 32px 20px 56px;
}

.lf-sku-sn-tool__inner {
  max-width: 880px;
  margin: 0 auto;
}

.lf-sku-sn-tool__topbar {
  margin-bottom: 20px;
}

.lf-sku-sn-tool__backlink {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  text-decoration: none;
}

.lf-sku-sn-tool__backlink:hover,
.lf-sku-sn-tool__backlink:focus {
  text-decoration: underline;
}

.lf-sku-sn-tool__header {
  margin-bottom: 24px;
}

.lf-sku-sn-tool__title {
  margin: 0 0 10px;
  font-size: 32px;
  line-height: 1.2;
}

.lf-sku-sn-tool__jump {
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
}

.lf-sku-sn-tool__jump a {
  font-weight: 600;
  text-decoration: none;
}

.lf-sku-sn-tool__jump a:hover,
.lf-sku-sn-tool__jump a:focus {
  text-decoration: underline;
}

.lf-sku-sn-tool__card {
  background: #ffffff;
  border: 1px solid #d9dde3;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 20px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.lf-sku-sn-tool__mode {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e7ebf0;
}

.lf-sku-sn-tool__mode-option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  cursor: pointer;
}

.lf-sku-sn-tool__field-group {
  margin-bottom: 18px;
}

.lf-sku-sn-tool__field-group--hidden {
  display: none;
}

.lf-sku-sn-tool__label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}

.lf-sku-sn-tool__input,
.lf-sku-sn-tool__select {
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  border: 1px solid #c7ced8;
  border-radius: 8px;
  font: inherit;
  background: #ffffff;
  box-sizing: border-box;
}

.lf-sku-sn-tool__input:focus,
.lf-sku-sn-tool__select:focus {
  outline: none;
  border-color: #1f73b7;
  box-shadow: 0 0 0 3px rgba(31, 115, 183, 0.15);
}

.lf-sku-sn-tool__actions {
  margin-top: 22px;
}

.lf-sku-sn-tool__button {
  appearance: none;
  border: 0;
  border-radius: 8px;
  min-height: 46px;
  padding: 0 18px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  background: #17494d;
  color: #ffffff;
}

.lf-sku-sn-tool__button:hover,
.lf-sku-sn-tool__button:focus {
  filter: brightness(1.05);
}

.lf-sku-sn-tool__button:active {
  transform: translateY(1px);
}

.lf-sku-sn-tool__status {
  margin: 14px 0 0;
  font-size: 14px;
  line-height: 1.5;
  color: #475467;
}

.lf-sku-sn-tool__status.is-error {
  color: #b42318;
}

.lf-sku-sn-tool__status.is-success {
  color: #027a48;
}

.lf-sku-sn-tool__preview-title,
.lf-sku-sn-tool__instructions-title {
  margin: 0 0 12px;
  font-size: 18px;
  line-height: 1.3;
}

.lf-sku-sn-tool__preview {
  margin: 0;
  padding: 16px;
  border: 1px solid #d9dde3;
  border-radius: 8px;
  background: #f8fafc;
  min-height: 88px;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 14px;
  line-height: 1.6;
}

.lf-sku-sn-tool__instructions-body p {
  margin: 0 0 12px;
  line-height: 1.6;
}

.lf-sku-sn-tool__instructions-body p:last-child {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .lf-sku-sn-tool {
    padding: 24px 16px 40px;
  }

  .lf-sku-sn-tool__card {
    padding: 18px;
  }

  .lf-sku-sn-tool__title {
    font-size: 26px;
  }

  .lf-sku-sn-tool__button {
    width: 100%;
  }
}

/* ================================
   SKU_SN_Config_tool END
   ================================ */

/* KB Field Tools app shell (Fran) 2026-03-11 START */

.lf-kb-app {
  margin: 24px auto 48px;
  max-width: 1120px;
}

[data-lf-kb-app-protected][data-lf-auth-state="pending"] [data-lf-kb-app-body] {
  display: none;
}

.lf-kb-app__hero {
  background: #ffffff;
  border: 1px solid #d8dcde;
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
  margin-bottom: 20px;
}

.lf-kb-app__hero--compact {
  padding: 20px;
}

.lf-kb-app__hero-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.lf-kb-app__hero-copy {
  flex: 1 1 auto;
  min-width: 0;
}

.lf-kb-app__hero-visual {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.lf-kb-app__hero-image {
  display: block;
  width: 90px;
  max-width: 100%;
  height: auto;
}

.lf-kb-app__eyebrow {
  display: inline-block;
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #68737d;
}

.lf-kb-app__title {
  margin: 0 0 8px;
  font-size: 32px;
  line-height: 1.15;
}

.lf-kb-app__intro {
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  color: #4f5b66;
}

.lf-kb-app__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.lf-kb-app__badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #f3f5f7;
  border: 1px solid #d8dcde;
  font-size: 13px;
  font-weight: 600;
  color: #2f3941;
}

.lf-kb-app__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.lf-kb-app__toolbar-link,
.lf-kb-app-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 600;
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.lf-kb-app__toolbar-link {
  background: #ffffff;
  border: 1px solid #d8dcde;
  color: #2f3941;
}

.lf-kb-app-button {
  border: 1px solid transparent;
}

.lf-kb-app-button--primary {
  background: #17494d;
  color: #ffffff;
}

.lf-kb-app-button--secondary {
  background: #ffffff;
  color: #17494d;
  border-color: #17494d;
}

.lf-kb-app__toolbar-link:hover,
.lf-kb-app-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08);
  text-decoration: none;
}

.lf-kb-app__search {
  margin-bottom: 20px;
}

.lf-kb-app__search-input {
  width: 100%;
  min-height: 48px;
  border: 1px solid #cfd7dc;
  border-radius: 14px;
  padding: 12px 14px;
  font-size: 16px;
  background: #ffffff;
}

.lf-kb-app__search-input:focus {
  outline: 2px solid #17494d;
  outline-offset: 1px;
  border-color: #17494d;
}

.lf-kb-app__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.lf-kb-app-card {
  display: block;
  background: #ffffff;
  border: 1px solid #d8dcde;
  border-radius: 18px;
  padding: 18px;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.04);
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.lf-kb-app-card:hover {
  transform: translateY(-2px);
  border-color: #17494d;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
  text-decoration: none;
}

.lf-kb-app-card__kicker {
  display: inline-block;
  margin-bottom: 8px;
  color: #68737d;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lf-kb-app-card__title {
  margin: 0 0 8px;
  font-size: 22px;
  line-height: 1.25;
}

.lf-kb-app-card__text {
  margin: 0;
  color: #4f5b66;
  line-height: 1.5;
}

.lf-kb-app__empty {
  margin-top: 16px;
  padding: 16px;
  border: 1px dashed #cfd7dc;
  border-radius: 14px;
  background: #ffffff;
  color: #68737d;
}

.lf-kb-tool-shell {
  background: #ffffff;
  border: 1px solid #d8dcde;
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}

.lf-kb-tool-shell__intro {
  margin: 0 0 20px;
  color: #4f5b66;
  line-height: 1.6;
}

.lf-kb-tool-shell__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.lf-kb-tool-shell__panel {
  border: 1px solid #d8dcde;
  border-radius: 16px;
  padding: 18px;
  background: #f9fafb;
}

.lf-kb-tool-shell__panel h2 {
  margin-top: 0;
  margin-bottom: 10px;
  font-size: 18px;
}

.lf-kb-tool-shell__panel p,
.lf-kb-tool-shell__panel li {
  color: #4f5b66;
  line-height: 1.5;
}

.lf-kb-tool-shell__placeholder {
  margin-top: 20px;
  padding: 20px;
  border: 2px dashed #cfd7dc;
  border-radius: 16px;
  background: #ffffff;
}

.lf-kb-tool-shell__placeholder h2 {
  margin-top: 0;
}

.lf-kb-access-denied__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.lf-kb-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

@media (min-width: 768px) {
  .lf-kb-app__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lf-kb-tool-shell__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lf-kb-app__title {
    font-size: 38px;
  }

  .lf-kb-app__hero-image {
    width: 110px;
  }
}

@media (min-width: 1100px) {
  .lf-kb-app__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lf-kb-app__hero-image {
    width: 125px;
  }
}

@media (max-width: 767px) {
  .lf-kb-app {
    margin-top: 16px;
  }

  .lf-kb-app__hero,
  .lf-kb-tool-shell {
    padding: 18px;
    border-radius: 16px;
  }

  .lf-kb-app__hero-inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .lf-kb-app__hero-visual {
    width: 100%;
    justify-content: center;
  }

  .lf-kb-app__hero-image {
    width: 80px;
  }

  .lf-kb-app__title {
    font-size: 28px;
  }

  .lf-kb-app-card__title {
    font-size: 20px;
  }
}

/* KB Field Tools app shell (Fran) 2026-03-11 END */

/* =========================================================
   Flash Health Monitor Validator START
   ========================================================= */

.lf-fhm-tool {
  max-width: 1080px;
  margin: 0 auto;
  padding: 32px 0 48px;
}

.lf-fhm-tool__hero {
  margin-bottom: 24px;
}

.lf-fhm-tool__top-link-wrap {
  margin-bottom: 12px;
}

.lf-fhm-tool__title {
  margin: 0 0 12px;
  font-size: 34px;
  line-height: 1.15;
}

.lf-fhm-tool__hero-links {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 14px;
}

.lf-fhm-tool__hero-link {
  font-weight: 600;
  text-decoration: none;
}

.lf-fhm-tool__hero-link:hover,
.lf-fhm-tool__hero-link:focus {
  text-decoration: underline;
}

.lf-fhm-tool__intro {
  margin: 0;
  max-width: 780px;
  color: #4b5563;
  line-height: 1.6;
}

.lf-fhm-tool__card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 20px;
  margin-top: 20px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.04);
}

.lf-fhm-tool__section-title {
  margin: 0 0 16px;
  font-size: 22px;
}

.lf-fhm-tool__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.lf-fhm-tool__label {
  font-weight: 700;
}

.lf-fhm-tool__input {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #cfd6df;
  border-radius: 10px;
  font: inherit;
  background: #fff;
  box-sizing: border-box;
}

.lf-fhm-tool__input--file {
  padding: 10px 12px;
}

.lf-fhm-tool__hint {
  margin: 0;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.5;
}

.lf-fhm-tool__hint code,
.lf-fhm-tool__instructions code {
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: 1px 6px;
  font-size: 12px;
}

.lf-fhm-tool__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.lf-fhm-tool__status {
  margin-top: 18px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #f3f4f6;
  color: #111827;
  border: 1px solid #e5e7eb;
  line-height: 1.5;
}

.lf-fhm-tool__status.is-success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.lf-fhm-tool__status.is-error {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}

.lf-fhm-tool__status.is-info {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

.lf-fhm-tool__meta {
  display: grid;
  gap: 10px;
  margin-bottom: 18px;
}

.lf-fhm-tool__meta-row {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 12px;
}

.lf-fhm-tool__meta-label {
  font-weight: 700;
  color: #374151;
}

.lf-fhm-tool__meta-value {
  color: #111827;
  word-break: break-word;
}

.lf-fhm-tool__outcome {
  padding: 14px 16px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  margin-bottom: 18px;
  line-height: 1.55;
}

.lf-fhm-tool__outcome--neutral {
  background: #f9fafb;
  color: #374151;
}

.lf-fhm-tool__outcome--success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.lf-fhm-tool__outcome--error {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}

.lf-fhm-tool__results {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.lf-fhm-tool__result-card {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 16px;
  background: #fff;
}

.lf-fhm-tool__result-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}

.lf-fhm-tool__result-title {
  margin: 0;
  font-size: 18px;
}

.lf-fhm-tool__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.lf-fhm-tool__badge.is-good {
  background: #dcfce7;
  color: #166534;
}

.lf-fhm-tool__badge.is-bad {
  background: #fee2e2;
  color: #991b1b;
}

.lf-fhm-tool__kv {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 10px 14px;
  font-size: 14px;
}

.lf-fhm-tool__kv-label {
  font-weight: 700;
  color: #374151;
}

.lf-fhm-tool__kv-value {
  word-break: break-word;
  color: #111827;
}

.lf-fhm-tool__description {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #e5e7eb;
  color: #4b5563;
  line-height: 1.55;
  font-size: 14px;
}

.lf-fhm-tool__details {
  display: grid;
  gap: 12px;
}

.lf-fhm-tool__detail-card {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 14px 16px;
  background: #fff;
}

.lf-fhm-tool__detail-file {
  margin: 0 0 8px;
  font-weight: 700;
  color: #111827;
  word-break: break-word;
}

.lf-fhm-tool__detail-text {
  margin: 0;
  color: #4b5563;
  line-height: 1.55;
  word-break: break-word;
}

.lf-fhm-tool__empty {
  padding: 18px;
  border: 1px dashed #cfd6df;
  border-radius: 12px;
  color: #6b7280;
  background: #fafafa;
}

.lf-fhm-tool__instructions {
  color: #374151;
  line-height: 1.65;
}

.lf-fhm-tool__instructions-list {
  margin: 0;
  padding-left: 20px;
}

.lf-fhm-tool__instructions-list li + li {
  margin-top: 8px;
}

@media (max-width: 900px) {
  .lf-fhm-tool__results {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  .lf-fhm-tool__title {
    font-size: 28px;
  }

  .lf-fhm-tool__meta-row,
  .lf-fhm-tool__kv {
    grid-template-columns: 1fr;
  }

  .lf-fhm-tool__result-top {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* =========================================================
   Flash Health Monitor Validator END
   ========================================================= */

/* ==========================================================================
   Fran - Cardio Console Immobilization Page START
   Scoped to custom page markup only
   ========================================================================== */

.lf-immobilize-page {
  max-width: 980px;
  margin: 0 auto;
  padding: 32px 0 48px;
}

.lf-immobilize-page__topnav {
  margin-bottom: 16px;
}

.lf-immobilize-page__back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  text-decoration: none;
}

.lf-immobilize-page__back-link:hover,
.lf-immobilize-page__back-link:focus {
  text-decoration: underline;
}

.lf-immobilize-page__header {
  margin-bottom: 24px;
}

.lf-immobilize-page__title {
  margin: 0 0 8px;
  font-size: 2rem;
  line-height: 1.2;
}

.lf-immobilize-page__jump-link-wrap {
  margin: 0;
}

.lf-immobilize-page__jump-link {
  font-weight: 600;
  text-decoration: none;
}

.lf-immobilize-page__jump-link:hover,
.lf-immobilize-page__jump-link:focus {
  text-decoration: underline;
}

.lf-immobilize-page__main {
  display: grid;
  gap: 20px;
}

.lf-immobilize-card {
  background: #f7f7f8;
  border: 1px solid #d9d9de;
  border-radius: 12px;
  overflow: hidden;
}

.lf-immobilize-card__body {
  padding: 24px;
}

.lf-immobilize-card__title {
  margin: 0 0 18px;
  font-size: 1.25rem;
  line-height: 1.3;
}

.lf-immobilize-form__label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}

.lf-immobilize-form__select {
  display: block;
  width: 100%;
  max-width: 560px;
  min-height: 48px;
  padding: 10px 14px;
  border: 1px solid #b9bcc6;
  border-radius: 8px;
  background: #ffffff;
  font: inherit;
  color: #1f2430;
}

.lf-immobilize-form__select:focus {
  outline: 2px solid #1a73e8;
  outline-offset: 2px;
}

.lf-immobilize-form__help {
  margin: 10px 0 0;
  color: #5f6675;
  font-size: 0.95rem;
}

.lf-immobilize-empty {
  padding: 6px 0;
  color: #5f6675;
}

.lf-immobilize-output__header {
  margin-bottom: 18px;
}

.lf-immobilize-output__title {
  margin: 0 0 6px;
  font-size: 1.35rem;
  line-height: 1.3;
}

.lf-immobilize-output__subtitle {
  margin: 0;
  color: #5f6675;
}

.lf-immobilize-steps-list {
  margin: 0;
  padding-left: 22px;
}

.lf-immobilize-steps-list li {
  margin-bottom: 12px;
  line-height: 1.55;
}

.lf-immobilize-notes {
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid #d9d9de;
}

.lf-immobilize-notes__title {
  margin: 0 0 10px;
  font-size: 1.05rem;
}

.lf-immobilize-notes__list {
  margin: 0;
  padding-left: 20px;
}

.lf-immobilize-notes__list li {
  margin-bottom: 8px;
  line-height: 1.5;
}

.lf-immobilize-instructions {
  margin-top: 24px;
}

.lf-immobilize-instructions__content p:first-child {
  margin-top: 0;
}

.lf-immobilize-instructions__content ul {
  margin: 12px 0 0;
  padding-left: 20px;
}

.lf-immobilize-instructions__content li {
  margin-bottom: 8px;
  line-height: 1.5;
}

@media (max-width: 767px) {
  .lf-immobilize-page {
    padding: 20px 0 36px;
  }

  .lf-immobilize-page__title {
    font-size: 1.7rem;
  }

  .lf-immobilize-card__body {
    padding: 18px;
  }

  .lf-immobilize-form__select {
    max-width: 100%;
  }
}

/* ==========================================================================
   Fran - Cardio Console Immobilization Page END
   ========================================================================== */

/* =========================================================
   Diagnostics Entry custom page
   Copenhagen v4 / Suite Enterprise
   Option 2: centralized HBS JSON data block
   ========================================================= */

.lf-diag-entry {
  --lf-diag-brand: #0060df;
  --lf-diag-brand-dark: #004bb0;
  --lf-diag-border: #dfe5ec;
  --lf-diag-bg: #f8f9fb;
  --lf-diag-bg-strong: #ffffff;
  --lf-diag-text: #112233;
  --lf-diag-muted: #5b6b7a;
  --lf-diag-radius: 14px;
  --lf-diag-shadow: 0 8px 24px rgba(17, 34, 51, 0.06);
  color: var(--lf-diag-text);
  margin: 32px 0 48px;
}

.lf-diag-entry__hero {
  margin-bottom: 24px;
}

.lf-diag-entry__eyebrow {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lf-diag-brand);
}

.lf-diag-entry__title {
  margin: 0 0 8px;
}

.lf-diag-entry__intro {
  margin: 0;
  max-width: 760px;
  color: var(--lf-diag-muted);
}

.lf-diag-card {
  background: var(--lf-diag-bg);
  border: 1px solid var(--lf-diag-border);
  border-radius: var(--lf-diag-radius);
  box-shadow: var(--lf-diag-shadow);
  padding: 20px;
  margin-bottom: 20px;
}

.lf-diag-grid {
  display: grid;
  gap: 16px;
}

.lf-diag-card__title {
  margin: 0 0 14px;
  font-size: 20px;
  line-height: 1.3;
}

.lf-diag-field {
  min-width: 0;
}

.lf-diag-label {
  display: block;
  margin-bottom: 8px;
  font-weight: 700;
  color: var(--lf-diag-text);
}

.lf-diag-select-wrap {
  position: relative;
  width: 100%;
  max-width: 560px;
}

.lf-diag-select-wrap::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  width: 12px;
  height: 12px;
  pointer-events: none;
  transform: translateY(-55%) rotate(45deg);
  border-right: 2px solid var(--lf-diag-muted);
  border-bottom: 2px solid var(--lf-diag-muted);
}

.lf-diag-select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: #fff;
  border: 1px solid var(--lf-diag-border);
  border-radius: 10px;
  padding: 12px 46px 12px 14px;
  font-size: 16px;
  line-height: 1.4;
  color: var(--lf-diag-text);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.lf-diag-select:hover {
  border-color: #c8d1dc;
}

.lf-diag-select:focus {
  outline: none;
  border-color: var(--lf-diag-brand);
  box-shadow: 0 0 0 3px rgba(0, 96, 223, 0.12);
}

.lf-diag-note {
  margin: 10px 0 0;
  font-size: 14px;
  color: var(--lf-diag-muted);
}

.lf-diag-placeholder {
  margin-bottom: 20px;
}

.lf-diag-placeholder[hidden] {
  display: none !important;
}

.lf-diag-placeholder__inner {
  background: #fff;
  border: 1px dashed var(--lf-diag-border);
  border-radius: var(--lf-diag-radius);
  padding: 20px;
}

.lf-diag-placeholder__title {
  margin: 0 0 8px;
  font-size: 20px;
}

.lf-diag-placeholder__text {
  margin: 0;
  color: var(--lf-diag-muted);
}

.lf-diag-results:empty {
  display: none;
}

.lf-diag-panel {
  display: block;
  background: var(--lf-diag-bg-strong);
  border: 1px solid var(--lf-diag-border);
  border-radius: var(--lf-diag-radius);
  box-shadow: var(--lf-diag-shadow);
  padding: 20px;
  margin-bottom: 20px;
}

.lf-diag-panel:focus {
  outline: 2px solid rgba(0, 96, 223, 0.2);
  outline-offset: 2px;
}

.lf-diag-panel__title {
  margin: 0 0 16px;
  font-size: 22px;
  line-height: 1.3;
}

.lf-diag-steps {
  counter-reset: lf-diag-step;
  list-style: none;
  margin: 0;
  padding: 0;
}

.lf-diag-steps li {
  position: relative;
  margin: 12px 0 0;
  padding: 14px 14px 14px 46px;
  border-left: 4px solid var(--lf-diag-brand);
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(0, 96, 223, 0.07), rgba(0, 96, 223, 0.02) 180px, #fff 100%);
}

.lf-diag-steps li:first-child {
  margin-top: 0;
}

.lf-diag-steps li::before {
  counter-increment: lf-diag-step;
  content: counter(lf-diag-step);
  position: absolute;
  top: 14px;
  left: 10px;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: var(--lf-diag-brand);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
}

.lf-diag-key-row {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}

.lf-diag-arrow {
  color: var(--lf-diag-muted);
  font-weight: 700;
}

.lf-diag-kbd,
.lf-diag-panel kbd {
  display: inline-block;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 0.92em;
  line-height: 1.3;
  white-space: nowrap;
  background: #f1f3f5;
  border: 1px solid #d8dee6;
  border-bottom-width: 2px;
  border-radius: 7px;
  padding: 2px 8px;
  color: #1c2a38;
}

@media (max-width: 767px) {
  .lf-diag-entry {
    margin-top: 20px;
  }

  .lf-diag-card,
  .lf-diag-panel,
  .lf-diag-placeholder__inner {
    padding: 16px;
  }

  .lf-diag-panel__title,
  .lf-diag-placeholder__title,
  .lf-diag-card__title {
    font-size: 18px;
  }

  .lf-diag-steps li {
    padding: 14px 12px 14px 42px;
  }

  .lf-diag-steps li::before {
    left: 8px;
  }
}
/* =========================================================
   Diagnostics Entry custom page - END
   Copenhagen v4 / Suite Enterprise
   Option 2: centralized HBS JSON data block
   ========================================================= */

/* START Fran 2026-03-18 10:24:00 UTC - Event Log Error Analyzer */
.lf-event-log-page {
  padding: 32px 0 48px;
}

.lf-event-log-page .container {
  max-width: 1200px;
}

.lf-event-log-page__back-link {
  display: inline-block;
  margin-bottom: 14px;
  font-weight: 600;
  text-decoration: none;
}

.lf-event-log-page__back-link:hover,
.lf-event-log-page__back-link:focus {
  text-decoration: underline;
}

.lf-event-log-page__header {
  margin-bottom: 20px;
}

.lf-event-log-page__title {
  margin: 0 0 8px;
}

.lf-event-log-page__jump {
  margin: 0;
}

.lf-event-log-page__jump a {
  font-weight: 600;
  text-decoration: none;
}

.lf-event-log-page__jump a:hover,
.lf-event-log-page__jump a:focus {
  text-decoration: underline;
}

.lf-event-log-card {
  margin: 0 0 20px;
  padding: 20px;
  border: 1px solid #d9dee7;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 2px 10px rgba(17, 24, 39, 0.05);
}

.lf-event-log-card__header {
  margin-bottom: 14px;
}

.lf-event-log-card__title {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.3;
}

.lf-event-log-form,
.lf-event-log-filter-grid {
  display: grid;
  gap: 16px;
}

.lf-event-log-filter-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 16px;
}

.lf-event-log-field {
  min-width: 0;
}

.lf-event-log-label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}

.lf-event-log-file-input,
.lf-event-log-select {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid #bcc6d4;
  border-radius: 10px;
  background: #ffffff;
  font: inherit;
  color: inherit;
}

.lf-event-log-file-input:focus,
.lf-event-log-select:focus {
  outline: none;
  border-color: #1f73b7;
  box-shadow: 0 0 0 3px rgba(31, 115, 183, 0.15);
}

.lf-event-log-help {
  margin: 8px 0 0;
  font-size: 0.95rem;
  color: #4b5563;
}

.lf-event-log-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-end;
}

.lf-event-log-btn {
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: 10px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.lf-event-log-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.lf-event-log-btn--secondary {
  border-color: #bcc6d4;
  background: #f6f8fb;
  color: #1f2937;
}

.lf-event-log-btn--secondary:hover:not(:disabled),
.lf-event-log-btn--secondary:focus:not(:disabled) {
  background: #eef2f7;
}

.lf-event-log-status {
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid transparent;
  font-size: 0.97rem;
}

.lf-event-log-status--info {
  background: #f4f8fd;
  border-color: #cfe0f5;
  color: #194f82;
}

.lf-event-log-status--success {
  background: #eefaf1;
  border-color: #ccebd3;
  color: #23643b;
}

.lf-event-log-status--error {
  background: #fff3f2;
  border-color: #f2cdca;
  color: #9b1c1c;
}

.lf-event-log-source {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #f8fafc;
  border: 1px solid #e3e8ef;
  color: #374151;
  font-size: 0.95rem;
}

.lf-event-log-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.lf-event-log-summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  background: #f4f7fb;
  border: 1px solid #dce4ef;
  font-size: 0.94rem;
  color: #1f2937;
}

.lf-event-log-summary-chip strong {
  font-weight: 700;
}

.lf-event-log-results-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.lf-event-log-results-meta {
  margin: 6px 0 0;
  color: #4b5563;
}

.lf-event-log-results {
  min-height: 100px;
}

.lf-event-log-empty {
  padding: 18px;
  border: 1px dashed #ccd5e1;
  border-radius: 12px;
  background: #f8fafc;
  color: #4b5563;
}

.lf-event-log-table-wrap {
  overflow: auto;
  border: 1px solid #d9dee7;
  border-radius: 14px;
  max-height: 70vh;
}

.lf-event-log-table {
  width: 100%;
  min-width: 980px;
  border-collapse: separate;
  border-spacing: 0;
  background: #ffffff;
}

.lf-event-log-table th,
.lf-event-log-table td {
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid #e6ebf2;
  font-size: 0.94rem;
}

.lf-event-log-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f5f8fc;
  font-weight: 700;
  white-space: nowrap;
}

.lf-event-log-table tbody tr:hover {
  background: #fafcff;
}

.lf-event-log-table tbody tr.lf-event-log-row--clickable {
  cursor: pointer;
}

.lf-event-log-table tbody tr.lf-event-log-row--clickable:focus {
  outline: 2px solid #1f73b7;
  outline-offset: -2px;
}

.lf-event-log-table tbody tr.lf-event-log-row--selected {
  background: #eef6ff;
}

.lf-event-log-table tbody tr.lf-event-log-row--context-selected {
  background: #eef6ff;
}

.lf-event-log-cell--wrap {
  white-space: pre-wrap;
  word-break: break-word;
}

.lf-event-log-cell--mono {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9rem;
}

.lf-event-log-context-note {
  margin: 0 0 12px;
  color: #4b5563;
  font-size: 0.95rem;
}

.lf-event-log-row-number {
  white-space: nowrap;
  font-weight: 600;
}

.lf-event-log-instructions ol {
  margin: 0 0 12px 20px;
  padding: 0;
}

.lf-event-log-instructions p {
  margin: 0 0 12px;
}

.lf-event-log-note {
  color: #4b5563;
  font-size: 0.95rem;
}

@media (max-width: 767px) {
  .lf-event-log-page {
    padding: 20px 0 32px;
  }

  .lf-event-log-card {
    padding: 16px;
    border-radius: 14px;
  }

  .lf-event-log-filter-grid {
    grid-template-columns: 1fr;
  }

  .lf-event-log-results-head {
    flex-direction: column;
    align-items: stretch;
  }

  .lf-event-log-table th,
  .lf-event-log-table td {
    padding: 9px 10px;
  }
}
/* END Fran 2026-03-18 10:24:00 UTC - Event Log Error Analyzer */

/* START Fran | 2026-03-23 | collect_logs.txt Download Widget */

.fran-clogs-page {
  padding: 32px 20px 48px;
}

.fran-clogs-page__inner {
  max-width: 960px;
  margin: 0 auto;
}

.fran-clogs-page__back-link,
.fran-clogs-page__jump-link {
  display: inline-block;
  font-size: 14px;
  line-height: 1.5;
  text-decoration: none;
}

.fran-clogs-page__back-link {
  margin-bottom: 12px;
  font-weight: 600;
}

.fran-clogs-page__jump-link {
  margin-bottom: 24px;
}

.fran-clogs-page__title {
  margin: 0 0 10px;
  font-size: 34px;
  line-height: 1.2;
  font-weight: 700;
}

.fran-clogs-card {
  background: #ffffff;
  border: 1px solid #d8dee4;
  border-radius: 16px;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
  padding: 24px;
}

.fran-clogs-card + .fran-clogs-card {
  margin-top: 28px;
}

.fran-clogs-card__title {
  margin: 0 0 10px;
  font-size: 24px;
  line-height: 1.25;
  font-weight: 700;
}

.fran-clogs-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 18px;
}

.fran-clogs-button {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  line-height: 1.2;
  min-height: 46px;
  padding: 12px 18px;
  text-align: center;
  transition: transform 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}

.fran-clogs-button:hover,
.fran-clogs-button:focus {
  transform: translateY(-1px);
  outline: none;
}

.fran-clogs-button--primary {
  background: #17494d;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(23, 73, 77, 0.18);
}

.fran-clogs-status {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid #d5dde6;
  background: #f7f9fb;
  color: #334155;
  line-height: 1.5;
}

.fran-clogs-status[data-status-type="success"] {
  background: #ecfdf3;
  border-color: #b7ebc6;
  color: #166534;
}

.fran-clogs-status[data-status-type="info"] {
  background: #eff6ff;
  border-color: #bfd7ff;
  color: #1d4ed8;
}

.fran-clogs-status[data-status-type="error"] {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

.fran-clogs-instructions {
  margin: 0;
  padding-left: 20px;
  line-height: 1.7;
}

.fran-clogs-instructions-note {
  margin: 16px 0 0;
  color: #425466;
  line-height: 1.6;
}

@media (max-width: 767px) {
  .fran-clogs-page {
    padding: 24px 14px 36px;
  }

  .fran-clogs-page__title {
    font-size: 28px;
  }

  .fran-clogs-card {
    padding: 18px;
    border-radius: 14px;
  }

  .fran-clogs-card__title {
    font-size: 22px;
  }

  .fran-clogs-actions {
    flex-direction: column;
  }

  .fran-clogs-button {
    width: 100%;
  }
}

/* END Fran | 2026-03-23 | collect_logs.txt Download Widget */

/* START Fran | 2026-03-25 | Software Recovery File Extractor */

.fran-pndx-page {
  --fran-pndx-border: #d7dbe2;
  --fran-pndx-border-strong: #b9c0ca;
  --fran-pndx-bg: #f5f7fa;
  --fran-pndx-card: #ffffff;
  --fran-pndx-text: #1f2937;
  --fran-pndx-muted: #5f6b7a;
  --fran-pndx-success-bg: #eef8f0;
  --fran-pndx-success-border: #acd7b4;
  --fran-pndx-warning-bg: #fff8e8;
  --fran-pndx-warning-border: #e7cb84;
  --fran-pndx-error-bg: #fdf0f0;
  --fran-pndx-error-border: #e4aaaa;
  --fran-pndx-info-bg: #eef5ff;
  --fran-pndx-info-border: #b8cff8;
  --fran-pndx-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
  --fran-pndx-radius: 14px;
  color: var(--fran-pndx-text);
}

.fran-pndx-page *,
.fran-pndx-page *::before,
.fran-pndx-page *::after {
  box-sizing: border-box;
}

.fran-pndx-shell {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 20px 48px;
}

.fran-pndx-backlink,
.fran-pndx-jumplink {
  display: inline-block;
  text-decoration: none;
}

.fran-pndx-backlink {
  margin-bottom: 12px;
  font-weight: 600;
}

.fran-pndx-pagehead {
  margin-bottom: 20px;
}

.fran-pndx-title {
  margin: 0 0 8px;
  font-size: 2rem;
  line-height: 1.2;
}

.fran-pndx-jumplink {
  font-weight: 600;
}

.fran-pndx-card {
  background: var(--fran-pndx-card);
  border: 1px solid var(--fran-pndx-border);
  border-radius: var(--fran-pndx-radius);
  box-shadow: var(--fran-pndx-shadow);
  padding: 24px;
  margin-bottom: 24px;
}

.fran-pndx-cardhead {
  margin-bottom: 20px;
}

.fran-pndx-cardtitle {
  margin: 0 0 8px;
  font-size: 1.35rem;
  line-height: 1.3;
}

.fran-pndx-cardintro,
.fran-pndx-help,
.fran-pndx-instructions p,
.fran-pndx-instructions li {
  color: var(--fran-pndx-text);
  line-height: 1.55;
}

.fran-pndx-browser-note {
  margin-bottom: 20px;
  padding: 14px 16px;
  border: 1px solid var(--fran-pndx-info-border);
  background: var(--fran-pndx-info-bg);
  border-radius: 10px;
}

.fran-pndx-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-bottom: 20px;
}

.fran-pndx-panel {
  border: 1px solid var(--fran-pndx-border);
  background: var(--fran-pndx-bg);
  border-radius: 12px;
  padding: 18px;
  margin-bottom: 20px;
}

.fran-pndx-panel:last-child {
  margin-bottom: 0;
}

.fran-pndx-paneltitle {
  margin: 0 0 14px;
  font-size: 1.05rem;
  line-height: 1.35;
}

.fran-pndx-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.fran-pndx-file-fallback {
  display: inline-flex;
  flex-direction: column;
  gap: 6px;
}

.fran-pndx-file-fallback-label {
  font-size: 0.95rem;
  font-weight: 600;
}

.fran-pndx-field {
  display: block;
}

.fran-pndx-label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}

.fran-pndx-page select,
.fran-pndx-page input[type="file"] {
  width: 100%;
  max-width: 100%;
}

.fran-pndx-summary {
  margin: 16px 0 0;
  display: grid;
  gap: 10px;
}

.fran-pndx-summary-row {
  display: grid;
  grid-template-columns: 200px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.fran-pndx-summary dt {
  margin: 0;
  font-weight: 700;
  color: var(--fran-pndx-muted);
}

.fran-pndx-summary dd {
  margin: 0;
  word-break: break-word;
}

.fran-pndx-option-note {
  margin-top: 14px;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--fran-pndx-info-border);
  background: var(--fran-pndx-info-bg);
  line-height: 1.55;
}

.fran-pndx-progress-wrap {
  margin-top: 4px;
}

.fran-pndx-progress-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
  font-weight: 600;
}

.fran-pndx-page progress {
  width: 100%;
  height: 16px;
}

.fran-pndx-status {
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--fran-pndx-border-strong);
  background: #fff;
  line-height: 1.55;
}

.fran-pndx-status.is-info {
  background: var(--fran-pndx-info-bg);
  border-color: var(--fran-pndx-info-border);
}

.fran-pndx-status.is-success {
  background: var(--fran-pndx-success-bg);
  border-color: var(--fran-pndx-success-border);
}

.fran-pndx-status.is-warning {
  background: var(--fran-pndx-warning-bg);
  border-color: var(--fran-pndx-warning-border);
}

.fran-pndx-status.is-error {
  background: var(--fran-pndx-error-bg);
  border-color: var(--fran-pndx-error-border);
}

.fran-pndx-instructions ol,
.fran-pndx-instructions ul {
  margin: 0 0 16px 20px;
  padding: 0;
}

.fran-pndx-instructions p:last-child {
  margin-bottom: 0;
}

.fran-pndx-page .is-hidden {
  display: none !important;
}

@media (max-width: 767px) {
  .fran-pndx-shell {
    padding: 20px 16px 40px;
  }

  .fran-pndx-card {
    padding: 18px;
  }

  .fran-pndx-grid {
    grid-template-columns: 1fr;
  }

  .fran-pndx-summary-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .fran-pndx-title {
    font-size: 1.6rem;
  }
}

/* END Fran | 2026-03-25 | Software Recovery File Extractor */

/* START Fran | 2026-03-26 | Console Diagnostics Access Custom Page */

.fran-console-page {
  padding: 32px 0 48px;
}

.fran-console-page__inner {
  max-width: 1240px;
  margin: 0 auto;
}

.fran-console-page__back-link {
  display: inline-block;
  margin-bottom: 16px;
  font-weight: 600;
  text-decoration: none;
}

.fran-console-page__back-link:hover,
.fran-console-page__back-link:focus {
  text-decoration: underline;
}

.fran-console-page__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 24px;
}

.fran-console-page__title {
  margin: 0;
  font-size: 2rem;
  line-height: 1.2;
}

.fran-console-page__jump-link {
  display: inline-block;
  text-align: left;
  font-weight: 600;
  text-decoration: none;
}

.fran-console-page__jump-link:hover,
.fran-console-page__jump-link:focus {
  text-decoration: underline;
}

.fran-console-card,
.fran-procedure-card,
.fran-console-instructions {
  background: #ffffff;
  border: 1px solid #d9e2ec;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.fran-console-card--controls {
  padding: 20px;
  margin-bottom: 20px;
}

.fran-console-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fran-console-field__label {
  font-weight: 700;
}

.fran-console-select {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border: 1px solid #bcccdc;
  border-radius: 10px;
  background: #ffffff;
  font: inherit;
  color: #102a43;
}

.fran-console-select:focus {
  outline: none;
  border-color: #486581;
  box-shadow: 0 0 0 3px rgba(72, 101, 129, 0.18);
}

.fran-console-status {
  margin: 14px 0 0;
  color: #52606d;
}

.fran-console-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  margin-bottom: 20px;
}

.fran-console-additional {
  margin-bottom: 20px;
}

.fran-console-navigation {
  margin-bottom: 28px;
}

.fran-procedure-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.fran-procedure-card--additional,
.fran-procedure-card--navigation {
  width: 100%;
}

.fran-procedure-card__header {
  padding: 18px 18px 0;
}

.fran-procedure-card__title {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.3;
}

.fran-procedure-card__body {
  padding: 16px 18px 18px;
}

.fran-procedure-card__empty,
.fran-procedure-flow__empty {
  margin: 0;
  padding: 14px;
  border-radius: 12px;
  background: #f8fafc;
  color: #52606d;
  border: 1px dashed #cbd5e1;
}

.fran-procedure-flow + .fran-procedure-flow {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid #d9e2ec;
}

.fran-procedure-flow__title {
  margin: 0 0 12px;
  font-size: 1rem;
  line-height: 1.35;
  color: #102a43;
}

.fran-procedure-card__steps {
  margin: 0;
  padding-left: 1.4rem;
}

.fran-procedure-card__steps li + li {
  margin-top: 14px;
}

.fran-step-content {
  color: #102a43;
  line-height: 1.9;
}

/* TOKEN FAMILY 1: CONSOLE BUTTONS */
.fran-button-token {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  margin: 0 3px;
  padding: 4px 12px;
  border-radius: 0;
  vertical-align: middle;
  line-height: 1.2;
  background: #eef4ff;
  border: 1px solid #9fb3d9;
  color: #243b53;
  font-weight: 700;
  white-space: nowrap;
}

.fran-button-token img {
  display: block;
  width: 40px;
  height: 30px;
  object-fit: contain;
}

/* TOKEN FAMILY 2: DISPLAY MESSAGES */
.fran-display-token {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  margin: 0 3px;
  padding: 3px 12px;
  border-radius: 999px;
  vertical-align: middle;
  line-height: 1.2;
  background: #fff7e6;
  border: 1px solid #f0b429;
  color: #8d2b0b;
  font-weight: 700;
  white-space: nowrap;
}

/* TOKEN FAMILY 3: TOUCH ACTIONS */
.fran-action-token {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  margin: 0 3px;
  padding: 4px 12px;
  border-radius: 18px 6px 18px 6px;
  vertical-align: middle;
  line-height: 1.2;
  background: #163d2a;
  border: 1px solid #2f7d57;
  color: #e8fff3;
  font-weight: 700;
  white-space: nowrap;
}

.fran-action-token__symbol {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  font-size: 1rem;
  line-height: 1;
}

.fran-action-token__label {
  display: inline-block;
}

/* OPTIONAL EXTRA CARD: 2 COLUMNS */
.fran-procedure-card--additional .fran-procedure-card__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.fran-procedure-card--additional .fran-procedure-flow {
  margin: 0;
  padding: 16px;
  border: 1px solid #d9e2ec;
  border-radius: 12px;
  background: #f8fafc;
}

.fran-procedure-card--additional .fran-procedure-flow + .fran-procedure-flow {
  margin: 0;
  padding: 16px;
  border-top: 1px solid #d9e2ec;
}

/* NAVIGATION CARD: 2 COLUMNS */
.fran-procedure-card--navigation .fran-procedure-card__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.fran-procedure-card--navigation .fran-procedure-flow {
  margin: 0;
  padding: 16px;
  border: 1px solid #d9e2ec;
  border-radius: 12px;
  background: #f8fafc;
}

.fran-procedure-card--navigation .fran-procedure-flow + .fran-procedure-flow {
  margin: 0;
  padding: 16px;
  border-top: 1px solid #d9e2ec;
}

.fran-console-instructions {
  padding: 24px 20px;
}

.fran-console-instructions__title {
  margin: 0 0 16px;
  font-size: 1.4rem;
}

.fran-console-instructions__subtitle {
  margin: 18px 0 12px;
  font-size: 1.05rem;
  line-height: 1.3;
}

.fran-console-instructions__body p {
  margin: 0 0 14px;
  line-height: 1.6;
}

.fran-console-instructions__body code {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 6px;
  background: #f8fafc;
  border: 1px solid #d9e2ec;
  font-size: 0.95em;
}

.fran-console-instructions__body a {
  font-weight: 600;
}

.fran-console-instructions__token-demo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

@media (max-width: 1023px) {
  .fran-console-grid {
    grid-template-columns: 1fr;
  }

  .fran-procedure-card--additional .fran-procedure-card__body,
  .fran-procedure-card--navigation .fran-procedure-card__body {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  .fran-console-page {
    padding: 24px 0 40px;
  }

  .fran-console-page__title {
    font-size: 1.7rem;
  }

  .fran-console-card--controls,
  .fran-console-instructions,
  .fran-procedure-card__body,
  .fran-procedure-card__header {
    padding-left: 16px;
    padding-right: 16px;
  }

  .fran-button-token img {
    width: 48px;
    height: 48px;
  }
}

/* END Fran | 2026-03-26 | Console Diagnostics Access Custom Page  */

/* ===== LF VTAP ZIP GENERATOR 2026-05-15 START ===== */

.lf-vtap-page {
  padding: 40px 20px 56px;
}
.lf-vtap-shell {
  max-width: 980px;
  margin: 0 auto;
}

/* ── Header ──────────────────────────────────────────────────────────── */

.lf-vtap-header {
  margin-bottom: 24px;
}
.lf-vtap-backlink {
  display: inline-block;
  margin-bottom: 12px;
  text-decoration: none;
}
.lf-vtap-title {
  margin: 0 0 8px;
  font-size: 32px;
  line-height: 1.2;
}
.lf-vtap-instructions-link {
  display: inline-block;
  font-size: 14px;
  text-decoration: none;
}
.lf-vtap-instructions-link:hover {
  text-decoration: underline;
}

/* ── Card ────────────────────────────────────────────────────────────── */

.lf-vtap-card {
  border: 1px solid #d8dcde;
  border-radius: 12px;
  padding: 24px;
  background: #fff;
}
.lf-vtap-form {
  margin-bottom: 24px;
}

/* ── Route selector ──────────────────────────────────────────────────── */

.lf-vtap-route-group {
  margin: 0 0 20px;
  padding: 16px 18px;
  border: 1px solid #d8dcde;
  border-radius: 10px;
}
.lf-vtap-route-group legend {
  padding: 0 6px;
  font-weight: 700;
}
.lf-vtap-route-options {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.lf-vtap-route-option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.lf-vtap-helper {
  margin: 6px 0 0;
  font-size: 14px;
  line-height: 1.45;
}

/* ── Form grid ───────────────────────────────────────────────────────── */

.lf-vtap-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.lf-vtap-field {
  display: flex;
  flex-direction: column;
}
.lf-vtap-field--full {
  grid-column: 1 / -1;
}
.lf-vtap-field label {
  margin-bottom: 8px;
  font-weight: 600;
}

/* ── File name section divider ───────────────────────────────────────── */

.lf-vtap-section-divider {
  margin-top: 8px;
  padding-top: 20px;
  border-top: 1px solid #d8dcde;
}
.lf-vtap-section-label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #68737d;
  margin-bottom: 4px;
}

/* ── Inputs, selects, textareas ──────────────────────────────────────── */

.lf-vtap-field input,
.lf-vtap-field textarea,
.lf-vtap-field select {
  width: 100%;
  border: 1px solid #cfd7df;
  border-radius: 8px;
  padding: 12px 14px;
  font: inherit;
  font-size: 15px;
  line-height: 1.4;
  box-sizing: border-box;
  background: #fff;
  appearance: none;
  -webkit-appearance: none;
}
.lf-vtap-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 36px;
  cursor: pointer;
}
.lf-vtap-field input[type="file"] {
  padding: 10px 12px;
}
.lf-vtap-file-selected {
  margin-top: 8px;
  font-size: 14px;
  word-break: break-word;
}

/* ── Actions ─────────────────────────────────────────────────────────── */

.lf-vtap-actions {
  display: flex;
  gap: 12px;
  margin-top: 18px;
  flex-wrap: wrap;
}

/* ── Status message ──────────────────────────────────────────────────── */

.lf-vtap-message {
  margin-top: 14px;
  min-height: 24px;
  font-size: 14px;
}
.lf-vtap-message.is-error   { color: #b42318; }
.lf-vtap-message.is-success { color: #027a48; }

/* ── ZIP filename preview ────────────────────────────────────────────── */

.lf-vtap-preview-wrap {
  margin-top: 24px;
}
.lf-vtap-preview-title {
  margin: 0 0 10px;
  font-size: 20px;
}
.lf-vtap-zipname-preview {
  padding: 14px 16px;
  border: 1px solid #d8dcde;
  border-radius: 8px;
  background: #f8f9f9;
  word-break: break-all;
  font-size: 14px;
  font-family: monospace;
}

/* ── Hidden state for custom PEM upload ──────────────────────────────── */

#lfCustomPemWrap[hidden] {
  display: none !important;
}

/* ── Instructions section ────────────────────────────────────────────── */

.lf-vtap-instructions {
  margin-top: 40px;
  padding: 28px 32px;
  border: 1px solid #d8dcde;
  border-radius: 12px;
  background: #f8f9f9;
}
.lf-vtap-instructions-title {
  margin: 0 0 16px;
  font-size: 22px;
}
.lf-vtap-instructions-list {
  margin: 0;
  padding-left: 20px;
  line-height: 1.7;
}
.lf-vtap-instructions-list li {
  margin-bottom: 12px;
}
.lf-vtap-instructions-list li:last-child {
  margin-bottom: 0;
}
.lf-vtap-instructions-list ul {
  margin-top: 6px;
  padding-left: 18px;
}
.lf-vtap-instructions-list ul li {
  margin-bottom: 4px;
}

/* ── Responsive ──────────────────────────────────────────────────────── */

@media (max-width: 767px) {
  .lf-vtap-grid {
    grid-template-columns: 1fr;
  }
  .lf-vtap-title {
    font-size: 26px;
  }
  .lf-vtap-card {
    padding: 18px;
  }
  .lf-vtap-instructions {
    padding: 20px;
  }
}

/* ===== LF VTAP ZIP GENERATOR 2026-05-15 END ===== */



/* Stuart Collop | 2026-06-10 | LED Console Logs Info START */

.sl-console-parser {
  max-width: 900px;
  margin: 0 auto;
  padding-top: 1.5rem;
}

.sl-console-parser .tt-card {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 20px;
}

.sl-console-parser .tt-title {
  font-size: 28px;
  margin-bottom: 10px;
}

.sl-console-parser .tt-back-link,
.sl-console-parser .tt-jump-link {
  display: block;
  margin-bottom: 10px;
  text-decoration: none;
  color: #0073e6;
}

.sl-console-parser .tt-section {
  margin-bottom: 20px;
}

.sl-console-parser .tt-label {
  font-weight: bold;
  display: block;
  margin-bottom: 4px;
}

.sl-console-parser .tt-hint {
  font-size: 13px;
  color: #6b7280;
  margin: 0 0 8px 0;
}

.sl-console-parser .tt-btn {
  background: #0073e6;
  color: #fff;
  border: none;
  padding: 10px 16px;
  border-radius: 8px;
  cursor: pointer;
  margin-right: 10px;
  font-size: 14px;
}

.sl-console-parser .tt-btn-secondary {
  background: #6b7280;
}

.sl-console-parser .tt-btn-clear {
  background: #fff;
  color: #6b7280;
  border: 1px solid #d1d5db;
}

.sl-console-parser .tt-btn-clear:hover {
  background: #f9fafb;
}

.sl-console-parser .tt-btn:disabled,
.sl-console-parser .tt-btn-secondary:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.sl-console-parser .tt-status {
  margin-top: 10px;
  font-size: 14px;
  font-weight: bold;
}

.sl-console-parser .tt-status.tt-error {
  color: #dc2626;
}

.sl-console-parser .tt-output {
  margin-top: 20px;
}

/* ── Report output ── */

.sl-console-parser .tt-report {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
}

.sl-console-parser .tt-sec-head {
  background: #f6f8fa;
  padding: 8px 16px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #6b7280;
  border-bottom: 1px solid #e5e7eb;
}

.sl-console-parser .tt-sec-head + .tt-sec-head,
.sl-console-parser .tt-rrow + .tt-sec-head {
  border-top: 1px solid #e5e7eb;
}

.sl-console-parser .tt-rrow {
  display: flex;
  align-items: baseline;
  padding: 8px 16px;
  border-bottom: 0.5px solid #f3f4f6;
}

.sl-console-parser .tt-rrow:last-child {
  border-bottom: none;
}

.sl-console-parser .tt-rlabel {
  font-size: 13px;
  color: #6b7280;
  min-width: 230px;
  flex-shrink: 0;
}

.sl-console-parser .tt-rval {
  font-size: 13px;
  color: #111827;
  font-weight: 500;
}

.sl-console-parser .tt-ns {
  color: #d1d5db;
  font-weight: 400;
  font-style: italic;
}

/* ── Instructions ── */

.sl-console-parser .tt-instructions {
  margin-top: 40px;
  padding: 20px;
  border-top: 1px solid #ddd;
}

.sl-console-parser .tt-instructions h3 {
  margin-top: 16px;
}

.sl-console-parser .tt-instructions code {
  background: #f0f0f0;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 13px;
}

/* Stuart Collop | 2026-06-10 | LED Console Logs Info END */


/* Fran 2026-06-11 START ==================================================== */
/* =============================================================
   HOME ARTICLE TEMPLATES — Centralized Styles
   Add this block to style.css (theme file).

   Covers all product Home and Partner Home articles.
   All article templates reference only the class names below.
   To restyle all home articles: edit this file only.

   NOTE: .lf-dyn-group / .lf-dyn-title / .lf-dyn-link / etc.
   are already defined in style.css — do not duplicate them here.
   ============================================================= */


/* -------------------------------------------------------
   Outer 3-column layout
   Left (resources) | Center (content) | Right (image/works-with)
------------------------------------------------------- */
.lf-home-layout {
  display: grid;
  grid-template-columns: 195px 1fr 230px;
  align-items: start;
}

/* Override lf-dyn-grid min column width inside the home center
   column — the default 240px min is too wide for a narrower col. */
.lf-home-center .lf-dyn-grid {
  grid-template-columns: repeat(var(--lf-dyn-cols, 1), minmax(160px, 1fr));
}


/* -------------------------------------------------------
   Left column — Additional Resources
------------------------------------------------------- */
.lf-home-left {
  padding: 0 20px 24px 0;
  border-right: 1px solid #d8dcde;
}

.lf-home-resources-title {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 10px 0;
  color: #2f3941;
}

.lf-home-resources-list {
  list-style: disc;
  padding-left: 18px;
  margin: 0 0 24px 0;
}

.lf-home-resources-list li {
  margin-bottom: 7px;
}

.lf-home-resources-list a {
  font-size: 14px;
  color: #1f73b7;
  text-decoration: none;
}

.lf-home-resources-list a:hover {
  text-decoration: underline;
}

.lf-home-counterpart-list {
  list-style: none;
  padding: 0;
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid #d8dcde;
}

.lf-home-counterpart-list li {
  margin-bottom: 6px;
}

.lf-home-counterpart-link {
  font-size: 14px;
  color: #1f73b7;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.lf-home-counterpart-link:hover {
  text-decoration: underline;
}


/* -------------------------------------------------------
   Center column
------------------------------------------------------- */
.lf-home-center {
  padding: 0 28px;
}

/* Model / Serial lookup form */
.lf-home-lookup {
  margin-bottom: 14px;
}

.lf-home-lookup__row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
}

.lf-home-lookup__label {
  font-size: 14px;
  color: #2f3941;
  width: 145px;
  flex-shrink: 0;
}

.lf-home-lookup__input {
  width: 190px;
  padding: 5px 10px;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  font-size: 14px;
  background: #fff;
}

.lf-home-lookup__input:focus {
  outline: 2px solid #1f73b7;
  outline-offset: 0;
}

/* Divider between lookup and article groups */
.lf-home-divider {
  border: none;
  border-top: 1px solid #d8dcde;
  margin: 14px 0 16px 0;
}

/* "Self Help articles:" label */
.lf-home-articles-label {
  font-size: 15px;
  color: #2f3941;
  margin: 0 0 14px 0;
}


/* -------------------------------------------------------
   Right column — brand logo, product image, Works with
------------------------------------------------------- */
.lf-home-right {
  padding: 0 0 0 20px;
  border-left: 1px solid #d8dcde;
}

.lf-home-brand-logo {
  max-width: 130px;
  height: auto;
  display: block;
  margin-bottom: 14px;
}

.lf-home-product-image {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  margin-bottom: 16px;
}

.lf-home-works-with__title {
  font-size: 14px;
  font-weight: 600;
  color: #2f3941;
  margin: 0 0 10px 0;
}

.lf-home-console-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #d8dcde;
  border-radius: 4px;
  text-decoration: none;
  color: #2f3941;
  background: #fff;
  margin-bottom: 8px;
}

.lf-home-console-card:hover {
  border-color: #8f959e;
  text-decoration: none;
}

.lf-home-console-card img {
  width: 72px;
  height: 54px;
  object-fit: cover;
  flex-shrink: 0;
  border-radius: 2px;
}

.lf-home-console-card span {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
  color: #2f3941;
}


/* -------------------------------------------------------
   Responsive — stack columns below 900px
------------------------------------------------------- */
@media (max-width: 900px) {
  .lf-home-layout {
    grid-template-columns: 1fr;
  }

  .lf-home-left {
    border-right: none;
    border-bottom: 1px solid #d8dcde;
    padding: 0 0 20px 0;
    margin-bottom: 20px;
  }

  .lf-home-center {
    padding: 0;
  }

  .lf-home-right {
    border-left: none;
    border-top: 1px solid #d8dcde;
    padding: 20px 0 0 0;
    margin-top: 20px;
  }

  .lf-home-center .lf-dyn-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 600px) {
  .lf-home-center .lf-dyn-grid {
    grid-template-columns: 1fr;
  }
}

/* Fran 2026-06-11 END ===================================================== */



/* Fran 2026-06-11 START =============================================================
HOME ARTICLE TEMPLATES — Centralized Styles
   Add this block to style.css (theme file).

   Covers all product Home and Partner Home articles.
   All article templates reference only the class names below.
   To restyle all home articles: edit this file only.

   NOTE: .lf-dyn-group / .lf-dyn-title / .lf-dyn-link / etc.
   are already defined in style.css — do not duplicate them here.
   ============================================================= */


/* -------------------------------------------------------
   article_home.hbs — full-width override
   Removes the 66% max-width constraint that normally
   reserves space for the right sidebar.
------------------------------------------------------- */
@media (min-width: 1024px) {
  .article-container--home .article {
    flex: 1 0 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0;
  }
}


/* -------------------------------------------------------
   Outer 3-column layout
   Left (resources) | Center (content) | Right (image/works-with)
------------------------------------------------------- */
.lf-home-layout {
  display: grid;
  grid-template-columns: 234px 1fr 389px;
  align-items: start;
}

/* Override lf-dyn-grid min column width inside the home center
   column — the default 240px min is too wide for a narrower col. */
.lf-home-center .lf-dyn-grid {
  grid-template-columns: repeat(var(--lf-dyn-cols, 1), minmax(160px, 1fr));
}


/* -------------------------------------------------------
   Left column — Additional Resources
------------------------------------------------------- */
.lf-home-left {
  padding: 0 20px 24px 0;
  border-right: 1px solid #d8dcde;
}

.lf-home-resources-title {
  font-size: 14px;
  font-weight: 700;
  margin: 0 0 10px 0;
  color: #2f3941;
}

.lf-home-resources-list {
  list-style: disc;
  padding-left: 18px;
  margin: 0 0 24px 0;
}

.lf-home-resources-list li {
  margin-bottom: 7px;
}

.lf-home-resources-list a {
  font-size: 14px;
  color: #1f73b7;
  text-decoration: none;
}

.lf-home-resources-list a:hover {
  text-decoration: underline;
}

.lf-home-counterpart-list {
  list-style: none;
  padding: 0;
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid #d8dcde;
}

.lf-home-counterpart-list li {
  margin-bottom: 6px;
}

.lf-home-counterpart-link {
  font-size: 14px;
  color: #1f73b7;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.lf-home-counterpart-link:hover {
  text-decoration: underline;
}


/* -------------------------------------------------------
   Center column
------------------------------------------------------- */
.lf-home-center {
  padding: 0 28px;
}

/* Model / Serial lookup form */
.lf-home-lookup {
  margin-bottom: 14px;
}

.lf-home-lookup__row {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 10px;
}

.lf-home-lookup__label {
  font-size: 14px;
  color: #2f3941;
  width: 145px;
  flex-shrink: 0;
}

.lf-home-lookup__input {
  width: 190px;
  padding: 5px 10px;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  font-size: 14px;
  background: #fff;
}

.lf-home-lookup__input:focus {
  outline: 2px solid #1f73b7;
  outline-offset: 0;
}

/* Divider between lookup and article groups */
.lf-home-divider {
  border: none;
  border-top: 1px solid #d8dcde;
  margin: 14px 0 16px 0;
}

/* "Self Help articles:" label */
.lf-home-articles-label {
  font-size: 15px;
  color: #2f3941;
  margin: 0 0 14px 0;
}


/* -------------------------------------------------------
   Right column — brand logo, product image, Works with
------------------------------------------------------- */
.lf-home-right {
  padding: 0 0 0 20px;
  border-left: 1px solid #d8dcde;
}

.lf-home-brand-logo {
  max-width: 130px;
  height: auto;
  display: block;
  margin-bottom: 14px;
}

.lf-home-product-image {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  margin-bottom: 16px;
}

.lf-home-works-with__title {
  font-size: 14px;
  font-weight: 600;
  color: #2f3941;
  margin: 0 0 10px 0;
}

.lf-home-console-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid #d8dcde;
  border-radius: 4px;
  text-decoration: none;
  color: #2f3941;
  background: #fff;
  margin-bottom: 8px;
}

.lf-home-console-card:hover {
  border-color: #8f959e;
  text-decoration: none;
}

.lf-home-console-card img {
  width: 144px;
  height: 108px;
  object-fit: cover;
  flex-shrink: 0;
  border-radius: 2px;
}

.lf-home-console-card span {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
  color: #2f3941;
}


/* -------------------------------------------------------
   Responsive — stack columns below 900px
------------------------------------------------------- */
@media (max-width: 900px) {
  .lf-home-layout {
    grid-template-columns: 1fr;
  }

  .lf-home-left {
    border-right: none;
    border-bottom: 1px solid #d8dcde;
    padding: 0 0 20px 0;
    margin-bottom: 20px;
  }

  .lf-home-center {
    padding: 0;
  }

  .lf-home-right {
    border-left: none;
    border-top: 1px solid #d8dcde;
    padding: 20px 0 0 0;
    margin-top: 20px;
  }

  .lf-home-center .lf-dyn-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 600px) {
  .lf-home-center .lf-dyn-grid {
    grid-template-columns: 1fr;
  }
}

/* Fran 2026-06-11 END ===================================================== */