/* Обновление 27.09.2026 — подключается после style.css и поверх него.
   Старый style.css не трогаем: в нём же оформлена админка сайта. */

:root {
  --rf-bg: #0b0d12;
  --rf-card: #121620;
  --rf-card-2: #181d29;
  --rf-line: rgba(255, 255, 255, 0.08);
  --rf-text: #eef1f6;
  --rf-muted: #9aa3b2;
  --rf-accent: #5b9cff;
  --rf-radius: 16px;
  --rf-feed: 720px;
}

body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background: var(--rf-bg);
  color: var(--rf-text);
}

/* ---------- шапка: знак и имя слева, разделы справа ---------- */
.rf-topbar {
  padding: 10px max(16px, calc((100vw - 1100px) / 2));
  gap: 16px;
}
.rf-brand {
  display: inline-flex; align-items: center; gap: 10px;
  font-weight: 700; font-size: 16px; letter-spacing: .01em; white-space: nowrap;
}
.rf-brand img { width: 36px; height: 36px; border-radius: 10px; display: block; }
.rf-topbar nav { gap: 4px; }
.rf-topbar nav a {
  padding: 7px 12px; border-radius: 999px; color: var(--rf-muted); font-size: 14.5px;
  transition: background .15s ease, color .15s ease;
}
.rf-topbar nav a:hover { background: rgba(255, 255, 255, .06); color: var(--rf-text); }
@media (max-width: 420px) {
  .rf-topbar nav a { padding: 7px 9px; font-size: 14px; }
}

/* ---------- лента: одна колонка удобной для чтения ширины ---------- */
main { padding-left: 16px; padding-right: 16px; }
.news-tape,
.home-pagination,
.pagination,
.ad-carousel-v2,
.search-page,
.news-page-top {
  max-width: var(--rf-feed);
  margin-left: auto;
  margin-right: auto;
}
.news-tape { display: grid; gap: 16px; padding: 0; }

.news-tape .rf-card {
  display: flex; flex-direction: column; gap: 0;
  padding: 0; overflow: hidden;
  background: var(--rf-card);
  border: 1px solid var(--rf-line);
  border-radius: var(--rf-radius);
  box-shadow: none;
}
.rf-card .tape-body { padding: 18px 20px 10px; display: block; }
.rf-card .rf-date { font-size: 13px; color: var(--rf-muted); margin: 0 0 6px; }
.rf-card .rf-title { margin: 0 0 8px; font-size: 20px; line-height: 1.3; font-weight: 700; }
.rf-card .rf-title a { color: var(--rf-text); }
.rf-card .rf-title a:hover { color: var(--rf-accent); }
@media (min-width: 700px) { .rf-card .rf-title { font-size: 22px; } }

.rf-text {
  font-size: 15.5px; line-height: 1.6; color: #d5dae3;
  overflow-wrap: anywhere;
}
.rf-text a, .rf-post .content a { color: var(--rf-accent); text-decoration: underline; text-underline-offset: 2px; }
/* Длинный пост свёрнут: видно начало, остальное — по кнопке. */
.rf-text.is-collapsed {
  max-height: 9.6em; overflow: hidden;
  -webkit-mask-image: linear-gradient(#000 60%, transparent);
          mask-image: linear-gradient(#000 60%, transparent);
}
.rf-more {
  margin: 6px 0 4px; padding: 0; border: 0; background: none; cursor: pointer;
  color: var(--rf-accent); font: inherit; font-size: 14.5px; font-weight: 600;
}
.rf-more:hover { text-decoration: underline; }

/* Фото в карточке — во всю ширину, без рамок. */
.rf-card .news-card-carousel { margin: 8px 0 0; border-radius: 0; }
.rf-card .news-carousel-frame { border-radius: 0; background: #07090d; }

/* Ряд действий внизу карточки */
.rf-actions {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  padding: 10px 14px; border-top: 1px solid var(--rf-line);
}
.rf-action {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 12px; border-radius: 999px; border: 0; background: none; cursor: pointer;
  color: var(--rf-muted); font: inherit; font-size: 14px; line-height: 1;
  transition: background .15s ease, color .15s ease;
}
.rf-action:hover { background: rgba(255, 255, 255, .06); color: var(--rf-text); }
.rf-open { margin-left: auto; color: var(--rf-text); }
.news-tape-card .comment-count { display: none; }  /* старый счётчик «💬 0» */

/* Меню «Поделиться», если телефон не умеет делиться сам */
.rf-share-menu {
  position: absolute; z-index: 30; min-width: 200px; padding: 6px;
  background: var(--rf-card-2); border: 1px solid var(--rf-line); border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .45);
}
.rf-share-menu a, .rf-share-menu button {
  display: block; width: 100%; text-align: left; padding: 9px 12px; border-radius: 8px;
  border: 0; background: none; color: var(--rf-text); font: inherit; font-size: 14.5px; cursor: pointer;
}
.rf-share-menu a:hover, .rf-share-menu button:hover { background: rgba(255, 255, 255, .06); }

/* ---------- пагинация ---------- */
.home-pagination, .pagination {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 22px; margin-bottom: 30px;
}
.home-pagination .page-link, .pagination .page-link {
  padding: 10px 16px; border-radius: 999px; border: 1px solid var(--rf-line);
  background: var(--rf-card); font-size: 14.5px;
}
.home-pagination .page-link:hover { border-color: var(--rf-accent); }
.home-pagination .page-link.disabled { opacity: .4; }
.home-pagination .page-current { color: var(--rf-muted); font-size: 14px; }


/* ---------- страница новости ---------- */
.rf-post { max-width: var(--rf-feed); margin: 0 auto; padding-top: 18px; }
.rf-post > .back { display: inline-block; margin-bottom: 14px; color: var(--rf-muted); font-size: 14.5px; }
.rf-post > .back:hover { color: var(--rf-text); }
.rf-post h1 { font-size: 26px; line-height: 1.25; margin: 6px 0 16px; }
@media (min-width: 700px) { .rf-post h1 { font-size: 32px; } }
.rf-post .content { font-size: 17px; line-height: 1.7; color: #dde2ea; margin-top: 16px; overflow-wrap: anywhere; }
.rf-post-actions { border-top: 0; padding: 18px 0 0; margin-left: -12px; }

.rf-more-news { max-width: var(--rf-feed); margin: 30px auto 40px; }
.rf-more-news h2 { font-size: 20px; margin: 0 0 14px; }
.rf-more-grid { display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 640px) { .rf-more-grid { grid-template-columns: repeat(3, 1fr); } }
.rf-mini {
  display: grid; gap: 6px; align-content: start; padding: 10px 10px 14px;
  background: var(--rf-card); border: 1px solid var(--rf-line); border-radius: 14px;
}
.rf-mini:hover { border-color: rgba(91, 156, 255, .5); }
.rf-mini img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 10px; background: #07090d; }
.rf-mini-date { font-size: 12.5px; color: var(--rf-muted); }
.rf-mini strong { font-size: 15px; line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.rf-all { display: inline-block; margin-top: 14px; color: var(--rf-accent); font-weight: 600; }

/* ---------- подвал с каналами ---------- */
.social-footer { border-top: 1px solid var(--rf-line); margin-top: 20px; }

/* ==========================================================================
   Перебиваем старые правила. В style.css почти всё с !important и жёсткими
   ширинами (лента была горизонтальной каруселью), поэтому здесь тоже
   !important, а селекторы на ступень точнее.
   ========================================================================== */

header.rf-topbar { justify-content: space-between !important; }
header.rf-topbar nav a { padding: 7px 12px !important; color: var(--rf-muted) !important; }
header.rf-topbar nav a:hover { color: var(--rf-text) !important; }
@media (max-width: 420px) { header.rf-topbar nav a { padding: 7px 9px !important; } }

main .news-tape {
  display: flex !important; flex-direction: column !important; gap: 16px !important;
  width: 100% !important; max-width: var(--rf-feed) !important;
  margin-left: auto !important; margin-right: auto !important;
  overflow: visible !important; padding: 0 !important;
}
main .ad-carousel-v2 {
  max-width: var(--rf-feed) !important;
  margin: 18px auto 20px !important;
}
/* Баннеры: острые углы (как просил владелец), стрелки почти незаметные —
   проявляются при наведении на баннер, на телефоне еле видны. */
main .ad-carousel-v2 .ad-carousel-viewport-v2 { border-radius: 0 !important; }
main .ad-carousel-v2 .ad-carousel-arrow-v2 {
  width: 34px !important; height: 34px !important;
  border: 0 !important; border-radius: 50% !important;
  background: rgba(0, 0, 0, .28) !important; color: rgba(255, 255, 255, .92) !important;
  font-size: 22px !important; line-height: 1 !important;
  opacity: 0 !important; transition: opacity .2s ease, background .2s ease !important;
}
main .ad-carousel-v2:hover .ad-carousel-arrow-v2 { opacity: .7 !important; }
main .ad-carousel-v2 .ad-carousel-arrow-v2:hover,
main .ad-carousel-v2 .ad-carousel-arrow-v2:focus-visible { opacity: 1 !important; background: rgba(0, 0, 0, .5) !important; }
main .ad-carousel-v2 .ad-carousel-arrow-v2.prev { left: 10px !important; }
main .ad-carousel-v2 .ad-carousel-arrow-v2.next { right: 10px !important; }
@media (hover: none) {
  main .ad-carousel-v2 .ad-carousel-arrow-v2 {
    opacity: .45 !important; width: 28px !important; height: 28px !important; font-size: 18px !important;
  }
}
main .ad-carousel-v2 .ad-carousel-dot-v2 {
  width: 7px !important; height: 7px !important; min-width: 7px !important;
  border: 0 !important; background: rgba(255, 255, 255, .45) !important;
}
main .ad-carousel-v2 .ad-carousel-dot-v2.is-active { background: #fff !important; }

.news-tape .full-feed-post.rf-card {
  position: relative !important;
  width: 100% !important; min-width: 0 !important; max-width: none !important;
  margin: 0 !important; padding: 0 !important;
  border-radius: var(--rf-radius) !important;
  background: var(--rf-card) !important;
  border: 1px solid var(--rf-line) !important;
}
.news-tape .full-feed-post.rf-card .tape-body { padding: 18px 20px 8px !important; }
.news-tape .full-feed-post.rf-card .tape-body h2 {
  margin: 0 0 8px !important; font-size: 20px !important; line-height: 1.3 !important;
}
@media (min-width: 700px) {
  .news-tape .full-feed-post.rf-card .tape-body h2 { font-size: 22px !important; }
}
.news-tape .full-feed-post.rf-card .feed-full-text {
  font-size: 15.5px !important; line-height: 1.6 !important; color: #d5dae3 !important;
}
.news-tape .full-feed-post .comment-count { display: none !important; }
.rf-more[hidden] { display: none !important; }

/* Фото — во всю ширину карточки, картинка целиком (без обрезки). */
.news-tape .full-feed-post.rf-card .news-card-carousel {
  width: 100% !important; height: auto !important; margin: 10px 0 0 !important; border-radius: 0 !important;
}
/* В ленте — миниатюры высотой около 300px (их делает сам сайт, чтобы лента
   грузилась быстро). Рамка под их размер; по нажатию фото открывается целиком. */
.news-tape .full-feed-post.rf-card .news-card-carousel .news-carousel-frame {
  height: 320px !important; aspect-ratio: auto !important;
  border-radius: 0 !important; background: #07090d !important;
}

@media (max-width: 850px) {
  .news-tape .full-feed-post.rf-card .tape-body { padding: 16px 16px 8px !important; }
  .news-tape .full-feed-post.rf-card .tape-body h2 { font-size: 19px !important; }
  .news-tape .full-feed-post.rf-card .news-card-carousel { width: 100% !important; height: auto !important; }
  .news-tape .full-feed-post.rf-card .news-card-carousel .news-carousel-frame { height: 280px !important; }
}

/* Телефон: знак слева и разделы справа в одну строку; заголовок целиком;
   действия карточки в одну строку. */
header.rf-topbar {
  flex-direction: row !important; flex-wrap: nowrap !important;
  align-items: center !important; justify-content: space-between !important;
}
header.rf-topbar nav { flex-wrap: nowrap !important; margin: 0 !important; }
.news-tape .full-feed-post.rf-card .tape-body h2 {
  display: block !important; -webkit-line-clamp: unset !important;
  max-height: none !important; overflow: visible !important;
}
.rf-more { text-align: left !important; width: auto !important; }
@media (max-width: 480px) {
  .rf-actions { padding: 8px 6px !important; gap: 0 !important; flex-wrap: nowrap !important; }
  .rf-action { padding: 7px 8px !important; font-size: 13.5px !important; white-space: nowrap !important; }
}

/* ---------- админка ---------- */
/* Ссылка «Админка» в шапке сайта — только когда вы вошли */
header.rf-topbar nav a.rf-admin-link { color: var(--rf-accent) !important; }

/* Разделы админки — отдельной строкой под шапкой. На телефоне листаются
   пальцем, а не ломают страницу. */
.rf-admin-bar {
  position: sticky; top: 57px; z-index: 9;
  background: #0f131c; border-bottom: 1px solid var(--rf-line);
}
.rf-admin-bar-in {
  display: flex; align-items: center; gap: 2px;
  max-width: 1100px; margin: 0 auto; padding: 6px 16px;
  overflow-x: auto; scrollbar-width: none; white-space: nowrap;
}
.rf-admin-bar-in::-webkit-scrollbar { display: none; }
.rf-admin-bar .rf-admin-bar-in { justify-content: flex-start !important; }
.rf-admin-bar a {
  padding: 7px 12px !important; border-radius: 999px; font-size: 14px; color: var(--rf-muted) !important;
}
.rf-admin-bar a:hover { background: rgba(255, 255, 255, .06); color: var(--rf-text) !important; }
.rf-admin-bar a.is-on { background: rgba(91, 156, 255, .16); color: var(--rf-text) !important; }
.rf-admin-bar a b {
  display: inline-block; min-width: 18px; margin-left: 4px; padding: 0 5px; border-radius: 999px;
  background: #e5484d; color: #fff; font-size: 12px; line-height: 18px; text-align: center;
}
.rf-admin-spacer { flex: 1; min-width: 12px; }

/* Кнопки действий в таблицах — в ряд, переносятся аккуратно */
.admin-wide .quick-actions, .admin-dashboard .quick-actions {
  display: flex !important; flex-wrap: wrap !important; gap: 6px !important; justify-content: flex-end !important;
}
.admin-wide .quick-actions form, .admin-dashboard .quick-actions form { margin: 0 !important; }
.admin-wide td strong, .admin-dashboard td strong { line-height: 1.35; }

/* Панель: публикации во всю ширину (заголовки не ломаются в столбик),
   комментарии ниже. */
.admin-dashboard .dashboard-columns { display: grid !important; grid-template-columns: 1fr !important; gap: 20px !important; }
.admin-wide table td:first-child, .admin-dashboard table td:first-child { width: 60%; }

/* Таблицы админки на телефоне: строка — карточка (заголовок, статус, кнопки
   друг под другом), иначе таблица шире экрана и телефон отдаляет страницу. */
@media (max-width: 700px) {
  .admin-dashboard .dashboard-columns > div { min-width: 0 !important; }
  .admin-wide table, .admin-dashboard table,
  .admin-wide tbody, .admin-dashboard tbody,
  .admin-wide tr, .admin-dashboard tr,
  .admin-wide td, .admin-dashboard td { display: block !important; width: 100% !important; min-width: 0 !important; }
  .admin-wide thead, .admin-dashboard thead { display: none !important; }
  .admin-wide tr, .admin-dashboard tr { padding: 12px 0 !important; border-bottom: 1px solid var(--rf-line) !important; }
  .admin-wide td, .admin-dashboard td { padding: 3px 0 !important; border: 0 !important; }
  .admin-wide .quick-actions, .admin-dashboard .quick-actions { justify-content: flex-start !important; }
  .admin-dashboard .dashboard-section-head { flex-wrap: wrap !important; gap: 8px !important; }
}

/* Заголовок ленты на главной (H1 для поисковиков) — неброский, над постами. */
main h1.rf-feed-h1 {
  max-width: var(--rf-feed); margin: 6px auto 12px !important; padding: 0 2px;
  font-size: 15px !important; line-height: 1.3; font-weight: 600;
  color: var(--rf-muted) !important; letter-spacing: .02em; text-transform: none;
}
