/* Modern UX layer for gorod template
   Подключайте ПОСЛЕ responsive.css и после inline style.php (см. index.php),
   иначе часть правил перекроется цветами темы или объединённым CSS плагинами. */

:root {
  --ux-bg: #f4f6fb;
  --ux-surface: #ffffff;
  --ux-surface-muted: #f8faff;
  --ux-border: #d8e0ef;
  --ux-text: #23324d;
  --ux-text-muted: #6e7b95;
  --ux-primary: #1f5fa8;
  --ux-primary-hover: #184b84;
  --ux-danger: #f45a61;
  --ux-radius-sm: 8px;
  --ux-radius-md: 12px;
  --ux-radius-lg: 16px;
  --ux-shadow-sm: 0 2px 8px rgba(20, 45, 90, 0.08);
  --ux-shadow-md: 0 8px 24px rgba(20, 45, 90, 0.12);
  /* Вертикальный ритм (базовые отступы) */
  --ux-space-xs: 4px;
  --ux-space-sm: 8px;
  --ux-space-md: 16px;
  --ux-space-lg: 24px;
  --ux-space-xl: 32px;
  --ux-focus-ring: 2px solid var(--ux-primary);
}

/* Фокус клавиатуры поверх глобального outline:none в template.css */
body.modern-ui :focus-visible {
  outline: var(--ux-focus-ring);
  outline-offset: 2px;
}

body.modern-ui .fancybox-container :focus-visible,
body.modern-ui .fancybox__container :focus-visible {
  outline: var(--ux-focus-ring);
  outline-offset: 2px;
}

body.modern-ui {
  background: var(--ux-bg);
  color: var(--ux-text);
  line-height: 1.45;
}

.modern-ui .all_gorod {
  max-width: 1240px;
}

.modern-ui .content a,
.modern-ui .news a,
.modern-ui .blog a,
.modern-ui .main_content a,
.modern-ui .popup_block a {
  color: var(--ux-primary);
  transition: color 0.2s ease;
}

.modern-ui .content a:hover,
.modern-ui .news a:hover,
.modern-ui .blog a:hover,
.modern-ui .main_content a:hover,
.modern-ui .popup_block a:hover {
  color: var(--ux-primary-hover);
}

.modern-ui .portal_top h3,
.modern-ui .left_block .portal_top h3,
.modern-ui .main_search .portal_top h3 {
  color: var(--ux-text);
  letter-spacing: 0.01em;
}

.modern-ui .padding,
.modern-ui .kat_item .padding,
.modern-ui .mini-blogs .padding,
.modern-ui .mod_blog .padding,
.modern-ui .katalog_item.padding,
.modern-ui .tema_padding,
.modern-ui .popup_block {
  background: var(--ux-surface);
  border: 1px solid var(--ux-border);
  border-radius: var(--ux-radius-md);
  box-shadow: var(--ux-shadow-sm);
}

/* mod_jcomments_latest: одна внешняя карточка (.padding), без вложенной рамки */
.modern-ui .jcomments-latest .tema_padding {
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
}

.modern-ui .jcomments-latest .comment.rounded {
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

/* Карусели на главной: слабее тень — меньше композитных слоёв при скролле */
.modern-ui .carousel .carousel-block .padding {
  box-shadow: 0 1px 4px rgba(20, 45, 90, 0.06);
}

.modern-ui .left_block ul.menu li,
.modern-ui .mainmenu ul.menu li a,
.modern-ui .top_menu li a {
  border-radius: var(--ux-radius-sm);
}

.modern-ui input[type="text"],
.modern-ui input[type="email"],
.modern-ui input[type="password"],
.modern-ui input[type="tel"],
.modern-ui input[type="number"],
.modern-ui select,
.modern-ui textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--ux-border);
  background: var(--ux-surface);
  border-radius: var(--ux-radius-sm);
  padding: 10px 12px;
  color: var(--ux-text);
  box-sizing: border-box;
}

.modern-ui textarea {
  min-height: 120px;
}

.modern-ui input:focus,
.modern-ui select:focus,
.modern-ui textarea:focus {
  border-color: var(--ux-primary);
  box-shadow: 0 0 0 3px rgba(31, 95, 168, 0.14);
  outline: none;
}

.modern-ui .button,
.modern-ui button,
.modern-ui input[type="submit"],
.modern-ui .link_all a,
.modern-ui a.sale_link {
  border-radius: 10px;
  border: inherit;
  padding: 10px 14px;
  min-height: 40px;
  background: inherit;
  color: inherit;
  box-shadow: none;
}

.modern-ui .mini_icon,
.modern-ui .phone_block,
.modern-ui .kat_item_info,
.modern-ui .mod_info_blog {
  color: var(--ux-text-muted);
}

.modern-ui .top_block,
.modern-ui .footer_block {
  background: var(--ux-surface);
  border-bottom: 1px solid var(--ux-border);
}

.modern-ui .footer_block {
  border-top: 1px solid var(--ux-border);
}

.modern-ui #map,
.modern-ui #mapGoogle,
.modern-ui #YMapsID {
  border-radius: var(--ux-radius-lg);
  overflow: hidden;
  box-shadow: var(--ux-shadow-md);
}

.modern-ui #map .left_block {
  border-left: 1px solid var(--ux-border);
  box-shadow: -8px 0 20px rgba(20, 45, 90, 0.08);
}

.modern-ui .popup,
.modern-ui .home,
.modern-ui .mainmenu {
  border-radius: var(--ux-radius-md);
}

.modern-ui .rsform-block {
  margin-bottom: 14px;
}

.modern-ui .rsform-block label,
.modern-ui .control-label {
  color: var(--ux-text);
  font-weight: 600;
  margin-bottom: 6px;
}

.modern-ui .rsform-error {
  color: #c5313a;
}

.modern-ui form#adminForm,
.modern-ui .edit.item-page,
.modern-ui .form-validate,
.modern-ui .com-content-form {
  background: var(--ux-surface);
  border: 1px solid var(--ux-border);
  border-radius: var(--ux-radius-md);
  box-shadow: var(--ux-shadow-sm);
  padding: 16px;
}

.modern-ui .control-group,
.modern-ui .form-group,
.modern-ui .rsform-block {
  margin-bottom: 14px;
}

.modern-ui .control-label,
.modern-ui .form-group label {
  font-size: 14px;
  color: var(--ux-text);
}

.modern-ui .btn-toolbar,
.modern-ui .form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 16px;
}

.modern-ui .btn-toolbar .btn,
.modern-ui .form-actions .btn {
  border-radius: 10px;
}

/* Подкатегории: скрываем дубль только у каталога фирм (в других разделах блок нужен). */
.modern-ui .gorod-category-layout--catalog .cat-children,
.modern-ui .catalog_items--catalog .cat-children {
  display: none !important;
}

/* Карточки листинга: общий модификатор секции (--catalog, --service, …) */
body.modern-ui .gorod-card.padding {
  box-sizing: border-box;
}

.gorod-category-layout .kat_item {
  margin-bottom: var(--ux-space-md);
}

.gorod-article-detail {
  margin-bottom: var(--ux-space-lg);
}

.modern-ui .add_menu,
.modern-ui .add_reklama,
.modern-ui .popup_block,
.modern-ui .panel_left,
.modern-ui .panel_right {
  background: var(--ux-surface);
  border: 1px solid var(--ux-border);
  border-radius: var(--ux-radius-md);
  box-shadow: var(--ux-shadow-sm);
  padding: 14px;
}

.modern-ui .carousel,
.modern-ui .mod_afisha,
.modern-ui .mod_catalog,
.modern-ui .mod_doska,
.modern-ui .mod_realty,
.modern-ui .mod_auto,
.modern-ui .mod_dost {
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
  border-radius: var(--ux-radius-md);
  padding: 8px;
}

/* Карусель внутри уже обведённого блока .mod_* — без второй «коробки» (контейнер в контейнере) */
.modern-ui .mod_afisha .carousel,
.modern-ui .mod_catalog .carousel,
.modern-ui .mod_doska .carousel,
.modern-ui .mod_realty .carousel,
.modern-ui .mod_auto .carousel,
.modern-ui .mod_dost .carousel {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
}

/* Header modernization */
.modern-ui .top_block {
  background: linear-gradient(180deg, #ffffff 0%, #f2f5fb 100%);
  color: #2b3a55;
  box-shadow: 0 3px 16px rgba(31, 54, 96, 0.1);
}

.modern-ui .top_block a {
  color: #2b3a55;
}

/* Гостевой ЛК: светлая шапка — белый PNG не был виден; иконка Font Awesome + контрастный фон */
.modern-ui .top_block .user_panel {
  width: auto !important;
  max-width: min(320px, 100%);
  min-width: 0;
}

.modern-ui .top_block .user_panel > a {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  width: auto;
  max-width: 100%;
  box-sizing: border-box;
}

.modern-ui .top_block .user_panel > a span.user_avatar {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 40px !important;
  height: 40px !important;
  flex: 0 0 auto;
  background: rgba(31, 95, 168, 0.12);
  border-radius: 10px;
  vertical-align: middle;
}

.modern-ui .top_block .user_panel .user_panel__guest-icon {
  font-size: 20px;
  color: var(--ux-primary);
  line-height: 1;
}

.modern-ui .top_block .user_panel > a span.user_text {
  display: block !important;
  width: auto !important;
  flex: 1 1 auto;
  min-width: 0;
  vertical-align: middle;
}

.modern-ui .top_block .user_panel > a span.user_text span,
.modern-ui .top_block .user_panel > a span.user_text small {
  color: var(--ux-text);
}

@media screen and (max-width: 960px) {
  .modern-ui .top_block .user_panel > a span.user_text {
    display: none !important;
  }

  .modern-ui .top_block .user_panel > a {
    justify-content: center;
  }

  .modern-ui .top_block .user_panel > a span.user_avatar {
    width: 44px !important;
    height: 44px !important;
    max-width: 44px !important;
  }
}

/* Выпадающий ЛК (авторизован, mod_slogin): карточка, без тесной трёхколонки */
.modern-ui .top_block .city_login .panel_login {
  top: 52px;
  left: 0;
  z-index: 220;
  width: min(440px, calc(100vw - 16px)) !important;
  max-width: min(440px, calc(100vw - 16px));
  padding: 0;
  overflow: hidden;
  background: var(--ux-surface);
  border: 1px solid var(--ux-border);
  border-top: 3px solid var(--ux-primary);
  border-radius: var(--ux-radius-lg);
  box-shadow: 0 16px 48px rgba(20, 45, 90, 0.14), 0 0 0 1px rgba(31, 95, 168, 0.06);
}

.modern-ui .top_block .city_login .panel_login::before {
  display: none;
}

.modern-ui .top_block .city_login .login_padding {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 18px 20px;
  padding: 22px 24px 20px;
  box-sizing: border-box;
}

.modern-ui .top_block .city_login .login_padding .panel_ava {
  flex: 0 0 104px;
  width: 104px !important;
  text-align: center;
}

.modern-ui .top_block .city_login .login_padding .panel_user_info {
  flex: 1 1 200px;
  min-width: 0;
  width: auto !important;
}

.modern-ui .top_block .city_login .login_padding .lk_link {
  flex: 1 1 100%;
  width: 100% !important;
  min-width: 0;
  margin: 0;
  padding: 16px 0 4px;
  border-top: 1px solid var(--ux-border);
}

.modern-ui .top_block .city_login .login_padding .introtext_border {
  display: block !important;
  flex: 0 0 100%;
  width: 100%;
  height: 0;
  margin: 6px 0 0;
  border-top: 1px solid var(--ux-border);
}

.modern-ui .top_block .city_login .login_padding .lk_btn {
  flex: 1 1 calc(50% - 10px);
  min-width: 0;
  margin: 0 !important;
}

.modern-ui .top_block .city_login .login_padding #login-form {
  flex: 1 1 calc(50% - 10px);
  min-width: 0;
  margin: 0 !important;
  display: flex;
  align-items: stretch;
}

.modern-ui .top_block .city_login .login_padding #login-form .logout-button {
  flex: 1;
  display: flex;
}

.modern-ui .top_block .city_login .login_padding a {
  color: var(--ux-primary);
}

.modern-ui .top_block .city_login .panel_ava_img {
  width: 96px;
  height: 96px;
  margin: 0 auto;
  border: 3px solid var(--ux-surface);
  box-shadow: 0 0 0 1px var(--ux-border), var(--ux-shadow-sm);
}

.modern-ui .top_block .city_login .panel_ava img {
  width: 96px;
  max-width: 100%;
}

.modern-ui .top_block .city_login .panel_ava a {
  display: inline-block;
  margin-top: 10px;
  color: var(--ux-primary);
  font-size: 12px;
  font-weight: 600;
  border-bottom: none;
  text-decoration: none;
  letter-spacing: 0.01em;
}

.modern-ui .top_block .city_login .panel_ava a:hover {
  color: var(--ux-primary-hover);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.modern-ui .top_block .city_login .panel_user_info h3 {
  margin: 0 0 12px;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--ux-text);
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.modern-ui .top_block .city_login .panel_user_info .row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin-bottom: 8px;
  padding-bottom: 0;
  border-bottom: none;
}

.modern-ui .top_block .city_login .panel_user_info .row label {
  flex: 0 0 auto;
  min-width: 3.2rem;
  color: var(--ux-text-muted);
  width: auto !important;
  font-size: 12px;
  font-weight: 500;
}

.modern-ui .top_block .city_login .panel_user_info .row span {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--ux-text);
  font-weight: 600;
  width: auto !important;
  font-size: 13px;
  word-break: break-word;
}

.modern-ui .top_block .city_login .panel_user_info .row_slogin {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--ux-border);
}

.modern-ui .top_block .city_login .panel_user_info .row_slogin label {
  display: block;
  margin-top: 0;
  margin-bottom: 6px;
  color: var(--ux-text-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.modern-ui .top_block .city_login .panel_login #slogin-buttons-unattach a,
.modern-ui .top_block .city_login .panel_login #slogin-buttons-attach a {
  color: var(--ux-text);
}

.modern-ui .top_block .city_login .row_balance {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 8px;
  margin-top: 14px;
  padding: 10px 14px;
  max-width: 100%;
  box-sizing: border-box;
  background: rgba(31, 95, 168, 0.07);
  border-radius: var(--ux-radius-sm);
  border: 1px solid rgba(31, 95, 168, 0.12);
}

.modern-ui .top_block .city_login .row_balance .row_balance_add {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 6px 12px;
  border-radius: 12px;
  text-decoration: none;
  background: var(--ux-primary);
  color: #fff !important;
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.modern-ui .top_block .city_login .row_balance .row_balance_add:hover {
  background: var(--ux-primary-hover);
  color: #fff !important;
}

.modern-ui .top_block .city_login .row_balance .row_balance_add i,
.modern-ui .top_block .city_login .row_balance .row_balance_add span {
  color: inherit !important;
  border-bottom: none;
}

.modern-ui .top_block .city_login .row_balance label {
  color: var(--ux-text-muted);
  font-size: 12px;
  font-weight: 600;
}

.modern-ui .top_block .city_login .row_balance span {
  color: var(--ux-primary);
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.modern-ui .top_block .city_login .lk_link ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  padding: 0;
  border: none;
  list-style: none;
  font-size: 13px;
}

.modern-ui .top_block .city_login .lk_link ul:last-child {
  margin-bottom: 0;
}

.modern-ui .top_block .city_login .lk_link ul li {
  margin: 0;
}

.modern-ui .top_block .city_login .lk_link ul li a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
  border-radius: 999px;
  color: var(--ux-text) !important;
  text-decoration: none;
  font-weight: 500;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.modern-ui .top_block .city_login .lk_link ul li a:hover {
  background: #fff;
  border-color: var(--ux-primary);
  color: var(--ux-primary) !important;
}

.modern-ui .top_block .city_login .lk_link ul li a i {
  width: 1.1em;
  color: var(--ux-primary);
  opacity: 0.9;
}

.modern-ui .top_block .city_login .lk_link ul li a span {
  color: inherit !important;
  border-bottom: none;
  font-weight: 500;
}

.modern-ui .top_block .city_login .lk_link ul.pay {
  width: 100%;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  margin-top: 4px;
  margin-bottom: 0 !important;
}

.modern-ui .top_block .city_login .lk_link ul.pay li {
  width: 100%;
  margin: 0;
}

.modern-ui .top_block .city_login .lk_link ul.pay li a {
  width: 100%;
  justify-content: center;
  box-sizing: border-box;
  padding: 11px 16px;
  border-radius: var(--ux-radius-sm);
  background: var(--ux-primary);
  border: 1px solid transparent;
  color: #fff !important;
  font-weight: 600;
  text-shadow: none;
  transition: background 0.2s ease;
}

.modern-ui .top_block .city_login .lk_link ul.pay li a:hover {
  background: var(--ux-primary-hover);
  color: #fff !important;
  border-color: transparent;
}

.modern-ui .top_block .city_login .lk_link ul.pay li a i {
  color: #fff !important;
  opacity: 1;
}

.modern-ui .top_block .city_login .lk_btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  box-sizing: border-box;
  min-height: 44px;
  background: var(--ux-surface-muted);
  color: var(--ux-text) !important;
  border: 1px solid var(--ux-border);
  padding: 10px 14px;
  border-radius: var(--ux-radius-sm);
  text-decoration: none;
  text-shadow: none;
  font-weight: 600;
  font-size: 14px;
  box-shadow: none;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.modern-ui .top_block .city_login .lk_btn a:hover {
  background: #fff;
  border-color: var(--ux-primary);
  color: var(--ux-primary) !important;
}

.modern-ui .top_block .city_login .lk_btn a i {
  margin-right: 0;
  font-size: 17px;
  color: var(--ux-primary);
}

.modern-ui .top_block .city_login .lk_btn a span {
  text-shadow: none;
  font-size: 14px;
}

.modern-ui .top_block .city_login #login-form .button {
  width: 100%;
  min-height: 44px;
  box-sizing: border-box;
  background: var(--ux-primary);
  color: #fff !important;
  border: none;
  padding: 10px 16px;
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  border-radius: var(--ux-radius-sm);
  cursor: pointer;
  transition: background 0.2s ease;
}

.modern-ui .top_block .city_login #login-form .button:hover {
  background: var(--ux-primary-hover);
}

.modern-ui .top_block .city_login .panel_login > .ul-jlslogin {
  display: none !important;
}

.modern-ui .top_block .city_login .panel_login > .ul-jlslogin li {
  margin: 0;
}

.modern-ui .top_block .city_login .panel_login > .ul-jlslogin a {
  color: var(--ux-text-muted);
  text-decoration: none;
}

.modern-ui .top_block .city_login .panel_login > .ul-jlslogin a:hover {
  color: var(--ux-primary);
  text-decoration: none;
}

@media screen and (max-width: 600px) {
  .modern-ui .top_block .city_login .lk_link {
    display: block !important;
  }

  .modern-ui .top_block .city_login .panel_user_info {
    width: 100% !important;
  }

  .modern-ui .top_block .city_login .login_padding {
    padding: 18px 18px 16px;
    gap: 14px;
  }

  .modern-ui .top_block .city_login .login_padding .panel_ava {
    flex: 1 1 100%;
    width: 100% !important;
  }

  .modern-ui .top_block .city_login .login_padding .lk_btn,
  .modern-ui .top_block .city_login .login_padding #login-form {
    flex: 1 1 100%;
  }

  .modern-ui .top_block .city_login .row_balance .row_balance_add {
    width: 100%;
    justify-content: center;
    margin-left: 0;
  }
}

/* Шапка: погода и валюта не сжимаются до «ломаной» иконки; строка города/VK не отъедает срочные новости */
.modern-ui .top_block .all_gorod {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 10px;
  row-gap: 6px;
  box-sizing: border-box;
}

.modern-ui .top_block .user_panel,
.modern-ui .top_block .today,
.modern-ui .top_block .top_vozrast {
  flex: 0 0 auto;
}

.modern-ui .top_block .pogoda {
  flex: 1 1 160px;
  width: auto !important;
  min-width: 140px;
  max-width: min(320px, 42vw);
  margin-right: 0 !important;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  text-align: left;
}

.modern-ui .top_block .valuta {
  flex: 1 1 200px;
  width: auto !important;
  min-width: 0;
}

.modern-ui .top_block .top_btn,
.modern-ui .top_block .mobile_btn_mainmenu,
.modern-ui .top_block .mobile_btn_home {
  flex: 0 0 auto;
}

.modern-ui .top_block .pogoda .pogoda_img,
.modern-ui .top_block .pogoda_img {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  flex-shrink: 0;
  width: auto !important;
  min-width: 40px;
  min-height: 40px;
  max-width: none;
}

/* Погода: иконка — Font Awesome (weather_owm_fa.inc.php), без внешних PNG */
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon,
.modern-ui .top_block .pogoda .pogoda_img .gorod-weather-fa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  font-size: 26px;
  line-height: 1;
  color: #5a6f94;
}

.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-01d,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-02d {
  color: #c77d00;
}

.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-01n,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-02n {
  color: #4a5f8a;
}

.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-11d,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-11n {
  color: #b8860b;
}

.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-10d,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-10n,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-09d,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-09n {
  color: #2a6f97;
}

.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-13d,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-13n {
  color: #5a7a9a;
}

.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-50d,
.modern-ui .top_block .pogoda .pogoda_img .pogoda_img__icon--owm-50n {
  color: #7a8699;
  opacity: 0.92;
}

.modern-ui .top_block .pogoda .pogoda_info,
.modern-ui .top_block .pogoda_info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 6px;
  width: auto !important;
  max-width: none;
  min-width: 0;
  flex: 1 1 auto;
  line-height: 1.25;
}

.modern-ui .top_block .pogoda_info > a {
  display: block;
  line-height: 1.25;
}

.modern-ui .top_block .pogoda_info a small {
  display: inline-block;
  margin-bottom: 0;
}

.modern-ui .top_block .w-temp {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: baseline;
  column-gap: 0.45em;
  width: 100%;
  min-width: 0;
}

.modern-ui .top_block .w-temp .w-temp__value {
  width: auto !important;
  display: inline-block !important;
  flex: 0 0 auto;
  font-size: 1.08rem !important;
  font-weight: 700;
  color: var(--ux-text);
  vertical-align: baseline !important;
  white-space: nowrap;
  line-height: 1.2;
  margin-top: 0;
}

.modern-ui .top_block .w-temp .w-temp__desc {
  display: inline;
  width: auto !important;
  max-width: 100%;
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--ux-text-muted);
  opacity: 1;
  vertical-align: baseline;
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* zzz-mobile-portal: на узком экране погода с text-align:center — в modern-ui оставляем читабельный левый край */
@media screen and (max-width: 640px) {
  .modern-ui .top_block .pogoda {
    text-align: left !important;
    justify-content: flex-start;
  }
}

/* responsive.css @520px: .w-temp strong { width:100% } ломает «12 °C» + описание */
@media screen and (max-width: 520px) {
  .modern-ui .top_block .w-temp strong.w-temp__value,
  .modern-ui .top_block .w-temp .w-temp__value {
    width: auto !important;
    max-width: 100%;
  }
}

/* zzz-mobile-portal (≤768px) задаёт align-items:flex-start — срочные новости прижимаются к верху ряда */
html body.modern-ui .all_gorod--subhead {
  display: flex;
  flex-wrap: wrap;
  align-items: center !important;
  gap: 12px 16px;
  box-sizing: border-box;
  padding: 8px 0 10px;
}

.modern-ui .all_gorod--subhead .like_block {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  width: auto !important;
  max-width: min(100%, 280px);
  margin-top: 0 !important;
  margin-right: 0 !important;
  padding-right: 12px;
  border-right: 1px solid var(--ux-border);
  box-sizing: border-box;
  vertical-align: middle;
}

.modern-ui .all_gorod--subhead .like_block .gorod {
  flex: 0 0 auto;
  white-space: nowrap;
}

.modern-ui .all_gorod--subhead #vk_like {
  flex: 0 0 auto;
  max-width: 118px;
  overflow: hidden;
  line-height: 0;
}

.modern-ui .all_gorod--subhead #vk_like iframe {
  max-width: 100% !important;
}

.modern-ui .all_gorod--subhead .holiday_block {
  flex: 1 1 200px;
  min-width: 0;
}

.modern-ui .all_gorod--subhead .hot_news {
  flex: 1 1 260px;
  min-width: min(100%, 220px);
  width: auto !important;
  max-width: 100%;
  margin-top: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
  overflow: visible;
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  align-self: center;
  gap: 10px;
  padding: 6px 0;
}

.modern-ui .all_gorod--subhead .hot_news > i {
  flex: 0 0 auto;
  align-self: center;
  line-height: 1;
  margin-top: 0;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  height: auto;
}

.modern-ui .all_gorod--subhead .hot_news .newsflash {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  max-width: 100%;
}

.modern-ui .all_gorod--subhead .hot_news .newsflash h4 {
  margin: 0;
  line-height: 1.4;
  word-wrap: break-word;
  overflow-wrap: anywhere;
}

.modern-ui .shop_menu_block,
.modern-ui .mainmenu,
.modern-ui .top_menu {
  background: #ffffff;
  border: 1px solid var(--ux-border);
  border-radius: 10px;
  box-shadow: var(--ux-shadow-sm);
}

/* Бегущая строка: не обрезать красный текст слева (template.css width:97%) */
.modern-ui .block_shop_menu .shop_menu_block {
  overflow-x: visible;
}

.modern-ui .block_shop_menu marquee {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-left: 0;
  margin-right: 0;
  padding-left: 8px;
  padding-right: 8px;
}

/* Header cluster: слева промо → под ним иконки; справа только контакты (+ корзина) */
.modern-ui .block_home_menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
}

.modern-ui .block_home_menu .gorod_logo {
  flex: 0 0 auto;
  width: auto;
  min-width: 120px;
  max-width: 220px;
}

.modern-ui .block_home_menu .gorod_logo img {
  display: block;
  max-height: 58px;
  width: auto;
  height: auto;
}

.modern-ui .block_home_menu .top_menu {
  flex: 1 1 280px;
  min-width: 0;
  width: auto;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 4px 8px;
  box-sizing: border-box;
}

.modern-ui .top_menu_body {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 10px 14px;
  width: 100%;
}

.modern-ui .top_menu_left {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.modern-ui .top_menu_left .firm_menu {
  width: 100%;
  display: block;
}

.modern-ui .firm_menu ul.menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2px 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.modern-ui .firm_menu ul.menu > li {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: 0;
  border: none;
  max-width: 100%;
}

.modern-ui .firm_menu ul.menu > li:not(:last-child) {
  border-right: 1px solid var(--ux-border);
  padding-right: 8px;
}

.modern-ui .firm_menu .menu li a {
  display: inline-flex;
  align-items: center;
  margin-right: 0;
  gap: 3px;
  white-space: normal;
  font-size: 12px;
  line-height: 1.15;
}

.modern-ui .firm_menu .menu li a i {
  font-size: 14px;
  margin-right: 0;
}

.modern-ui .firm_menu .menu li:first-child a {
  padding: 2px 8px;
  font-size: 11px;
  margin-right: 0;
  border-radius: 3px;
}

.modern-ui .firm_menu .menu li:first-child a i {
  font-size: 13px;
}

.modern-ui .firm_menu .menu li a .city_txt span {
  white-space: normal;
}

.modern-ui .top_menu_aside {
  flex: 0 0 auto;
  max-width: 240px;
  text-align: right;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}

/* Редакция: компактно (перебивает template.css .phone p 18px) */
.modern-ui .top_menu_aside .phone {
  width: 100%;
  text-align: right;
  line-height: 1.1;
  font-size: 10px;
}

.modern-ui .top_menu_aside .phone p {
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.15;
  color: var(--ux-primary);
}

.modern-ui .top_menu_aside .phone small {
  display: block;
  font-size: 9px;
  font-weight: 400;
  line-height: 1.1;
  color: var(--ux-text-muted);
  margin-top: 1px;
}

.modern-ui .top_menu_aside .cart {
  width: auto;
  font-size: 12px;
  text-align: right;
}

.modern-ui .top_menu .home.top_menu_icons {
  width: 100%;
  margin-top: 0;
  padding-top: 4px;
  border-top: 1px solid var(--ux-border);
}

/* Плейсхолдер overlay между промо и иконками — не раздувает колонку на десктопе */
.modern-ui .top_menu_left > .overlay_home {
  min-height: 0;
  line-height: 0;
  font-size: 0;
}

.modern-ui .top_menu .home.top_menu_icons ul.menu {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1px 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.modern-ui .top_menu .home.top_menu_icons ul.menu > li {
  margin: 0;
  padding: 0;
  border: none;
  font-size: 11px;
  line-height: 1.15;
}

.modern-ui .top_menu .home.top_menu_icons ul.menu > li > a {
  padding: 1px 0;
}

.modern-ui .top_menu .home.top_menu_icons ul.menu > li > a i {
  font-size: 14px;
  vertical-align: middle;
}

.modern-ui .top_menu .home.top_menu_icons ul.menu > li > a .city_menu_img img {
  width: 22px;
  height: auto;
}

.modern-ui .top_menu .home.top_menu_icons ul.menu > li > a span.note {
  font-size: 9px;
  padding: 0 3px;
  top: -2px;
}

@media screen and (min-width: 1100px) {
  .modern-ui .block_home_menu .top_menu {
    padding: 3px 8px;
  }

  .modern-ui .top_menu_body {
    flex-wrap: nowrap;
    align-items: center;
  }

  .modern-ui .top_menu_aside {
    align-self: center;
    margin-left: auto;
  }

  .modern-ui .top_menu .home.top_menu_icons ul.menu {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    gap: 4px 8px;
    padding-bottom: 1px;
  }
}

.modern-ui .mainmenu ul.menu li a span.city_txt span,
.modern-ui .shop_menu ul.menu li a span.city_txt span,
.modern-ui .top_menu ul.menu li a span.city_txt span {
  color: #2b3a55;
}

/* Restore legacy button colors where expected */
.modern-ui .top_btn a,
.modern-ui a.sale_link,
.modern-ui .link_add a,
.modern-ui .readmore a,
.modern-ui button.btn-primary,
.modern-ui .btn-primary,
.modern-ui input[type="submit"] {
  background: #f55;
  color: #fff;
  border-color: #f55;
  box-shadow: var(--ux-shadow-sm);
}

.modern-ui .top_btn a:hover,
.modern-ui a.sale_link:hover,
.modern-ui .link_add a:hover,
.modern-ui .readmore a:hover,
.modern-ui button.btn-primary:hover,
.modern-ui .btn-primary:hover,
.modern-ui input[type="submit"]:hover {
  background: #eb4a4a;
  color: #fff;
}

.modern-ui .top_btn a span,
.modern-ui .top_btn a i,
.modern-ui .top_btn a img {
  color: #fff;
}

/* «Предложить новость» / .link_add — без завышенного min-height, плотная высота */
.modern-ui .link_add a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 5px 12px;
  min-height: 0;
  line-height: 1.25;
  font-size: 12px;
  box-sizing: border-box;
  border-radius: 6px;
  text-transform: uppercase;
  font-weight: bold;
  text-decoration: none;
}

.modern-ui .link_add a i {
  font-size: 14px;
  line-height: 1;
  margin-right: 0;
  vertical-align: middle;
}

.modern-ui .link_add a span {
  display: inline;
  vertical-align: baseline;
}

.modern-ui .link_add a span,
.modern-ui .link_add a i {
  color: #fff;
}

/* «Читать полностью» в карточках: без min-height с общих кнопок, текст + » в одну линию */
.modern-ui .kat_item .readmore > div {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.modern-ui .kat_item .readmore a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 12px;
  min-height: 0;
  line-height: 1.35;
  box-sizing: border-box;
  overflow: visible;
  text-decoration: none;
  border-radius: 8px;
  white-space: nowrap;
}

.modern-ui .kat_item .readmore a span {
  display: inline;
  border-bottom: none;
  vertical-align: baseline;
  line-height: inherit;
}

.modern-ui .kat_item .readmore a i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  font-size: 15px;
  line-height: 1;
  flex-shrink: 0;
}

/* list-вид: убираем «кружок» у иконки, чтобы не было отдельного квадрата */
.modern-ui .list.kat_item .readmore a i {
  width: auto;
  height: auto;
  padding: 0;
  border: none;
  border-radius: 0;
  text-align: center;
  vertical-align: middle;
}

/* —— Каталог организаций (com_content/category/catalog.php) —— */
.modern-ui .catalog_items--catalog .kat_item > .padding {
  display: flex;
  align-items: stretch;
  gap: 16px;
  padding: 14px;
}

.modern-ui .catalog_items--catalog .kat_item .mod_news_img {
  flex: 0 0 255px;
  width: 255px;
  margin-right: 0;
}

.modern-ui .catalog_items--catalog .kat_item .mod_news_img a {
  display: block;
}

.modern-ui .catalog_items--catalog .kat_item .mod_news_img img {
  display: block;
  width: 100%;
  height: 190px;
  object-fit: contain;
  object-position: center;
  background: #fff;
  border-radius: 10px;
}

.modern-ui .catalog_items--catalog .kat_item .kat_item_info {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}

.modern-ui .catalog_items--catalog .kat_item .kat_item_info > div[itemprop="address"] {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}

.modern-ui .catalog_items--catalog .kat_item .mini_icon {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
}

.modern-ui .catalog_items--catalog .kat_item .phone_block {
  flex: 0 0 230px;
  width: 230px;
}

.modern-ui .catalog_items--catalog .kat_item h3 {
  margin-bottom: 8px;
}

.modern-ui .catalog_items--catalog .kat_item .ic_cat,
.modern-ui .catalog_items--catalog .kat_item .ic_big span,
.modern-ui .catalog_items--catalog .kat_item .ic_big_phone .hide-tail {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.modern-ui .catalog_items--catalog .kat_item .mini_icon .ic_cat.link_category a {
  color: var(--ux-primary);
}

.modern-ui .catalog_items--catalog .kat_item .cat_other {
  margin: 6px 0 2px;
}

.modern-ui .catalog_items--catalog .kat_item .cat_other a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  margin: 0 6px 6px 0;
  border-radius: 999px;
  border: 1px solid #c7d7f3;
  background: #edf3ff;
  color: #1f4f8f !important;
  text-decoration: none;
}

.modern-ui .catalog_items--catalog .kat_item .cat_other a i,
.modern-ui .catalog_items--catalog .kat_item .cat_other a span {
  color: inherit;
}

.modern-ui .catalog_items--catalog .kat_item .cat_other a:hover {
  background: #dfeaff;
  color: #173f73 !important;
}

.modern-ui .catalog_items--catalog .kat_item .mini_icon ul.tags {
  margin-top: 8px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.modern-ui .catalog_items--catalog .kat_item .mini_icon ul.tags li {
  margin: 0;
  opacity: 1;
}

.modern-ui .catalog_items--catalog .kat_item .mini_icon ul.tags li a {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border: 1px solid var(--ux-border);
  border-radius: 999px;
  background: var(--ux-surface-muted);
  color: var(--ux-text) !important;
  text-decoration: none;
  font-size: 13px;
}

.modern-ui .catalog_items--catalog .kat_item .mini_icon ul.tags li a .fa {
  color: #7f8ca6;
}

/* В каталоге организаций карточка всегда строкой на всю ширину (legacy .list.kat_item задает 33%). */
.modern-ui .catalog_items--catalog .kat_item,
.modern-ui .catalog_items--catalog .list.kat_item,
.modern-ui .catalog_items--catalog .grid.kat_item {
  display: block !important;
  width: 100% !important;
  margin-right: 0 !important;
}

@media (max-width: 980px) {
  .modern-ui .catalog_items--catalog .kat_item > .padding {
    flex-direction: column;
    gap: 12px;
  }

  .modern-ui .catalog_items--catalog .kat_item .mod_news_img,
  .modern-ui .catalog_items--catalog .kat_item .phone_block {
    width: 100%;
    flex-basis: auto;
  }

  .modern-ui .catalog_items--catalog .kat_item .kat_item_info > div[itemprop="address"] {
    flex-direction: column;
    gap: 10px;
  }

  .modern-ui .catalog_items--catalog .kat_item .mod_news_img img {
    height: auto;
    max-height: 260px;
  }
}

/* —— Личный кабинет (com_content/article/lk.php) —— */
.modern-ui .lk-page .profile .page-header h1 {
  margin-bottom: 14px;
}

.modern-ui .lk-page .profile .padding {
  margin-bottom: 16px;
  padding: 16px 18px !important;
  border-radius: var(--ux-radius-md);
  border: 1px solid var(--ux-border);
  background: var(--ux-surface);
  box-shadow: var(--ux-shadow-sm);
}

.modern-ui .lk-page .profile .user_block1 .padding {
  padding: 18px 20px !important;
}

.modern-ui .lk-page .profile .main_ava_block {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 140px;
  vertical-align: top;
}

.modern-ui .lk-page .profile .main_ava_block img {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--ux-surface);
  box-shadow: 0 0 0 1px var(--ux-border), var(--ux-shadow-sm);
}

.modern-ui .lk-page .profile .main_ava_block a {
  color: var(--ux-primary);
  text-decoration: none;
  border-bottom: none;
  font-size: 13px;
  font-weight: 600;
}

.modern-ui .lk-page .profile .main_user_info {
  width: calc(100% - 140px);
  padding-left: 16px;
  box-sizing: border-box;
  vertical-align: top;
}

.modern-ui .lk-page .profile .main_user_info h3 {
  margin: 0 0 10px;
  font-size: 1.35rem;
  line-height: 1.25;
}

.modern-ui .lk-page .profile .main_user_info .row {
  display: flex;
  align-items: baseline;
  gap: 8px 12px;
  margin-bottom: 8px;
}

.modern-ui .lk-page .profile .main_user_info .row label {
  width: auto;
  min-width: 64px;
  color: var(--ux-text-muted);
  font-size: 13px;
}

.modern-ui .lk-page .profile .main_user_info .row span {
  min-width: 0;
  word-break: break-word;
  font-size: 15px;
  color: var(--ux-text-strong);
  font-weight: 700;
}

.modern-ui .lk-page .profile .main_user_info .row_balans {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.modern-ui .lk-page .profile .main_user_info .row_balans .row_balance {
  margin-right: 0;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 9px 12px;
  border-radius: var(--ux-radius-sm);
  background: rgba(31, 95, 168, 0.08);
  border: 1px solid rgba(31, 95, 168, 0.14);
}

.modern-ui .lk-page .profile .main_user_info .row_balans .row_balance span {
  font-size: 22px;
  line-height: 1;
  color: var(--ux-primary);
}

.modern-ui .lk-page .profile .main_user_info a.btn_balans {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  padding: 9px 14px;
  border-radius: var(--ux-radius-sm);
  background: var(--ux-primary);
  border: 1px solid transparent;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
}

.modern-ui .lk-page .profile .main_user_info a.btn_balans:hover {
  background: var(--ux-primary-hover);
}

.modern-ui .lk-page .profile .user_block2 .padding h2,
.modern-ui .lk-page .profile .history .padding h2 {
  margin: 0 0 12px;
  font-size: 1.15rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.modern-ui .lk-page .profile .history .top_history,
.modern-ui .lk-page .profile .history .bottom_history {
  display: grid;
  grid-template-columns: 1.1fr 1.2fr 2fr 1fr;
  gap: 10px;
  align-items: center;
}

.modern-ui .lk-page .profile .history .top_history {
  margin-bottom: 8px;
  padding: 0 0 8px;
  border-bottom: 1px solid var(--ux-border);
  font-size: 13px;
  font-weight: 700;
  color: var(--ux-text-muted);
}

.modern-ui .lk-page .profile .history .bottom_history {
  font-size: 14px;
  padding: 6px 0;
  border-bottom: 1px dashed rgba(160, 176, 204, 0.45);
}

.modern-ui .lk-page .profile .history .top_row20,
.modern-ui .lk-page .profile .history .top_row40,
.modern-ui .lk-page .profile .history .row20,
.modern-ui .lk-page .profile .history .row40 {
  width: auto;
  text-align: left;
}

.modern-ui .lk-page .profile .history .history.right {
  margin-top: 10px;
  text-align: right;
}

@media (max-width: 900px) {
  .modern-ui .lk-page .profile .main_ava_block,
  .modern-ui .lk-page .profile .main_user_info {
    display: block;
    width: 100%;
    padding-left: 0;
  }

  .modern-ui .lk-page .profile .main_ava_block {
    margin-bottom: 12px;
  }

  .modern-ui .lk-page .profile .history .top_history,
  .modern-ui .lk-page .profile .history .bottom_history {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* —— Страница новости (com_content/article/news.php) —— */
.modern-ui .edit_item_panel.padding {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  padding: 12px 14px !important;
  margin-bottom: 18px;
}

.modern-ui .edit_item_panel .panel_left,
.modern-ui .edit_item_panel .panel_right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  width: auto;
  vertical-align: unset;
}

.modern-ui .edit_item_panel .panel_right {
  justify-content: flex-end;
  margin-left: auto;
}

.modern-ui .edit_item_panel .edit_button a {
  background: var(--ux-primary);
  color: #fff !important;
  border-radius: var(--ux-radius-sm);
  font-weight: 600;
  padding: 8px 16px;
  font-size: 14px;
  box-shadow: var(--ux-shadow-sm);
  text-decoration: none;
}

.modern-ui .edit_item_panel .edit_button a:hover {
  color: #fff !important;
  background: var(--ux-primary-hover);
}

.modern-ui .edit_item_panel .edit_button a i {
  color: #fff !important;
}

.modern-ui .edit_item_panel .pay_btn_cell {
  width: 40px;
  height: 40px;
  border-radius: var(--ux-radius-sm);
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
}

.modern-ui .edit_item_panel .pay_btn a {
  color: var(--ux-text-muted);
}

.modern-ui .news-page__head {
  margin-bottom: 0;
}

.modern-ui .news-page h1 {
  text-transform: none;
  font-size: clamp(1.35rem, 2.6vw, 1.9rem);
  font-weight: 700;
  color: var(--ux-text);
  line-height: 1.28;
  letter-spacing: -0.02em;
  margin: 0 0 4px;
}

.modern-ui .news-page h1 .mod_hr {
  width: 48px;
  max-width: 25%;
  height: 3px;
  margin: 14px 0 0;
  background: linear-gradient(90deg, var(--ux-primary), rgba(31, 95, 168, 0.25));
  border-radius: 2px;
}

.modern-ui .news-page__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 20px;
  padding: 14px 0 16px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--ux-border);
}

.modern-ui .news-page .mini_icons,
.modern-ui .news-page .author_news_block {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: auto;
  vertical-align: unset;
}

.modern-ui .news-page .mini_icons {
  flex: 1 1 200px;
  gap: 8px 16px;
  color: var(--ux-text-muted);
  font-size: 13px;
}

.modern-ui .news-page .mini_icons .ic {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-right: 0;
}

.modern-ui .news-page .mini_icons .ic i {
  opacity: 0.88;
  font-size: 14px;
}

.modern-ui .news-page .ic_cat a {
  display: inline-block;
  padding: 4px 11px;
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  color: var(--ux-primary);
}

.modern-ui .news-page .ic_cat a:hover {
  color: var(--ux-primary-hover);
  border-color: rgba(31, 95, 168, 0.35);
}

.modern-ui .news-page .author_news_block {
  flex: 0 1 auto;
  justify-content: flex-end;
  gap: 10px;
  text-align: right;
}

.modern-ui .news-page .mini_ava {
  border: 2px solid var(--ux-border);
  flex-shrink: 0;
}

.modern-ui .news-page .cat_author small {
  display: block;
  color: var(--ux-text-muted);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 2px;
}

.modern-ui .news-page .cat_author label {
  font-weight: 600;
  color: var(--ux-text);
  font-size: 14px;
}

.modern-ui .news-page .news_logo_block .news_logo.padding {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin: 0 0 10px;
  border-radius: var(--ux-radius-md);
  overflow: hidden;
  box-shadow: var(--ux-shadow-sm);
}

.modern-ui .news-page .news_logo_block .news_logo.padding img {
  display: block;
  width: 100%;
  height: auto;
}

.modern-ui .news-page .author_photo {
  margin: 0 0 14px;
}

.modern-ui .news-page .author_photo span {
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
  color: var(--ux-text-muted);
  font-size: 13px;
  border-radius: var(--ux-radius-sm);
  padding: 6px 12px;
}

.modern-ui .news-page .social_button {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 6px 0 18px;
}

.modern-ui .news-page .intro_text_item {
  margin: 0 0 20px;
  padding: 14px 16px;
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
  border-radius: var(--ux-radius-sm);
  border-left: 4px solid var(--ux-primary);
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 1.55;
  color: var(--ux-text);
}

.modern-ui .news-page .intro_text_item p:last-child {
  margin-bottom: 0;
}

.modern-ui .news-page .video {
  margin: 0 0 18px;
  border-radius: var(--ux-radius-md);
  overflow: hidden;
  box-shadow: var(--ux-shadow-sm);
}

.modern-ui .news-page .desc.padding {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--ux-text);
  max-width: none;
  width: 100%;
  box-sizing: border-box;
  background: transparent;
  border: none;
  box-shadow: none;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.modern-ui .news-page .desc.padding p {
  margin: 0 0 1em;
}

/* Тело новости / материал: картинки на ширину колонки (TinyMCE: узкие обёртки, inline width) */
.modern-ui .news-page .desc.padding p:has(> img:only-child),
.modern-ui .news_all .desc.padding p:has(> img:only-child),
.modern-ui .news-page .desc.padding div:has(> img:only-child):not(.sigplus-gallery):not([class*="gallery"]),
.modern-ui .news_all .desc.padding div:has(> img:only-child):not(.sigplus-gallery):not([class*="gallery"]),
.modern-ui .news-page .intro_text_item p:has(> img:only-child),
.modern-ui .news_all .intro_text_item p:has(> img:only-child),
.modern-ui .news-page .intro_text_item div:has(> img:only-child):not(.sigplus-gallery),
.modern-ui .news_all .intro_text_item div:has(> img:only-child):not(.sigplus-gallery),
.modern-ui .news-page .news-page__body-extra p:has(> img:only-child),
.modern-ui .news-page .news-page__body-extra div:has(> img:only-child) {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .news-page .desc.padding a:has(> img:only-child),
.modern-ui .news_all .desc.padding a:has(> img:only-child),
.modern-ui .news-page .intro_text_item a:has(> img:only-child),
.modern-ui .news_all .intro_text_item a:has(> img:only-child),
.modern-ui .news-page .news-page__body-extra a:has(> img:only-child) {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

/* TinyMCE часто оборачивает картинку в span inline-block + width — без этого img остаётся «узким» */
.modern-ui .news-page .desc.padding span:has(> img:only-child),
.modern-ui .news_all .desc.padding span:has(> img:only-child),
.modern-ui .news-page .intro_text_item span:has(> img:only-child),
.modern-ui .news_all .intro_text_item span:has(> img:only-child),
.modern-ui .news-page .news-page__body-extra span:has(> img:only-child) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .news-page .desc.padding center:has(img),
.modern-ui .news_all .desc.padding center:has(img),
.modern-ui .news-page .intro_text_item center:has(img),
.modern-ui .news_all .intro_text_item center:has(img),
.modern-ui .news-page .news-page__body-extra center:has(img) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

.modern-ui .item-page .desc span:has(> img:only-child),
.modern-ui .item-page .full_desc span:has(> img:only-child) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .item-page .desc center:has(img),
.modern-ui .item-page .full_desc center:has(img) {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

.modern-ui .news-page .desc.padding figure,
.modern-ui .news_all .desc.padding figure,
.modern-ui .news-page .intro_text_item figure,
.modern-ui .news_all .intro_text_item figure,
.modern-ui .news-page .news-page__body-extra figure {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1em 0;
  box-sizing: border-box;
}

.modern-ui .news-page .desc.padding img,
.modern-ui .news_all .desc.padding img,
.modern-ui .news-page .intro_text_item img,
.modern-ui .news_all .intro_text_item img,
.modern-ui .news-page .news-page__body-extra img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  float: none !important;
  vertical-align: middle;
  box-sizing: border-box;
}

.modern-ui .news-page .desc.padding picture,
.modern-ui .news_all .desc.padding picture,
.modern-ui .news-page .intro_text_item picture,
.modern-ui .news_all .intro_text_item picture,
.modern-ui .news-page .news-page__body-extra picture {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .news-page .desc.padding picture img,
.modern-ui .news_all .desc.padding picture img,
.modern-ui .news-page .intro_text_item picture img,
.modern-ui .news_all .intro_text_item picture img,
.modern-ui .news-page .news-page__body-extra picture img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  float: none !important;
  box-sizing: border-box;
}

/* Другие раскладки com_content (default.php и т.д.) — тот же приём */
.modern-ui .item-page .desc p:has(> img:only-child),
.modern-ui .item-page .desc div:has(> img:only-child):not(.sigplus-gallery),
.modern-ui .item-page .full_desc p:has(> img:only-child),
.modern-ui .item-page .full_desc div:has(> img:only-child):not(.sigplus-gallery) {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .item-page .desc figure,
.modern-ui .item-page .full_desc figure {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1em 0;
  box-sizing: border-box;
}

.modern-ui .item-page .desc a:has(> img:only-child),
.modern-ui .item-page .full_desc a:has(> img:only-child) {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .item-page .desc img,
.modern-ui .item-page .full_desc img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .item-page .desc picture,
.modern-ui .item-page .full_desc picture {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .item-page .desc picture img,
.modern-ui .item-page .full_desc picture img {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  float: none !important;
  box-sizing: border-box;
}

.modern-ui .news-page .desc.padding blockquote,
.modern-ui .news-page .intro_text_item blockquote {
  margin: 1.15em 0;
  padding: 14px 16px 14px 18px;
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
  border-radius: var(--ux-radius-sm);
  border-left: 4px solid var(--ux-primary);
  color: var(--ux-text);
  position: static;
}

.modern-ui .news-page .desc.padding blockquote::before,
.modern-ui .news-page .intro_text_item blockquote::before {
  content: none;
  display: none;
}

.modern-ui .news-page .istochnik {
  margin-top: 1.5em;
  font-size: 14px;
  color: var(--ux-text-muted);
}

.modern-ui .news-page .bottom_tag {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.modern-ui .news-page .bottom_tag .tag_div a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 11px;
  background: var(--ux-surface-muted);
  border: 1px solid var(--ux-border);
  border-radius: 999px;
  font-size: 13px;
  text-decoration: none;
}

.modern-ui .news-page .col3 h4 {
  margin: 28px 0 12px;
  font-size: 1.05rem;
  color: var(--ux-text);
  font-weight: 600;
}

/* SigPlus (.gallery): flex-сетка вместо inline-block 25%, превью тянутся на ячейку */
.modern-ui .gallery {
  margin: 18px 0;
  text-align: center;
}

.modern-ui .gallery .sigplus-gallery > ul {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 12px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

.modern-ui .gallery .sigplus-gallery > ul > li {
  display: block !important;
  flex: 1 1 calc(25% - 12px);
  min-width: 140px;
  max-width: calc(25% - 9px);
  width: auto !important;
  vertical-align: unset !important;
  margin: 0 !important;
  box-sizing: border-box;
}

.modern-ui .gallery .sigplus-gallery > ul > li > a {
  display: block !important;
  margin: 0 !important;
  border-radius: var(--ux-radius-sm);
  overflow: hidden;
  border: 1px solid var(--ux-border);
  box-shadow: var(--ux-shadow-sm);
  background: var(--ux-surface-muted);
}

.modern-ui .gallery a.sigplus-image > img,
.modern-ui .gallery img.sigplus-preview {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  vertical-align: top;
}

@media screen and (max-width: 600px) {
  .modern-ui .gallery .sigplus-gallery > ul > li {
    flex: 1 1 calc(50% - 10px);
    max-width: calc(50% - 6px);
    min-width: calc(50% - 10px);
  }
}

@media screen and (max-width: 1024px) {
  .modern-ui .padding,
  .modern-ui .kat_item .padding,
  .modern-ui .mini-blogs .padding,
  .modern-ui .mod_blog .padding {
    border-radius: 10px;
  }
}

@media screen and (max-width: 768px) {
  html {
    -webkit-text-size-adjust: 100%;
  }

  body.modern-ui {
    overflow-x: hidden;
  }

  .modern-ui .all_gorod {
    width: 100%;
    max-width: 100vw;
    box-sizing: border-box;
    padding-left: max(0px, env(safe-area-inset-left, 0px));
    padding-right: max(0px, env(safe-area-inset-right, 0px));
  }

  .modern-ui .main_content img,
  .modern-ui .content img,
  .modern-ui .news img,
  .modern-ui .blog img,
  .modern-ui .item-image img,
  .modern-ui .intro img,
  .modern-ui .fulltext img {
    max-width: 100%;
    height: auto;
  }

  .modern-ui .main_content iframe:not(.fancybox-iframe),
  .modern-ui .content iframe:not(.fancybox-iframe),
  .modern-ui .fulltext iframe,
  .modern-ui .intro iframe {
    max-width: 100%;
  }

  .modern-ui .main_content table {
    max-width: 100%;
  }

  .modern-ui .main_content pre {
    overflow-x: auto;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
  }

  .modern-ui .button,
  .modern-ui button,
  .modern-ui input[type="submit"] {
    min-height: 44px;
  }

  /* iOS: меньше авто-зума при фокусе в полях */
  .modern-ui input[type="text"],
  .modern-ui input[type="email"],
  .modern-ui input[type="password"],
  .modern-ui input[type="tel"],
  .modern-ui input[type="number"],
  .modern-ui input[type="search"],
  .modern-ui input[type="url"],
  .modern-ui select,
  .modern-ui textarea {
    font-size: 16px;
  }

  .modern-ui .main_content,
  .modern-ui .content,
  .modern-ui .blog,
  .modern-ui .news,
  .modern-ui .fulltext {
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  .modern-ui .left_block,
  .modern-ui .content,
  .modern-ui .news,
  .modern-ui .blog {
    margin-bottom: 14px;
  }

  /* «Читать все» / «Предложить» — компактные, в потоке (не на всю ширину) */
  .modern-ui .portal_top > .link_all,
  .modern-ui .portal_top > .link_add {
    width: auto !important;
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 10px;
    text-align: left;
  }

  .modern-ui .portal_top > .link_all {
    margin-right: 10px;
    max-width: calc(100% - 12px);
  }

  .modern-ui .portal_top > .link_add a {
    text-transform: none;
    font-size: 13px;
    font-weight: 600;
    padding: 10px 14px !important;
    min-height: 44px;
    box-sizing: border-box;
    border-radius: var(--ux-radius-sm);
  }

  .modern-ui .kat_item,
  .modern-ui .product-container,
  .modern-ui .mini-blogs {
    width: 100%;
  }

  .modern-ui .block_home_menu .gorod_logo {
    max-width: none;
    width: 100%;
    text-align: center;
  }

  .modern-ui .top_menu_body {
    flex-direction: column;
    align-items: stretch;
  }

  .modern-ui .top_menu_aside {
    max-width: none;
    align-items: flex-start;
    text-align: left;
    width: 100%;
  }

  .modern-ui .top_menu_aside .phone {
    text-align: left;
  }

  .modern-ui .top_menu_aside .cart {
    text-align: left;
  }

  .modern-ui .firm_menu ul.menu > li:not(:last-child) {
    border-right: none;
    padding-right: 0;
  }

  /* Первый экран: верхняя полоса + срочные новости */
  .modern-ui .top_block .all_gorod {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    padding-top: 8px;
    padding-bottom: 10px;
  }

  .modern-ui .top_block .hot_news {
    width: 100% !important;
    flex: 1 0 100%;
    order: 99;
    margin: 4px 0 0 !important;
    text-align: left !important;
    padding: 10px 12px;
    box-sizing: border-box;
    /* заметно и на светлой шапке (.modern-ui .top_block), не только на тёмной */
    background: rgba(31, 95, 168, 0.08);
    border: 1px solid var(--ux-border);
    border-radius: var(--ux-radius-sm);
  }

  .modern-ui .top_block .hot_news i {
    font-size: 17px !important;
    vertical-align: middle;
    margin-right: 8px;
  }

  .modern-ui .top_block .hot_news .newsflash {
    display: inline;
    vertical-align: middle;
    width: auto !important;
    text-align: left !important;
  }

  .modern-ui .top_block .hot_news .newsflash h4 {
    font-size: 14px;
    line-height: 1.35;
    font-weight: 600;
    margin: 0;
  }

  .modern-ui .top_block .hot_news .newsflash h4 a {
    border-bottom: none;
    color: var(--ux-primary);
  }

  /* «Скидки и акции» и первая кнопка firm_menu — не на всю ширину экрана */
  .modern-ui .firm_menu .menu li:first-child,
  .modern-ui .firm_menu .menu li:first-child a {
    width: auto !important;
    max-width: 100%;
    box-sizing: border-box;
  }

  .modern-ui a.sale_link,
  .modern-ui .firm_menu .menu li:first-child a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    max-width: min(100%, 340px);
    font-size: 13px !important;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0.01em;
    padding: 10px 16px !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    border-radius: var(--ux-radius-sm);
    min-height: 44px;
    line-height: 1.2;
    box-sizing: border-box;
  }

  .modern-ui .firm_menu .menu li:first-child a i {
    font-size: 15px !important;
  }

  /* Полоса поиска (mod_finder): поле и «Найти» одной высоты */
  .modern-ui .shop_menu_block .poisk .form-search {
    position: relative;
    width: 100%;
    margin-bottom: 8px;
  }

  .modern-ui .shop_menu_block .poisk .form-search > .finder {
    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
    width: 100%;
    gap: 0;
  }

  .modern-ui .shop_menu_block .poisk .form-search .finder input[type="text"],
  .modern-ui .shop_menu_block .poisk .form-search .finder input[type="search"],
  .modern-ui .shop_menu_block .poisk .form-search .finder input.search-query {
    flex: 1;
    min-width: 0;
    min-height: 44px;
    height: 44px;
    padding-right: 12px;
    border-radius: var(--ux-radius-sm) 0 0 var(--ux-radius-sm);
    box-sizing: border-box;
  }

  .modern-ui .shop_menu_block .poisk .form-search button.finder {
    position: static;
    flex: 0 0 auto;
    min-height: 44px;
    height: 44px;
    padding: 0 14px;
    border-radius: 0 var(--ux-radius-sm) var(--ux-radius-sm) 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    box-sizing: border-box;
  }

  .modern-ui .block_shop_menu {
    margin-bottom: 12px;
  }

  .modern-ui .block_shop_menu .shop_menu_block {
    padding: 8px 10px;
    box-sizing: border-box;
  }

  .modern-ui .tagspopular {
    margin-top: 6px;
    line-height: 1.5;
  }

  .modern-ui .tagspopular li {
    margin: 0 6px 6px 0;
  }

  /* Логотип и быстрые иконки: воздух и зона нажатия */
  .modern-ui .block_home_menu {
    margin-top: 4px;
    margin-bottom: 14px;
    gap: 10px 12px;
  }

  .modern-ui .block_home_menu .gorod_logo img {
    max-height: 52px;
  }

  .modern-ui .top_menu .home.top_menu_icons ul.menu > li > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 8px 6px;
    box-sizing: border-box;
  }

  .modern-ui .top_menu .home.top_menu_icons ul.menu > li > a i {
    font-size: 18px;
  }

  .modern-ui .news-page__meta {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding-bottom: 14px;
  }

  .modern-ui .news-page .author_news_block {
    justify-content: flex-start;
    text-align: left;
    padding-top: 4px;
    border-top: 1px dashed var(--ux-border);
  }

  .modern-ui .edit_item_panel.padding {
    flex-direction: column;
    align-items: stretch;
  }

  .modern-ui .edit_item_panel .panel_right {
    margin-left: 0;
    justify-content: stretch;
  }

  .modern-ui .edit_item_panel .panel_right .edit_button,
  .modern-ui .edit_item_panel .panel_right .edit_button a {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
  }

  .modern-ui .mainmenu ul.menu li,
  .modern-ui .top_menu .home.top_menu_icons li,
  .modern-ui .shop_menu ul.menu li {
    border-bottom: 1px solid var(--ux-border);
  }
}

/* —— «Добавить объявление» (?tmpl=menu): только карточка, фон прозрачный (оверлей Fancybox) —— */
html:has(body.page-add-menu) {
  background: transparent !important;
}

body.page-add-menu.modern-ui {
  margin: 0;
  padding: max(10px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px))
    max(10px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
  min-height: 320px;
  background: transparent !important;
  box-sizing: border-box;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body.page-add-menu.modern-ui .all_gorod.all_gorod--add-menu {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-sizing: border-box;
}

body.page-add-menu.modern-ui .popup_block.popup_block--add-menu {
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 22px 24px 26px;
  width: 100% !important;
  max-width: 920px !important;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: flex-start;
  align-content: flex-start;
  border: 1px solid var(--ux-border) !important;
  border-radius: var(--ux-radius-md) !important;
  box-shadow: var(--ux-shadow-md) !important;
  background: var(--ux-surface) !important;
}

body.page-add-menu .add_menu {
  flex: 1 1 100%;
  width: 100% !important;
  max-width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.page-add-menu .add_reklama {
  flex: 1 1 260px;
  min-width: 200px;
}

body.page-add-menu .add_menu .portal_top {
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

body.page-add-menu .add_menu .portal_top h3 {
  margin: 0 0 22px;
  padding: 0 0 14px;
  position: relative;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--ux-text);
  text-transform: uppercase;
  line-height: 1.35;
  border: none;
}

body.page-add-menu .add_menu .portal_top h3 i {
  color: var(--ux-danger);
  margin-right: 6px;
}

body.page-add-menu .add_menu .portal_top h3 span.mod_hr {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 72px;
  max-width: 35%;
  height: 4px;
  margin: 0;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--ux-danger) 0%, var(--ux-primary) 100%);
}

body.page-add-menu .popup_block--add-menu ul.menu {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  width: 100%;
}

body.page-add-menu .popup_block--add-menu ul.menu li {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  vertical-align: unset;
  border: 1px solid var(--ux-border) !important;
  border-radius: var(--ux-radius-sm) !important;
  background: var(--ux-surface-muted) !important;
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.18s ease,
    background 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
  body.page-add-menu .popup_block--add-menu ul.menu li:hover {
    border-color: rgba(31, 95, 168, 0.45) !important;
    background: var(--ux-surface) !important;
    box-shadow: var(--ux-shadow-sm);
    transform: translateY(-2px);
  }
}

body.page-add-menu .popup_block--add-menu ul.menu li a {
  display: flex !important;
  align-items: center;
  gap: 12px;
  padding: 14px 14px !important;
  font-size: 14px !important;
  font-weight: 600;
  color: var(--ux-text) !important;
  text-decoration: none !important;
  min-height: 54px;
  box-sizing: border-box;
  line-height: 1.3;
  -webkit-tap-highlight-color: rgba(31, 95, 168, 0.12);
  touch-action: manipulation;
}

body.page-add-menu .popup_block--add-menu ul.menu li a:hover {
  color: var(--ux-primary) !important;
}

body.page-add-menu .popup_block--add-menu ul.menu li a span.city_menu_img {
  flex-shrink: 0;
  width: 44px !important;
  min-width: 44px;
  height: 44px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(31, 95, 168, 0.1);
  border-radius: 11px;
  overflow: hidden;
}

body.page-add-menu .popup_block--add-menu ul.menu li a span.city_menu_img img {
  width: 26px !important;
  height: 26px !important;
  max-width: 26px !important;
  object-fit: contain;
  vertical-align: middle;
}

body.page-add-menu .popup_block--add-menu ul.menu li a > i {
  flex-shrink: 0;
  width: 44px;
  min-width: 44px;
  height: 44px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--ux-primary);
  background: rgba(31, 95, 168, 0.1);
  border-radius: 11px;
}

body.page-add-menu .popup_block--add-menu ul.menu li a .city_txt {
  display: flex !important;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  text-align: left;
  vertical-align: middle;
}

body.page-add-menu .popup_block--add-menu ul.menu li a .city_txt > span {
  display: block;
}

body.page-add-menu .popup_block--add-menu ul.menu li a .city_txt small {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 400;
  color: var(--ux-text-muted);
}

@media screen and (max-width: 720px) {
  body.page-add-menu .popup_block--add-menu ul.menu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
}

@media screen and (max-width: 520px) {
  body.page-add-menu .popup_block--add-menu ul.menu {
    grid-template-columns: minmax(0, 1fr);
  }

  body.page-add-menu .add_reklama {
    flex: 1 1 100%;
    min-width: 0;
    max-width: 100%;
  }
}

@media screen and (max-width: 440px) {
  body.page-add-menu.modern-ui .popup_block.popup_block--add-menu {
    padding: 14px 12px 18px;
    gap: 14px;
  }

  body.page-add-menu .add_menu .portal_top h3 {
    font-size: 0.95rem;
    letter-spacing: 0.01em;
    word-wrap: break-word;
    overflow-wrap: break-word;
  }

  body.page-add-menu .popup_block--add-menu ul.menu li a {
    min-height: 52px;
    padding: 12px 12px !important;
    font-size: 15px !important;
  }
}

/* Fancybox: «Добавить» — карточка на затемнённом фоне */
.fancybox-slide.fancybox-slide--add-sheet,
.fancybox-slide.fancybox-slide--add-sheet.fancybox-slide--iframe {
  padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px))
    max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px)) !important;
}

/* Оболочка Fancybox прозрачная — одна «карточка» только внутри iframe (.popup_block--add-menu) */
.fancybox-slide--add-sheet .fancybox-content {
  background: transparent !important;
  padding: 0 !important;
  max-height: 100vh;
  max-height: 100dvh;
  box-sizing: border-box;
  border-radius: 0 !important;
  overflow: visible !important;
  box-shadow: none !important;
  border: none !important;
}

.fancybox-slide--add-sheet .fancybox-iframe {
  background: transparent !important;
  display: block;
  max-width: 100%;
}

@media screen and (max-width: 480px) {
  .fancybox-slide.fancybox-slide--add-sheet,
  .fancybox-slide.fancybox-slide--add-sheet.fancybox-slide--iframe {
    padding: max(8px, env(safe-area-inset-top, 0px)) 8px max(8px, env(safe-area-inset-bottom, 0px)) 8px !important;
  }
}

/* Перебиваем responsive.css: там у .fancybox-slide padding 44px на узких экранах */
@media screen and (max-width: 375px) {
  .fancybox-slide.fancybox-slide--add-sheet.fancybox-slide--iframe {
    padding: max(6px, env(safe-area-inset-top, 0px)) 6px max(6px, env(safe-area-inset-bottom, 0px)) 6px !important;
  }
}

/* ========== Портал: прочие iframe-модалки на телефонах (логин, формы) ========== */
@media screen and (max-width: 480px) {
  .fancybox-slide.fancybox-slide--iframe:not(.fancybox-slide--add-sheet) {
    padding: max(12px, env(safe-area-inset-top, 0px)) 10px max(12px, env(safe-area-inset-bottom, 0px)) 10px !important;
  }
}

@media screen and (max-width: 375px) {
  .fancybox-container .fancybox-slide.fancybox-slide--iframe:not(.fancybox-slide--add-sheet) {
    padding: 14px 8px !important;
  }
}

/* Карта и широкие встраивания: не вылезают за экран */
@media screen and (max-width: 768px) {
  .modern-ui #map,
  .modern-ui #mapGoogle,
  .modern-ui #YMapsID {
    max-width: 100%;
  }

  .modern-ui .top_block .all_gorod {
    box-sizing: border-box;
  }
}

/* ========== Форма входа в iframe: карточка на затемнённом фоне Fancybox ========== */
html:has(body.page-login-iframe.modern-ui) {
  background: transparent !important;
}

body.page-login-iframe.modern-ui {
  background: transparent !important;
  min-height: 0;
}

body.page-login-iframe.modern-ui .all_gorod {
  max-width: none;
  width: 100%;
  margin: 0 auto;
  padding: max(8px, env(safe-area-inset-top, 0px)) max(10px, env(safe-area-inset-right, 0px))
    max(8px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-left, 0px));
  box-sizing: border-box;
  min-height: 0;
  background: transparent !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Fancybox: слайд с формой входа — без белой подложки вокруг iframe */
.fancybox-slide--gorod-login .fancybox-content {
  background: transparent !important;
  padding: 0 !important;
}

.fancybox-slide--gorod-login .fancybox-iframe {
  background: transparent !important;
}

/* ========== Формы в iframe (add-news, RSForm и др., component.php): одна карточка .popup_block, фон прозрачный ========== */
html:has(body.page-component-iframe.modern-ui) {
  background: transparent !important;
}

body.page-component-iframe.modern-ui {
  margin: 0;
  padding: max(8px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px))
    max(8px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px));
  min-height: 0;
  background: transparent !important;
  box-sizing: border-box;
}

body.page-component-iframe.modern-ui .all_gorod {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.page-component-iframe.modern-ui .popup_block {
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  border-radius: var(--ux-radius-lg) !important;
  box-shadow: 0 24px 56px rgba(15, 35, 72, 0.22), 0 0 0 1px var(--ux-border) !important;
}

/* Форма материала в iframe (add-news и др.): редактор на всю ширину карточки */
body.page-component-iframe.modern-ui .edit.item-page .js-editor-tinymce,
body.page-component-iframe.modern-ui .edit.item-page .mce-tinymce,
body.page-component-iframe.modern-ui .edit.item-page .mce-container,
body.page-component-iframe.modern-ui .edit.item-page .mce-stack-layout,
body.page-component-iframe.modern-ui .edit.item-page .mce-edit-area {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

body.page-component-iframe.modern-ui .edit.item-page textarea.joomla-editor-tinymce,
body.page-component-iframe.modern-ui .edit.item-page textarea.mce_editable {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  box-sizing: border-box;
}

body.page-component-iframe.modern-ui .edit.item-page iframe[id^='jform_articletext_ifr'],
body.page-component-iframe.modern-ui .edit.item-page .mce-edit-area iframe {
  width: 100% !important;
}

/* Legacy-редакторы (TinyMCE 3/JCE) в component-iframe: не сжимаем в левую колонку */
body.page-component-iframe.modern-ui .mceEditor,
body.page-component-iframe.modern-ui .mceLayout,
body.page-component-iframe.modern-ui table.mceEditor,
body.page-component-iframe.modern-ui table.mceLayout,
body.page-component-iframe.modern-ui .wf-editor-container,
body.page-component-iframe.modern-ui .tox,
body.page-component-iframe.modern-ui .tox-tinymce {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

body.page-component-iframe.modern-ui .mceLayout iframe,
body.page-component-iframe.modern-ui .mceEditor iframe,
body.page-component-iframe.modern-ui .wf-editor-container iframe,
body.page-component-iframe.modern-ui iframe[id*='articletext_ifr'] {
  width: 100% !important;
  max-width: 100% !important;
}

/* Высота области ввода TinyMCE: иначе при узком/высоком iframe остаётся «полоска» под тулбаром */
body.page-component-iframe.modern-ui .edit.item-page .mce-edit-area,
body.page-component-iframe.modern-ui .edit.item-page .mce-edit-area iframe {
  min-height: 280px !important;
}

@media screen and (max-width: 768px) {
  body.page-component-iframe.modern-ui .edit.item-page .mce-edit-area,
  body.page-component-iframe.modern-ui .edit.item-page .mce-edit-area iframe {
    min-height: 220px !important;
  }
}

/* ========== Fancybox 3: затемнение фона (перебиваем jquery.fancybox.min.css) ========== */
body.modern-ui .fancybox-container {
  background: transparent !important;
}

body.modern-ui .fancybox-bg {
  background: rgba(10, 20, 38, 0.66) !important;
  opacity: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

@supports (backdrop-filter: blur(4px)) {
  body.modern-ui .fancybox-bg {
    background: rgba(10, 20, 38, 0.58) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
}

body.modern-ui .fancybox-is-open .fancybox-bg {
  opacity: 1 !important;
}

body.modern-ui .fancybox-slide {
  padding: max(16px, env(safe-area-inset-top, 0px)) max(18px, env(safe-area-inset-right, 0px))
    max(16px, env(safe-area-inset-bottom, 0px)) max(18px, env(safe-area-inset-left, 0px)) !important;
}

/* Одна карточка — внутри iframe (.popup_block), не второй белый слой Fancybox */
body.modern-ui .fancybox-slide--iframe:not(.fancybox-slide--gorod-login):not(.fancybox-slide--add-sheet) .fancybox-content {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  box-shadow: none !important;
  border: none !important;
}

body.modern-ui .fancybox-slide--iframe:not(.fancybox-slide--gorod-login) .fancybox-iframe {
  display: block !important;
  border-radius: 0;
  background: transparent !important;
}

/*
 * Клики по прозрачной оболочке вокруг iframe шли в .fancybox-content → ветка «Content» и не закрывали модалку.
 * Пусть события проходят к .fancybox-slide (clickSlide: close); сам iframe остаётся интерактивным.
 */
body.modern-ui .fancybox-slide--iframe .fancybox-content {
  pointer-events: none !important;
}

body.modern-ui .fancybox-slide--iframe .fancybox-iframe {
  pointer-events: auto !important;
}

body.modern-ui .fancybox-toolbar {
  top: 8px;
  right: 8px;
  opacity: 1;
}

/* Только крестик закрытия (zoom / slideshow / thumbs не нужны в портальных модалках) */
body.modern-ui .fancybox-toolbar .fancybox-button:not(.fancybox-button--close) {
  display: none !important;
}

body.modern-ui .fancybox-button {
  background: rgba(255, 255, 255, 0.96) !important;
  color: var(--ux-text) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 16px rgba(20, 45, 90, 0.18) !important;
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.modern-ui .fancybox-button:hover {
  background: #fff !important;
  color: var(--ux-primary) !important;
}

body.modern-ui .fancybox-navigation {
  display: none;
}

body.modern-ui .fancybox-infobar {
  display: none !important;
}

/* Sigplus boxplusx (.boxplusx-container z-index ~9999) остаётся под Fancybox 3 (.fancybox-container ~99992) */

@media screen and (max-width: 480px) {
  body.modern-ui .fancybox-slide {
    padding: max(10px, env(safe-area-inset-top, 0px)) 10px max(10px, env(safe-area-inset-bottom, 0px)) 10px !important;
  }

  body.modern-ui .fancybox-button {
    width: 42px !important;
    height: 42px !important;
  }
}

body.page-login-iframe.modern-ui .all_gorod > .popup_block {
  flex: 0 1 420px;
  width: 100%;
  max-width: 420px;
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

body.page-login-iframe.modern-ui .login_form {
  width: 100% !important;
  max-width: 420px;
  margin: 0 auto !important;
}

body.page-login-iframe.modern-ui .login_form > .padding {
  padding: 28px 24px 24px !important;
  margin: 0;
  border-radius: var(--ux-radius-lg);
  box-shadow: 0 16px 48px rgba(20, 45, 90, 0.12) !important;
  border: 1px solid rgba(216, 224, 239, 0.98) !important;
  background: var(--ux-surface) !important;
}

body.page-login-iframe.modern-ui .login_form .page-header {
  margin-bottom: 4px;
}

body.page-login-iframe.modern-ui .login_form .page-header h1 {
  font-size: 1.28rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin: 0 0 10px;
  color: var(--ux-text);
  line-height: 1.25;
  text-align: center;
}

body.page-login-iframe.modern-ui .login_form .page-header .mod_hr {
  display: block;
  margin: 0 auto 16px;
  width: 52px;
  height: 3px;
  background: linear-gradient(90deg, var(--ux-danger), #ff9a8e);
  border: none;
  border-radius: 2px;
}

body.page-login-iframe.modern-ui .login_form .city_login .pretext,
body.page-login-iframe.modern-ui .login_form .city_login .pretext p,
body.page-login-iframe.modern-ui .login_form .pretext p {
  text-align: center;
  color: var(--ux-text-muted);
  font-size: 14px;
  line-height: 1.5;
  margin: 0 0 18px;
}

body.page-login-iframe.modern-ui .login_form #mini_login-form fieldset.userdata {
  border: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px 14px;
  align-items: center;
}

body.page-login-iframe.modern-ui .login_form #form-login-username,
body.page-login-iframe.modern-ui .login_form #form-login-password {
  grid-column: 1 / -1;
}

body.page-login-iframe.modern-ui .login_form #mini_login-form .userdata p {
  margin: 0;
}

body.page-login-iframe.modern-ui .login_form .log_btn_block {
  grid-column: 1;
  width: auto !important;
  justify-self: start;
}

body.page-login-iframe.modern-ui .login_form .remembe_block {
  grid-column: 2;
  width: auto !important;
  max-width: 100%;
  justify-self: end;
  text-align: right;
  font-size: 13px;
}

body.page-login-iframe.modern-ui .login_form .remembe_block a {
  color: var(--ux-primary);
}

body.page-login-iframe.modern-ui .login_form .remembe_block a span {
  border-bottom-color: rgba(31, 95, 168, 0.35);
}

body.page-login-iframe.modern-ui .login_form .log_btn_block button,
body.page-login-iframe.modern-ui .login_form .log_btn_block .button {
  min-height: 44px;
  padding: 10px 18px !important;
  background: var(--ux-primary) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--ux-radius-sm) !important;
  font-weight: 600;
  font-size: 15px;
  box-shadow: 0 2px 10px rgba(31, 95, 168, 0.28);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: inherit;
}

body.page-login-iframe.modern-ui .login_form .log_btn_block button:hover,
body.page-login-iframe.modern-ui .login_form .log_btn_block .button:hover {
  background: var(--ux-primary-hover) !important;
}

body.page-login-iframe.modern-ui .login_form #slogin-buttons {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  width: 100% !important;
  margin: 20px 0 0 !important;
}

body.page-login-iframe.modern-ui .login_form #slogin-buttons a,
body.page-login-iframe.modern-ui .login_form .slogin-buttons.slogin-default a {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  float: none !important;
  border-radius: var(--ux-radius-sm) !important;
  min-height: 46px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
}

body.page-login-iframe.modern-ui .login_form .log_reg_text {
  text-align: center;
  margin: 20px 0 6px;
  font-size: 13px;
  color: var(--ux-text-muted);
  line-height: 1.4;
}

body.page-login-iframe.modern-ui .login_form .city_login a.btn {
  width: 100% !important;
  max-width: 100%;
  margin: 12px 0 6px !important;
  border-radius: var(--ux-radius-sm) !important;
  min-height: 48px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--ux-danger) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(244, 90, 97, 0.32);
  font-weight: 700;
  font-size: 15px;
  text-decoration: none !important;
  box-sizing: border-box;
}

body.page-login-iframe.modern-ui .login_form .city_login a.btn:hover {
  filter: brightness(1.05);
  color: #fff !important;
}

body.page-login-iframe.modern-ui .login_form .posttext,
body.page-login-iframe.modern-ui .login_form .posttext p {
  text-align: center;
  font-size: 12px;
  color: var(--ux-text-muted);
  margin: 10px 0 0;
  line-height: 1.45;
}

/* Регистрация в iframe: десктопное оформление в стиле login_form */
body.page-login-iframe.modern-ui .registration_form,
body.page-registration-iframe.modern-ui .registration_form,
body.page-component-iframe.modern-ui .registration_form {
  width: 100% !important;
  max-width: 560px;
  margin: 0 auto !important;
}

body.page-login-iframe.modern-ui .registration_form > .padding,
body.page-registration-iframe.modern-ui .registration_form > .padding,
body.page-component-iframe.modern-ui .registration_form > .padding {
  padding: 24px 22px 18px !important;
  margin: 0;
  border-radius: var(--ux-radius-lg);
  box-shadow: 0 16px 48px rgba(20, 45, 90, 0.12) !important;
  border: 1px solid rgba(216, 224, 239, 0.98) !important;
  background: var(--ux-surface) !important;
}

body.page-login-iframe.modern-ui .registration_form .page-header h1,
body.page-registration-iframe.modern-ui .registration_form .page-header h1,
body.page-component-iframe.modern-ui .registration_form .page-header h1 {
  font-size: 40px;
  line-height: 1.05;
}

body.page-login-iframe.modern-ui .registration_form #member-registration,
body.page-registration-iframe.modern-ui .registration_form #member-registration,
body.page-component-iframe.modern-ui .registration_form #member-registration {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-login-iframe.modern-ui .registration_form #member-registration .controls .btn,
body.page-registration-iframe.modern-ui .registration_form #member-registration .controls .btn,
body.page-component-iframe.modern-ui .registration_form #member-registration .controls .btn {
  width: auto !important;
  min-width: 168px;
}

body.page-login-iframe.modern-ui .registration_form #member-registration .controls .btn + .btn,
body.page-registration-iframe.modern-ui .registration_form #member-registration .controls .btn + .btn,
body.page-component-iframe.modern-ui .registration_form #member-registration .controls .btn + .btn {
  margin-left: 10px !important;
}

@media screen and (max-width: 768px) {
  /* zzz-mobile-portal: не растягивать кнопку «Войти» на всю ширину в двухколоночной сетке */
  html body.page-login-iframe.modern-ui .login_form .log_btn_block .button,
  html body.page-login-iframe.modern-ui .login_form .log_btn_block button {
    width: auto !important;
    max-width: 100%;
  }

  html body.page-login-iframe.modern-ui .login_form #slogin-buttons {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.page-login-iframe.modern-ui .login_form #slogin-buttons a,
  html body.page-login-iframe.modern-ui .login_form .slogin-buttons.slogin-default a {
    display: inline-flex !important;
    width: 100% !important;
    margin: 0 !important;
  }

  html body.page-login-iframe.modern-ui .registration_form,
  html body.page-registration-iframe.modern-ui .registration_form,
  html body.page-component-iframe.modern-ui .registration_form {
    max-width: 420px !important;
  }

  html body.page-login-iframe.modern-ui .registration_form > .padding,
  html body.page-registration-iframe.modern-ui .registration_form > .padding,
  html body.page-component-iframe.modern-ui .registration_form > .padding {
    padding: 14px 12px 12px !important;
  }

  html body.page-login-iframe.modern-ui .registration_form #member-registration .controls .btn,
  html body.page-registration-iframe.modern-ui .registration_form #member-registration .controls .btn,
  html body.page-component-iframe.modern-ui .registration_form #member-registration .controls .btn {
    width: 100% !important;
    min-width: 0;
    margin: 0 0 8px !important;
  }

  html body.page-login-iframe.modern-ui .registration_form #member-registration .controls .btn + .btn,
  html body.page-registration-iframe.modern-ui .registration_form #member-registration .controls .btn + .btn,
  html body.page-component-iframe.modern-ui .registration_form #member-registration .controls .btn + .btn {
    margin-left: 0 !important;
  }
}

@media screen and (max-width: 380px) {
  body.page-login-iframe.modern-ui .login_form #mini_login-form fieldset.userdata {
    grid-template-columns: 1fr;
  }

  body.page-login-iframe.modern-ui .login_form .log_btn_block,
  body.page-login-iframe.modern-ui .login_form .remembe_block {
    grid-column: 1 / -1;
    justify-self: stretch;
    text-align: center !important;
  }

  html body.page-login-iframe.modern-ui .login_form .log_btn_block button,
  html body.page-login-iframe.modern-ui .login_form .log_btn_block .button {
    width: 100% !important;
    justify-content: center;
  }

  body.page-login-iframe.modern-ui .login_form #slogin-buttons {
    grid-template-columns: 1fr !important;
  }
}

/* —— Kunena: сбалансированный вид (единый блок, без дублирования) —— */
.modern-ui #kunena.layout {
  --kunena-surface: #fafbfc;
  --kunena-line: #d8e2ee;
  --kunena-header: linear-gradient(180deg, #3d5270 0%, #34485d 100%);
  --kunena-primary: #366897;
  --kunena-primary-hover: #2d5a82;
  --kunena-neutral-bg: #f0f4f9;
  --kunena-neutral-border: #c9d6e8;
  --kunena-neutral-text: #3a4d63;
  --kunena-danger: #5a6270;
  --kunena-danger-hover: #4d5461;
}

.modern-ui #kunena.layout .kfrontend,
.modern-ui #kunena.layout #categoryactions,
.modern-ui #kunena.layout .hidden-xs-down .pagination {
  background: var(--kunena-surface);
  border: 1px solid var(--kunena-line);
  border-radius: var(--ux-radius-md);
  box-shadow: var(--ux-shadow-sm);
}

.modern-ui #kunena.layout .kfrontend {
  padding: 14px;
}

.modern-ui #kunena.layout #topic-actions-toolbar {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 12px 0;
  padding: 12px 14px;
  background: var(--kunena-surface);
  border: 1px solid var(--kunena-line);
  border-radius: var(--ux-radius-md);
  box-shadow: var(--ux-shadow-sm);
}

.modern-ui #kunena.layout #topic-actions-toolbar .btn-group,
.modern-ui #kunena.layout #topic-actions-toolbar .kright_block {
  width: auto !important;
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  vertical-align: unset !important;
}

.modern-ui #kunena.layout #topic-actions-toolbar .btn-group ul,
.modern-ui #kunena.layout #topic-actions-toolbar .kright_block ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.modern-ui #kunena.layout #topic-actions-toolbar .btn-group li,
.modern-ui #kunena.layout #topic-actions-toolbar .kright_block li {
  display: flex;
  margin: 0;
  vertical-align: unset;
}

.modern-ui #kunena.layout .card-header,
.modern-ui #kunena.layout .kunena-topic-item h1 {
  background: var(--kunena-header);
  border-radius: var(--ux-radius-md) var(--ux-radius-md) 0 0;
  color: #fff;
}

.modern-ui #kunena.layout .kunena-topic-item h1 {
  padding: 14px 16px;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.modern-ui #kunena.layout .topic-item-messages .row.message {
  background: #fff;
  border: 1px solid var(--kunena-line);
  border-radius: var(--ux-radius-md);
  padding: 16px 18px;
  margin-bottom: 14px;
  box-shadow: var(--ux-shadow-sm);
}

.modern-ui #kunena.layout .topic_user_col {
  width: 22%;
  min-width: 180px;
  padding-right: 14px;
  box-sizing: border-box;
}

.modern-ui #kunena.layout .topic_user_message {
  width: calc(78% - 8px);
  padding-left: 4px;
  box-sizing: border-box;
}

.modern-ui #kunena.layout .main_message {
  font-size: 16px;
  line-height: 1.62;
  color: var(--ux-text);
}

.modern-ui #kunena.layout .kmessagepadding {
  padding: 12px !important;
}

.modern-ui #kunena.layout .kbutton_block {
  margin-bottom: 0;
}

.modern-ui #kunena.layout .abuse_forum {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed var(--kunena-line);
}

.modern-ui #kunena.layout .edit_button_forum {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 10px 0 0;
  margin-left: 0 !important;
  width: 100%;
  box-sizing: border-box;
}

.modern-ui #kunena.layout .edit_button_forum .btn-group,
.modern-ui #kunena.layout .edit_button_forum .kright_block {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
}

.modern-ui #kunena.layout .edit_button_forum .btn-group ul,
.modern-ui #kunena.layout .edit_button_forum .kright_block ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 0;
}

.modern-ui #kunena.layout .edit_button_forum li {
  display: flex;
  margin: 0;
}

.modern-ui #kunena.layout .kmessage-buttons-row .btn {
  min-height: 34px;
  padding: 7px 12px !important;
  border-radius: 8px;
  font-size: 12px !important;
  font-weight: 600;
}

/* Базовая геометрия всех кнопок Kunena */
.modern-ui #kunena.layout a.kbutton-create,
.modern-ui #kunena.layout a.kbutton-reply,
.modern-ui #kunena.layout a.Kreplyclick,
.modern-ui #kunena.layout a.kbutton-markread,
.modern-ui #kunena.layout a.kbutton-subscribe,
.modern-ui #kunena.layout a.kbutton-delete,
.modern-ui #kunena.layout a.kbutton-moderate,
.modern-ui #kunena.layout a.kbutton-sticky,
.modern-ui #kunena.layout a.kbutton-lock,
.modern-ui #kunena.layout a.kbutton-unsubscribe,
.modern-ui #kunena.layout a.kbutton-unfavorite,
.modern-ui #kunena.layout a.kbutton-quote,
.modern-ui #kunena.layout a.kbutton-edit,
.modern-ui #kunena.layout a.kbutton-favorite,
.modern-ui #kunena.layout button.btn-md,
.modern-ui #kunena.layout button.btn-primary,
.modern-ui #kunena.layout button.btn-danger,
.modern-ui #kunena.layout button.btn-outline-primary,
.modern-ui #kunena.layout input.kreply-submit,
.modern-ui #kunena.layout input.kreply-cancel,
.modern-ui #kunena.layout #kforumsearch input.kbutton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.25;
  text-decoration: none;
  box-sizing: border-box;
  box-shadow: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

/* Primary */
.modern-ui #kunena.layout a.kbutton-create,
.modern-ui #kunena.layout a.kbutton-reply,
.modern-ui #kunena.layout input.kreply-submit,
.modern-ui #kunena.layout button.btn-primary {
  background: var(--kunena-primary);
  border-color: var(--kunena-primary);
  color: #fff;
}

.modern-ui #kunena.layout a.kbutton-create:hover,
.modern-ui #kunena.layout a.kbutton-reply:hover,
.modern-ui #kunena.layout input.kreply-submit:hover,
.modern-ui #kunena.layout button.btn-primary:hover {
  background: var(--kunena-primary-hover);
  border-color: var(--kunena-primary-hover);
  color: #fff;
}

/* Быстрый ответ — тот же вес, но мягче (меньше «кислоты») */
.modern-ui #kunena.layout a.Kreplyclick {
  background: var(--kunena-neutral-bg);
  border-color: var(--kunena-neutral-border);
  color: var(--kunena-primary);
}

.modern-ui #kunena.layout a.Kreplyclick:hover {
  background: #e4ebf4;
  border-color: #b8c8dc;
  color: var(--kunena-primary-hover);
}

/* Neutral / secondary */
.modern-ui #kunena.layout a.kbutton-subscribe,
.modern-ui #kunena.layout a.kbutton-unsubscribe,
.modern-ui #kunena.layout a.kbutton-quote,
.modern-ui #kunena.layout a.kbutton-edit,
.modern-ui #kunena.layout a.kbutton-moderate,
.modern-ui #kunena.layout a.kbutton-sticky,
.modern-ui #kunena.layout a.kbutton-lock,
.modern-ui #kunena.layout a.kbutton-unfavorite,
.modern-ui #kunena.layout a.kbutton-favorite,
.modern-ui #kunena.layout a.kbutton-markread,
.modern-ui #kunena.layout input.kreply-cancel,
.modern-ui #kunena.layout button.btn-md,
.modern-ui #kunena.layout button.btn-outline-primary,
.modern-ui #kunena.layout #kforumsearch input.kbutton {
  background: var(--kunena-neutral-bg);
  border-color: var(--kunena-neutral-border);
  color: var(--kunena-neutral-text);
}

.modern-ui #kunena.layout a.kbutton-subscribe:hover,
.modern-ui #kunena.layout a.kbutton-unsubscribe:hover,
.modern-ui #kunena.layout a.kbutton-quote:hover,
.modern-ui #kunena.layout a.kbutton-edit:hover,
.modern-ui #kunena.layout a.kbutton-moderate:hover,
.modern-ui #kunena.layout a.kbutton-sticky:hover,
.modern-ui #kunena.layout a.kbutton-lock:hover,
.modern-ui #kunena.layout a.kbutton-unfavorite:hover,
.modern-ui #kunena.layout a.kbutton-favorite:hover,
.modern-ui #kunena.layout a.kbutton-markread:hover,
.modern-ui #kunena.layout input.kreply-cancel:hover,
.modern-ui #kunena.layout button.btn-md:hover,
.modern-ui #kunena.layout button.btn-outline-primary:hover,
.modern-ui #kunena.layout #kforumsearch input.kbutton:hover {
  background: #e4ebf4;
  border-color: #b8c8dc;
  color: #2f3f54;
}

/* Destructive */
.modern-ui #kunena.layout a.kbutton-delete,
.modern-ui #kunena.layout button.btn-danger {
  background: var(--kunena-danger);
  border-color: var(--kunena-danger);
  color: #fff;
}

.modern-ui #kunena.layout a.kbutton-delete:hover,
.modern-ui #kunena.layout button.btn-danger:hover {
  background: var(--kunena-danger-hover);
  border-color: var(--kunena-danger-hover);
  color: #fff;
}

@media (max-width: 900px) {
  .modern-ui #kunena.layout .topic_user_col,
  .modern-ui #kunena.layout .topic_user_message {
    width: 100%;
    min-width: 0;
    display: block;
    padding-left: 0;
    padding-right: 0;
  }

  .modern-ui #kunena.layout .topic_user_col {
    margin-bottom: 12px;
    text-align: left;
  }

  .modern-ui #kunena.layout .main_ava_forum {
    margin: 0 0 8px;
    text-align: left;
  }

  .modern-ui #kunena.layout .main_ava_forum .ava_forum_user {
    margin: 0;
  }

  .modern-ui #kunena.layout #topic-actions-toolbar,
  .modern-ui #kunena.layout #topic-actions-toolbar .btn-group,
  .modern-ui #kunena.layout #topic-actions-toolbar .kright_block {
    gap: 6px;
  }

  .modern-ui #kunena.layout a.kbutton-create,
  .modern-ui #kunena.layout a.kbutton-reply,
  .modern-ui #kunena.layout a.Kreplyclick,
  .modern-ui #kunena.layout a.kbutton-markread,
  .modern-ui #kunena.layout a.kbutton-subscribe,
  .modern-ui #kunena.layout a.kbutton-delete,
  .modern-ui #kunena.layout a.kbutton-moderate,
  .modern-ui #kunena.layout a.kbutton-sticky,
  .modern-ui #kunena.layout a.kbutton-lock,
  .modern-ui #kunena.layout a.kbutton-unsubscribe,
  .modern-ui #kunena.layout a.kbutton-unfavorite,
  .modern-ui #kunena.layout a.kbutton-quote,
  .modern-ui #kunena.layout a.kbutton-edit,
  .modern-ui #kunena.layout a.kbutton-favorite,
  .modern-ui #kunena.layout button.btn-md,
  .modern-ui #kunena.layout button.btn-primary,
  .modern-ui #kunena.layout button.btn-danger,
  .modern-ui #kunena.layout button.btn-outline-primary,
  .modern-ui #kunena.layout input.kreply-submit,
  .modern-ui #kunena.layout input.kreply-cancel,
  .modern-ui #kunena.layout #kforumsearch input.kbutton {
    min-height: 38px;
    padding: 8px 12px;
  }
}