/* Pagination buttons, counter and footer are owned by site-pagination.css. Load it globally after this file. */
/* Joomla Center knowledge base — RU / EN. 2026-11-09.
   Replace templates/joomlacenter/css/listextended.css.
   Upload assets/joomla-atlas-transparent.webp to /images/joomla-atlas-transparent.webp.
   Apply template-exclusion.patch once. No article.css / Bootstrap changes. */
#sp-component .list-extended .com-content-category__articles {
  --kb-ink: #172334;
  --kb-blue: #115a91;
  --kb-muted: #536274;
  --kb-line: #d8e1eb;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background-color: #fff;
  color: var(--kb-ink);
  font-size: 14px;
  line-height: 1.5;
}
#sp-component .list-extended .com-content-category__articles [hidden] { display: none !important; }
#sp-component .list-extended .com-content-category__articles .le-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
#sp-component .list-extended .com-content-category__articles .le-filter-toolbar {
  flex: 1 1 340px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
#sp-component .list-extended .com-content-category__articles .le-title-search { flex: 1 1 220px; min-width: 0; }
#sp-component .list-extended .com-content-category__articles .le-search-tools { display: flex; gap: 8px; }
#sp-component .list-extended .com-content-category__articles .le-list-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-inline-start: auto;
}
#sp-component .list-extended .com-content-category__articles .com-content__filter,
#sp-component .list-extended .com-content-category__articles .le-toolbar .com-content-category__pagination { margin: 0; }
#sp-component .list-extended .com-content-category__articles :is(.form-control, .form-select, .le-filter-button) {
  box-sizing: border-box;
  min-height: 44px;
  margin-block: 0;
  border: 1px solid #cbd9e6;
  border-radius: 8px;
  font-size: 14px;
  line-height: 20px;
}
#sp-component .list-extended .com-content-category__articles :is(.form-control, .form-select) {
  background-color: #fff;
  color: var(--kb-ink);
  box-shadow: none;
}
#sp-component .list-extended .com-content-category__articles .form-control { min-width: 0; padding: 11px 12px; }
#sp-component .list-extended .com-content-category__articles .form-control::placeholder { color: #78909f; }
#sp-component .list-extended .com-content-category__articles .form-select { padding: 11px 34px 11px 12px; }
#sp-component .list-extended .com-content-category__articles .le-sort-control .form-select { max-width: 200px; }
#sp-component .list-extended .com-content-category__articles select[name="limit"] { min-width: 74px; }
#sp-component .list-extended .com-content-category__articles .le-filter-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 44px;
  padding: 11px 13px;
  background-color: #f7fafc;
  color: var(--kb-ink);
  font-weight: 500;
  white-space: nowrap;
  box-shadow: none;
}
#sp-component .list-extended .com-content-category__articles .le-title-search > .form-control { border-radius: 8px 0 0 8px; }
#sp-component .list-extended .com-content-category__articles .le-title-search > .btn { border-radius: 0 8px 8px 0; }
#sp-component .list-extended .com-content-category__articles :is(.btn-primary, [data-le-search-tools].active) {
  background-color: var(--kb-blue);
  border-color: var(--kb-blue);
  color: #fff;
}
#sp-component .list-extended .com-content-category__articles :is(.btn-primary, [data-le-search-tools].active):hover {
  background-color: #0b4675;
  border-color: #0b4675;
}
#sp-component .list-extended .com-content-category__articles button[name="filter-clear-button"] {
  background-color: transparent;
  border-color: #d7e2e9;
  color: var(--kb-muted);
}
#sp-component .list-extended .com-content-category__articles .le-filter-button:not(:disabled):hover { border-color: #9cbccc; }
#sp-component .list-extended .com-content-category__articles .le-filter-button:disabled { color: #8095a3; opacity: .6; cursor: default; }
#sp-component .list-extended .com-content-category__articles :is(a, button, input, select):focus-visible {
  outline: 2px solid var(--kb-blue);
  outline-offset: 3px;
}
#sp-component .list-extended .com-content-category__articles .le-filter-fields {
  gap: 12px;
  margin: 0 0 18px;
  padding: 14px;
  border-radius: 9px;
  background-color: #f0f3f7;
}
#sp-component .list-extended .com-content-category__articles .le-filter-field { min-width: 0; flex: 1 1 180px;padding: 0;}
#sp-component .list-extended .com-content-category__articles .le-filter-field > label {
  margin-bottom: 6px;
  color: var(--kb-muted);
  font-size: 12px;
  font-weight: 500;
}
#sp-component .list-extended .com-content-category__articles .choices { margin: 0; font-size: 14px; }
#sp-component .list-extended .com-content-category__articles .choices__inner {
  min-height: 44px;
  padding: 7px 10px;
  border: 1px solid #cbd9e6;
  border-radius: 8px;
  background-color: #fff;
  font-size: 14px;
}
#sp-component .list-extended .com-content-category__articles .choices__list--multiple .choices__item {
  margin: 2px 4px 2px 0;
  padding: 3px 7px;
  border: 1px solid #cfdfeb;
  border-radius: 6px;
  background-color: #edf3f9;
  color: var(--kb-ink);
  font-size: 13px;
}
#sp-component .list-extended .com-content-category__articles .choices__input--cloned {
  min-width: min(34ch, 100%) !important;
  max-width: 100%;
  margin-bottom: 0;
  padding: 2px 0;
  border: 0;
  box-shadow: none;
  background-color: transparent;
  color: var(--kb-ink);
  font-size: 14px;
}
#sp-component .list-extended .com-content-category__articles .choices:focus-within .choices__inner {
  border-color: var(--kb-blue);
  box-shadow: 0 0 0 3px rgb(20 123 180 / 14%);
}
#sp-component .list-extended .com-content-category__articles .choices__list--dropdown { border-color: #cbd9e6; border-radius: 8px; }
#sp-component .list-extended .com-content-category__articles .choices__list--dropdown .is-highlighted { background-color: #edf6fc; }
#sp-component .list-extended .com-content-category__articles .table-responsive { margin: 0; overflow-x: auto; overflow-y: hidden; }
#sp-component .list-extended .com-content-category__articles .com-content-category__table {
  --table-striped-bg: transparent;
  --table-hover-bg: transparent;
  --bs-table-striped-bg: transparent;
  --bs-table-hover-bg: transparent;
  width: 100%;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  color: var(--kb-ink);
  font-size: 14px;
}
#sp-component .list-extended .com-content-category__articles .com-content-category__table :is(th, td) {
  padding: 13px 12px;
  border: 0;
  border-bottom: 1px solid #e5edf2;
  background-color: #fff;
  vertical-align: middle;
  box-shadow: none;
}
#sp-component .list-extended .com-content-category__articles .com-content-category__table thead th {
  padding-block: 11px;
  border-bottom-color: #d9e5ee;
  background-color: #f0f5f8;
  color: #496678;
  font-size: 12px;
  font-weight: 600;
}
#sp-component .list-extended .com-content-category__articles .le-heading-sort { color: inherit; text-decoration: none; }
#sp-component .list-extended .com-content-category__articles .le-heading-sort:hover { color: var(--kb-blue); text-decoration: underline; }
#sp-component .list-extended .com-content-category__articles .com-content-category__table tbody tr { height: 54px; }
#sp-component .list-extended .com-content-category__articles :is(.list-title, #categorylist_header_title) { min-width: 220px; }
#sp-component .list-extended .com-content-category__articles .list-title { font-weight: 500; }
#sp-component .list-extended .com-content-category__articles .list-title > a { color: var(--kb-ink); font-weight: 500; text-decoration: none; }
#sp-component .list-extended .com-content-category__articles .list-title > a:hover { color: var(--kb-blue); text-decoration: underline; }
#sp-component .list-extended .com-content-category__articles .list-date { min-width: 134px; color: var(--kb-muted); font-size: 13px; white-space: nowrap; }
#sp-component .list-extended .com-content-category__articles .com-content-category__table tbody tr:hover > * { background-color: #f0f7fc; }
#sp-component .list-extended .com-content-category__articles .com-content-category__table tbody tr:hover > .list-title { box-shadow: inset 2px 0 var(--kb-blue); }
@media (max-width: 767px) {
  #sp-component .list-extended .com-content-category__articles { padding: 0; }
  #sp-component .list-extended .com-content-category__articles .le-filter-toolbar { flex-basis: 100%; }
  #sp-component .list-extended .com-content-category__articles .le-title-search { flex-basis: 190px; }
  #sp-component .list-extended .com-content-category__articles .le-list-controls { width: 100%; justify-content: flex-end; }
  #sp-component .list-extended .com-content-category__articles .le-sort-control { min-width: 0; flex: 1; }
  #sp-component .list-extended .com-content-category__articles .le-sort-control .form-select { width: 100%; max-width: none; }
}
@media (max-width: 575px) {
  #sp-component .list-extended .com-content-category__articles .le-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  #sp-component .list-extended .com-content-category__articles .le-filter-toolbar { display: contents; }
  #sp-component .list-extended .com-content-category__articles .le-title-search { grid-column: 1 / -1; width: 100%; }
  #sp-component .list-extended .com-content-category__articles .le-search-tools { grid-column: 1; }
  #sp-component .list-extended .com-content-category__articles .le-list-controls { grid-column: 2; width: auto; margin-inline-start: 0; }
  #sp-component .list-extended .com-content-category__articles .le-toolbar:has(.le-sort-control) .le-list-controls { grid-column: 1 / -1; width: 100%; }
}
/* Shared visual language with article.css. Variables are local: article.css
   defines its tokens on article/term bodies, not on category pages. */
#sp-component .list-extended {
  --jc-text: #172334;
  --jc-muted: #536274;
  --jc-link: #115a91;
  --jc-line: #d8e1eb;
  --jc-soft: #f0f3f7;
  --jc-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--jc-text);
  font: 400 17px/1.7 var(--jc-font);
  min-inline-size: 0;
}
#sp-component .list-extended .le-toolbar {
  padding: 16px;
  border: 1px solid var(--jc-line);
  border-radius: 8px;
  background: var(--jc-soft);
  gap: 12px;
  margin-bottom: 24px;
}
#sp-component .list-extended .le-toolbar:has(+ .le-filter-fields:not([hidden])) {
  margin-bottom: 0;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}
#sp-component .list-extended .le-filter-fields:not([hidden]) {
  margin-bottom: 24px;
  padding: 0 16px 16px;
  border: 1px solid var(--jc-line);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: var(--jc-soft);
}
#sp-component .list-extended .le-filter-field > .le-control-label { color: var(--jc-muted); font-size: 13px; }
#sp-component .list-extended :is(input,select,button) { font-family: var(--jc-font); }
#sp-component .list-extended .le-article-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
#sp-component .list-extended .le-article-list > li {
  margin: 0;
  padding: 24px 0;
  border: 0;
  border-bottom: 1px solid var(--jc-line);
  background: transparent;
  list-style: none;
}
#sp-component .list-extended .le-article-list > li:first-child { padding-top: 0; }
#sp-component .list-extended .le-article-list > li:last-child { border-bottom: 0; }
#sp-component .list-extended .le-article-row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px;
  min-inline-size: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
#sp-component .list-extended .le-list-image {
  flex: 0 0 min(var(--le-image-width, 240px), 30%);
  inline-size: min(var(--le-image-width, 240px), 30%);
  min-inline-size: 0;
  max-inline-size: 100%;
}
#sp-component .list-extended .le-list-image a { display: block; border-radius: 7px; }
#sp-component .list-extended .le-list-image img {
  display: block;
  inline-size: 100%;
  max-inline-size: 100%;
  block-size: auto;
  border: 1px solid #d7dfe8;
  border-radius: 7px;
  box-shadow: 0 3px 14px #17233409;
}
#sp-component .list-extended .le-list-body { flex: 1 1 0; min-inline-size: 0; overflow-wrap: break-word; }
#sp-component .list-extended .le-list-title {
  margin: 0 0 8px;
  padding: 0;
  border: 0;
  color: #173c55;
  font: 700 18px/1.35 var(--jc-font);
  letter-spacing: normal;
  text-transform: none;
  text-wrap: pretty;
}
#sp-component .list-extended .le-list-title::after { content: none; }
#sp-component .list-extended .le-list-title a { color: #236093; font: inherit; text-decoration: none; }
#sp-component .list-extended .le-list-title a:hover { color: var(--jc-link); text-decoration: underline; text-underline-offset: .16em; }
#sp-component .list-extended .le-article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin: 0 0 10px;
  color: var(--jc-muted);
  font: 400 13px/1.5 var(--jc-font);
}
#sp-component .list-extended .le-meta-item { gap: 5px; }
#sp-component .list-extended .le-meta-item .le-icon { color: #657d93; }
#sp-component .list-extended .le-article-meta a { color: var(--jc-link); }
#sp-component .list-extended .le-intro-text {
  margin: 0;
  color: #173c55;
  font: 400 14px/1.5 var(--jc-font);
  overflow-wrap: break-word;
}
#sp-component .list-extended :is(a,button,input,select,[tabindex]):focus-visible {
  outline: 3px solid #357ab7;
  outline-offset: 3px;
}
#sp-component .list-extended .choices__list--dropdown { z-index: 20; box-shadow: 0 8px 24px #17233414; }
#sp-component .list-extended .choices__list--dropdown .choices__item { font-size: 14px; }
#sp-component .list-extended .choices__list--multiple .choices__item { white-space: normal; overflow-wrap: anywhere; }
#sp-component .list-extended .choices__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
#sp-component .list-extended .choices__list--multiple { display: flex; flex-wrap: wrap; flex: 1 0 100%; gap: 6px; }
#sp-component .list-extended .choices__list--multiple:empty { display: none; }
#sp-component .list-extended .choices__list--multiple .choices__item { margin: 0; }
#sp-component .list-extended .choices__input--cloned { flex: 1 1 100%; }
#sp-component .list-extended .choices__input--cloned:focus-visible { outline: none; }
#sp-component .list-extended [data-le-error]:not([hidden]) { padding: 16px; border-radius: 7px; border: 1px solid #ecd5b6; background: #fff4e6; color: #634316; }
@media (max-width: 767px) {
  #sp-component .list-extended { font-size: 16px; }
  #sp-component .list-extended .le-article-row { gap: 16px; }
}
@media (max-width: 575px) {
  #sp-component .list-extended .com-content-category__articles { padding: 0; }
  #sp-component .list-extended .le-toolbar { padding: 12px; }
  #sp-component .list-extended .le-filter-fields:not([hidden]) { padding: 0 12px 12px; }
  #sp-component .list-extended .le-article-row { flex-direction: column; gap: 16px; }
  #sp-component .list-extended .le-list-image { flex-basis: auto; inline-size: 100%; }
  #sp-component .list-extended .le-list-body { inline-size: 100%; }
}
@media (max-width: 480px) {
  #sp-component .list-extended .le-intro-text { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  #sp-component .list-extended :is(a,img,button) { transition: none; }
}
/* EN places Clear inside the search group; RU places it in .le-search-tools. */
#sp-component .list-extended .le-title-search > .form-control { flex: 1 1 0; width: 0; }
#sp-component .list-extended .le-title-search > .btn { flex: 0 0 auto; }
#sp-component .list-extended .le-title-search > .btn:not(:last-child) { border-radius: 0; }
#sp-component .list-extended .le-title-search > .btn:last-child { border-radius: 0 8px 8px 0; }
@media (max-width: 575px) {
  #sp-component .list-extended .le-title-search:has(> button[type="reset"]) { display: grid; grid-template-columns: minmax(0,1fr) auto; row-gap: 10px; }
  #sp-component .list-extended .le-title-search:has(> button[type="reset"]) > .form-control { width: 100%; }
  #sp-component .list-extended .le-title-search:has(> button[type="reset"]) > button[type="submit"] { border-radius: 0 8px 8px 0; }
  #sp-component .list-extended .le-title-search:has(> button[type="reset"]) > button[type="reset"] { grid-column: 1 / -1; justify-self: start; margin-left: 0; border-radius: 8px; }
}

/* Three independent surfaces: header, filters, and the article list.
   The form and category wrappers stay transparent, including the gaps. */
#sp-component .list-extended .com-content-category__articles {
  background: transparent;
  box-shadow: none;
}
#sp-component .list-extended .com-content-category__articles .le-toolbar {
  margin-bottom: 24px;
  padding: 20px;
  border: 1px solid var(--jc-line);
  border-radius: 8px;
  background: #fff;
}
#sp-component .list-extended .com-content-category__articles .le-toolbar:has(+ .le-filter-fields:not([hidden])) {
  margin-bottom: 0;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
}
#sp-component .list-extended .com-content-category__articles .le-filter-fields:not([hidden]) {
  margin-bottom: 24px;
  padding: 0 20px 20px;
  border: 1px solid var(--jc-line);
  border-top: 0;
  border-radius: 0 0 8px 8px;
  background: #fff;
}
#sp-component .list-extended .com-content-category__articles .le-article-list {
  margin: 0;
  padding: 14px 28px;
  border: 1px solid var(--jc-line);
  border-radius: 8px;
  background: #fff;
}
#sp-component .list-extended .com-content-category__articles .le-article-list > li:first-child { padding-top: 24px; }
@media (max-width: 575px) {
  #sp-component .list-extended .com-content-category__articles .le-toolbar { padding: 16px; }
  #sp-component .list-extended .com-content-category__articles .le-filter-fields:not([hidden]) { padding: 0 16px 16px; }
  #sp-component .list-extended .com-content-category__articles .le-article-list { padding-inline: 16px; }
}

/* Compact Digital Atlas. The native h1 + category description form one hero.
   Selectors are shared by RU and EN; no language- or menu-ID dependency. */
#sp-component .list-extended {
  container: jc-kb / inline-size;
  --kb-hero-image: url("/images/joomla-atlas-transparent.webp");
}
#sp-component .list-extended .content-category {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  isolation: isolate;
}
#sp-component .list-extended .content-category::before,
#sp-component .list-extended .content-category::after {
  content: "";
  grid-area: 1 / 1 / 2 / 2;
  min-block-size: 240px;
  border-radius: 12px;
  pointer-events: none;
}
#sp-component .list-extended .content-category:has(> .category-desc)::before,
#sp-component .list-extended .content-category:has(> .category-desc)::after { grid-row-end: 3; }
#sp-component .list-extended .content-category::before {
  border: 1px solid #1a4c90;
  background: radial-gradient(ellipse at 93% 65%, #1456ad66, transparent 52%),
    linear-gradient(110deg, #061a45, #082a66 64%, #0a3475);
}
#sp-component .list-extended .content-category::after {
  justify-self: end;
  inline-size: 43%;
  max-inline-size: 360px;
  background: var(--kb-hero-image) right 12px center / auto 224px no-repeat;
}
#sp-component .list-extended .content-category > h1 {
  grid-area: 1 / 1;
  z-index: 1;
  align-self: center;
  min-inline-size: 0;
  margin: 0;
  padding: 28px 40% 28px 32px;
  border: 0;
  background: none;
  color: #fff;
  font: 750 clamp(28px, 4.3cqi, 38px)/1.15 var(--jc-font);
  letter-spacing: -.03em;
  text-align: start;
  text-transform: none;
  text-wrap: balance;
  overflow-wrap: break-word;
}
#sp-component .list-extended .content-category:has(> .category-desc) > h1 {
  align-self: end;
  padding-bottom: 12px;
}
#sp-component .list-extended .content-category > h1::after { content: none; }
#sp-component .list-extended .content-category > .category-desc {
  grid-area: 2 / 1;
  z-index: 1;
  align-self: start;
  min-inline-size: 0;
  block-size: auto;
  margin: 0;
  padding: 0 40% 28px 32px;
  border: 0;
  background: none;
  box-shadow: none;
  color: #d5e4f9;
  font: 400 16px/1.6 var(--jc-font);
  text-wrap: pretty;
  overflow-wrap: break-word;
}
#sp-component .list-extended .category-desc p { margin: 0; font: inherit; }
#sp-component .list-extended .category-desc a { color: #d5e4f9; text-decoration: underline; text-underline-offset: .18em; }
#sp-component .list-extended .content-category > form {
  grid-area: 2 / 1;
  position: relative;
  z-index: 2;
  margin: -16px 0 0;
}
#sp-component .list-extended .content-category:has(> .category-desc) > form { grid-row: 3; }

/* Current native filter wrapper: one panel, approved controls inside. */
#sp-component .list-extended .com-content-category__articles .le-filter-section {
  position: relative;
  margin: 0 20px 24px;
  padding: 20px;
  border: 1px solid var(--jc-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px #102d4714;
}
#sp-component .list-extended .le-filter-section > .le-filter-text {
  margin: 0 0 16px;
  color: #5d7181;
  font: 400 13px/1.6 var(--jc-font);
}
#sp-component .list-extended .com-content-category__articles .le-filter-section .le-toolbar {
  margin: 0;
  margin-bottom: 0 !important; /* Bootstrap mb-3 utility in the current markup. */
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#sp-component .list-extended .com-content-category__articles .le-filter-section .le-filter-fields:not([hidden]) {
  margin-bottom: 0 !important; /* Bootstrap mb-3 utility in the current markup. */
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

/* Respond to the component width, including layouts with a sidebar. */
@container jc-kb (max-width: 680px) {
  #sp-component .list-extended .content-category > h1 { padding-inline: 24px 290px; font-size: 30px; }
  #sp-component .list-extended .content-category > .category-desc { padding-inline: 24px 290px; }
  #sp-component .list-extended .content-category::after { inline-size: 300px; background-size: auto 210px; }
}
@container jc-kb (max-width: 520px) {
  #sp-component .list-extended .content-category::before,
  #sp-component .list-extended .content-category::after { min-block-size: 216px; }
  #sp-component .list-extended .content-category::after {
    inline-size: 70%;
    max-inline-size: 270px;
    opacity: .2;
    background-size: auto 200px;
  }
  #sp-component .list-extended .content-category > h1 { padding: 24px 22px; font-size: 28px; }
  #sp-component .list-extended .content-category:has(> .category-desc) > h1 { padding-bottom: 12px; }
  #sp-component .list-extended .content-category > .category-desc { padding: 0 22px 24px; font-size: 15px; }
  #sp-component .list-extended .com-content-category__articles .le-filter-section { margin-inline: 10px; padding: 16px; }
  #sp-component .list-extended .com-content-category__articles .le-sort-control .form-select { min-inline-size: 0; max-inline-size: 100%; }
}