/* Joomla 4-6 markup support for the granit template (port of sdksirius atomic) (added 2026-10-30) */

/* Screen-reader-only text (Bootstrap 5 utility used across Joomla core layouts) */
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Left menu: submenus always expanded as in Joomla 3, no toggle button */
.leftmenu .mod-menu__toggle-sub {
  display: none;
}

.leftmenu .mod-menu__sub {
  display: block;
}

/* Pagination: Joomla 6 prints Font Awesome icons, granit has no icon font -> J3 text labels */
.pagination .icon-angle-double-left::before { content: "В начало"; }
.pagination .icon-angle-left::before { content: "Назад"; }
.pagination .icon-angle-right::before { content: "Вперёд"; }
.pagination .icon-angle-double-right::before { content: "В конец"; }
.pagination .pagination__wrapper { display: inline; }

/* Top menu: no submenu toggle button */
.topmenu .mod-menu__toggle-sub {
  display: none;
}

/* Cookie notice (replacement for SP Cookie Consent) */
.sdk-cookie {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px 20px;
  padding: 22px 30px;
  background: #ededed;
  color: #000000;
  font-size: 13.33px;
  line-height: 1.45;
  box-shadow: 0 -2px 6px rgba(0, 0, 0, .15);
}
.sdk-cookie__text { max-width: 900px; }
.sdk-cookie__text p { margin: 0; }
.sdk-cookie__text a { color: #cd272e; text-decoration: underline; }
.sdk-cookie__btn {
  flex: 0 0 auto;
  padding: 7px 15px;
  border: 0;
  border-radius: 4px;
  background: #cd272e;
  color: #ffffff;
  font-size: 14.4px;
  cursor: pointer;
}
.sdk-cookie__btn:hover,
.sdk-cookie__btn:focus { background: #a81f25; }

/* Page/article titles: Joomla 3 printed <h2>, Joomla 4-6 print <h1> -> copy of the template's h2 rules (style.css) */
.inner h1{padding:0; margin:0; color:#606060; font-size:24px; font-weight:normal}
.inner h1 a{text-decoration:underline; color:#606060;}
.inner h1 a:hover{text-decoration:none;}

/* Login: "Показать пароль" toggle (Joomla 6 passwordview.js).
   granit has no icon font and no Bootstrap .btn/.input-group styles, so the button collapsed to 16x6 px.
   Size it to the 21 px input and draw the eye / crossed-eye icons as inline SVG (added 2026-11-09). */
.password-group #password { vertical-align: top; }
.password-group .input-password-toggle {
  display: inline-block;
  box-sizing: border-box;
  width: 25px;
  height: 21px;
  margin: 0 0 0 3px;
  padding: 0;
  vertical-align: top;
  border: 1px solid #a9a9a9;
  border-radius: 2px;
  background: #f0f0f0;
  line-height: 0;
  cursor: pointer;
}
.password-group .input-password-toggle:hover { background: #e2e2e2; }
.password-group .input-password-toggle:focus-visible { outline: 2px solid #cd272e; outline-offset: 1px; }
.password-group .input-password-toggle .icon-eye,
.password-group .input-password-toggle .icon-eye-slash {
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: middle;
  background: no-repeat center / 15px 15px;
}
.password-group .input-password-toggle .icon-eye {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23132f5d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}
.password-group .input-password-toggle .icon-eye-slash {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23132f5d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
}

/* Joomla system messages (<jdoc:include type="message" />, rendered as <joomla-alert> by media/system/js/messages.js) */
#system-message-container { margin: 6px 2px 10px; }
#system-message-container joomla-alert {
  display: block;
  position: relative;
  margin: 0 0 8px;
  padding: 10px 34px 10px 12px;
  border: 1px solid #b7c4d6;
  border-left-width: 4px;
  border-radius: 3px;
  background: #eef3f9;
  color: #132f5d;
  font-size: 13px;
  line-height: 1.4;
}
#system-message-container joomla-alert[type="danger"],
#system-message-container joomla-alert[type="error"] { border-color: #e2b4b4; border-left-color: #cd272e; background: #fbeeee; color: #7a1418; }
#system-message-container joomla-alert[type="warning"] { border-color: #ead9a8; border-left-color: #d49b00; background: #fdf7e6; color: #6b4e00; }
#system-message-container joomla-alert[type="success"] { border-color: #b9dcbf; border-left-color: #2e7d32; background: #eef8ef; color: #1e4d21; }
#system-message-container .alert-heading { font-weight: bold; margin-bottom: 2px; }
#system-message-container .alert-message { margin: 0; }
#system-message-container .joomla-alert--close,
#system-message-container .joomla-alert-button--close {
  position: absolute;
  top: 6px;
  right: 8px;
  border: 0;
  background: transparent;
  font-size: 18px;
  line-height: 1;
  color: inherit;
  cursor: pointer;
}

/* Pagination: current page as plain grey text, "Вперёд / В конец" bold (as on Joomla 3) */
.pagination .page-item.active .page-link { color: inherit; pointer-events: none; text-decoration: none; }
.pagination .icon-angle-right::before,
.pagination .icon-angle-double-right::before { font-weight: normal; }   /* granit J3 showed them in normal weight (atomic: bold) */

/* No space for the message container when there is no message (Joomla prints it empty on every page) */
#system-message-container:empty { margin: 0; }

/* Top menu: captions centred in the 71px tab (vertically and horizontally) */
.topmenu ul li a { display: flex !important; align-items: center; justify-content: center; box-sizing: border-box;
  width: 100% !important; height: 71px !important; padding: 0 10px !important; transform: none !important; }

/* PDF links: thin outline icon in the link's own colour (replaces the blurry 16x16 pdf.png from style.css) */
a[href$='.pdf'], a[href$='.PDF'] { padding-left: 0 !important; background: none !important; }
a[href$='.pdf']::before, a[href$='.PDF']::before {
  content: ""; display: inline-block; width: 9px; height: 11px; margin-right: 5px; vertical-align: -1px;
  background-color: currentColor; opacity: .85;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 11'%3E%3Cpath d='M.5.5h5l3 3v7h-8z M5.5.5v3h3 M2.2 6h4.6 M2.2 8h4.6' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 11'%3E%3Cpath d='M.5.5h5l3 3v7h-8z M5.5.5v3h3 M2.2 6h4.6 M2.2 8h4.6' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") no-repeat center / contain;
}
/* Footer has line-height:10px: give each PDF link its own row so the icons do not touch */
.footer a[href$='.pdf'], .footer a[href$='.PDF'] { display: inline-block; line-height: 14px; margin: 1px 0; }