/* ==========================================================================
   Gaya konten editor (TinyMCE) — SATU sumber untuk dua sisi:
   - Visitor: kontainer `.tinymce-content` di halaman Informasi & Halaman
     (dimuat di layouts/public.blade.php).
   - Panel admin: dimuat ke iframe TinyMCE lewat `content_css` dengan
     `body_class: 'tinymce-content'` (lihat components/operator/rich-editor).

   Semua elemen ditulis eksplisit karena sisi visitor memakai reset Tailwind
   (preflight) sedangkan iframe editor memakai gaya bawaan browser; tanpa
   aturan eksplisit keduanya akan tampil berbeda.
   ========================================================================== */

.tinymce-content {
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 0.95rem;
  line-height: 1.8;
  color: #334155;
  overflow-wrap: break-word;
}

.tinymce-content > :first-child { margin-top: 0; }
.tinymce-content > :last-child { margin-bottom: 0; }

/* ---------- Paragraf & teks inline ---------- */

.tinymce-content p {
  margin: 0 0 1.25rem;
}

.tinymce-content strong,
.tinymce-content b { font-weight: 700; color: #0f172a; }
.tinymce-content em,
.tinymce-content i { font-style: italic; }
.tinymce-content u { text-decoration: underline; text-underline-offset: 3px; }
.tinymce-content s { text-decoration: line-through; }
.tinymce-content sub,
.tinymce-content sup { font-size: 0.75em; line-height: 0; position: relative; vertical-align: baseline; }
.tinymce-content sup { top: -0.5em; }
.tinymce-content sub { bottom: -0.25em; }

.tinymce-content a {
  color: #2563eb;
  text-decoration: underline;
  text-underline-offset: 3px;
  font-weight: 500;
  transition: color 0.2s ease;
}
.tinymce-content a:hover { color: #1d4ed8; }

/* ---------- Judul ---------- */

.tinymce-content h1,
.tinymce-content h2,
.tinymce-content h3,
.tinymce-content h4,
.tinymce-content h5,
.tinymce-content h6 {
  color: #0f172a;
  font-weight: 700;
  line-height: 1.3;
  margin: 2rem 0 1rem;
}

.tinymce-content h1 { font-size: 1.75rem; }
.tinymce-content h2 { font-size: 1.5rem; }
.tinymce-content h3 { font-size: 1.25rem; }
.tinymce-content h4 { font-size: 1.1rem; }
.tinymce-content h5,
.tinymce-content h6 { font-size: 1rem; }

/* ---------- Daftar ---------- */

.tinymce-content ul,
.tinymce-content ol {
  margin: 0.5rem 0 1.25rem;
  padding-left: 1.5rem;
}

.tinymce-content ul { list-style-type: disc; }
.tinymce-content ol { list-style-type: decimal; }
.tinymce-content ul ul { list-style-type: circle; }
.tinymce-content ol ol { list-style-type: lower-alpha; }
.tinymce-content li > ul,
.tinymce-content li > ol { margin: 0.5rem 0 0; }

.tinymce-content li {
  margin: 0 0 0.5rem;
  line-height: 1.7;
}

/* ---------- Kutipan & garis ---------- */

.tinymce-content blockquote {
  border-left: 4px solid #3b82f6;
  background-color: #f8fafc;
  padding: 0.75rem 1.25rem;
  margin: 1.5rem 0;
  border-radius: 0 0.375rem 0.375rem 0;
  font-style: italic;
  color: #475569;
}
.tinymce-content blockquote p { margin-bottom: 0; }

.tinymce-content hr {
  border: 0;
  border-top: 1px solid #e2e8f0;
  margin: 2rem 0;
}

/* ---------- Gambar & media ---------- */

.tinymce-content img {
  max-width: 100%;
  height: auto;
  border-radius: 0.5rem;
  margin: 1.5rem auto;
  display: block;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

/* Gambar rata kiri/kanan dari toolbar TinyMCE (inline float). */
.tinymce-content img[style*="float: left"] { margin: 0.25rem 1.5rem 1rem 0; }
.tinymce-content img[style*="float: right"] { margin: 0.25rem 0 1rem 1.5rem; }

.tinymce-content figure {
  margin: 1.5rem 0;
  text-align: center;
}
.tinymce-content figure img { margin-bottom: 0; }

.tinymce-content figcaption {
  font-size: 0.85rem;
  color: #64748b;
  margin-top: 0.5rem;
  font-style: italic;
}

.tinymce-content iframe,
.tinymce-content video {
  display: block;
  max-width: 100%;
  margin: 1.5rem auto;
  border: 0;
}

/* ---------- Tabel ---------- */

.tinymce-content table {
  width: 100%;
  margin: 1.5rem 0;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.tinymce-content th,
.tinymce-content td {
  border: 1px solid #e2e8f0;
  padding: 0.75rem;
  text-align: left;
  vertical-align: top;
}

.tinymce-content th {
  background-color: #f1f5f9;
  font-weight: 600;
  color: #0f172a;
}

/* ---------- Kode ---------- */

.tinymce-content pre,
.tinymce-content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  background-color: #f1f5f9;
  border-radius: 0.25rem;
}

.tinymce-content code {
  padding: 0.2rem 0.4rem;
  font-size: 0.875em;
  color: #0f172a;
}

.tinymce-content pre {
  padding: 1rem;
  overflow-x: auto;
  margin: 1.5rem 0;
}

.tinymce-content pre code {
  padding: 0;
  background-color: transparent;
}