/* Gaming Portal - Article Content Styles */
/* Applied to .main-content-text in post_detail.html */

.main-content-text {
  line-height: 1.85;
  color: rgba(212, 212, 232, 0.85);
  font-family: 'Inter', sans-serif;
  font-size: 0.97rem;
}

/* ---- Headings ---- */
.main-content-text h1,
.main-content-text h2,
.main-content-text h3,
.main-content-text h4,
.main-content-text h5,
.main-content-text h6 {
  font-family: 'Rajdhani', 'Inter', sans-serif;
  font-weight: 700;
  color: #ffffff;
  margin-top: 2em;
  margin-bottom: 0.6em;
  line-height: 1.25;
}

.main-content-text h1 { font-size: 2rem; }
.main-content-text h2 {
  font-size: 1.5rem;
  padding-bottom: 0.4em;
  border-bottom: 1px solid rgba(0, 240, 255, 0.1);
  color: #e8e8f4;
}
.main-content-text h3 { font-size: 1.2rem; color: #e8e8f4; }
.main-content-text h4 { font-size: 1.05rem; color: rgba(168, 85, 247, 0.9); }
.main-content-text h5 { font-size: 0.95rem; }
.main-content-text h6 { font-size: 0.875rem; }

/* ---- Paragraphs ---- */
.main-content-text p {
  margin-bottom: 1.2em;
  color: rgb(255 255 255 / 79%);
  text-align: justify;
}

.post p{
  text-align: justify;
}

/* ---- Links ---- */
.main-content-text a {
  color: #00f0ff;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 240, 255, 0.2);
  transition: color 0.2s, border-color 0.2s;
}
.main-content-text a:hover {
  color: #fff;
  border-color: rgba(0, 240, 255, 0.5);
}

/* ---- Lists ---- */
.main-content-text ul,
.main-content-text ol {
  padding-left: 1.6rem;
  margin-bottom: 1.2em;
  color: rgb(255 255 255 / 79%);
}
.main-content-text ul { list-style: none; }
.main-content-text ul li {
  position: relative;
  padding-left: 0.5rem;
  margin-bottom: 0.4em;
  text-align: justify;
}
.main-content-text ul li::before {
  content: '';
  position: absolute;
  left: -0.9rem;
  top: 0.65em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #00f0ff;
  box-shadow: 0 0 6px rgba(0, 240, 255, 0.5);
}
.main-content-text ol { list-style: decimal; }
.main-content-text ol li { margin-bottom: 0.4em; }
.main-content-text li::marker { color: rgba(0, 240, 255, 0.6); }

/* ---- Blockquote ---- */
.main-content-text blockquote {
  margin: 1.5em 0;
  padding: 1em 1.4em;
  border-left: 3px solid #00f0ff;
  background: rgba(0, 240, 255, 0.04);
  border-radius: 0 12px 12px 0;
  color: rgba(212, 212, 232, 0.65);
  font-style: italic;
  font-size: 1.02rem;
  box-shadow: inset 3px 0 0 rgba(0, 240, 255, 0.3);
}
.main-content-text blockquote p { margin-bottom: 0; color: inherit; }

/* ---- Code ---- */
.main-content-text code {
  font-family: 'Courier New', Consolas, monospace;
  font-size: 0.875em;
  padding: 0.15em 0.5em;
  border-radius: 6px;
  background: rgba(0, 240, 255, 0.08);
  color: #00f0ff;
  border: 1px solid rgba(0, 240, 255, 0.15);
}
.main-content-text pre {
  background: #0d0d10;
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 12px;
  padding: 1.2em 1.4em;
  overflow-x: auto;
  margin: 1.5em 0;
  box-shadow: inset 0 0 0 1px rgba(0, 240, 255, 0.05);
}
.main-content-text pre code {
  background: none;
  border: none;
  padding: 0;
  color: rgba(212, 212, 232, 0.85);
  font-size: 0.875rem;
}

/* ---- Tables ---- */
.main-content-text table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5em 0;
  font-size: 0.9rem;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.main-content-text th {
  background: rgba(0, 240, 255, 0.07);
  color: #00f0ff;
  font-family: 'Rajdhani', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.8rem;
  padding: 0.75em 1em;
  text-align: left;
  border-bottom: 1px solid rgba(0, 240, 255, 0.15);
}
.main-content-text td {
  padding: 0.65em 1em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  color: rgba(212, 212, 232, 0.7);
}
.main-content-text tr:last-child td { border-bottom: none; }
.main-content-text tr:hover td { background: rgba(255, 255, 255, 0.02); }

/* ---- Images ---- */
.main-content-text img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 1.2em 0;
  border: 1px solid rgba(255, 255, 255, 0.06);
  display: block;
}
.main-content-text figure {
  margin: 1.5em 0;
  text-align: center;
}
.main-content-text figcaption {
  font-size: 0.8rem;
  color: rgba(212, 212, 232, 0.35);
  margin-top: 0.5em;
  font-style: italic;
}

/* ---- HR ---- */
.main-content-text hr {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0, 240, 255, 0.2), transparent);
  margin: 2em 0;
}

/* ---- Text formatting ---- */
.main-content-text strong, .main-content-text b {
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
}
.main-content-text em, .main-content-text i {
  font-style: italic;
  color: rgb(255 255 255 / 79%);
}
.main-content-text mark {
  background: rgba(168, 85, 247, 0.2);
  color: #c084fc;
  padding: 0.1em 0.35em;
  border-radius: 4px;
}
.main-content-text s, .main-content-text del {
  text-decoration: line-through;
  color: rgba(212, 212, 232, 0.35);
}

/* ---- Ad banner zoom ---- */
ntvk-tag.ntvk-frame.banner { zoom: 0.8; }

/* ---- Light mode overrides ---- */
html:not(.dark) .main-content-text {
  color: #2a2a3e;
}
html:not(.dark) .main-content-text h1,
html:not(.dark) .main-content-text h2,
html:not(.dark) .main-content-text h3 {
  color: #1a1a2e;
}
html:not(.dark) .main-content-text p { color: #3a3a5e; }
html:not(.dark) .main-content-text a { color: #0066cc; border-color: rgba(0, 102, 204, 0.2); }
html:not(.dark) .main-content-text code { background: rgba(0, 102, 204, 0.06); color: #0066cc; }
html:not(.dark) .main-content-text blockquote { background: rgba(0, 102, 204, 0.04); }

/* ---- Responsive ---- */
@media (max-width: 768px) {
  .main-content-text h1 { font-size: 1.6rem; }
  .main-content-text h2 { font-size: 1.3rem; }
  .main-content-text h3 { font-size: 1.1rem; }
  .main-content-text table { font-size: 0.8rem; }
  .main-content-text th, .main-content-text td { padding: 0.5em 0.7em; }
}
