/* =========================================================
   nawasena-rich-text.css
   Bagian 1  : tampilan editor di halaman admin
   Bagian 2  : tampilan HASIL di halaman depan  (.rich-text)
   Bagian 3  : perbaikan kartu sponsor supaya teks tidak menumpuk
   ========================================================= */

:root {
  --nsc-gold: #d8b364;
  --nsc-ink: #0d0d0f;
  --nsc-panel: #16161a;
  --nsc-line: #2c2c33;
  --nsc-text: #e8e6e1;
  --nsc-muted: #9b978e;
}

/* ---------- 1. EDITOR (admin) ---------- */

.nsc-editor {
  border: 1px solid var(--nsc-line);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

.nsc-editor .ql-toolbar.ql-snow {
  border: 0;
  border-bottom: 1px solid var(--nsc-line);
  background: #f6f5f2;
  position: sticky;
  top: 0;
  z-index: 3;
}

.nsc-editor .ql-container.ql-snow { border: 0; }

.nsc-editor .ql-editor {
  font-size: 15px;
  line-height: 1.7;
  color: #1d1d20;
  padding: 20px 22px;
}

.nsc-editor .ql-editor.ql-blank::before {
  color: #9a9a9a;
  font-style: normal;
}

.nsc-editor .ql-snow .ql-stroke { stroke: #3a3a3d; }
.nsc-editor .ql-snow .ql-fill { fill: #3a3a3d; }
.nsc-editor .ql-snow .ql-active .ql-stroke { stroke: #8a6b1f; }
.nsc-editor .ql-snow .ql-active .ql-fill { fill: #8a6b1f; }
.nsc-editor .ql-snow button:focus-visible { outline: 2px solid var(--nsc-gold); }

.nsc-editor__source {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

.nsc-editor__foot {
  padding: 7px 14px;
  font-size: 12px;
  color: var(--nsc-muted);
  background: #f6f5f2;
  border-top: 1px solid var(--nsc-line);
}

/* ---------- 2. HASIL (halaman depan & preview) ---------- */

.rich-text {
  color: var(--nsc-text);
  font-size: 15px;
  line-height: 1.75;
  max-width: 68ch;
  overflow-wrap: anywhere;
}

.rich-text > *:first-child { margin-top: 0; }
.rich-text > *:last-child { margin-bottom: 0; }

.rich-text p { margin: 0 0 1em; }

.rich-text h2,
.rich-text h3,
.rich-text h4 {
  margin: 1.6em 0 .5em;
  line-height: 1.3;
  color: #fff;
  font-weight: 700;
}
.rich-text h2 { font-size: 1.35em; }
.rich-text h3 { font-size: 1.15em; }
.rich-text h4 { font-size: 1em; }

.rich-text ul,
.rich-text ol { margin: 0 0 1em; padding-left: 1.35em; }
.rich-text ul { list-style: disc; }
.rich-text ol { list-style: decimal; }
.rich-text li { margin: .35em 0; padding-left: .2em; }
.rich-text li::marker { color: var(--nsc-gold); }

.rich-text strong, .rich-text b { color: #fff; font-weight: 700; }
.rich-text em, .rich-text i { font-style: italic; }

.rich-text a {
  color: var(--nsc-gold);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.rich-text blockquote {
  margin: 1.2em 0;
  padding: .2em 0 .2em 1em;
  border-left: 3px solid var(--nsc-gold);
  color: var(--nsc-muted);
}

.rich-text img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 1em 0;
}

.rich-text hr { border: 0; border-top: 1px solid var(--nsc-line); margin: 2em 0; }

/* tabel (tombol tabel di toolbar) */
.rich-text table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.2em 0;
  font-size: .95em;
  display: block;
  overflow-x: auto;         /* tabel lebar tidak merusak layout di HP */
}
.rich-text th,
.rich-text td {
  border: 1px solid var(--nsc-line);
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
}
.rich-text th { background: #1c1c21; color: #fff; font-weight: 600; }

/* gambar dengan perataan dari editor */
.rich-text img[style*="float: left"]  { margin: .3em 1.2em 1em 0; }
.rich-text img[style*="float: right"] { margin: .3em 0 1em 1.2em; }
.rich-text figure { margin: 1.2em 0; }
.rich-text figcaption { font-size: .875em; color: var(--nsc-muted); margin-top: .5em; }

/* kelas bawaan Quill */
.rich-text .ql-align-center { text-align: center; }
.rich-text .ql-align-right  { text-align: right; }
.rich-text .ql-align-justify{ text-align: justify; }
.rich-text .ql-indent-1 { margin-left: 2em; }
.rich-text .ql-indent-2 { margin-left: 4em; }
.rich-text .ql-indent-3 { margin-left: 6em; }

.nsc-empty { color: var(--nsc-muted); font-style: italic; }

/* Versi terang, kalau dipakai di area berlatar putih */
.rich-text--light { color: #24242a; }
.rich-text--light h2,
.rich-text--light h3,
.rich-text--light h4,
.rich-text--light strong { color: #0d0d0f; }
.rich-text--light a { color: #8a6b1f; }

/* ---------- 3. KARTU SPONSOR ---------- */

.sponsor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 24px;
  align-items: start;            /* kartu ikut tinggi isinya, tidak dipaksa sama */
}

.sponsor-card {
  display: flex;
  gap: 22px;
  align-items: flex-start;
  padding: 24px;
  border: 1px solid var(--nsc-line);
  border-radius: 14px;
  background: var(--nsc-panel);
  height: auto;                  /* buang height/min-height tetap */
  overflow: visible;             /* teks tidak terpotong */
  position: static;              /* jangan absolute — penyebab tumpukan */
}

.sponsor-card__logo {
  flex: 0 0 150px;
  background: #fff;
  border-radius: 10px;
  padding: 14px;
  display: grid;
  place-items: center;
}
.sponsor-card__logo img { max-width: 100%; height: auto; display: block; }

.sponsor-card__body { flex: 1 1 auto; min-width: 0; }

.sponsor-card__label {
  color: var(--nsc-gold);
  font-size: 12px;
  letter-spacing: .08em;
  margin: 0 0 4px;
}

.sponsor-card__name { margin: 0 0 10px; font-size: 18px; color: #fff; }

/* Potong deskripsi panjang; buka lewat tombol "Selengkapnya" */
.rich-text.is-clamped {
  display: -webkit-box;
  -webkit-line-clamp: 8;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sponsor-more {
  margin-top: 10px;
  background: none;
  border: 0;
  padding: 0;
  color: var(--nsc-gold);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  text-decoration: underline;
}

@media (max-width: 640px) {
  .sponsor-card { flex-direction: column; }
  .sponsor-card__logo { flex: 0 0 auto; width: 130px; }
}

/* override khusus layout sponsor lama */
.sponsor-grid,
.sponsor-page-card .sponsor-grid {
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  align-items: start;
}
.sponsor-card,
.sponsor-page-card .sponsor-card {
  align-items: flex-start;
  min-height: 0;
}
.sponsor-copy p {
  margin: 0 0 0.85em;
  line-height: 1.7;
}
.sponsor-copy p:last-child { margin-bottom: 0; }
.sponsor-copy ul,
.sponsor-copy ol {
  margin: 0 0 0.85em;
  padding-left: 1.25em;
  color: rgba(255,255,255,0.68);
  font-size: 0.92rem;
  line-height: 1.7;
}
.sponsor-copy li { margin: 0.3em 0; }
.sponsor-copy li::marker { color: var(--accent); }
.sponsor-copy strong { color: #fff; }

/* deskripsi sponsor dengan pembungkus rich-edit-content */
.sponsor-copy .rich-edit-content p {
  margin: 0 0 0.85em;
  color: rgba(255,255,255,0.68);
  font-size: 0.92rem;
  line-height: 1.7;
}
.sponsor-copy .rich-edit-content p:last-child { margin-bottom: 0; }
.sponsor-copy .rich-edit-content {
  color: rgba(255,255,255,0.68);
  font-size: 0.92rem;
  line-height: 1.7;
}
