/*
 * Roblox fullstory layout
 * Loaded only on DLE showfull pages, after style.min.css.
 * All selectors are scoped to .rbx-article to avoid affecting the rest of the theme.
 */
/* The global theme caps .full_content_width at 800px.
   Remove that cap only for this article so it fills the available main column. */
.rbx-article.full_content_width {
  width: 100%;
  max-width: none;
}

.rbx-article {
  --rbx-text: var(--a-color-text, var(--bs-body-color, #212529));
  --rbx-muted: var(--a-color-muted, #6c757d);
  --rbx-border: var(--a-color-border, var(--bs-border, #e5e7eb));
  --rbx-card: var(--a-card-color, var(--bs-card-color, #fff));
  --rbx-soft: var(--a-color-sidebar, #f5f6f7);
  --rbx-soft-button: var(--a-color-btn-light, #f9fafb);
  --rbx-accent: var(--a-color-main, #198aff);
  color: var(--rbx-text);
  width: 100%;
}

.rbx-article .rbx-story-shell {
  display: block;
  padding: 18px 22px 22px !important;
  background: var(--rbx-card);
  color: var(--rbx-text);
  border: 1px solid var(--rbx-border);
  border-radius: 18px;
  box-shadow: 0 8px 28px rgb(0 0 0 / 4%);
}

/* Publication header */
.rbx-article .rbx-post-header { margin: 0 0 20px; }
.rbx-article .rbx-post-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 28px;
  color: var(--rbx-muted);
  font-size: 13px;
  line-height: 1.4;
}
.rbx-article .rbx-post-meta__main,
.rbx-article .rbx-post-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  min-width: 0;
}
.rbx-article .rbx-author-avatar {
  display: inline-block;
  width: 24px;
  height: 24px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 50%;
  vertical-align: middle;
}
.rbx-article .rbx-author-name { color: var(--rbx-text); font-weight: 600; }
.rbx-article .rbx-author-name a { color: inherit; }
.rbx-article .rbx-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid var(--rbx-border);
  border-radius: 8px;
  line-height: 1.25;
  white-space: nowrap;
}
.rbx-article .rbx-meta-pill__icon {
  flex: 0 0 auto;
  opacity: .9;
}
.rbx-article .rbx-category {
  border-color: rgb(25 138 255 / 18%);
  background: rgb(25 138 255 / 8%);
  color: var(--rbx-accent);
  font-weight: 650;
}
.rbx-article .rbx-category a {
  color: inherit;
  font-weight: inherit;
  text-decoration: none;
}
.rbx-article .rbx-category a:hover { text-decoration: underline; }
.rbx-article .rbx-date {
  background: var(--rbx-soft);
  color: var(--rbx-muted);
  font-variant-numeric: tabular-nums;
}
.rbx-article .rbx-meta-icon,
.rbx-article .rbx-icon-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--rbx-muted);
}
.rbx-article .rbx-icon-link {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  transition: background-color .15s ease, color .15s ease;
}
.rbx-article .rbx-icon-link:hover {
  color: var(--rbx-accent);
  background: var(--rbx-soft);
}
.rbx-article .rbx-title {
  position: relative;
  max-width: 720px;
  margin: 17px auto 25px;
  padding: 0 0 13px;
  color: var(--rbx-text);
  font-size: clamp(1.55rem, 3vw, 2rem);
  font-weight: 700;
  line-height: 1.28;
  text-align: center;
  overflow-wrap: anywhere;
}
.rbx-article .rbx-title::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 76px;
  height: 4px;
  border-radius: 99px;
  background: var(--rbx-accent);
  content: "";
  transform: translateX(-50%);
}

/* Project information panel */
.rbx-article .rbx-cover { overflow: visible; margin: 0 0 22px; }
.rbx-article .rbx-info-card {
  overflow: hidden;
  border: 1px solid var(--rbx-border);
  border-radius: 14px;
  background: var(--rbx-card);
}
.rbx-article .rbx-info-card__header {
  padding: 12px 16px;
  background: var(--rbx-soft);
  border-bottom: 1px solid var(--rbx-border);
}
.rbx-article .rbx-info-card__title {
  margin: 0;
  color: var(--rbx-text);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
}
.rbx-article .rbx-info-card__content { padding: 9px 16px 12px; }
.rbx-article .rbx-info-item {
  display: grid;
  grid-template-columns: minmax(125px, 150px) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 9px 0;
  border-bottom: 1px solid var(--rbx-border);
  line-height: 1.5;
}
.rbx-article .rbx-info-item:last-child { border-bottom: 0; }
.rbx-article .rbx-info-item__label {
  color: var(--rbx-muted);
  font-size: 14px;
  font-weight: 500;
}
.rbx-article .rbx-info-item__value {
  min-width: 0;
  color: var(--rbx-text);
  font-size: 14px;
  overflow-wrap: anywhere;
}
.rbx-article .rbx-unknown { color: var(--rbx-muted); font-style: italic; }
.rbx-article .rbx-text-link { color: var(--rbx-accent); font-weight: 500; }
.rbx-article .rbx-text-link:hover { text-decoration: underline; }
.rbx-article .rbx-separator { padding: 0 4px; color: var(--rbx-muted); }
.rbx-article .rbx-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  min-height: 28px;
  padding: 3px 10px;
  border: 1px solid var(--rbx-border);
  border-radius: 999px;
  background: rgb(25 138 255 / 9%);
  color: var(--rbx-accent);
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.rbx-article .rbx-status-list { display: flex; flex-wrap: wrap; gap: 6px; }
.rbx-article .rbx-status {
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .035em;
  line-height: 1.3;
}
.rbx-article .rbx-status--undetected { background: rgb(25 135 84 / 12%); color: #198754; }
.rbx-article .rbx-status--outdated { background: rgb(253 126 20 / 13%); color: #c65d05; }
.rbx-article .rbx-status--risk { background: rgb(255 193 7 / 16%); color: #9a6a00; }
.rbx-article .rbx-status--crack { background: rgb(111 66 193 / 13%); color: #7b45b5; }
.rbx-article .rbx-status--detected { background: rgb(220 53 69 / 12%); color: #c53040; }
.rbx-article .rbx-status--source { background: rgb(25 138 255 / 12%); color: #1674cf; }
.rbx-article .rbx-support-links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rbx-article .rbx-support-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  padding: 6px 11px;
  border: 1px solid var(--rbx-border);
  border-radius: 9px;
  background: var(--rbx-soft-button);
  color: var(--rbx-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
.rbx-article .rbx-support-link:hover {
  border-color: var(--rbx-accent);
  background: var(--rbx-soft);
  color: var(--rbx-text);
  transform: translateY(-1px);
}
.rbx-article .rbx-support-link--discord { background: #5865f2; border-color: #5865f2; color: #fff; }
.rbx-article .rbx-support-link--discord:hover { background: #4752c4; border-color: #4752c4; color: #fff; }
.rbx-article .rbx-support-link--telegram { background: #0088cc; border-color: #0088cc; color: #fff; }
.rbx-article .rbx-support-link--telegram:hover { background: #0678b2; border-color: #0678b2; color: #fff; }

/* Main article content: styles are deliberately scoped so site widgets are untouched. */
.rbx-article .rbx-content {
  min-width: 0;
  color: var(--rbx-text);
  font-size: 15px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}
.rbx-article .rbx-content > *:first-child { margin-top: 0; }
.rbx-article .rbx-content p { margin: 0 0 1rem; }
.rbx-article .rbx-content h2,
.rbx-article .rbx-content h3,
.rbx-article .rbx-content h4 {
  color: var(--rbx-text);
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
}
.rbx-article .rbx-content h2 {
  margin: 28px 0 14px;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--rbx-border);
  font-size: 1.35rem;
}
.rbx-article .rbx-content h3 {
  margin: 22px 0 12px;
  padding: 10px 13px;
  border: 1px solid var(--rbx-border);
  border-left: 4px solid var(--rbx-accent);
  border-radius: 9px;
  background: var(--rbx-soft);
  box-shadow: none;
  font-size: 1.1rem;
}
.rbx-article .rbx-content h4 { margin: 18px 0 9px; font-size: 1rem; }
.rbx-article .rbx-content ul,
.rbx-article .rbx-content ol { margin: 0 0 1rem; padding-left: 1.5rem; }
.rbx-article .rbx-content li { margin: .25rem 0; }
.rbx-article .rbx-content a:not(.rbx-support-link) { color: var(--rbx-accent); }
.rbx-article .rbx-content a:not(.rbx-support-link):hover { text-decoration: underline; }
.rbx-article .rbx-content img {
  display: block;
  max-width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
  margin: 16px auto;
  border-radius: 8px;
}
.rbx-article .rbx-content iframe,
.rbx-article .rbx-content video { max-width: 100%; }
.rbx-article .rbx-content table { display: block; width: 100%; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.rbx-article .rbx-content th,
.rbx-article .rbx-content td { padding: 8px 10px; border: 1px solid var(--rbx-border); }
.rbx-article .rbx-content blockquote {
  margin: 16px 0;
  padding: 12px 16px;
  border-left: 4px solid var(--rbx-accent);
  border-radius: 0 8px 8px 0;
  background: var(--rbx-soft);
}
.rbx-article .rbx-content :not(pre) > code {
  padding: 2px 6px;
  border: 1px solid var(--rbx-border);
  border-radius: 5px;
  background: var(--rbx-soft);
  color: var(--rbx-text);
  font-size: .9em;
  overflow-wrap: anywhere;
}
.rbx-article .rbx-edit-note {
  margin: 20px 0;
  padding: 12px 15px;
  border: 1px solid var(--rbx-border);
  border-radius: 10px;
  background: var(--rbx-soft);
}
.rbx-article .rbx-edit-note h4 { margin: 0 0 5px; }
.rbx-article .rbx-edit-note p { margin: 0; }

/* Code box used by the existing Copy -> /copy.html flow. */
.rbx-article .rbx-code-block {
  position: relative;
  overflow: hidden;
  margin: 18px 0;
  border: 1px solid #303846;
  border-radius: 11px;
  background: #1f2632;
  box-shadow: 0 4px 14px rgb(0 0 0 / 8%);
}
.rbx-article .rbx-code-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 7px 11px;
  border-bottom: 1px solid rgb(255 255 255 / 9%);
  background: #252e3b;
}
.rbx-article .rbx-code-dots { display: inline-flex; gap: 6px; }
.rbx-article .rbx-code-dots i { width: 9px; height: 9px; border-radius: 50%; background: #778190; }
.rbx-article .rbx-code-dots i:nth-child(1) { background: #ff6058; }
.rbx-article .rbx-code-dots i:nth-child(2) { background: #ffbd2e; }
.rbx-article .rbx-code-dots i:nth-child(3) { background: #28c840; }
.rbx-article .rbx-copy-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid rgb(255 255 255 / 14%);
  border-radius: 7px;
  background: rgb(255 255 255 / 8%);
  color: #f3f4f6;
  font: 600 12px/1.2 var(--a-font-family, system-ui, sans-serif);
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.rbx-article .rbx-copy-btn:hover { border-color: rgb(255 255 255 / 28%); background: rgb(255 255 255 / 14%); }
.rbx-article .rbx-copy-btn:focus-visible { outline: 2px solid var(--rbx-accent); outline-offset: 2px; }
.rbx-article .rbx-copy-btn svg { width: 15px; height: 15px; }
.rbx-article .rbx-code-scroll { max-width: 100%; max-height: 70vh; overflow: auto; }
.rbx-article .rbx-code-scroll pre {
  margin: 0;
  padding: 15px;
  overflow: visible;
  background: #1f2632;
  color: #e5e7eb;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 13px;
  line-height: 1.65;
  white-space: pre;
  tab-size: 2;
}
.rbx-article .rbx-code-scroll pre code {
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  white-space: inherit;
  overflow-wrap: normal;
  word-break: normal;
}
.rbx-article .rbx-code-scroll::-webkit-scrollbar { width: 9px; height: 9px; }
.rbx-article .rbx-code-scroll::-webkit-scrollbar-thumb { border-radius: 8px; background: #596273; }
.rbx-article .rbx-code-scroll::-webkit-scrollbar-track { background: #252e3b; }
.rbx-article .code-temporal-wrap { position: relative; }
.rbx-article .code-temporal-hidden { display: none !important; }
.rbx-article .code-timer {
  margin: 16px 0;
  padding: 12px 14px;
  border: 1px dashed var(--rbx-border);
  border-radius: 10px;
  color: var(--rbx-muted);
  text-align: center;
  font-size: 14px;
}
.rbx-article .code-timer b,
.rbx-article .code-countdown-chip { font-variant-numeric: tabular-nums; }
.rbx-article .code-countdown-chip {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  border: 1px solid var(--rbx-border);
  border-radius: 999px;
}

/* Existing download block and messages for non-Roblox categories. */
.rbx-article .fdl-btn + .fdl-btn { margin-top: 10px; }
.rbx-article .fdl-btn {
  display: block;
  position: relative;
  overflow: hidden;
  padding: 15px 15px 15px 130px;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: 0 3px 10px rgb(0 0 0 / 10%);
}
.rbx-article .fdl-btn-title { font-weight: 600; text-transform: uppercase; overflow-wrap: anywhere; }
.rbx-article .fdl-btn-size { margin: -2px 0 6px; font-size: 14px; opacity: .9; }
.rbx-article .fdl-btn-caption { font-size: 14px; opacity: .7; }
.rbx-article .fdl-btn-dl { margin-left: 15px; font-size: 12px; text-transform: uppercase; }
.rbx-article .fdl-btn > * { position: relative; z-index: 3; }
.rbx-article .fdl-btn-icon {
  position: absolute;
  top: 50%;
  left: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  margin-top: -25px;
  border-radius: 50%;
  font-size: 24px;
  box-shadow: 0 0 0 15px rgb(0 0 0 / 13%), 0 0 0 30px rgb(0 0 0 / 8%), 0 0 0 45px rgb(0 0 0 / 4%);
}
.rbx-article .rbx-download-message {
  margin: 12px 0;
  padding: 14px 16px;
  border: 1px solid rgb(220 53 69 / 18%);
  border-left: 3px solid #dc3545;
  border-radius: 8px;
  background: rgb(220 53 69 / 7%);
  color: var(--rbx-text);
}

/* Footer, rating and comments */
.rbx-article .rbx-engagement { color: var(--rbx-muted); }
.rbx-article .rbx-comments-card {
  margin: 14px 0 0;
  border: 1px solid var(--rbx-border);
  border-radius: 15px;
  background: var(--rbx-card);
  box-shadow: 0 6px 20px rgb(0 0 0 / 3%);
}
.rbx-article .rbx-comments-title { margin: 0; color: var(--rbx-text); font-size: 18px; font-weight: 700; }
.rbx-article .rbx-comments-card .nav-pills .nav-link {
  border-radius: 8px 8px 0 0;
  color: var(--rbx-muted);
  font-size: 14px;
}
.rbx-article .rbx-comments-card .nav-pills .nav-link.active {
  background: transparent;
  color: var(--rbx-accent);
  font-weight: 600;
  border-bottom: 2px solid var(--rbx-accent);
}
.rbx-article .rbx-comments { color: var(--rbx-text); }
.rbx-article .fullstory_tags a { border-color: var(--rbx-border); }

@media (max-width: 640px) {
  .rbx-article .rbx-story-shell { padding: 14px 12px 18px !important; border-radius: 13px; }
  .rbx-article .rbx-post-meta { align-items: flex-start; }
  .rbx-article .rbx-post-meta__main { gap: 7px; }
  .rbx-article .rbx-meta-pill { min-height: 28px; padding: 4px 8px; font-size: 12px; white-space: normal; }
  .rbx-article .rbx-post-actions { gap: 4px; }
  .rbx-article .rbx-title { margin: 15px auto 20px; font-size: clamp(1.35rem, 6vw, 1.7rem); }
  .rbx-article .rbx-info-card { border-radius: 11px; }
  .rbx-article .rbx-info-item { grid-template-columns: 1fr; gap: 3px; padding: 8px 0; }
  .rbx-article .rbx-info-item__label { font-size: 12px; }
  .rbx-article .rbx-info-item__value { font-size: 14px; }
  .rbx-article .rbx-info-card__content { padding: 8px 13px 10px; }
  .rbx-article .rbx-support-links { gap: 6px; }
  .rbx-article .rbx-support-link { min-height: 32px; padding: 5px 9px; font-size: 12px; }
  .rbx-article .rbx-content { font-size: 14px; }
  .rbx-article .rbx-code-scroll pre { padding: 12px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .rbx-article .rbx-icon-link,
  .rbx-article .rbx-support-link,
  .rbx-article .rbx-copy-btn { transition: none; }
}

/* v3.1 hard overrides: deliberately loaded after the theme and the previous v2 file. */
article.rbx-article.full_content_width {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

article.rbx-article .rbx-story-shell {
  padding-left: 12px !important;
  padding-right: 12px !important;
}

article.rbx-article .rbx-info-card {
  display: block;
  width: 100%;
  max-width: none;
}

article.rbx-article .rbx-meta-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 30px !important;
  padding: 5px 10px !important;
  border: 1px solid var(--rbx-border) !important;
  border-radius: 8px !important;
  line-height: 1.25 !important;
  white-space: nowrap;
}

article.rbx-article .rbx-category {
  border-color: rgb(25 138 255 / 20%) !important;
  background: rgb(25 138 255 / 9%) !important;
  color: var(--rbx-accent) !important;
  font-weight: 650 !important;
}

article.rbx-article .rbx-category a {
  color: inherit !important;
  text-decoration: none !important;
}

article.rbx-article .rbx-date {
  background: var(--rbx-soft) !important;
  color: var(--rbx-muted) !important;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
  article.rbx-article .rbx-story-shell {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  article.rbx-article .rbx-meta-pill {
    white-space: normal;
  }
}
