/* MeczRealu: posty i komentarze 1:1 jak na X (MR-20261010-X-TYPE).
   Ladowany jako OSTATNI arkusz w _head.tpl, wiec nadpisuje starsze warstwy.
   Wartosci z X.com (widok ciemny i jasny):
   - jedna czcionka dla nicka, @nicka, czasu i tresci (X: Chirp; my: Inter -
     najblizszy dostepny zamiennik, juz pobierany w _head.tpl);
   - nick 15/20 pogrubiony, @nick i czas 15/20 szary, tresc 15/20,
     tresc glownego wpisu 17/24;
   - avatar odpowiedzi 40 px, odstep avatar -> tekst 8 px;
   - ikony 18.75 px (glowny wpis 22.5 px), licznik 13 px;
   - kolejnosc ikon: serce (po lewej - decyzja wlasciciela), odpowiedz, podaj dalej,
     wyswietlenia | zakladka, udostepnij. */

html body {
  --mrx-font: "MR Twemoji", Chirp, TwitterChirp, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mrx-text: #e7e9ea;
  --mrx-dim: #71767b;
  --mrx-line: #2f3336;
}
html[data-mr-theme="light"] body {
  --mrx-text: #0f1419;
  --mrx-dim: #536471;
  --mrx-line: #eff3f4;
}

/* ---------------------------------------------------------------- czcionka */
html body .post .post-meta,
html body .post .post-author,
html body .post .js_post-link,
html body .post .post-text,
html body .post .mr-x-post-meta,
html body .comment .comment-author,
html body .comment .comment-author a,
html body .comment .comment-text,
html body .comment .comment-actions,
html body .post .post-actions {
  font-family: var(--mrx-font) !important;
  letter-spacing: normal;
}

/* ------------------------------------------------------------ nick i czas */
html body .post .post-meta .post-author,
html body .comment .comment-author a.fw-semibold {
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 700 !important;
  color: var(--mrx-text) !important;
}
html body .post .post-meta .text-muted.small,
html body .post .post-meta .mr-fx-time,
html body .post .post-meta .js_moment,
html body .comment .comment-author .mr-thread-handle,
html body .comment .comment-author small.js_moment {
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 400 !important;
  color: var(--mrx-dim) !important;
}

/* ------------------------------------------------------------------ tresc */
html body .post .post-text,
html body .comment .comment-text {
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 400 !important;
  color: var(--mrx-text) !important;
}
/* glowny wpis (strona /posts i okno wpisu); promowane w feedzie tez maja
   standalone-post, ale klase .boosted - to zwykle wpisy feedu */
html body .post.standalone-post:not(.boosted) > .post-body .post-text {
  font-size: 17px !important;
  line-height: 24px !important;
}
html body .post.standalone-post:not(.boosted) > .post-body .mr-x-post-meta,
html body .post.standalone-post:not(.boosted) > .post-body .mr-x-post-meta * {
  font-size: 15px !important;
  line-height: 20px !important;
  color: var(--mrx-dim);
}

/* ----------------------------------------------------- avatar odpowiedzi */
html body .comment .comment-avatar-picture {
  width: 40px !important;
  height: 40px !important;
  margin-left: 0 !important;
}

/* ----------------------------------------------------------- pasek ikon */
html body .post .post-actions .action-btn svg,
html body .comment .comment-actions .action-btn svg {
  width: 18.75px !important;
  height: 18.75px !important;
}
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn svg {
  width: 22.5px !important;
  height: 22.5px !important;
}
html body .post .post-actions .action-btn,
html body .comment .comment-actions .action-btn {
  font-size: 13px !important;
  line-height: 16px !important;
  font-weight: 400 !important;
}
/* napisy "Reakcje" / "Odpowiedz" / "Udostepnij" - na X sa same ikony */
html body .comment .comment-actions .action-btn > span.d-none,
html body .comment .comment-actions .reaction-btn-name {
  display: none !important;
}
/* odstep tresc -> ikony w odpowiedzi jak na X (12 px) */
html body .comment .comment-actions {
  margin-top: 4px !important;
}

/* kolejnosc w glownym wpisie (pasek flex; feed i odpowiedzi maja stale
   kolumny w mr-feed-x.css): serce po lewej (decyzja wlasciciela), odpowiedz,
   podaj dalej, wyswietlenia, reszta, zakladka, udostepnij */
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn { order: 5; }
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn.js_comment { order: 2; }
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn.js_share-toggle { order: 3; }
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn.reactions-wrapper { order: 1; }
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn.js_mr-views { order: 4; }
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn.js_mr-save { order: 6; }
html body .post.standalone-post:not(.boosted) > .post-body .post-actions > .action-btn.js_mr-share { order: 7; }

/* glowny wpis: pasek ikon miedzy liniami (jak na X) */
html body .post.standalone-post:not(.boosted) > .post-body .post-actions {
  border-top: 1px solid var(--mrx-line) !important;
  border-bottom: 1px solid var(--mrx-line) !important;
}

/* zakladka i udostepnij nie sklejaja sie (telefon zeruje marginesy przyciskow) */
html body:not(#mrx0):not(#mrx1):not(#mrx2) .comment .comment-actions > .js_mr-share,
html body:not(#mrx0):not(#mrx1):not(#mrx2) .post .post-actions > .js_mr-share {
  margin-left: 12px !important;
}
