/*
* Name: Obscu
* Version: 4.1.5
* Author: Grow Shine Services Pvt. Ltd.
* Download From: https://themes.grow-shine.com OR https://www.customersupporttheme.com
* Corporate Website : https://www.grow-shine.com
* License: You must have a valid license purchased only from themes.grow-shine.com in order to legally use the theme for your project.
* Copyright: © 2016 - 2025 Grow Shine Services Pvt. Ltd. All Rights Reserved.
*/

@charset "UTF-8";
/***** Normalize.css *****/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  height: 100%;
  /* Barra de scroll vertical siempre reservada, tenga o no scroll la página.
     Así el ancho útil del viewport es idéntico en TODAS las páginas y no hay
     ese ~1% de diferencia (ancho de la barra) que hacía ver el home y las
     páginas internas con distinto tamaño/posición. A diferencia de
     scrollbar-gutter, acá se dibuja la barra real (no un hueco vacío blanco). */
  overflow-y: scroll;
}

body {
  margin: 0;
}

main {
  display: block;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
  transition: all 0.3s ease;
}

a:hover {
  transition: all 0.3s ease;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

b,
strong {
  font-weight: bolder;
}

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

summary {
  display: list-item;
}

template {
  display: none;
}

[hidden] {
  display: none;
}

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

body {
  background-color: #ffffff;
  color: rgba(13, 12, 14, 1);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* El body llena todo el alto del viewport y apila su contenido en columna,
     así el footer queda pegado abajo (sticky footer) y no queda blanco por
     debajo cuando la página es corta. */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  body > main {
    min-height: 65vh;
  }
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 600;
  margin-top: 0;
}

h1 {
  font-size: 32px;
}

h2 {
  font-size: 22px;
}

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

h4 {
  font-size: 16px;
}

a {
  color: rgba(160, 44, 83, 1);
  text-decoration: none;
}

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

input,
textarea {
  color: rgba(13, 12, 14, 1);
  font-size: 14px;
}

input {
  max-width: 100%;
  box-sizing: border-box;
  transition: border .12s ease-in-out;
}

input:not([type="checkbox"]) {
  outline: none;
}

input:not([type="checkbox"]):focus {
  border: 1px solid rgba(192, 192, 192, 1);
}

input[disabled] {
  background-color: #ddd;
}

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 rgba(230, 228, 231, 1);
  border-radius: 4px;
  padding: 8px 30px 8px 10px;
  outline: none;
  color: #555;
  width: 100%;
}

select:focus {
  border: 1px solid rgba(192, 192, 192, 1);
}

select::-ms-expand {
  display: none;
}

textarea {
  border: 1px solid rgba(230, 228, 231, 1);
  border-radius: 3px;
  resize: vertical;
  width: 100%;
  outline: none;
  padding: 10px;
}

textarea:focus {
  border: 1px solid rgba(192, 192, 192, 1);
}

.container {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 5%;
}

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

  body .full--width {
    width: 95%;
  }
}

body .full--width {
  max-width: 100%;
}

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

.error-page h1 {
    font-size: 5em;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0;
    margin-top: 40px;
}
.error-page h2,
h1.form-header {
    font-weight: 600;
}
.error-page h3 {
    font-size: 10em;
    color: rgba(192, 192, 192, 1);
    margin: 0;
}

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

.visibility-hidden, .recent-activity-accessibility-label, .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;
}

/***** Buttons *****/
.button, .section-subscribe button, .article-subscribe button, .community-follow button, .requests-table-toolbar .organization-subscribe button, .subscriptions-subscribe button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link, .edit-profile-button a, .hc__btn,
.split-button button {
  background-color: rgba(192, 192, 192, 1);
  border: 1px solid rgba(192, 192, 192, 1);
  border-radius: 3px;
  color: rgba(255, 255, 255, 1);
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  font-weight: 600;
  line-height: 2.34;
  margin: 0;
  padding: 0 24px;
  text-align: center;
  transition: background-color .12s ease-in-out, border-color .12s ease-in-out, color .15s ease-in-out;
  user-select: none;
  white-space: nowrap;
  width: 100%;
  -webkit-touch-callout: none;
}

.hc__btn {
    width: auto;
}

/* Sign in button styling - remove background */
.sign-in.hc__btn.login--btn,
.sign-in.login--btn,
a.sign-in.hc__btn {
  background-color: transparent !important;
  border: none !important;
  color: inherit !important;
}

.sign-in.hc__btn.login--btn:hover,
.sign-in.login--btn:hover,
a.sign-in.hc__btn:hover {
  background-color: transparent !important;
  border: none !important;
}

@media (min-width: 768px) {
  .button, .section-subscribe button, .article-subscribe button, .community-follow button, .requests-table-toolbar .organization-subscribe button, .subscriptions-subscribe button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link, .edit-profile-button a,
  .split-button button {
    width: auto;
  }
}

.button:hover, .section-subscribe button:hover, .article-subscribe button:hover, .community-follow button:hover, .requests-table-toolbar .organization-subscribe button:hover, .subscriptions-subscribe button:hover, .pagination-next-link:hover, .pagination-prev-link:hover, .pagination-first-link:hover, .pagination-last-link:hover, .edit-profile-button a:hover, .button:active, .section-subscribe button:active, .article-subscribe button:active, .community-follow button:active, .requests-table-toolbar .organization-subscribe button:active, .subscriptions-subscribe button:active, .pagination-next-link:active, .pagination-prev-link:active, .pagination-first-link:active, .pagination-last-link:active, .edit-profile-button a:active, .button:focus, .section-subscribe button:focus, .article-subscribe button:focus, .community-follow button:focus, .requests-table-toolbar .organization-subscribe button:focus, .subscriptions-subscribe button:focus, .pagination-next-link:focus, .pagination-prev-link:focus, .pagination-first-link:focus, .pagination-last-link:focus, .edit-profile-button a:focus, .button.button-primary, .section-subscribe button.button-primary, .section-subscribe button[data-selected="true"], .article-subscribe button.button-primary, .article-subscribe button[data-selected="true"], .community-follow button.button-primary, .requests-table-toolbar .organization-subscribe button.button-primary, .requests-table-toolbar .organization-subscribe button[data-selected="true"], .subscriptions-subscribe button.button-primary, .subscriptions-subscribe button[data-selected="true"], .button-primary.pagination-next-link, .button-primary.pagination-prev-link, .button-primary.pagination-first-link, .button-primary.pagination-last-link, .edit-profile-button a.button-primary {
  background-color: rgba(192, 192, 192, 1);
  color: rgba(255, 255, 255, 1);
  text-decoration: none;
}

.button.button-primary:hover, .section-subscribe button.button-primary:hover, .section-subscribe button[data-selected="true"]:hover, .article-subscribe button.button-primary:hover, .article-subscribe button[data-selected="true"]:hover, .community-follow button.button-primary:hover, .requests-table-toolbar .organization-subscribe button.button-primary:hover, .requests-table-toolbar .organization-subscribe button[data-selected="true"]:hover, .subscriptions-subscribe button.button-primary:hover, .subscriptions-subscribe button[data-selected="true"]: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, .edit-profile-button a.button-primary:hover, .button.button-primary:focus, .section-subscribe button.button-primary:focus, .section-subscribe button[data-selected="true"]:focus, .article-subscribe button.button-primary:focus, .article-subscribe button[data-selected="true"]:focus, .community-follow button.button-primary:focus, .requests-table-toolbar .organization-subscribe button.button-primary:focus, .requests-table-toolbar .organization-subscribe button[data-selected="true"]:focus, .subscriptions-subscribe button.button-primary:focus, .subscriptions-subscribe button[data-selected="true"]: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, .edit-profile-button a.button-primary:focus, .button.button-primary:active, .section-subscribe button.button-primary:active, .section-subscribe button[data-selected="true"]:active, .article-subscribe button.button-primary:active, .article-subscribe button[data-selected="true"]:active, .community-follow button.button-primary:active, .requests-table-toolbar .organization-subscribe button.button-primary:active, .requests-table-toolbar .organization-subscribe button[data-selected="true"]:active, .subscriptions-subscribe button.button-primary:active, .subscriptions-subscribe button[data-selected="true"]: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, .edit-profile-button a.button-primary:active {
  background-color: #8d8d8d;
  border-color: #8d8d8d;
}

.button[data-disabled], .section-subscribe button[data-disabled], .article-subscribe button[data-disabled], .community-follow button[data-disabled], .requests-table-toolbar .organization-subscribe button[data-disabled], .subscriptions-subscribe button[data-disabled], .pagination-next-link[data-disabled], .pagination-prev-link[data-disabled], .pagination-first-link[data-disabled], .pagination-last-link[data-disabled], .edit-profile-button a[data-disabled] {
  cursor: default;
}

.button-large, input[type="submit"] {
  cursor: pointer;
  background-color: rgba(192, 192, 192, 1);
  border: 0;
  border-radius: 3px;
  color: rgba(255, 255, 255, 1);
  font-size: 14px;
  font-weight: 400;
  line-height: 2.72;
  min-width: 190px;
  padding: 0 1.9286em;
  width: 100%;
}

@media (min-width: 768px) {
  .button-large, input[type="submit"] {
    width: auto;
  }
}

.button-large:hover, .button-large:active, .button-large:focus, input[type="submit"]:hover, input[type="submit"]:active, input[type="submit"]:focus {
  background-color: #8d8d8d;
}

.button-large[disabled], input[type="submit"][disabled] {
  background-color: #ddd;
}

.button-secondary {
  color: #403b45;
  border: 1px solid rgba(230, 228, 231, 1);
  background-color: transparent;
}

.button-secondary:hover, .button-secondary:focus, .button-secondary:active {
  color: rgba(13, 12, 14, 1);
  border: 1px solid rgba(230, 228, 231, 1);
  background-color: #f7f7f7;
}

/***** 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: #403b45;
  font-size: 13px;
  text-align: left;
}

[dir="rtl"] .table th, [dir="rtl"]
.table th a {
  text-align: right;
}

.table tr {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  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: 750px;
  background-color: rgba(255, 255, 255, 1);
  padding: 30px;
  border-radius: 3px;
  margin-bottom: 50px;
}

.form p {
  text-align: left;
}

.form .rPCMa span.kXVLDw,
.form .hMopEg span.kXVLDw {
  color: red;
  padding-left: 5px;
}

.lnPyYC h2 {
  font-size: 17px;
}

.ihVAXT {
  background: #fff;
  padding: 25px;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
}

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

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

.form-field.required > label::after {
  margin-left: 2px;
  content: "*";
  color: #FC8181;
}

.form-field input,
.form input {
  border: 1px solid rgba(230, 228, 231, 1);
  border-radius: 4px;
  padding: 10px;
  width: 100%;
}

.new_community_post input[type="submit"] {
  width: 10%;
  padding: 2px;
}

body .ck.ck-editor__main>.ck-editor__editable:not(.ck-focused), .hbs-form select, .search select, .form select, .form .bQzCzH, .upload-dropzone, .form div[role="button"] {
  border: 1px solid rgba(230, 228, 231, 1);
}

body .ck.ck-editor__top .ck-sticky-panel .ck-sticky-panel__content {
  border: solid rgba(230, 228, 231, 1);
  border-width: 1px 1px 0;
}

.form .ggKiGq, .upload-dropzone, .form div[role="button"] {
  background-color: #fff;
  border: 1px dashed rgba(230, 228, 231, 1);
}

.form button[type="submit"] {
    border-radius: 3px;
    min-width: 190px;
}

.form-field input:focus {
  border: 1px solid rgba(192, 192, 192, 1);
}

.form-field input[type="text"] {
  border: 1px solid rgba(230, 228, 231, 1);
  border-radius: 4px;
}

.form-field input[type="text"]:focus {
  border: 1px solid rgba(192, 192, 192, 1);
}

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

.form-field .nesty-input {
  border-color: rgba(230, 228, 231, 1);
  border-radius: 3px;
  height: 40px;
  line-height: 40px;
  outline: none;
  vertical-align: middle;
}

.form-field .nesty-input:focus {
  border: 1px solid rgba(192, 192, 192, 1);
  text-decoration: none;
}

.form-field .hc-multiselect-toggle:focus {
  outline: none;
  border: 1px solid rgba(192, 192, 192, 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: #403b45;
  margin-left: 4px;
}

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

.form footer {
  margin-top: 0;
  padding-top: 30px;
  text-align: right;
}

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

.form .suggestion-list {
  font-size: 13px;
  margin-top: 15px;
}

.form .suggestion-list h2 {
  font-size: 14px;
  margin-bottom: 0;
}

.form .suggestion-list .searchbox {
  background: #fff;
  border: 1px solid rgba(230, 228, 231, 1);
  padding: 20px;
  border-radius: 3px;
}

.form .suggestion-list label {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  display: block;
  padding-bottom: 5px;
}

.form .suggestion-list li {
  padding: 10px 0;
}

.form .suggestion-list li a:visited {
  color: #50162a;
}

.upload-item,
.bNjKvm {
  background: #ffffff;
}

.upload-item:hover {
  background: #ccc;
}

.ck.ck-button:focus-visible, .ck.ck-content.ck-editor__editable.ck-editor__editable_inline.ck-focused,
.ck.ck-content.ck-editor__editable.ck-focused, .ck.ck-toolbar:focus-visible {
  box-shadow: none !important;
  border-color: rgba(230, 228, 231, 1) !important;
}

.gNoOyn {
  text-align: right;
}

.post-bb {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  margin-bottom: 25px;
}

/***** Header *****/

.alert--bar {
  background: rgba(240, 62, 62, 1);
  padding: 10px 0;
  color: #FFFFFF;
  text-align: center;
  position: relative;
  z-index: 3;
}

@media (max-width: 768px) {
  .alert--bar {
    font-size: 11px;
  }
}

.alert--bar a {
  color: #FFFFFF;
  border-bottom: 1px solid;
}

.hc_header {
  background: transparent;
  z-index: 9;
  position: relative;
}

._border {
  border-bottom: 1px solid #fff;
}

.header {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 5%;
  position: relative;
  align-items: center;
  display: flex;
  height: 72px;
  justify-content: space-between;
}

@media (min-width: 1160px) {
  .header {
    padding: 0;
    width: 90%;
  }
}

.logo img {
  max-height: 35px;
}

.user-nav {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .user-nav {
    position: relative;
  }
  .form button[type="submit"] {
    float: right;
    margin-bottom: 10px;
  }
}

.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 #e8e8e8;
  right: 0;
  left: 0;
  top: 72px;
  z-index: 1;
}

.user-nav[aria-expanded="true"] > a {
  display: block;
  margin: 20px;
}

.logo span {
  color: rgba(13, 12, 14, 1);
  height: 35px;
  display: inline-block;
  vertical-align: bottom;
  margin-left: 5px;
}

@media (min-width: 768px) {
  .nav-wrapper .cd-primary-nav-trigger {
    padding-right: 0;
    margin-right: -12px;
  }
}

.nav-wrapper a.login {
  display: inline-block;
}

.nav-wrapper .menu-button {
  background: none;
  border: 0;
  color: #fff;
  display: inline-block;
  margin-right: 2px;
  padding: 0;
  width: auto;
  cursor: pointer;
}

@media (min-width: 768px) {
  .nav-wrapper .menu-button {
    display: none;
  }
}

.nav-wrapper .menu-button .icon-menu {
  vertical-align: middle;
  width: 17px;
  height: 17px;
}

[dir="rtl"] .nav-wrapper .menu-button {
  margin-left: 10px;
  margin-right: 0;
}

.nav-wrapper .menu-button:hover, .nav-wrapper .menu-button:focus, .nav-wrapper .menu-button:active {
  background-color: transparent;
  color: #fff;
}

.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: rgba(13, 12, 14, 1);
  display: none;
  font-size: 16px;
  padding: 0 10px 0 10px;
  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 {
  color: rgba(13, 12, 14, 1);
  opacity: 0.9;
}

@media (min-width: 1024px) {
  .nav-wrapper-mobile {
    display: none;
  }
}
.nav-wrapper-mobile .menu-button-mobile {
  background: none;
  border: 0;
  width: auto;
  cursor: pointer;
  padding: 0;
}
.nav-wrapper-mobile .menu-button-mobile .icon-menu {
  background: rgba(160, 44, 83, 1);
  color: #fff;
  padding: 9px;
  vertical-align: middle;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  transition: background 0.2s ease, box-shadow 0.2s ease;
}
.nav-wrapper-mobile .menu-button-mobile[aria-expanded=true] .icon-menu {
  background: rgba(192, 192, 192, 1);
  box-shadow: 0 2px 12px rgba(0,0,0,0.2);
}
.nav-wrapper-mobile .menu-list-mobile {
  position: fixed;
  background-color: #fff;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
  border-radius: 16px;
  right: 16px;
  top: 76px;
  width: 240px;
  z-index: 9999;
  display: none;
  padding: 12px;
}
.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: 2px 0;
}
.nav-wrapper-mobile .menu-list-mobile-items li:empty:not(.nav-divider) {
  display: none;
}
.nav-wrapper-mobile .menu-list-mobile-items .nav-divider {
  display: none;
}
.nav-wrapper-mobile .menu-list-mobile-items button {
  background: none;
  border: none;
  padding: 10px 16px;
  width: 100%;
  height: 100%;
  color: rgba(13, 12, 14, 1);
  cursor: pointer;
  text-align: start;
  border-radius: 10px;
  font-size: 15px;
}
.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: #f5f5f5;
}
.nav-wrapper-mobile .menu-list-mobile-items a {
  display: block;
  padding: 10px 16px;
  width: 100%;
  height: 100%;
  color: rgba(13, 12, 14, 1);
  border-radius: 10px;
  font-size: 15px;
  font-weight: 500;
}
.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: #f5f5f5;
  text-decoration: none;
}
.nav-wrapper-mobile .menu-list-mobile-items .user-avatar-item .my-profile {
  background-color: #f8f8f8;
  border-radius: 12px;
  padding: 12px 16px;
  margin-bottom: 4px;
}
.nav-wrapper-mobile .menu-list-mobile-items .my-profile {
  display: flex;
  align-items: center;
  line-height: 1.4;
}
.nav-wrapper-mobile .menu-list-mobile-items .my-profile .my-profile-tooltip {
  font-size: 12px;
  color: #999;
}
.nav-wrapper-mobile .menu-list-mobile-items .menu-profile-avatar {
  height: 44px;
  width: 44px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 12px;
}
[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,
.search .clear-button {
  display: none;
}

/* Native browser search clear button (X) */
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath stroke='%23A02C53' stroke-linecap='round' stroke-width='2' d='M3 9l6-6m0 6L3 3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.15s ease;
}

input[type="search"]::-webkit-search-cancel-button:hover {
  opacity: 1;
}

/***** 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 .dropdown-toggle {
  background: #F6F6F6 !important;
  border: 1px solid #F6F6F6 !important;
  border-radius: 3px;
}

.user-info > button {
  background: #F6F6F6 !important;
  border: 1px solid #F6F6F6 !important;
  border-radius: 3px;
  color: rgba(13, 12, 14, 1);
  min-width: 0;
  padding: 5px 10px;
  white-space: nowrap;
}

.user-info > button:hover, .user-info > button:focus {
  color: rgba(13, 12, 14, 1);
  background: #F6F6F6 !important;
  opacity: 0.9;
}

.user-info > button::after {
  color: rgba(160, 44, 83, 1);
  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(192, 192, 192, 1);
  border: 2px solid #fff;
  border-radius: 50%;
  bottom: -4px;
  background-color: rgba(255, 255, 255, 1);
  font-size: 17px;
  height: 17px;
  line-height: 17px;
  position: absolute;
  right: -2px;
  text-align: center;
  width: 17px;
}

/***** Footer *****/

.footer {
    background: rgba(255, 255, 255, 0.23);
    /* auto: en el body flex-column empuja el footer al fondo del viewport
       cuando la página es corta; en páginas largas colapsa a 0 y el aire lo da
       el propio padding interno del footer. */
    margin-top: auto;
    color: rgba(255, 255, 255, 1);
}

._grid ._col_4 {
    flex: 1 0 auto;
    width: 25%;
    padding-top: 50px;
    padding-bottom: 40px;
    padding-right: 15px;
}

.hc_footer h3:after,
.article-relatives h2:after,
.article-sidebar .sidenav-title:after,
.new-request-title:after {
    content: "";
    background: rgba(255, 255, 255, 1);
    height: 3px;
    display: block;
    margin-top: 10px;
    max-width: 50px;
}

.article-relatives h2:after,
.article-sidebar .sidenav-title:after,
.new-request-title:after {
    background: rgba(192, 192, 192, 1);
    margin-top: 5px;
}

.hc_footer ._col h3 {
    color: rgba(255, 255, 255, 1);
    font-size: 1.3em;
    font-weight: 700;
}

.hc_footer ._col li {
    padding: 6px 0;
    line-height: 1.2;
}

.footer .social {
    margin-bottom: 10px;
}

.footer .social li {
    display: inline-block;
    margin: 1px;
    padding-bottom: 0;
}
.footer .social li a {
    border: 1px solid rgba(255, 255, 255, 1);
    height: 35px;
    display: block;
    width: 35px;
    line-height: 32px;
    border-radius: 3px;
    text-align: center;
}
.footer .social li i {
    font-size: 0.9em;
}
.footer .social li a:hover,
.footer .social li a:focus {
    background: #fff;
    border-color: #fff;
    color: #333;
}
.footer .social li a:hover {
  transform: translateY(-4px);
}
.footer a,
.footer_copyright a,
.footer_copyright p {
    color: rgba(255, 255, 255, 1);
}
.footer-inner {
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 5%;
    display: flex;
    justify-content: space-between;
}
.text-center {
    text-align: center;
}

.footer_copyright {
    background: rgba(255, 255, 255, 0.23);
    padding: 10px 1px 10px 1px;
    color: #fff;
}

.footer_copyright a {
   border-bottom: 1px dashed #fff;
}

@media (min-width: 1160px) {
  .footer-inner {
    padding: 0;
    width: 90%;
  }
  .nav-wrapper .cd-primary-nav-trigger {
    padding-right: 0;
    margin-right: -10px;
  }
}

.footer-language-selector {
  color: #403b45;
  display: inline-block;
  font-weight: 300;
}

.footer-language-selector button.dropdown-toggle {
  color: rgba(255, 255, 255, 1);
  border: 1px solid rgba(255, 255, 255, 1);
  border-radius: 3px;
  padding: 10px 25px;
}

@media (max-width: 500px) {
  body ._grid ._col_4 {
    width: 100%;
    padding-top: 30px;
    padding-bottom: 30px;
  }

  body .footer {
    padding-bottom: 0;
  }

  .footer_copyright p {
    margin-top: 0;
  }

  body .home__categories,
  body .contact--blocks {
    padding: 40px 0;
  }

  body .quick-articles > section {
      margin: 20px 0 0;
  }

  .blocks-list li:last-child {
    margin-bottom: 0;
  }

  .user-info .dropdown-toggle > span {
    display: none;
  }

}

/***** Breadcrumbs *****/

.breadcrumbs {
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
}

.breadcrumbs li {
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  font-weight: 500;
  color: #999;
  max-width: 280px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.breadcrumbs li:last-child {
  max-width: none;
  overflow: visible;
  text-overflow: unset;
  white-space: normal;
}

.breadcrumbs li a {
  color: #888;
  text-decoration: none;
  transition: color 0.15s ease;
}

.breadcrumbs li a:hover {
  color: #A02C53;
}

.breadcrumbs li:last-child a,
.breadcrumbs li:last-child a:visited,
.breadcrumbs li:last-child {
  color: #333;
  font-weight: 600;
}

.breadcrumbs li:first-child a {
  display: inline-flex;
  align-items: center;
  font-size: 0; /* oculta el texto original "Admoji" */
}

/* Reemplaza "Admoji" + icono de casa por un simple "Home" */
[dir=ltr] .breadcrumbs__block .breadcrumbs li:first-child a:before,
[dir=rtl] .breadcrumbs__block .breadcrumbs li:first-child a:after {
  content: "Home";
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #888;
}

/* El icono del home acompaña el color del texto en hover */
[dir=ltr] .breadcrumbs__block .breadcrumbs li:first-child a:hover:before,
[dir=rtl] .breadcrumbs__block .breadcrumbs li:first-child a:hover:after {
  color: #A02C53;
}

[dir=ltr] .breadcrumbs li + li::before,
[dir=rtl] .breadcrumbs li + li::after {
  content: ">";
  font-family: 'Inter', sans-serif;
  margin: 0 8px;
  font-size: 13px;
  color: #ccc;
  font-weight: 300;
}

[dir=rtl] .breadcrumbs li + li::after {
  content: "<";
}

.breadcrumbs li a:visited {
  color: #888;
}

.breadcrumbs__block {
  border-bottom: none;
  padding: 14px 0;
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  .breadcrumbs__block {
    margin-bottom: 6px;
  }
}

/***** Search field *****/

.search {
  position: relative;
}

.hero .search {
  margin-top: 28px !important;
  box-shadow: 0 4px 32px rgba(0, 0, 0, 0.09) !important;
  border-radius: 60px !important;
  overflow: visible;
  background: #ffffff;
  max-width: 660px;
  margin-left: auto !important;
  margin-right: auto !important;
  transition: box-shadow 0.2s ease;
}

.hero .search:focus-within {
  box-shadow: 0 4px 32px rgba(0, 0, 0, 0.09), 0 0 0 3px rgba(160, 44, 83, 0.2) !important;
}

.search input[type="search"] {
  box-sizing: border-box;
  color: #333;
  padding-left: 40px;
  padding-right: 20px;
  -webkit-appearance: none;
  width: 100%;
}

.requests-table-toolbar .search input[type="search"] {
  border-color: rgba(230, 228, 231, 1);
  background-color: #fff;
  padding-left: 40px;
}

.requests-table-toolbar .search input[type="search"]:focus {
  border-color: #ddd;
}

[dir="rtl"] .search input[type="search"] {
  padding-right: 20px;
  padding-left: 110px;
}

[dir="rtl"] .search input[type="submit"] {
  right: inherit;
  left: 0;
}

.search input[type="search"]:focus {
  border: 1px solid #fff;
}

.search-full input[type="search"] {
  border: 1px solid #fff;
}

.search input[type="search"] {
    background-color: #ffffff !important;
    border: none !important;
    border-radius: 60px !important;
    height: 68px !important;
    padding: 10px 130px 10px 28px !important;
    font-size: 16px !important;
    font-weight: 400;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    width: 100%;
    transition: none;
    outline: none;
    box-shadow: none !important;
}

.search input[type="search"]:focus {
    border: none !important;
    box-shadow: none !important;
    outline: none;
}

.search input[type="search"]::placeholder {
    color: #b0b0b0 !important;
    opacity: 1;
}

.search input[type="submit"] {
    border: none !important;
    color: #ffffff !important;
    height: calc(100% - 14px);
    overflow: hidden;
    position: absolute;
    right: 7px;
    top: 7px;
    vertical-align: middle;
    background: #A02C53 !important;
    padding: 0 26px !important;
    border-radius: 50px !important;
    margin: 0;
    min-width: 110px !important;
    max-width: 110px;
    font-weight: 600 !important;
    font-size: 14px !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    letter-spacing: 0.01em;
    transition: background 0.18s ease;
    cursor: pointer;
}

.search input[type="submit"]:hover {
    background: #8a2547 !important;
}

.search input[type="submit"]:active {
    background: #7a1f3d !important;
}

.search input[type="submit"]:focus-visible {
    outline: 2.5px solid #A02C53 !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 4px rgba(160, 44, 83, 0.2) !important;
}

/* Mobile responsive adjustments for search input */
@media (max-width: 768px) {
  .search input[type="search"] {
    padding: 10px 100px 10px 22px !important;
    font-size: 15px !important;
  }
  
  .search input[type="submit"] {
    min-width: 90px !important;
    max-width: 90px;
    padding: 0 16px !important;
    font-size: 14px !important;
  }
  
  .search-icon {
    width: 18px;
    height: 18px;
    left: 18px;
  }
}

@media (max-width: 480px) {
  .search input[type="search"] {
    padding: 10px 90px 10px 20px !important;
    font-size: 14px !important;
  }
  
  .search input[type="submit"] {
    min-width: 80px !important;
    max-width: 80px;
    padding: 0 12px !important;
    font-size: 13px !important;
  }
  
  .search-icon {
    width: 16px;
    height: 16px;
    left: 15px;
  }
}

.search-icon {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 26px !important;
  z-index: 1;
  width: 20px !important;
  height: 20px !important;
  color: #aaa !important;
  transition: color 0.15s ease;
}

.search input[type="search"]:focus ~ .search-icon,
.search:focus-within .search-icon {
  color: #A02C53 !important;
}

.breadcrumbs__block .search-icon,
.requests-table-toolbar .search-icon {
    transform: translateY(-50%);
}

[dir="rtl"] .search-icon {
  right: 15px;
  left: auto;
}

.search-container {
  position: relative;
}

/* Search autocomplete dropdown */
zd-autocomplete {
  background: #ffffff !important;
  border: 1px solid #ebebeb !important;
  border-radius: 16px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06) !important;
  padding: 8px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

@media (max-width: 768px) {
  zd-autocomplete {
    max-height: 50vh !important;
    overflow-y: auto !important;
  }
}

zd-autocomplete-multibrand {
  display: block !important;
  padding: 11px 14px !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  border: none !important;
  border-bottom: 1px solid #f5f5f5 !important;
  outline: none !important;
  transition: background-color 0.12s ease !important;
}

zd-autocomplete-multibrand:last-child {
  border-bottom: none !important;
}

zd-autocomplete-multibrand:hover,
zd-autocomplete-multibrand:focus,
zd-autocomplete-multibrand[aria-selected="true"] {
  background-color: #fef2f6 !important;
  border-bottom-color: transparent !important;
  outline: none !important;
  border-left: none !important;
  box-shadow: none !important;
}

zd-autocomplete-title-multibrand {
  display: block !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #222 !important;
  line-height: 1.45 !important;
  transition: color 0.12s ease !important;
}

zd-autocomplete-multibrand:hover zd-autocomplete-title-multibrand,
zd-autocomplete-multibrand[aria-selected="true"] zd-autocomplete-title-multibrand {
  color: #A02C53 !important;
}

zd-autocomplete-title-multibrand em {
  color: #A02C53 !important;
  font-style: normal !important;
  font-weight: 700 !important;
}

zd-autocomplete-breadcrumbs-multibrand {
  display: block !important;
  font-size: 11px !important;
  color: #bbb !important;
  margin-top: 3px !important;
  line-height: 1.3 !important;
  letter-spacing: 0.01em !important;
  border: none !important;
  outline: none !important;
}


/***** Hero component *****/

.welcome_text {
  color: rgba(13, 12, 14, 1);
  margin-bottom: 16px !important;
  font-weight: 800;
  font-size: 3.2em !important;
  line-height: 1.08;
  letter-spacing: -1.5px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.help-center-details {
  color: #888 !important;
  font-size: 1.1em !important;
  font-weight: 400;
  margin-bottom: 32px !important;
  line-height: 1.6;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto;
  letter-spacing: 0.01em;
}

/* ==========================================================================
   Reveal system — "settle" entrance (fade + micro-scale), plays once.
   Gated behind .reveal-ready (added in <head>) so content stays visible
   if JS is disabled/fails. Directionless on purpose: reads as solid, not "flying in".
   ========================================================================== */
/* PREVIEW: animaciones de carga desactivadas — todo visible de entrada.
   Para restaurar, descomentar el bloque de abajo y borrar este override. */
.reveal-ready .element-fade,
.reveal-ready .element-fade.is-visible {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/*
.reveal-ready .element-fade {
  opacity: 0;
  transform: scale(0.985);
}

.reveal-ready .element-fade.is-visible {
  opacity: 1;
  transform: none;
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
*/

@media (prefers-reduced-motion: reduce) {
  .reveal-ready .element-fade,
  .reveal-ready .element-fade.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

.hero {
  background-color: rgba(244, 244, 244, 0.8);
  padding: 100px 0 60px 0;
  margin-top: -72px;
  width: 100%;
}

/* Mobile: más aire entre el hero del home y la sección de categorías.
   Se ubica después del @media (max-width: 500px) que setea padding a
   .home__categories, para ganarle por orden de cascada. */
@media (max-width: 767px) {
  .hero:not(.pages--hero) {
    padding-bottom: 50px;
  }

  body .home__categories {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

.colored-header {
  background: rgba(244, 244, 244, 0.8);
}

/* pages--hero hereda el mismo padding que .hero para que TODOS los heroes
   (home e internas) sean idénticos y den la sensación de estar siempre en la
   misma página. Si querés heroes internos más compactos, definí el padding acá. */
.pages--hero {
  padding: 100px 0 60px 0;
}

/* Category & section: mismo fondo tintado bajo el hero que el home y los
   artículos, para que ninguna página quede con un "hueco" blanco tras el hero
   y todo se sienta continuo. Mismo tratamiento que .article-page. */
.category-page,
.section-page {
  background: rgba(244, 244, 244, 0.4);
}

/* Sticky footer real: el <main> crece para llenar el alto del viewport y el
   wrapper gris (category/section/article) se estira dentro de él, de modo que
   el fondo tintado llega hasta el footer y no queda una banda blanca abajo en
   páginas cortas. Scopeado con las clases que el theme pone en <html>. */
.is-category body > main,
.is-section body > main,
.is-article body > main {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
}

.is-category .category-page,
.is-section .section-page,
.is-article .article-page {
  flex: 1 0 auto;
}

.section-page {
  padding: 0 0 56px;
}

.category-page {
  padding: 0;
  /* Crea un contexto de formato para que el margin-top del breadcrumb no se
     colapse hacia afuera (hacia el hero) y quede dentro del wrapper gris. */
  display: flow-root;
}

.hero-image {
    background-image: url(/hc/theming_assets/01K2J5B7P36TTKF8A3MN02N2YB);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}

.hero-image::before,
.community-hero::before {
    content: "";
    background: rgba(244, 244, 244, 0.8);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0.7;
}

.hero-gradiant {
    background-image: linear-gradient(-150deg, #19003B 0%, #280082 97%);
}

.header-gradiant {
  background: transparent;
}

.hero-inner {
  max-width: 750px !important;
  position: relative;
  z-index: 1;
}

.search--center {
  margin: 0 auto;
  text-align: center;
}

.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;
    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 {
  color: #333;
  flex-grow: 1;
  margin-bottom: 15px;
}

.my-activities-header > h1 {
  font-weight: 600;
}

.page-header-description {
  color: #665e6e;
  margin: 0 0 30px 0;
  word-break: break-word;
  font-size: 16px;
  line-height: 1.6;
}

/* Section page content width */
.section-content {
  max-width: 780px;
  margin: 0 auto;
}

/* Enhanced page header for section pages */
.section-content .page-header h1 {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* El h1 de sección está oculto (screen-reader). Si además no hay descripción,
   el page-header queda vacío pero con su mb-20, sumando ~20px antes de la lista.
   Lo colapsamos para que queden 28px reales (simétricos) entre el breadcrumb y
   los títulos de artículos. Si hay descripción, se mantiene su espaciado. */
.section-content .page-header:not(:has(.page-header-description)) {
  margin: 0;
}

.section-content .page-header-description {
  font-size: 18px;
  color: #666;
  margin-bottom: 40px;
  line-height: 1.6;
  max-width: 800px;
}

@media (min-width: 1024px) {
  .page-header-description {
    flex-basis: 100%;
  }
}

/* Category page header — title and description side by side */
.category-content .page-header {
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 24px;
  flex-wrap: nowrap !important;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #f0f0f0;
}

/* Ocultar el header (título + descripción) en la página de categoría. */
.category-content .page-header {
  display: none !important;
}

/* En desktop las cards de sección son ~50% y van centradas; llevo el header
   (título de categoría) al mismo ancho y centrado para que quede alineado con
   la card de artículos de abajo. En mobile las cards son full-width, así que
   el header queda full-width por defecto. */
@media (min-width: 768px) {
  .category-content .page-header {
    /* Mismo ancho que la card de sección: por el margin negativo del
       .section-tree (0 -15px), la card mide calc(50% - 15px) del contenido. */
    max-width: calc(50% - 15px);
    margin-left: auto;
    margin-right: auto;
  }
}

.category-content .page-header h1 {
  flex: 0 0 auto;
  font-size: 22px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 0;
  white-space: nowrap;
  letter-spacing: -0.2px;
}

.category-content .page-header-description {
  flex: 1;
  font-size: 14px;
  color: #909090;
  margin: 0;
  line-height: 1.5;
  letter-spacing: 0.01em;
  flex-basis: auto !important;
}

@media (max-width: 767px) {
  .category-content .page-header {
    flex-direction: column !important;
    flex-wrap: wrap !important;
    gap: 8px;
  }

  .category-content .page-header h1 {
    white-space: normal;
  }

  .category-content .page-header-description {
    flex-basis: 100% !important;
    font-size: 13px;
  }
}

.page-header .icon-lock {
  height: 20px;
  width: 20px;
  position: relative;
  left: -5px;
  vertical-align: baseline;
}

.sub-nav {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 30px;
  min-height: 50px;
  padding-bottom: 15px;
}

.breadcrumbs__block .sub-nav {
  margin-bottom: 0;
  padding-bottom: 0;
  min-height: inherit;
}

@media (min-width: 768px) {
  .sub-nav {
    align-items: baseline;
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .sub-nav input[type="search"] {
    min-width: 300px;
  }
}

.sub-nav input[type="search"]::after {
  font-size: 15px;
}

/***** Blocks *****/
/* Used in Homepage#categories and Community#topics */
.blocks-list,
.quick-articles,
._grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  list-style: none;
  padding: 0;
}

.pt-30 {
  padding-top: 30px;
}

body .mb-0,
.article-sidebar ul.mb-0,
.article-sidebar ul.mb-0 > li:last-child {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .blocks-list {
    margin: -12px;
  }
  .quick-articles {
    margin: 0 -10px;
  }
}

.blocks-item,
.quick-articles > section {
  background: #fff;
  border-radius: 4px;
  box-sizing: border-box;
  color: rgba(192, 192, 192, 1);
  display: flex;
  flex: 1 0 340px;
  margin: 0 0 30px;
  max-width: 100%;
  transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.blocks-list .blocks-item:nth-child(1) { animation-delay: 0s; }
.blocks-list .blocks-item:nth-child(2) { animation-delay: 0.06s; }
.blocks-list .blocks-item:nth-child(3) { animation-delay: 0.12s; }
.blocks-list .blocks-item:nth-child(4) { animation-delay: 0.18s; }
.blocks-list .blocks-item:nth-child(5) { animation-delay: 0.24s; }
.blocks-list .blocks-item:nth-child(6) { animation-delay: 0.30s; }

.blocks-item {
  border-radius: 12px !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(160, 44, 83, 0.05) !important;
  overflow: hidden;
  position: relative;
  will-change: transform, box-shadow;
}

.blocks-item::before {
  content: none;
}

.quick-articles > section {
    display: block;
    margin: 40px 15px 10px;
    text-align: left;
    padding: 40px !important;
    background: rgba(255, 255, 255, 1) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid #f0f0f0 !important;
    position: relative;
    overflow: hidden;
}

.quick-articles > section::before {
  content: none;
}

[dir="rtl"] .quick-articles > section {
  text-align: inherit;
}

.quick-articles h2 {
    font-size: 1.4em;
    font-weight: 700;
    color: rgba(13, 12, 14, 1);
    margin-bottom: 0;
}

@media (min-width: 768px) {
  .blocks-item {
    margin: 15px 15px 15px;
  }
}

.blocks-item:hover, .blocks-item:focus, .blocks-item:active {
  background-color: #fff !important;
  box-shadow: 0 8px 24px rgba(160, 44, 83, 0.18) !important;
  transform: translateY(-4px) !important;
  transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
  color: rgba(13, 12, 14, 1);
  text-decoration: none;
}

.topics-list .blocks-item:hover i {
  color: rgba(159, 44, 83, 1);
}

.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: rgba(13, 12, 14, 1);
}

.blocks-item-link {
  background: #fff;
  color: rgba(13, 12, 14, 1);
  padding: 35px 30px !important;
  display: flex;
  flex-direction: column;
  flex: 1;
  border-radius: inherit;
  position: relative;
  transition: color 0.2s ease, text-decoration 0.2s ease;
}

.icon--center .blocks-item-link {
  align-items: center;
  text-align: center;
}

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


.blocks-item-link:focus {
  outline: 0;
  box-shadow: none;
  text-decoration: none;
}

.blocks-item-title {
  font-family: 'Inter', sans-serif;
  margin-bottom: 0;
  font-weight: 700;
  font-size: 1.5em !important;
  color: #1a1a1a;
  letter-spacing: -0.3px;
  transition: color 0.3s ease;
}

.blocks-item:hover .blocks-item-title {
  color: #A02C53 !important;
}

.blocks-item-description {
  color: #909090 !important;
  font-size: 0.95em !important;
  margin: 0;
  line-height: 1.6;
  transition: color 0.3s ease;
}

.blocks-item-description:not(:empty) {
  margin-top: 12px !important;
}

/***** Homepage *****/

.home__categories {
  background: rgba(244, 244, 244, 0.4);
  padding: 60px 0;
}

.contact--blocks {
  background: rgba(26, 116, 176, 0.08);
  padding: 60px 0;
  margin-bottom: -40px;
}

.section {
  margin-bottom: 40px;
}

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

.b-700 {
  font-weight: 700;
}

.hc--title {
  font-size: 28px !important;
  font-weight: 700;
  letter-spacing: -0.5px;
  color: #1a1a1a;
  margin-bottom: 30px;
  line-height: 1.2;
}

/* Si el título (kb_title) está vacío no debe ocupar espacio ni reservar su
   margen de 30px. Se oculta solo; vuelve a mostrarse si se le carga texto. */
.hc--title:empty {
  display: none;
}

.home-section h2 {
  color: rgba(13, 12, 14, 1);
  margin-bottom: 10px;
  text-align: center;
  font-weight: 600;
}

.category-icon i,
.category-icon svg {
  display: none;
}

.blocks-item span.category-icon,
.topic-icon,
.category-icon i:last-child,
.category-icon svg:last-child {
    display: block;
}

.category-icon img {
  max-width: 45px;
  margin-bottom: 10px;
}

.blocks-item .category-icon i,
.topic-icon i {
    color: #A02C53 !important;
    font-size: 2.8em !important;
    margin-bottom: 20px !important;
    transition: all 0.3s ease;
}

.blocks-item .category-icon svg,
.topic-icon svg {
    color: #A02C53 !important;
    font-size: 2.8em !important;
    height: 1em !important;
    width: auto !important;
    margin-bottom: 20px !important;
    transition: all 0.3s ease;
}

.blocks-item:hover .category-icon i,
.blocks-item:hover .category-icon svg {
    color: #A02C53 !important;
    transform: scale(1.1) rotate(8deg);
}

.article-list li:before,
.quick-articles ul > li > a:before,
.article-sidebar ul > li:before,
.section-lists li:before {
    content: "\f15c";
    color: rgba(192, 192, 192, 1);
    font-family: "FontAwesome";
    position: absolute;
    left: 0;
    margin-top: 2px;
}

/* Remove icon before for recent articles */
.recent-articles li a::before {
    content: none !important;
}

/* Remove icon before for section container article list items */
.section-container .article-list li:before {
    content: none;
}

/* Remove icon before for category container article list items */
.category-container .section-tree .section .article-list li:before {
    content: none;
}

[dir="rtl"] .article-list li:before,
[dir="rtl"] .quick-articles ul > li > a:before,
[dir="rtl"] .article-sidebar ul > li:before,
[dir="rtl"] .section-lists li:before {
    left: inherit;
    right: 0;
}

.section-lists li:before {
    content: "\f07c";
}
.article-relatives li a {
    color: #333;
}
.article-relatives h2 {
    margin-bottom: 15px;
}
.article-list li:last-child {
    border-bottom: 0;
}

/***** 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: 0;
    width: 100%;
    /* Three columns on desktop */
  }
  [dir="rtl"] .promoted-articles-item {
    padding: 0 0 0 30px;
  }
}

.promoted-articles-item:nth-child(3n) {
  padding-right: 0;
}

/* ── Homepage: 2-column featured section ──────────────────────── */
.home-featured-articles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 30px;
}

/* Sin artículos vistos recientemente: ocultamos la tarjeta vacía y
   centramos "promoted" en una sola columna con ancho máximo. */
.home-featured-articles.only-promoted {
  grid-template-columns: minmax(0, 640px);
  justify-content: center;
}

.home-featured-articles.only-promoted .home-recent-articles {
  display: none;
}

@media (max-width: 1024px) {
  .home-featured-articles {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px) {
  /* En mobile: aire simétrico de 50px arriba y abajo del box. Neutralizamos el
     padding-top de la clase .pt-30 para que el espacio superior lo dé solo el
     margin-top y no se duplique. */
  .home-featured-articles {
    margin-top: 50px;
    margin-bottom: 50px;
  }

  .home-featured-articles.pt-30 {
    padding-top: 0;
  }
}

/* Recently viewed articles box */
.home-recent-articles {
  background: #ffffff;
  border-radius: 16px;
  padding: 40px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  border: 1px solid #f0f0f0;
}

@media (max-width: 767px) {
  .home-recent-articles {
    padding: 24px 16px;
  }
}

/* Promoted articles box — mismo estilo que recent-articles */
.home-promoted-articles {
  background: #ffffff;
  border-radius: 16px;
  padding: 40px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  border: 1px solid #f0f0f0;
}

@media (max-width: 767px) {
  .home-promoted-articles {
    padding: 24px 16px;
  }
}

.home-promoted-articles ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.home-promoted-articles li {
  margin-bottom: 8px;
  padding: 0;
  position: relative;
  list-style: none;
}

.home-promoted-articles li:last-child {
  margin-bottom: 0;
}

.home-promoted-articles li a {
  display: flex !important;
  align-items: center;
  padding: 15px 20px !important;
  background: #ffffff !important;
  border: 1px solid #ebebeb !important;
  border-radius: 10px !important;
  color: #333 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  font-weight: 500;
  font-size: 15px;
  position: relative;
}

.home-promoted-articles li a:hover {
  background: #fef2f6 !important;
  box-shadow: inset 3px 0 0 #A02C53, 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  color: #A02C53 !important;
}

.home-promoted-articles li a:active {
  background: #fce8f0 !important;
  box-shadow: inset 3px 0 0 #8a2547, 0 1px 2px rgba(0, 0, 0, 0.06) !important;
  color: #8a2547 !important;
}

.home-promoted-articles li a::after {
  content: '›';
  position: absolute;
  right: 20px;
  color: #999;
  font-size: 20px;
  transition: color 0.15s ease, transform 0.2s ease;
}

.home-promoted-articles li a:hover::after {
  color: #A02C53;
  transform: translateX(4px);
}
/* ─────────────────────────────────────────────────────────────── */

.promoted-articles-item a,
.quick-articles li a {
  display: block;
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  padding: 15px 0;
  color: rgba(13, 12, 14, 1);
}

/* Override for recent articles */
.recent-articles li a {
  border-bottom: none !important;
  padding: 16px 20px !important;
}

.quick-articles li a,
.article-list li,
.article-sidebar ul> li,
.section-lists li {
    padding-left: 25px;
}

/* Remove padding for recent articles */
.recent-articles li a {
    padding-left: 20px !important;
}

/* Remove padding for section container article list items */
.section-container .article-list li {
    padding-left: 0;
}

/* Remove padding for category container article list items */
.category-container .section-tree .section .article-list li {
    padding-left: 0 !important;
}

[dir="rtl"] .quick-articles li a,
[dir="rtl"] .article-list li,
[dir="rtl"] .article-sidebar ul> li,
[dir="rtl"] .section-lists li {
    padding-left: 0;
    padding-right: 25px;
}

/* RTL support for section container article list */
[dir="rtl"] .section-container .article-list li {
    padding-right: 0;
}

[dir="rtl"] .section-container .article-list-arrow {
    margin-left: 0;
    margin-right: 12px;
    transform: scaleX(-1);
}

[dir="rtl"] .section-container .article-list-link:hover .article-list-arrow {
    transform: scaleX(-1) translateX(-4px);
}

[dir="rtl"] .section-container .article-list-item .icon-star,
[dir="rtl"] .section-container .article-list-item .icon-lock {
    margin-left: 0;
    margin-right: 8px;
}

[dir="rtl"] .section-container .see-all-articles i {
    margin-left: 0;
    margin-right: 8px;
}

[dir="rtl"] .section-container .see-all-articles:hover i {
    transform: translateX(-4px);
}

/* RTL support for category container article list */
[dir="rtl"] .category-container .section-tree .section .article-list li {
    padding-right: 0 !important;
}

[dir="rtl"] .category-container .section-tree .section .article-list-arrow {
    margin-left: 0;
    margin-right: 12px;
    transform: scaleX(-1);
}

[dir="rtl"] .category-container .section-tree .section .article-list-link:hover .article-list-arrow {
    transform: scaleX(-1) translateX(-4px);
}

[dir="rtl"] .category-container .section-tree .section .article-list-item .icon-star,
[dir="rtl"] .category-container .section-tree .section .article-list-item .icon-lock {
    margin-left: 0;
    margin-right: 8px;
}

[dir="rtl"] .category-container .section-tree .section .see-all-articles i {
    margin-left: 0;
    margin-right: 8px;
}

[dir="rtl"] .category-container .section-tree .section .see-all-articles:hover i {
    transform: translateX(-4px) !important;
}

.quick-articles ul li:last-child a {
    border-bottom: 0;
}

.quick-articles section li,
.article-list li,
.section-lists li {
    position: relative;
    margin-bottom: 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 rgba(230, 228, 231, 1);
  }
}

.new-request-title {
  margin-bottom: 30px;
}

/***** Community section in homepage *****/

.community {
  text-align: center;
}

.community-image {
  display: flex;
  align-items: center;
  min-height: 200px;
  background-image: url($community_image);
  background-position: center;
  background-repeat: no-repeat;
  max-width: 100%;
  position: relative;
  text-align: center;
}

.community,
.activity {
  border-top: 0;
  padding: 30px 0;
}

/***** Recent activity *****/

.recent-activity-list {
  padding: 0;
}

.recent-activity-item {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  overflow: auto;
  padding: 20px 0;
}

.recent-activity-item h3 {
  margin-bottom: 5px;
}

.recent-activity-item h3 a {
  font-weight: 700;
  font-size: 17px;
}

.quick-articles .recent-activity-item {
  padding: 10px 0;
}

.quick-articles .recent-activity-list section:last-child {
  border-bottom: 0;
}

.quick-articles .recent-activity-controls {
  padding-top: 0;
}

.recent-activity-item-parent {
  font-size: 16px;
  font-weight: 500;
}

.recent-activity-item-parent, .recent-activity-item-link {
  margin: 6px 0;
  color: rgba(13, 12, 14, 1);
  display: inline-block;
  width: 100%;
}

@media (min-width: 768px) {
  .recent-activity-item-parent, .recent-activity-item-link {
    width: 70%;
    margin: 0;
  }
  .quick-articles .recent-activity-item-parent,
  .quick-articles .recent-activity-item-link {
    width: 100%;
  }
}

.quick-articles .recent-activity-item-parent,
.quick-articles .recent-activity-item-link {
   color: rgba(13, 12, 14, 1);
}

.recent-activity-item-meta {
  margin: 5px 0 5px 0;
  display: flex;
  justify-content: space-between;
}

.recent-activity-item-time, .recent-activity-item-comment {
  color: rgba(192, 192, 192, 1);
  display: inline-block;
  font-size: 12px;
}

.home-recent-activity .recent-activity-item-time {
  color: #665e6e;
}

.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-comment-icon svg {
  vertical-align: middle;
  color: rgba(192, 192, 192, 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;
}

.home-recent-activity .recent-activity-item h3 {
  display: none;
}

/***** Category pages *****/

.category-container {
  display: flex;
  justify-content: flex-end;
}

.category-container .category-empty {
  padding-left: 20px;
}

.category-content {
  flex: 1;
  max-width: 780px;
  margin: 0 auto;
}

@media (min-width: 1024px) {
  .category-content {
    flex: 0 0 100%;
  }
}

/* La card de categoría se ubica y dimensiona igual que la card del artículo:
   arranca en el borde izquierdo del container y su ancho es el mismo que el de
   .article.article-card (todo el container menos el aside de 300px + gap 24px).
   Así, al navegar entre artículo y su categoría, la caja no se mueve ni cambia
   de tamaño. */
.category-page .category-container {
  justify-content: flex-start;
}

.category-page .category-content {
  max-width: none;
  margin: 0;
  flex: 1 1 auto;
  width: 100%;
}

@media (min-width: 1024px) {
  .category-page .category-content {
    flex: 0 0 auto;
    width: calc(100% - 324px); /* 300px del aside + 24px de gap del artículo */
    max-width: none;
  }
}

/* La página de categoría muestra sus secciones en una sola columna con el
   mismo ancho (780px centrado) que la lista de artículos de la página de
   sección, para que ambas cajas se vean idénticas. */
@media (min-width: 768px) {
  .category-page .category-container .section-tree {
    flex-direction: column;
    margin: 0;
  }

  .category-page .category-container .section-tree .section {
    flex: 1 1 100%;
    max-width: 100%;
    margin: 15px 0;
  }

  /* La primera sección arranca flush con el tope (sin margen superior). */
  .category-page .category-container .section-tree .section:first-child {
    margin-top: 0;
  }
}

.section-tree {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .section-tree {
    flex-direction: row;
    margin: 0 -15px;
    justify-content: center;
  }
}

.section-tree .section {
  flex: initial;
}

.category-container .section-tree .section {
  background: rgba(255, 255, 255, 1) !important;
  border-radius: 16px !important;
  padding: 40px !important;
  margin: 15px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
  border: none !important;
}

.category-container .section-tree .section::before {
  content: none;
}

@media (min-width: 768px) {
  .section-tree .section {
    flex: 1 1 calc(48% - 30px);
    max-width: calc(50% - 30px);
  }
}

@media (max-width: 767px) {
  .category-container .section-tree .section {
    flex: 1 1 100%;
    max-width: 100%;
    margin: 8px 0;
    padding: 24px 16px !important;
  }
}

.section-tree-title {
  display: none !important;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}

.section-tree-title a {
  color: #333;
}

.section-tree .see-all-articles,
.recent-activity-controls > a {
  display: block;
  padding: 6px 15px;
  background: rgba(192, 192, 192, 1);
  border-radius: 3px;
  color: rgba(255, 255, 255, 1);
  margin-top: 10px;
  margin-bottom: 5px;
}

.section-tree .see-all-articles {
  text-align: center;
}

/* "See all articles" button — category and section pages */
.category-container .section-tree .section .see-all-articles,
.section-container .see-all-articles {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 13px 20px !important;
  margin-top: 20px !important;
  background: #A02C53 !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  letter-spacing: 0.01em !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(160, 44, 83, 0.25) !important;
  transition: background 0.18s ease, box-shadow 0.2s ease, transform 0.18s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-sizing: border-box !important;
}

.category-container .section-tree .section .see-all-articles:hover,
.section-container .see-all-articles:hover {
  background: #8a2547 !important;
  box-shadow: 0 4px 18px rgba(160, 44, 83, 0.38), 0 1px 4px rgba(0,0,0,0.08) !important;
  transform: translateY(-2px) !important;
}

.category-container .section-tree .section .see-all-articles:focus-visible,
.section-container .see-all-articles:focus-visible {
  outline: 2.5px solid #A02C53 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 4px rgba(160, 44, 83, 0.2) !important;
}

.category-container .section-tree .section .see-all-articles:active,
.section-container .see-all-articles:active {
  transform: scale(0.96) translateY(0) !important;
  box-shadow: 0 1px 4px rgba(160, 44, 83, 0.2) !important;
}

.category-container .section-tree .section .see-all-articles i,
.section-container .see-all-articles i {
  transform: rotate(0deg) !important;
  font-size: 13px;
  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  margin-left: 0 !important;
}

.category-container .section-tree .section .see-all-articles:hover i,
.section-container .see-all-articles:hover i {
  transform: translateX(4px) !important;
}

.see-all-articles i {
  transform: rotate(-40deg);
  font-size: 13px;
  margin-left: 4px;
}

.recent-activity-controls > a {
  display: inline-block;
}

.article-list-item,
.section-lists-item {
  font-size: 16px;
  padding: 10px 0;
}

.article-list-item a,
.section-lists-item a {
  color: #333;
}

/* Enhanced article list link styling for section pages */
.section-container .section-content .article-list-item,
.section-container .article-list .article-list-item {
  padding: 0 !important;
  margin-bottom: 16px !important;
  list-style: none !important;
  position: relative;
  width: 100% !important;
  box-sizing: border-box !important;
}

.section-container .section-content .article-list-item:last-child,
.section-container .article-list .article-list-item:last-child {
  margin-bottom: 0 !important;
}

.section-container .section-content .article-list-link,
.section-container .article-list .article-list-link {
  display: flex !important;
  width: 100% !important;
  box-sizing: border-box !important;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px !important;
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  border-radius: 12px !important;
  color: #333 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  font-weight: 500;
}

.section-container .section-content .article-list-link:hover,
.section-container .article-list .article-list-link:hover {
  background: #fef2f6 !important;
  box-shadow: inset 3px 0 0 #A02C53, 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  color: #A02C53 !important;
}

.section-container .section-content .article-list-link:active,
.section-container .article-list .article-list-link:active {
  background: #fce8f0 !important;
  box-shadow: inset 3px 0 0 #8a2547, 0 1px 2px rgba(0, 0, 0, 0.06) !important;
  color: #8a2547 !important;
  transform: scale(0.995);
}

.section-container .section-content .article-list-link-text,
.section-container .article-list .article-list-link-text {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
}

.section-container .section-content .article-list-arrow,
.section-container .article-list .article-list-arrow {
  color: #999;
  transition: color 0.15s ease, transform 0.2s ease;
  flex-shrink: 0;
  margin-left: 12px;
}

.section-container .section-content .article-list-link:hover .article-list-arrow,
.section-container .article-list .article-list-link:hover .article-list-arrow {
  color: #A02C53;
  transform: translateX(4px);
}

.section-container .section-content .article-list-item .icon-star,
.section-container .section-content .article-list-item .icon-lock,
.section-container .article-list .article-list-item .icon-star,
.section-container .article-list .article-list-item .icon-lock {
  flex-shrink: 0;
  margin-left: 8px;
}

/* Enhanced article list link styling for category pages */
.category-container .section-tree .section .article-list-item {
  padding: 0 !important;
  margin-bottom: 16px !important;
  list-style: none !important;
  position: relative;
}

.category-container .section-tree .section .article-list-item:last-child {
  margin-bottom: 0 !important;
}

.category-container .section-tree .section .article-list-link {
  display: flex !important;
  width: 100% !important;
  box-sizing: border-box !important;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px !important;
  background: #ffffff !important;
  border: 1px solid #e8e8e8 !important;
  border-radius: 12px !important;
  color: #333 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  font-weight: 500;
}

.category-container .section-tree .section .article-list-link:hover {
  background: #fef2f6 !important;
  box-shadow: inset 3px 0 0 #A02C53, 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  color: #A02C53 !important;
}

.category-container .section-tree .section .article-list-link:active {
  background: #fce8f0 !important;
  box-shadow: inset 3px 0 0 #8a2547, 0 1px 2px rgba(0, 0, 0, 0.06) !important;
  color: #8a2547 !important;
  transform: scale(0.995);
}

.category-container .section-tree .section .article-list-link-text {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
}

.category-container .section-tree .section .article-list-arrow {
  color: #999;
  transition: color 0.15s ease, transform 0.2s ease;
  flex-shrink: 0;
  margin-left: 12px;
}

.category-container .section-tree .section .article-list-link:hover .article-list-arrow {
  color: #A02C53;
  transform: translateX(4px);
}

.category-container .section-tree .section .article-list-item .icon-star,
.category-container .section-tree .section .article-list-item .icon-lock {
  flex-shrink: 0;
  margin-left: 8px;
}

@media (max-width: 767px) {
  .section-container .section-content .article-list-link,
  .section-container .article-list .article-list-link,
  .category-container .section-tree .section .article-list-link,
  .quick-articles .article-list-link {
    padding: 12px 16px !important;
    border-radius: 8px !important;
    font-size: 14px;
  }

  .section-container .section-content .article-list-link-text,
  .section-container .article-list .article-list-link-text,
  .category-container .section-tree .section .article-list-link-text,
  .quick-articles .article-list-link-text {
    gap: 8px;
  }

  .section-container .section-content .article-list-arrow,
  .section-container .article-list .article-list-arrow,
  .category-container .section-tree .section .article-list-arrow,
  .quick-articles .article-list-arrow {
    margin-left: 8px;
    width: 14px;
    height: 14px;
  }

  .quick-articles > section {
    padding: 24px 16px !important;
    margin: 16px 0 !important;
  }
}

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

/***** Section pages *****/

.section-container {
  display: flex;
  justify-content: flex-end;
}

.section-container ul.article-list,
.section-container .section-lists {
  background: rgba(255, 255, 255, 1) !important;
  padding: 40px !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
  border: none !important;
}

.section-container .section-lists {
  margin-top: 10px;
}

@media (max-width: 767px) {
  .section-container ul.article-list,
  .section-container .section-lists {
    padding: 16px !important;
    border-radius: 12px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .section-container {
    flex-direction: column !important;
    justify-content: flex-start !important;
  }

  .section-content {
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

.section-content {
  flex: 1;
}

@media (min-width: 1024px) {
  .section-content {
    flex: 0 0 100%;
  }
}

/* La card de sección se ubica y dimensiona igual que la card del artículo:
   arranca en el borde izquierdo del container y su ancho es el mismo que el de
   .article.article-card (todo el container menos el aside de 300px + gap 24px).
   Mismo tratamiento que la página de categoría. */
.section-page .section-container {
  justify-content: flex-start;
}

.section-page .section-content {
  max-width: none;
  margin: 0;
  flex: 1 1 auto;
  width: 100%;
}

@media (min-width: 1024px) {
  .section-page .section-content {
    flex: 0 0 auto;
    width: calc(100% - 324px); /* 300px del aside + 24px de gap del artículo */
    max-width: none;
  }
}

.section-list {
  margin: 40px 0;
}

.section-list--collapsed .section-list-item:nth-child(1n + 6) {
  display: none;
}

.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: rgba(13, 12, 14, 1);
  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 75%;
    max-width: 75%;
    min-width: 640px;
    padding: 0 40px 0 0;
  }
  [dir="rtl"] .article {
    padding: 0px 0 0px 40px;
  }
}

.article-container {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  .article-container {
    flex-direction: row-reverse;
  }
}

.article-header {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  padding-bottom: 20px;
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 20px;
  margin-top: 20px;
}

@media (min-width: 768px) {
  .article-header {
    flex-direction: row;
    margin-top: 0;
  }
}

.article-avatar {
  margin-right: 10px;
}

.article-author {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .article-title {
    flex-basis: 100%;
    font-weight: 600;
  }
}

.article-title {
  margin-bottom: 0 !important;
  text-align: center;
  width: 100%;
}

@media (max-width: 767px) {
  .article-title {
    font-size: 20px !important;
    line-height: 1.3;
    text-align: center !important;
    width: 100%;
  }
}

.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 {
  font-size: 16px;
  max-width: 100%;
}

.article-meta {
  display: inline-block;
  vertical-align: middle;
}

.article-body img {
  height: auto;
  max-width: 100%;
}

.article-body iframe, .article-body img {
  border-radius: 10px;
  box-shadow: 0 20px 25px -5px rgb(0 0 0 / 5%), 0 10px 10px -5px rgb(0 0 0 / 4%);
}

/* Make article images larger on mobile */
@media (max-width: 768px) {
  .article-body img {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 20px 0 !important;
  }
  
  .article-body img[width],
  .article-body img[style*="width"] {
    width: 100% !important;
    min-width: 100% !important;
  }
  
  .article-body img[height],
  .article-body img[style*="height"] {
    height: auto !important;
  }
}

.article-body iframe {
  box-shadow: 25px 25px 0px 0px rgba(255, 255, 255, 1);
  margin-bottom: 40px;
}

.article-body ul, .article-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}

.article-body ul > li, .article-body ol > li {
  margin-bottom: 0.55rem;
  margin-top: 0.55rem;
}

[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 a:visited {
  color: rgba(160, 44, 83, 1);
}

.article-body a {
  text-decoration: underline;
  text-underline-position: under;
}

.article-body td {
  padding: 10px;
}

.article-body code {
  background: #f7f7f7;
  border: 1px solid #e8e8e8;
  border-radius: 5px;
  padding: 2px 6px;
  margin: 0 2px;
  font-size: 0.875em;
}

.article-body pre {
  background: rgba(255, 255, 255, 1);
  border: 1px solid #f2f2f2;
  border-radius: 12px;
  padding: 16px 20px;
  overflow: auto;
  white-space: pre;
}

.article-body blockquote {
  border-left: 3px solid #A02C53;
  color: #555;
  font-style: italic;
  padding: 12px 20px;
  background: #fef2f6;
  border-radius: 0 8px 8px 0;
  margin: 20px 0;
}

.article-body > p:last-child {
  margin-bottom: 0;
}

.article-content {
  line-height: 1.8;
  margin: 30px 0;
  word-wrap: break-word;
}

.article-body h2 {
  font-size: 22px;
  font-weight: 700;
  color: #1a1a1a;
  margin-top: 40px;
  margin-bottom: 14px;
  letter-spacing: -0.3px;
  line-height: 1.25;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.article-body h3 {
  font-size: 18px;
  font-weight: 600;
  color: #1a1a1a;
  margin-top: 32px;
  margin-bottom: 10px;
  letter-spacing: -0.2px;
  line-height: 1.3;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.article-body h4 {
  font-size: 15px;
  font-weight: 600;
  color: #333;
  margin-top: 24px;
  margin-bottom: 8px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.article-body p {
  margin-bottom: 18px;
  line-height: 1.78;
  color: #444;
}

/* Párrafos justificados (típicamente steps de navegación): sin margen.
   Zendesk borra el margin inline del artículo, por eso se anula acá. */
.article-body p.wysiwyg-text-align-justify {
  margin: 0;
}

/* Steps de navegación (<li> con párrafo justificado): margen a la mitad
   (8px → 4px) para juntar un poco los pasos. */
.article-body li:has(> p.wysiwyg-text-align-justify) {
  margin-bottom: 4px;
}

/* Lista que sigue a un título de step (<p> justificado): reduce el hueco
   entre el título y el primer item (default ~16px → 4px). */
.article-body p.wysiwyg-text-align-justify + ol,
.article-body p.wysiwyg-text-align-justify + ul {
  margin-top: 4px;
}

/* Notas / callouts: aire arriba y abajo (el margin inline lo borra Zendesk). */
.article-body .callout {
  margin: 8px 0;
}

.article-body ul,
.article-body ol {
  margin-bottom: 18px;
  padding-left: 24px;
}

.article-body li {
  margin-bottom: 8px;
  line-height: 1.7;
  color: #444;
}

.article-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
  padding-top: 20px;
}

/* Footer del artículo oculto: con share y comentarios desactivados queda vacío
   y solo dejaba un espacio en blanco. (Los votos y "volver arriba" están fuera
   de .article-footer, así que no se ven afectados.) Si algún día activás
   compartir o comentarios, quitá este display:none. */
.article-footer {
  display: none !important;
}

.article-comment-count {
  color: #403b45;
  font-weight: 300;
}

.article-comment-count:hover {
  text-decoration: none;
}

.article-comment-count-icon {
  vertical-align: middle;
  color: rgba(192, 192, 192, 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: 0;
}

@media (max-width: 767px) {
  .article-sidebar {
    border: none;
  }

  .article-header {
    margin-top: 0 !important;
    margin-bottom: 6px !important;
    padding-bottom: 6px !important;
    text-align: center;
  }
}

.article-sidebar .article-sidebar-item {
  font-weight: 700;
  margin-top: 15px;
  display: inline-block;
}

.article-sidebar .article-sidebar-item i {
  position: relative;
  top: 1px;
}

[dir="rtl"] .article-sidebar .article-sidebar-item i {
  display: none;
}

.article-sidebar .article-sidebar-item i,
.article-sidebar .article-sidebar-item:hover i {
  transition: transform 0.2s ease;
}

.article-sidebar .article-sidebar-item:hover i {
  transform: translateX(8px);
}

@media (min-width: 1024px) {
  .article-sidebar {
    border: 0;
    flex: 0 0 25%;
    height: auto;
  }
  .article-sidebar,
  .search-results-sidebar,
  .request-container .request-sidebar,
  .post-sidebar {
    align-self: start;
    position: sticky;
    top: 15px;
  }
}

.article-sidebar ul {
   margin-bottom: 25px;
}

.article-relatives > *:last-child {
  padding: 0;
}

/* 2-column layout: recent articles (left) + related articles (right) — desktop only */
@media (min-width: 1025px) {
  .article-relatives {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 36px;
    align-items: start;
  }
}

.article-votes {
  background: #f9f9f9 !important;
  border: 1px solid #f0f0f0 !important;
  border-top: none !important;
  border-radius: 14px !important;
  padding: 22px 28px !important;
  margin: 30px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

.article-votes .article-votes-controls {
  display: flex !important;
  gap: 8px !important;
}

.article-vote {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 8px 20px !important;
  border-radius: 100px !important;
  border: 1.5px solid #e0e0e0 !important;
  background: #fff !important;
  color: #555 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
  min-width: auto !important;
  width: auto !important;
}

.article-vote:hover {
  background: #fef2f6 !important;
  border-color: #A02C53 !important;
  color: #A02C53 !important;
  box-shadow: 0 2px 8px rgba(160, 44, 83, 0.15) !important;
}

.article-vote:active {
  transform: scale(0.96) !important;
  background: #fce8f0 !important;
}

.article-votes .article-votes-question {
  font-weight: 600 !important;
  font-size: 15px !important;
  color: #333 !important;
  margin: 0 !important;
  flex: 1 !important;
  min-width: 160px !important;
}

.article-more-questions {
  margin: 0;
  text-align: center;
}

.article-return-to-top {
  border-top: 1px solid #ddd;
}

@media (min-width: 1024px) {
  .article-return-to-top {
    display: none;
  }
}

@media (max-width: 767px) {
  .article-container footer {
    display: none;
  }
}

@media (max-width: 600px) {
  .article-votes {
    text-align: center;
  }
  .article-votes .article-votes-question,
  .article-votes .article-votes-controls {
    display: block;
  }
  .article-votes .article-votes-controls {
    margin: 15px 0;
  }
}

.article-return-to-top a {
  color: rgba(13, 12, 14, 1);
  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);
}

.sidenav-title {
  font-size: 18px;
  position: relative;
  font-weight: 700;
  margin-bottom: 15px;
  display: block;
  font-family: 'Inter', sans-serif;
}

.sidenav-item {
  color: rgba(13, 12, 14, 1);
  display: block;
}

.sidenav-item.current-article, .sidenav-item:hover,
.article-sidebar li a:hover {
  color: rgba(192, 192, 192, 1);
}

.recent-articles li,
.related-articles li,
.article-sidebar ul > li{
  margin-bottom: 12px;
  position: relative;
  list-style: none;
}

/* Enhanced recent articles list styling */
.recent-articles li {
  margin-bottom: 8px !important;
  padding: 0 !important;
}

.recent-articles li:last-child {
  margin-bottom: 0 !important;
}

.recent-articles li a {
  display: flex !important;
  align-items: center;
  padding: 15px 20px !important;
  background: #ffffff !important;
  border: 1px solid #ebebeb !important;
  border-radius: 10px !important;
  color: #333 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  font-weight: 500;
  font-size: 15px;
  position: relative;
}

.recent-articles li a:hover {
  background: #fef2f6 !important;
  box-shadow: inset 3px 0 0 #A02C53, 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  color: #A02C53 !important;
}

.recent-articles li a:active {
  background: #fce8f0 !important;
  box-shadow: inset 3px 0 0 #8a2547, 0 1px 2px rgba(0, 0, 0, 0.06) !important;
  color: #8a2547 !important;
  transform: scale(0.995);
}

.recent-articles li a::after {
  content: '›';
  position: absolute;
  right: 20px;
  color: #999;
  font-size: 20px;
  transition: color 0.15s ease, transform 0.2s ease;
}

.recent-articles li a:hover::after {
  color: #A02C53;
  transform: translateX(4px);
}

/* Related articles — same card style as recent articles */
.related-articles li {
  margin-bottom: 6px !important;
  padding: 0 !important;
}

.related-articles li:last-child {
  margin-bottom: 0 !important;
}

.related-articles li a {
  display: flex !important;
  align-items: center;
  padding: 12px 16px !important;
  background: #ffffff !important;
  border: 1px solid #ebebeb !important;
  border-radius: 10px !important;
  color: #333 !important;
  text-decoration: none !important;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
  font-weight: 500;
  font-size: 14px;
  position: relative;
}

.related-articles li a:hover {
  background: #fef2f6 !important;
  box-shadow: inset 3px 0 0 #A02C53, 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  color: #A02C53 !important;
}

.related-articles li a:active {
  background: #fce8f0 !important;
  box-shadow: inset 3px 0 0 #8a2547, 0 1px 2px rgba(0, 0, 0, 0.06) !important;
  color: #8a2547 !important;
  transform: scale(0.995);
}

.related-articles li a::after {
  content: '›';
  position: absolute;
  right: 20px;
  color: #999;
  font-size: 20px;
  transition: color 0.15s ease, transform 0.2s ease;
}

.related-articles li a:hover::after {
  color: #A02C53;
  transform: translateX(4px);
}


/***** Attachments *****/
/* Styles attachments inside posts, articles and comments */
.attachments .attachment-item {
  display: none !important;
}

/* Custom download button hover/active states */
a[href*="article_attachments"][style] {
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease !important;
}

a[href*="article_attachments"][style]:hover {
  background: #A02C53 !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(160, 44, 83, 0.3) !important;
}

a[href*="article_attachments"][style]:active {
  background: #8a2547 !important;
  color: #fff !important;
  transform: translateY(0) !important;
  box-shadow: 0 2px 6px rgba(160, 44, 83, 0.2) !important;
}

.upload-dropzone {
  border-color: rgba(230, 228, 231, 1);
  background-color: #fff;
  border-radius: 8px;
}

.upload-dropzone span {
  color: #403b45;
}

/***** 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: #332f37;
}

.share a:hover {
  text-decoration: none;
  color: rgba(192, 192, 192, 1);
}

.share a svg {
  height: 18px;
  width: 18px;
  display: block;
}

/***** Comments *****/
/* Styles comments inside articles, posts and requests */
.comment {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  padding: 20px 0;
}

.comment-heading {
  margin-bottom: 24px !important;
  margin-top: 0;
  font-size: 24px !important;
  font-weight: 700;
  color: #1a1a1a;
  letter-spacing: -0.3px;
}

.recent-articles-title,
.related-articles-title {
  margin-bottom: 14px !important;
  margin-top: 0;
  font-size: 11px !important;
  font-weight: 700;
  color: #aaa !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.comment-overview {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  border-top: 1px solid rgba(230, 228, 231, 1);
  padding: 20px 0;
}

.comment-overview p {
  margin-top: 0;
}

.comment-callout {
  color: #403b45;
  display: inline-block;
  font-weight: 300;
  font-size: 13px;
  margin-bottom: 0;
}

.comment-callout a {
  color: rgba(192, 192, 192, 1);
}

.comment-sorter {
  display: inline-block;
  float: right;
}

.comment-sorter .dropdown-toggle {
  color: #403b45;
  font-size: 13px;
}

[dir="rtl"] .comment-sorter {
  float: left;
}

.comment-wrapper {
  display: flex;
  position: relative;
}

.comment-wrapper.comment-official {
  border: 1px solid rgba(192, 192, 192, 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 {
    align-items: center;
    justify-content: space-between;
  }
}

#hc-wysiwyg {
  border-color: rgba(230, 228, 231, 1);
}

.comment-avatar {
  margin-right: 10px;
}

[dir="rtl"] .comment-avatar {
  margin-left: 10px;
  margin-right: 0;
}

.comment-meta {
  flex: 1 0 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(192, 192, 192, 1);
}

.comment-body {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  font-family: 'Inter', sans-serif;
  line-height: 1.6;
  overflow-x: auto;
}

.comment-body img {
  height: auto;
  max-width: 100%;
}

.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 a:visited {
  color: #50162a;
}

.comment-body 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: #403b45;
  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: #403b45;
  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(192, 192, 192, 1);
}

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

.vote-voted {
  color: rgba(192, 192, 192, 1);
}

.vote-voted:hover {
  color: #8d8d8d;
}

/***** 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/01K2J5B86N69AH9PGJ36GQM2QK);
  background-position: center center;
  background-size: cover;
  position: relative;
}

.community-footer {
  padding-top: 50px;
  text-align: center;
}

.community-footer-title {
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: 600;
}

.community-featured-posts .title {
  font-weight: 700;
}

.community-featured-posts, .community-activity {
  padding-top: 40px;
  width: 100%;
}

.community-activity .recent-activity-header {
  font-weight: 700;
  margin-bottom: 0;
}

.community-header {
  margin-bottom: 30px;
}

.community-header .title {
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 600;
}

.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: 10px;
}

/* Community topic page */
.topic-header {
  border-bottom: 1px solid rgba(230, 228, 231, 1);
  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(192, 192, 192, 1);
}

.community-follow button:hover::after, .community-follow button:focus::after {
  border-color: rgba(255, 255, 255, 1);
  color: rgba(255, 255, 255, 1);
}

.community-follow button[data-selected="true"] {
  background-color: rgba(192, 192, 192, 1);
  color: rgba(255, 255, 255, 1);
}

.community-follow button[data-selected="true"]::after {
  border-left: 1px solid rgba(255, 255, 255, 1);
  color: rgba(255, 255, 255, 1);
}

.community-follow button[data-selected="true"]:hover {
  background-color: #8d8d8d;
  border-color: #8d8d8d;
}

.community-follow button::after {
  border-left: 1px solid rgba(255, 255, 255, 1);
  content: attr(data-follower-count);
  color: rgba(255, 255, 255, 1);
  display: inline-block;
  font-family: 'Inter', 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(192, 192, 192, 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 rgba(230, 228, 231, 1);
  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: rgba(160, 44, 83, 1);
  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: #50162a;
}

.striped-list .meta-group {
  margin: 5px 0;
}

.striped-list-count {
  color: #403b45;
  font-weight: 300;
  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 {
  font-weight: 300;
  text-align: center;
}

@media (min-width: 768px) {
  .striped-list-number {
    color: rgba(13, 12, 14, 1);
    display: block;
    font-weight: 400;
  }
}

/***** 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(192, 192, 192, 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: #403b45;
}

.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-open, .status-label-closed, .status-label-solved, .status-label-new, .status-label-hold, .status-label-pending {
  text-transform: lowercase;
}

/***** 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;
  font-weight: 600;
}

@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: 'Inter', 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 img {
  height: auto;
  max-width: 100%;
}

.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 a:visited {
  color: #50162a;
}

.post-body 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: #403b45;
  font-style: italic;
  padding: 0 15px;
}

.post-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}

.post-comment-count {
  color: #403b45;
  font-weight: 300;
}

.post-comment-count:hover {
  text-decoration: none;
}

.post-comment-count .icon-comments {
  color: rgba(192, 192, 192, 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-weight: 700;
}

.post-comments,
.mb-20 {
  margin-bottom: 20px;
}

@media (min-width: 1024px) {
  .post-comments {
    margin-bottom: 0;
  }
}

/* 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 rgba(230, 228, 231, 1);
  border-top: 1px solid rgba(230, 228, 231, 1);
}

@media (min-width: 768px) {
  .collapsible-nav-border {
    border-top: 0;
  }
}

.collapsible-nav-toggle {
  top: calc(45px / 2);
  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(192, 192, 192, 1);
}

.collapsible-nav-list {
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .collapsible-nav-list {
    flex-direction: row;
  }
}

.collapsible-nav-list li {
  color: rgba(13, 12, 14, 1);
  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: rgba(13, 12, 14, 1);
  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(192, 192, 192, 1);
    order: 1;
  }
}

.collapsible-nav-list li[aria-selected="true"] a,
.collapsible-nav-list li.current a {
  color: rgba(13, 12, 14, 1);
}

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

  .article-container .collapsible-sidebar {
    background: rgba(255, 255, 255, 1);
    padding: 30px;
    margin-bottom: 20px;
    margin-top: 15px;
    border-radius: 12px;
  }
}

.collapsible-sidebar-title {
  margin-top: 0;
}

.collapsible-sidebar-toggle {
  position: absolute;
  top: calc(45px / 2);
  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(192, 192, 192, 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: rgba(255, 255, 255, 1);
  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: #403b45;
  font-size: 13px;
  font-weight: 300;
}

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

.no-activities {
  color: #403b45;
}

/***** 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: 30px;
}

@media (min-width: 1024px) {
  .request-breadcrumbs {
    margin-bottom: 20px;
  }
}

.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 {
  background: rgba(255, 255, 255, 1);
  border-radius: 3px;
  border: 1px solid rgba(230, 228, 231, 1);
  color: #403b45;
  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(192, 192, 192, 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(192, 192, 192, 1);
}

.request-main input#mark_as_solved {
  display: none;
}

.request-title {
  width: 100%;
  font-weight: 600;
}

@media (min-width: 1024px) {
  .request-title {
    border-bottom: 1px solid rgba(230, 228, 231, 1);
    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: rgba(255, 255, 255, 1);
    border: 0;
    border-radius: 3px;
    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 rgba(230, 228, 231, 1);
  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: #403b45;
  font-weight: 600;
  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: 30px 0;
  text-align: center;
}

.pagination-list {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.pagination-next, .pagination-prev, .pagination-first, .pagination-last {
  display: inline-block;
  margin: 0;
}

.pagination-first-link, .pagination-last-link {
  padding: 0 10px;
}

.pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 22px !important;
  background: #ffffff !important;
  border: 1.5px solid #e0e0e0 !important;
  border-radius: 100px !important;
  color: #444 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  letter-spacing: 0.01em;
  transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.2s ease, transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), color 0.18s ease !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07) !important;
  min-width: 44px;
  height: 44px;
  gap: 6px;
}

.pagination-next-link:hover, .pagination-prev-link:hover, .pagination-first-link:hover, .pagination-last-link:hover {
  background: #fdf0f4 !important;
  border-color: #A02C53 !important;
  box-shadow: 0 4px 16px rgba(160, 44, 83, 0.22), 0 1px 4px rgba(0,0,0,0.06) !important;
  transform: translateY(-2px);
  color: #A02C53 !important;
}

.pagination-next-link:focus-visible, .pagination-prev-link:focus-visible,
.pagination-first-link:focus-visible, .pagination-last-link:focus-visible {
  outline: 2.5px solid #A02C53 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 4px rgba(160, 44, 83, 0.15) !important;
}

.pagination-next-link:active, .pagination-prev-link:active, .pagination-first-link:active, .pagination-last-link:active {
  transform: scale(0.95) translateY(0) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07) !important;
}

.pagination-next-text, .pagination-prev-text, .pagination-first-text, .pagination-last-text {
  margin-right: 0;
}

.pagination-next-icon, .pagination-prev-icon, .pagination-first-icon, .pagination-last-icon {
  font-size: 17px;
  line-height: 1;
  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.pagination-next-link:hover .pagination-next-icon,
.pagination-last-link:hover .pagination-last-icon {
  transform: translateX(3px);
}

.pagination-prev-link:hover .pagination-prev-icon,
.pagination-first-link:hover .pagination-first-icon {
  transform: translateX(-3px);
}

.pagination-next-link {
  padding-right: 10px;
}

.pagination-next-text {
  margin-right: 8px;
}

[dir="rtl"] .pagination-next-link {
  padding-left: 10px;
}

[dir="rtl"] .pagination-next-text {
  margin-left: 8px;
  margin-right: 0;
}

.pagination-prev-link {
  padding-left: 10px;
}

.pagination-prev-text {
  margin-left: 8px;
}

[dir="rtl"] .pagination-prev-link {
  padding-right: 10px;
}

[dir="rtl"] .pagination-prev-text {
  margin-right: 8px;
  margin-left: 0;
}

/* Disabled state */
.pagination-next-link[data-disabled], .pagination-prev-link[data-disabled],
.pagination-first-link[data-disabled], .pagination-last-link[data-disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

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

.meta-group * {
  display: inline;
}

.meta-data {
  color: #403b45;
  font-size: 13px;
}

.meta-data:not(:last-child)::after {
  content: "\00B7";
  margin: 0 5px;
}

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

.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: 65px;
  height: 65px;
}

.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;
  font-weight: 700;
  line-height: 25px;
  margin-right: 5px;
}

.profile-header .basic-info .name a {
  color: #333;
}

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

.edit-profile-button a {
  background-color: rgba(192, 192, 192, 1);
  border: 0;
  color: rgba(255, 255, 255, 1);
  line-height: normal;
  padding: 8px 20px;
  outline-color: rgba(192, 192, 192, 1);
}

.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: #403b45;
  font-weight: 300;
  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(192, 192, 192, 1);
  border-radius: 4px;
  color: rgba(192, 192, 192, 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: rgba(255, 255, 255, 1);
  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: #403b45;
  font-weight: 300;
  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-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: 16px;
  vertical-align: middle;
  font-weight: 700;
}

.profile-contribution-title > a {
   color: #333;
}

.profile-contribution-body {
  margin: 10px 0;
}

.profile-contribution-list > .profile-contribution {
  border-top: 1px solid #ddd;
}

@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 #ddd;
}

.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: rgba(255, 255, 255, 1);
}

@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: #ffffff;
  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 77%;
  }
}

.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;
    padding-right: 30px;
  }
}

.search-results-sidebar .sidenav-item {
   padding: 12px 16px;
   border-radius: 8px;
   margin-bottom: 8px;
   background: #ffffff;
   border: 1px solid #e8e8e8;
   transition: all 0.2s ease;
   display: block;
   color: #333;
   font-weight: 400;
}

.search-results-sidebar .sidenav-item:hover {
  background-color: #fef2f6;
  border-color: #A02C53;
  color: #A02C53;
  text-decoration: none;
  transform: translateX(2px);
}

.search-results-sidebar .sidenav-item.current {
  background-color: #A02C53;
  border-color: #A02C53;
  color: #fff;
  text-decoration: none;
  font-weight: 500;
}

.search-results-sidebar .sidenav-subitem {
  unicode-bidi: embed;
}

/* Hide entire search results sidebar */
.search-results-sidebar {
  display: none !important;
}

/* Make search results column full width when sidebar is hidden */
.search-results-column {
  flex: 1 0 100% !important;
  max-width: 100% !important;
}

@media (min-width: 1024px) {
  .search-results-column {
    flex: 1 0 100% !important;
    max-width: 100% !important;
  }
}

/* Hide filters section in search results sidebar */
.filters-in-section.collapsible-sidebar,
.search-results-sidebar .filters-in-section.collapsible-sidebar {
  display: none !important;
}

.search-results-sidebar .collapsible-sidebar {
  margin-bottom: 30px;
  background: #ffffff;
  border: 1px solid #e8e8e8;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.search-results-sidebar .collapsible-sidebar-title {
  font-size: 16px;
  font-weight: 600;
  color: #1a1a1a;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f0f0f0;
}

.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: #333;
  font-weight: 600;
}

.search-results-sidebar .see-all-filters[aria-hidden="true"] {
  display: none;
}

.search-results-sidebar .see-all-filters:hover {
  color: #A02C53;
  text-decoration: underline;
}

.search-results-sidebar .see-all-filters::after {
  content: ' \2304';
  font-weight: bold;
  position: relative;
  top: -4px;
}

.search-results-subheading {
  font-size: 22px;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 24px;
  letter-spacing: -0.4px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.search-results-list {
  margin-bottom: 25px;
}

/* Align pagination with search result cards - centered within search-results-column */
.search-results-column .pagination {
  margin-top: 40px;
  margin-bottom: 30px;
  padding: 0;
  text-align: center;
  width: 100%;
}

.search-results-column .pagination-list {
  justify-content: center;
  display: flex;
  align-items: center;
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 0 auto;
  width: fit-content;
  max-width: 100%;
}

.search-results-list > li {
  border-bottom: none;
  padding: 24px;
  margin-bottom: 16px;
  background: #ffffff;
  border: none !important;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(160, 44, 83, 0.05);
  transition: transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  will-change: transform, box-shadow;
}

.search-results-list > li:hover {
  box-shadow: 0 8px 28px rgba(160, 44, 83, 0.14) !important;
  transform: translateY(-3px);
}

.search-results-list > li:active {
  box-shadow: 0 3px 10px rgba(160, 44, 83, 0.10) !important;
  transform: translateY(-1px);
  transition: transform 0.08s ease, box-shadow 0.08s ease;
}

.search-result-title-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.search-result-meta-container {
    color: #999;
    display: flex;
    flex-direction: column;
    margin-top: 12px;
    font-size: 13px;
    padding-top: 10px;
    border-top: 1px solid #f5f5f5;
}

@media (min-width: 1024px) {
  .search-result-meta-container {
      flex-direction: row;
      align-items: center;
      margin-top: 12px;
  }
  .search-result-meta-container nav {
    flex: 1;
  }
}

.search-result-meta-container .meta-data {
  color: #aaa;
  font-size: 12px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.search-result-meta-container .breadcrumbs a {
  color: #666;
  transition: color 0.2s ease;
}

.search-result-meta-container .breadcrumbs a:hover {
  color: #A02C53;
}

.search-results-list > li h2 {
  margin-bottom: 10px;
  font-weight: 700;
  font-size: 1.15em;
  line-height: 1.35;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.search-results-list > li h2 a {
  color: #1a1a1a;
  transition: color 0.15s ease;
  text-decoration: none;
  letter-spacing: -0.2px;
}

.search-results-list > li:hover h2 a {
  color: #A02C53;
}

.search-results .meta-group {
  display: block;
  align-items: center;
  clear: both;
  color: #666;
}

@media (min-width: 1024px) {
  .search-results .meta-group {
    display: flex;
  }
}

.search-results .meta-group > li {
  display: block;
}

@media (min-width: 1024px) {
  .search-results .meta-group > li {
    display: inline;
  }
}

@media (min-width: 1024px) {
  .search-results .meta-group li:first-child {
    flex: 1;
  }
}

.search-results .meta-group .meta-data {
  color: inherit;
}

[dir="ltr"] .search-results .meta-group .meta-data:not(:last-child) {
  margin-right: 20px;
}

[dir="rtl"] .search-results .meta-group .meta-data:not(:last-child) {
  margin-left: 20px;
}

.search-results .meta-group .meta-data::after {
  content: none;
}

.search-results-description {
  margin-top: 10px;
  word-break: break-word;
  color: #666;
  line-height: 1.7;
  font-size: 14px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.search-result-title {
  font-size: 16px;
  display: inline-block;
}

[dir="ltr"] .search-result-icons {
  float: right;
}

[dir="rtl"] .search-result-icons {
  float: left;
}

.search-result-votes, .search-result-meta-count {
  color: #403b45;
  display: inline-block;
  font-size: 13px;
  font-weight: 300;
  padding: 4px 5px;
  position: relative;
}

.search-result-votes-icon, .search-result-meta-count-icon {
  color: rgba(192, 192, 192, 1);
  vertical-align: middle;
  width: 13px;
  height: 13px;
}

[dir="ltr"] .search-result-votes, [dir="ltr"] .search-result-meta-count {
  margin-left: 5px;
}

[dir="ltr"] .search-result-votes::before, [dir="ltr"] .search-result-meta-count::before {
  margin-right: 3px;
}

[dir="rtl"] .search-result-votes, [dir="rtl"] .search-result-meta-count {
  margin-right: 5px;
}

[dir="rtl"] .search-result-votes::before, [dir="rtl"] .search-result-meta-count::before {
  margin-left: 3px;
}

.search-result .meta-group {
  align-items: center;
}

.search-result-breadcrumbs {
  margin: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.search-result-breadcrumbs li {
  display: inline-flex;
  align-items: center;
}

.search-result-breadcrumbs li, .search-result-breadcrumbs li a, .search-result-breadcrumbs li a:visited {
  color: inherit;
}

/* No results state */
.no-results {
  text-align: center;
  padding: 60px 20px;
}

.no-results svg {
  opacity: 0.35;
  margin-bottom: 24px;
}

.no-results p {
  color: #888;
  font-size: 15px;
  line-height: 1.7;
  max-width: 400px;
  margin: 0 auto;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* Sidebar filter link hover */
.search-results-sidebar .multibrand-filter-list a {
  transition: color 0.15s ease;
}

.search-results-sidebar .multibrand-filter-list a:hover {
  color: #A02C53;
}

/* By default use bold instead of italic to highlight */
.search-results-description em {
  background: rgba(160, 44, 83, 0.08);
  color: #A02C53;
  font-style: normal;
  font-weight: 600;
  border-radius: 3px;
  padding: 0 2px;
}

/* Background for Chinese */
html[lang|="zh"] .search-results-description em {
  font-style: normal;
  background: rgba(160, 44, 83, 0.08);
}

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

.notification a {
  color: #158ec2;
}

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

.notification-icon, .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: .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,
.dropdown-toggle:focus {
  outline: none;
  text-decoration: none;
}

.dropdown-toggle > * {
  display: inline-block;
}

.dropdown-menu {
  background: #fff;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  display: none;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  left: 0;
  margin-top: 8px;
  min-width: 180px;
  padding: 8px 0;
  position: absolute;
  text-align: left;
  z-index: 1000;
  overflow: hidden;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

[dir="rtl"] .dropdown-menu {
  text-align: right;
}

.dropdown-menu[aria-expanded="true"],
.dropdown-toggle[aria-expanded=true] + .dropdown-menu {
  display: block;
}

.hc_header .dropdown-menu[aria-expanded="true"] {
  left: inherit;
  right: 0;
}

.dropdown-menu [role="separator"] {
  border-bottom: 1px solid #f0f0f0;
  color: rgba(13, 12, 14, 1);
  display: block;
  font-weight: normal;
  font-size: 11px;
  padding: 4px 0;
  margin: 4px 20px;
  height: 1px;
  background: #f0f0f0;
}

/* Hide separator if it's the last element */
.dropdown-menu [role="separator"]:last-child {
  display: none !important;
}

/* Hide separator if it's after the last menuitem */
.dropdown-menu [role="menuitem"]:last-child + [role="separator"],
.dropdown-menu [role=menuitem]:last-child + [role="separator"],
.dropdown-menu [role=menuitemradio]:last-child + [role="separator"] {
  display: none !important;
}

.dropdown-menu [role="menuitem"],
.dropdown-menu [role=menuitem],
.dropdown-menu [role=menuitemradio] {
  color: #333;
  cursor: pointer;
  display: block;
  padding: 8px 32px 8px 18px;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  -webkit-appearance: none;
  text-align: start;
  font-size: 13px;
  line-height: 1.4;
  width: 100%;
  transition: all 0.2s ease;
  font-weight: 400;
  position: relative;
}

[dir="rtl"] .dropdown-menu [role="menuitem"],
[dir="rtl"] .dropdown-menu [role=menuitem],
[dir="rtl"] .dropdown-menu [role=menuitemradio] {
  padding: 12px 20px 12px 40px;
}

.dropdown-menu [role="menuitem"]:hover, 
.dropdown-menu [role="menuitem"]:focus,
.dropdown-menu [role=menuitem]:hover,
.dropdown-menu [role=menuitem]:focus,
.dropdown-menu [role=menuitemradio]:hover,
.dropdown-menu [role=menuitemradio]:focus {
  background: #fef2f6;
  text-decoration: none;
  color: #A02C53;
  border: 0;
}

.dropdown-menu [role="menuitem"][aria-selected="true"],
.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-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='%23A02C53' 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;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}

[dir="rtl"] .dropdown-menu [role="menuitem"][aria-selected="true"]::after,
[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 {
  right: auto;
  left: 20px;
  margin-left: 0;
  margin-right: 0;
}

.dropdown-menu [role="menuitem"][hidden], .dropdown-menu [role="menuitem"][aria-hidden="true"],
.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%;
  border-radius: 8px;
  margin-bottom: 6px;
}

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

@media (max-width: 1024px) {
  .article-relatives,
  .article-sidebar .sidenav-title:after {
    display: none;
  }
  .collapsible-sidebar-title {
    cursor: pointer;
  }
  .search-results-sidebar .collapsible-sidebar {
    margin-bottom: 0;
  }
  .search-results-sidebar .collapsible-sidebar-title {
    border-bottom: 1px solid #ddd;
    padding-bottom: 7px;
  }
}

@media (max-width: 992px) {
  .section-tree .section {
    flex: 0 0 45%;
  }
}

@media (max-width: 768px) {
  .xs_hide, .user-nav {
    display: none;
  }
  .user-nav[aria-expanded="true"] {
    display: block;
  }
  .user-nav a,
  .user-nav a:hover {
    color: #333
  }
  ._grid ._col_4 {
    width: 50%;
  }
  .category-container .section-tree .section {
    margin: 0 0 15px 0;
  }
  .quick-articles > section {
    margin: 50px 0 0;
  }
}
@media (max-width: 464px) {
  .hero-inner .search-icon {
    top: 65%;
  }
}

/* =========================================== */
/*  Shortcodes
/* =========================================== */

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.alert {
    border-width: 2px;
}

.__with_fa {
    border: 2px solid rgba(245, 166, 35, 1);
    background: rgba(245, 166, 35, 0.66);
    position: relative;
    font-size: 1.2em;
    line-height: 1.4;
    padding: 30px 15px 15px 15px;
}

.__with_fa .fa {
    position: absolute;
    top: 0;
    background: #fff;
    margin-top: -25px;
    border-radius: 100%;
    border: 2px solid rgba(245, 166, 35, 1);
    left: 15px;
    height: 45px;
    width: 45px;
    display: block;
    text-align: center;
    line-height: 45px;
}

.__with_fa .fa:before {
    margin-left: 5px;
}

.__with_fa {
    margin-top: 40px;
}

.alert-download {
    border: 2px solid #9adeec;
    background: #bce8f1;
}

.alert-quote {
    border: 2px solid rgba(103, 77, 68, 0.26);
    background: rgba(121, 85, 72, 0.26);
}

.alert-pdf {
    border: 2px solid rgba(229, 65, 94, 1);
    background: rgb(229, 65, 94);
    color: #fff;
}

.alert-download .fa {
    border: 2px solid #9adeec;
}

.alert-quote .fa {
    border: 2px solid rgb(186, 174, 168);
}

.alert-pdf .fa {
    border: 2px solid rgba(229, 65, 94, 1);
    color: rgba(229, 65, 94, 1);
}

.accordion {
   margin-bottom: 30px;
}

.colored_accordion .accordion_title {
   background: #ddd;
   border-color: #ddd;
}

.colored_accordion ._active {
   background: #ffb110;
   border-color: #ffb110;
   color: #fff;
}

.default_accordion ._active {
   background: #444;
   border-color: #444;
   color: #ffffff;
}

.accordion_content {
   display: none;
   padding: 10px;
}

._active::after,
.accordion .open::after {
   transform: rotate(90deg);
}

body .table,
.form .jpeIfh {
    background: #fff;
}

.table > thead > tr > th {
   color: #333;
   font-weight: 500;
   padding: 14px;
}

.article-container .table > thead > tr > th {
   border-bottom: 3px solid #ddd;
}

.article-container .table > tbody > tr > td {
   border-top: 1px solid #ddd;
   padding: 14px;
   font-size: 0.9em;
}

.table.header-color>thead>tr>th {
   border-color: #444;
   background: #444;
   color: #fff;
   padding: 10px;
}

.dark-table {
   background: #444;
   color: #fff;
}

.dark-table > thead > tr > th {
   border-bottom: 2px solid #fff;
}

.dark-table > tbody > tr > td {
   background: #333;
   border-color: #fff;
}

.dark-table > thead > tr > th {
   color: #fff;
}

.colored-list ul,
.colored-list ol {
   margin: 15px 0 0 0px;
}

.colored-list {
    list-style-type: none;
    padding: 0;
    counter-reset: li-counter;
}

.colored-list > li {
    position: relative;
    margin-bottom: 12px;
    padding-left: 35px;
    min-height: 0;
}

.colored-list > li:before {
    position: absolute;
    top: 3px;
    left: 0;
    font-size: 12px;
    color: #fff;
    content: counter(li-counter);
    counter-increment: li-counter;
    background-color: #276FD0;
    border-radius: 100%;
    height: 25px;
    width: 25px;
    line-height: 25px;
    text-align: center;
}

.list-black > li:before {
   background-color: #a59898;
}

.check-list-bullet li {
   list-style-type: none;
   position: relative;
   padding-left: 30px;
   margin-bottom: 15px;
}

.check-list-bullet li:before {
   content: "\f058";
   position: absolute;
   top: 0;
   left: 0;
   font-family: "FontAwesome";
   font-size: 25px;
   color: #276FD0;
   margin-top: -6px;
}

body .note--message,
body .warning--message,
body .quote--message,
body .support--message {
  padding: 30px 15px 15px 15px;
  font-size: 16px !important;
  position: relative;
  margin-top: 40px;
  margin-bottom: 20px;
  border-radius: 2px;
}

body .note--message::before,
body .warning--message::before,
body .quote--message::before,
body .support--message::before {
  font-family: 'LineIcons';
  position: absolute;
  top: 0;
  background: #fff;
  margin-top: -25px;
  border-radius: 100%;
  left: 15px;
  height: 45px;
  width: 45px;
  line-height: 45px;
  text-align: center;
  font-size: 23px;
}

[dir="rtl"] body .note--message::before,
[dir="rtl"] body .warning--message::before,
[dir="rtl"] body .quote--message::before,
[dir="rtl"] body .support--message::before {
  left: inherit;
  right: 15px;
}

body .note--message::before {
  content: "\eaf4";
}

body .warning--message::before {
  content: "\eaab";
}

body .quote--message::before {
  content: "\eb70";
}

body .support--message::before {
  content: "\ea2f";
}

body .note--message {
  background: #bce8f1;
  border: 2px solid #68cbdf;
}

body .support--message {
  background: rgba(192, 192, 192, 1);
  border: 2px solid #a7a7a7;
  color: #fff;
}

body .note--message::before {
  border: 2px solid #68cbdf;
}

body .support--message::before {
  border: 2px solid #a7a7a7;
  color: #a7a7a7;
}

body .warning--message {
  background: #e5415e;
  border: 2px solid #e5415e;
  color: #fff;
}

body .warning--message::before {
  border: 2px solid #e5415e;
  color: #000;
}

body .quote--message {
  background: #d5ccc9;
  border: 2px solid #a89690;
}

body .quote--message::before {
  border: 2px solid #a89690;
}

body .check--list {
  margin-left: 30px;
}

body .check--list li,
body .number--list li {
  position: relative;
  list-style-type: none;
}

body .number--list li {
  padding-left: 35px;
}

body .check--list li:before {
  content: "\ead2";
  font-family: "LineIcons";
  position: absolute;
  top: 0;
  left: -30px;
  font-size: 22px;
  color: rgba(192, 192, 192, 1);
  margin-top: -4px;
}

[dir="rtl"] body .check--list li:before {
  left: inherit;
  right: -30px;
}

body .number--list {
  list-style-type: none;
  padding: 0;
  counter-reset: li-counter;
}

body .number--list > li:before {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  color: #fff;
  content: counter(li-counter);
  counter-increment: li-counter;
  background-color: rgba(192, 192, 192, 1);
  border-radius: 100%;
  height: 25px;
  width: 25px;
  line-height: 25px;
  text-align: center;
  margin-top: -1px;
}

[dir="rtl"] body .number--list > li:before {
  left: inherit;
  right: -35px;
}

body .accordion_title {
  background: #ffffff;
  border: 2px solid #dddddd;
  color: rgba(13, 12, 14, 1);
  cursor: pointer;
  padding: 15px 45px 15px 15px;
  margin-bottom: 5px;
  position: relative;
  border-radius: 2px;
}

[dir="rtl"] body .accordion_title {
  padding: 15px 15px 15px 45px;
}

body .accordion_content {
  display: none;
  padding: 10px;
}

body .accordion_title::after {
  content: "\eb0d";
  font-family: "LineIcons";
  position: absolute;
  top: 50%;
  right: 15px;
  font-size: 16px;
  margin-top: -12px;
  transition: all 0.2s ease-in;
}

[dir="rtl"] body .accordion_title::after {
  right: inherit;
  left: 15px;
  transform: rotate(180deg);
}

body .article-body .accordion_title._active::after,
body .article-body .accordion_title.open::after,
.active::after {
  transform: rotate(90deg) !important;
}

body .accordion_title.open {
  background: rgba(192, 192, 192, 1);
  border: 2px solid rgba(192, 192, 192, 1);
  color: #fff;
}

.tabs {
  width: 100%;
  background-color: rgba(192, 192, 192, 1);
  border-radius: 5px;
}

ul#tabs-nav {
  list-style: none;
  margin: 0;
  padding: 5px;
  overflow: auto;
}

ul#tabs-nav > li {
  float: left;
  font-weight: 600;
  margin-right: 2px;
  margin-bottom: 0;
  padding: 8px 10px;
  border-radius: 5px;
  cursor: pointer;
}

[dir="rtl"] ul#tabs-nav > li {
  float: right;
}

ul#tabs-nav > li:hover,
ul#tabs-nav > li.active {
  background-color: #8d8d8d;
}

#tabs-nav > li > a {
  text-decoration: none;
  color: #ffffff;
}

#tabs-content {
  background: #ffffff;
}

.tab-content {
  padding: 10px;
  border: 2px solid rgba(192, 192, 192, 1);
  background-color: #ffffff;
}

/***** Community Badges *****/
/* Styles labels used next to the authors of article comments, community posts, and community comments */

.community-badge-title {
  background-color: rgba(192, 192, 192, 1);
  border-radius: 4px;
  color: rgba(255, 255, 255, 1);
  font-size: 12px;
  font-weight: 600;
  padding: 0px 8px;
  vertical-align: top;
  white-space: nowrap;
  display: inline-flex;
  line-height: 18px;
  vertical-align: middle;
}

.profile-info .community-badge-title {
  padding: 2px 8px;
  line-height: 20px;
}

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

.community-badge-container-achievements > .community-badge-titles {
  margin-left: calc(28px - 0.5em);
}

[dir="rtl"] .community-badge-container-achievements > .community-badge-titles {
  margin-right: calc(28px - 0.5em);
}

.community-name-and-title-badges {
  display: flex;
  flex-wrap: wrap;
}

.community-badge {
  margin: 2px;
}

.community-badge-achievements {
  display: block;
  height: 16px;
  white-space: nowrap;
  width: 16px;
}

.profile-info .community-badge-achievements {
  height: 40px;
  width: 40px;
}

.community-title-badges {
  flex-basis: 100%;
  margin-top: 15px;
}

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

.community-badge-achievements img {
  width: 100%;
  height: 100%;
}

.community-badge-titles img {
  width: 20px;
  height: 20px;
}

.profile-info .community-badge-achievements-rest {
  line-height: 40px;
  font-size: 20px;
}

.split-button {
  display: flex;
}

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

.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):first-child {
  border-left: 1px solid rgba(255, 255, 255, 1);
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

[dir="ltr"] .split-button button:not(:only-child):first-child {
  border-right: 1px solid rgba(255, 255, 255, 1);
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}

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

.profile-badges-items {
  margin-top: 25px;
}

.profile-badges-item {
  border-top: 1px solid rgba(230, 228, 231, 1);
  display: flex;
  flex: 1;
  flex-direction: row;
  justify-content: flex-start;
  padding: 27px 12px;
}

.profile-badges-item-image {
  height: 40px;
  width: 40px;
  margin-right: 12px;
}

[dir="rtl"] .profile-badges-item-image {
  margin-left: 12px;
  margin-right: 0;
}

.profile-badges-item > div {
  padding-right: 12px;
  padding-left: 12px;
}

.profile-badges-item-image img {
  max-height: 40px;
}

.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: #403b45;
  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;
}

.community-badge[aria-label="Community team"] {
  background: #eaa40a;
}

.community-badge[aria-label="Community moderator"],
.community-badge[aria-label="Community manager"] {
  background: #11aa7b;
}

.community-badge[aria-label="Idea generator"],
.community-badge[aria-label="Good karma"] {
  background: #4a8cf1;
}

.community-badge[aria-label="Great answers"] {
  background: #fc585b;
}

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

/* Lightbox for article images */
.article-body figure.wysiwyg-image-resized img {
  cursor: zoom-in;
  transition: opacity 0.15s ease;
}

.article-body figure.wysiwyg-image-resized img:hover {
  opacity: 0.88;
}

#zd-lightbox {
  display: flex;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.80);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

#zd-lightbox.active {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

#zd-lightbox #zd-lightbox-img {
  max-width: 95vw;
  max-height: 90vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 8px 48px rgba(0, 0, 0, 0.6);
  cursor: default;
  transform: scale(0.88);
  opacity: 0;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
}

#zd-lightbox.active #zd-lightbox-img {
  transform: scale(1);
  opacity: 1;
}

/* While a newly selected image is still loading, keep it fully hidden so the
   previous image can't flash. Placed after the .active rule to win on source order. */
#zd-lightbox #zd-lightbox-img.is-loading {
  opacity: 0;
  transition: none;
}

#zd-lightbox-close {
  position: absolute;
  top: 16px;
  right: 20px;
  background: none;
  border: none;
  color: #ffffff;
  font-size: 40px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  z-index: 1;
  opacity: 0.75;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

#zd-lightbox-close:hover,
#zd-lightbox-close:focus {
  opacity: 1;
  transform: scale(1.15);
  outline: none;
}

/* =========================================================
   Article page redesign (mockup) — boxed layout + sidebar
   ========================================================= */

/* Same background as the categories section on the home, for consistency.
   The top padding absorbs the breadcrumb's former bottom margin so the tint
   starts right under the breadcrumb (no white gap). */
.article-page {
  background: rgba(244, 244, 244, 0.4);
  padding: 0 0 56px;
}

/* Breadcrumb: banda con fondo gris (igual que el resto de la página) y, dentro,
   una tarjeta blanca que encierra los enlaces. Se apoya en las clases del <html>
   (is-article/is-category/is-section) para que funcione aunque el wrapper del
   template no esté, y en el wrapper por si las clases no están. */
/* Banda del breadcrumb: fondo TRANSPARENTE para mostrar el gris del wrapper
   de la página sin duplicarlo (categories_bg_color es semitransparente y, si se
   pinta encima del wrapper, se suma y oscurece). El padding-top da el aire
   superior; queda pintado del gris del wrapper que se ve por detrás. */
.breadcrumbs__block {
  background: transparent;
  /* Alto total fijo de 60px; el pill queda centrado verticalmente. */
  height: 60px;
  box-sizing: border-box;
  padding: 0;
  display: flex;
  align-items: center;
  /* 28px exactos entre el breadcrumb y la sección de contenido de abajo. */
  margin: 0 0 28px;
}

/* Al pasar el bloque a flex, el .container podría encogerse a su contenido;
   lo forzamos a ancho completo para conservar el centrado/alineación del pill. */
.breadcrumbs__block > .container {
  width: 100%;
}
/* En la página de artículo el breadcrumb queda FUERA del wrapper gris
   (.article-page), sobre el body blanco, así que le damos el mismo gris que
   .article-page para que combine. Al estar sobre blanco (no sobre otro gris),
   no se duplica el tono. Scopeado con :has(.article-content) para no depender
   de la clase is-article de los templates. */
body:has(.article-content) .breadcrumbs__block {
  /* El breadcrumb está DENTRO de .article-page (gris). Si le pintamos otro
     categories_bg_color (semitransparente) encima, los dos grises se suman y
     queda más oscuro. Lo dejamos transparente para mostrar el gris único del
     wrapper, igual que la zona del artículo. */
  background: transparent;
  margin-bottom: 0;
}

/* En categoría y sección el breadcrumb va sin margen (ni arriba ni abajo). */
body:has(.category-content) .breadcrumbs__block,
body:has(.section-content) .breadcrumbs__block {
  margin: 0;
}
/* La tarjeta blanca envuelve SOLO el texto del breadcrumb: inline-flex +
   fit-content la encogen a su contenido; el .container sigue full-width, así el
   borde izquierdo del pill queda alineado con el contenido de abajo. */
.breadcrumbs__block .sub-nav {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: 0;
  background: #ffffff;
  border: 1px solid #ebebeb;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  padding: 12px 24px;
}

/* El pill del breadcrumb arranca en el borde izquierdo de su container, que
   coincide con el borde izquierdo del box de contenido de abajo. En sección,
   categoría y artículo el container queda a ancho completo, así el breadcrumb
   se alinea con la card ancha ubicada a la izquierda. */
body:has(.section-content) .breadcrumbs__block .container,
body:has(.category-content) .breadcrumbs__block .container {
  text-align: left;
}

/* Column gap between main content and sidebar */
.article-page .article-container {
  gap: 24px;
}

/* White "box" around the article content, defined by a subtle border
   + shadow (so it reads as a card on the white background) */
.article-page .article.article-card {
  background: #ffffff;
  /* Mismo efecto de borde/sombra que la card de categoría (.section-tree .section). */
  border: none;
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  padding: 40px;
  min-width: 0;
}

@media (min-width: 1024px) {
  /* Let the main column fill the space left by the fixed-width sidebar */
  .article-page .article.article-card {
    flex: 1 1 auto;
    max-width: none;
    padding: 40px;
    margin: 0;
  }
}

@media (max-width: 767px) {
  .article-page .article.article-card {
    padding: 24px;
    border-radius: 12px;
    margin-top: 20px;
  }
}

/* Rounded media inside the article for visual consistency */
.article-page .article-body img,
.article-page .article-body iframe,
.article-page .article-body video {
  border-radius: 12px;
}

/* Sidebar: vertically stacked cards */
.article-aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

@media (min-width: 1024px) {
  .article-aside {
    flex: 0 0 300px;
    max-width: 300px;
    align-self: flex-start;
    position: sticky;
    top: 15px;
  }
}

/* On mobile the sidebar stacks below the article */
@media (max-width: 1023px) {
  .article-page .article.article-card {
    order: 1;
  }
  .article-page .article-aside {
    order: 2;
  }
}

.aside-card {
  background: #ffffff;
  border: 1px solid #ebebeb;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  padding: 24px;
}

/* "Related articles" sidebar card — estiliza el markup del helper nativo
   {{related_articles}} (section.related-articles > h2 + <ul><li><a>).
   Usa !important + scope .aside-card-related para ganarle a los estilos
   legacy de .related-articles (que eran para el bloque de abajo, con cajitas). */
.aside-card-related {
  padding: 20px 24px;
}
.aside-card-related .related-articles {
  margin: 0;
}
.aside-card-related .related-articles-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #0d0c0e !important;
  margin: 0 0 8px !important;
}
.aside-card-related .related-articles ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.aside-card-related .related-articles li {
  margin: 0 !important;
  padding: 0 !important;
}
.aside-card-related .related-articles li:before {
  content: none !important;
}
.aside-card-related .related-articles li a {
  display: block !important;
  align-items: initial;
  padding: 9px 18px 9px 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid #f0f0f0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.4;
  color: #444 !important;
  text-decoration: none !important;
}
.aside-card-related .related-articles li:last-child a {
  border-bottom: 0 !important;
}
.aside-card-related .related-articles li a:hover {
  background: transparent !important;
  box-shadow: none !important;
  color: #A02C53 !important;
}
.aside-card-related .related-articles li a::after {
  content: '›';
  position: absolute !important;
  top: 50% !important;
  right: 2px !important;
  transform: translateY(-50%) !important;
}
.aside-card-related .related-articles li a:hover::after {
  color: #A02C53;
  transform: translateX(3px) translateY(-50%) !important;
}

/* "Still need help?" card — same white background as the article */
.aside-card-help {
  background: #ffffff;
}

.aside-card-title {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 8px;
  color: #0d0c0e;
}

.aside-card-text {
  font-size: 14px;
  color: #666;
  line-height: 1.5;
  margin: 0 0 16px;
}

/* "Hablá con AskMoji" — primary filled button que abre el widget de mensajería */
.aside-askmoji-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-bottom: 10px;
  padding: 10px 16px;
  border: 1px solid #A02C53;
  border-radius: 8px;
  background: #A02C53;
  color: #ffffff;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.aside-askmoji-button svg {
  flex: 0 0 auto;
}
.aside-askmoji-button:hover,
.aside-askmoji-button:focus {
  background: #8a2547;
  border-color: #8a2547;
  color: #ffffff;
}

/* "Contact Support" outline button */
a.aside-help-button,
.aside-help-button {
  display: block;
  width: 100%;
  text-align: center;
  padding: 10px 16px;
  border: 1px solid #A02C53;
  border-radius: 8px;
  background: transparent;
  color: #A02C53;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}

a.aside-help-button:hover,
a.aside-help-button:visited,
.aside-help-button:hover {
  color: #A02C53;
  text-decoration: none;
}

a.aside-help-button:hover {
  background: #A02C53;
  color: #ffffff;
}

/* En las páginas internas (article, request, category, section) el footer toma
   el mismo gris que el contenido para que no quede un corte blanco al final.
   El home NO lleva estas clases, así que conserva su color de footer propio. */
html.is-article .footer,
html.is-request .footer,
html.is-category .footer,
html.is-section .footer {
  margin-top: 0;
  background: rgba(244, 244, 244, 0.4);
}

/* =========================================================
   Submit a request page — same boxed layout as the article
   Class is added in document_head.hbs for /requests/new URLs.
   (El fondo gris del footer se maneja en la regla combinada de arriba.)
   ========================================================= */

/* Centered heading */
html.is-request .new-request-title {
  text-align: center;
  margin-top: 0;
  padding-top: 28px;
  margin-bottom: 28px;
}

/* Remove the accent underline below the title on this page */
html.is-request .new-request-title:after {
  display: none;
}

/* Form rendered as a centered white card matching the article boxes */
html.is-request .form {
  margin: 0 auto 56px;
  padding: 40px;
  border: 1px solid #ebebeb;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

@media (max-width: 767px) {
  html.is-request .form {
    padding: 24px;
    border-radius: 12px;
  }
}

/* Submit button (Garden StyledButton) matches the theme's standard buttons.
   El form nuevo de Garden no usa el wrapper .form, así que apuntamos por el
   atributo estable data-garden-id (la clase StyledButton-* cambia por versión).
   !important overrides the emotion styles injected by the new-request-form bundle. */
/* Nota: el setting rgba(192, 192, 192, 1) del tema está en gris (#C0C0C0), por eso el
   Submit salía gris. Acá hardcodeamos el color de marca real (#A02C53) solo
   para este botón, sin tocar el resto de los usos de rgba(192, 192, 192, 1). */
html.is-request .form button[type="submit"],
button[data-garden-id="buttons.button"][type="submit"] {
  cursor: pointer;
  background-color: #A02C53 !important;
  background-image: none !important;
  border: 1px solid #A02C53 !important;
  border-radius: 3px !important;
  color: #ffffff !important;
  box-shadow: none !important;
  font-size: 14px;
  font-weight: 400;
  line-height: 2.72;
  min-width: 190px;
  padding: 0 1.9286em;
}

html.is-request .form button[type="submit"]:hover,
html.is-request .form button[type="submit"]:focus,
html.is-request .form button[type="submit"]:active,
button[data-garden-id="buttons.button"][type="submit"]:hover,
button[data-garden-id="buttons.button"][type="submit"]:focus,
button[data-garden-id="buttons.button"][type="submit"]:active {
  background-color: #8a2547 !important;
  border-color: #8a2547 !important;
  color: #ffffff !important;
  box-shadow: none !important;
}