/* --------------------------------------------------------------------
   1) Základní reset editoru a všech potomků
   -------------------------------------------------------------------- */

trix-editor,
trix-editor * {
  box-sizing: border-box !important;
}

trix-editor {
  display: block;
  min-height: 8em;
  padding: 12px 14px !important;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  background: #fff !important;

  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  color: #1f2328 !important;

  outline: none;
}

trix-editor:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

/* Placeholder (atribut placeholder="..." na <trix-editor>) */
trix-editor:empty:not(:focus)::before {
  content: attr(placeholder);
  color: #9aa1a9 !important;
  font-style: italic;
  pointer-events: none;
}

/* Reset okrajů pro odstavce a obecné bloky */
trix-editor p,
trix-editor div {
  margin: 0 0 0.75em 0 !important;
  padding: 0 !important;
}

trix-editor > *:last-child {
  margin-bottom: 0 !important;
}


/* --------------------------------------------------------------------
   2) Nadpis (h1) — Trix má jen jednu úroveň nadpisu
   -------------------------------------------------------------------- */

trix-editor h1 {
  margin: 0.9em 0 0.4em 0 !important;
  padding: 0 !important;
  font-size: 1.6em !important;
  /* font-weight: 700 !important; */
  line-height: 1.25 !important;
  color: inherit !important;
  border: none !important;
  background: none !important;
}

trix-editor h1:first-child {
  margin-top: 0 !important;
}


/* --------------------------------------------------------------------
   3) Inline formátování — tučné, kurzíva, přeškrtnuté, odkaz
   -------------------------------------------------------------------- */

trix-editor strong,
trix-editor b {
  font-weight: 700 !important;
  color: inherit !important;
}

trix-editor em,
trix-editor i {
  font-style: italic !important;
  color: inherit !important;
}

trix-editor del {
  text-decoration: line-through !important;
  color: inherit !important;
  opacity: 0.75;
}

trix-editor a {
  color: #2563eb !important;
  text-decoration: underline !important;
  font-weight: inherit !important;
  background: none !important;
}

trix-editor a:hover {
  color: #1d4ed8 !important;
}


/* --------------------------------------------------------------------
   4) Citace (blockquote) — včetně vnořování (zvýšení úrovně odsazení)
   -------------------------------------------------------------------- */

trix-editor blockquote {
  margin: 0.75em 0 !important;
  padding: 0.15em 0 0.15em 1em !important;
  border-left: 3px solid #d0d5dd !important;
  color: #56606a !important;
  font-style: italic;
  background: none !important;
}

trix-editor blockquote blockquote {
  border-left-color: #b7bec7 !important;
  margin: 0.5em 0 !important;
}


/* --------------------------------------------------------------------
   5) Blok kódu (code) — Trix jej vkládá jako <pre>
   -------------------------------------------------------------------- */

trix-editor pre {
  margin: 0.75em 0 !important;
  padding: 0.75em 1em !important;
  background: #f4f5f7 !important;
  color: #1f2328 !important;
  border: 1px solid #e2e5e9;
  border-radius: 4px;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace !important;
  font-size: 0.9em !important;
  line-height: 1.5 !important;
  white-space: pre-wrap !important;
  word-break: break-word;
}

/* Pro jistotu i inline <code>, kdyby se objevilo přes vložený HTML obsah */
trix-editor code {
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace !important;
  background: #f4f5f7 !important;
  padding: 0.1em 0.35em;
  border-radius: 3px;
  font-size: 0.9em !important;
}

trix-editor pre code {
  background: none !important;
  padding: 0 !important;
}


/* --------------------------------------------------------------------
   6) Seznamy — odrážkový a číslovaný, včetně vnořování
   -------------------------------------------------------------------- */

trix-editor ul,
trix-editor ol {
  margin: 0.5em 0 !important;
  padding: 0 !important;
  padding-left: 1.5em !important;
}

trix-editor ul {
  list-style-type: disc !important;
}

trix-editor ol {
  list-style-type: decimal !important;
}

trix-editor ul ul {
  list-style-type: circle !important;
}

trix-editor ul ul ul {
  list-style-type: square !important;
}

trix-editor li {
  margin: 0.15em 0 !important;
  padding: 0 !important;
  color: inherit !important;
}

trix-editor li::marker {
  color: #56606a;
}


/* --------------------------------------------------------------------
   7) Přílohy (obrázky a soubory) — <figure class="attachment">
   -------------------------------------------------------------------- */

trix-editor figure.attachment {
  position: relative;
  margin: 0.75em 0 !important;
  padding: 0 !important;
  max-width: 100%;
  border: none !important;
  background: none !important;
}

/* Obrázková příloha */
trix-editor figure.attachment--preview img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  border: 1px solid #e2e5e9;
}

trix-editor figure.attachment.attachment--selected img,
trix-editor figure.attachment.attachment--selected {
  outline: 2px solid #3b82f6;
  outline-offset: 2px;
  border-radius: 4px;
}

/* Popisek pod obrázkem / u souboru */
trix-editor figcaption.attachment__caption {
  margin-top: 0.35em !important;
  font-size: 0.8em !important;
  color: #6b7280 !important;
  text-align: center;
}

trix-editor .attachment__name {
  font-weight: 500 !important;
  word-break: break-all;
}

trix-editor .attachment__size {
  color: #9aa1a9 !important;
  margin-left: 0.35em;
}

/* Nepřehledávatelná příloha (PDF, DOC, ZIP...) — obecný "souborový" box */
trix-editor figure.attachment--file {
  display: flex;
  align-items: center;
  gap: 0.6em;
  padding: 0.6em 0.8em !important;
  background: #f4f5f7 !important;
  border: 1px solid #e2e5e9 !important;
  border-radius: 6px;
  max-width: 320px;
}

trix-editor figure.attachment--file::before {
  content: "";
  flex: 0 0 auto;
  width: 28px;
  height: 32px;
  background: #d0d5dd;
  border-radius: 3px;
}

trix-editor figure.attachment--file figcaption.attachment__caption {
  margin-top: 0 !important;
  text-align: left;
  flex: 1 1 auto;
  min-width: 0;
}

/* Průběh nahrávání */
trix-editor .attachment__progress {
  position: absolute;
  left: 0.5em;
  right: 0.5em;
  bottom: 0.5em;
  height: 4px;
  border: none;
  border-radius: 2px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.6);
}

trix-editor .attachment__progress::-webkit-progress-bar {
  background: rgba(255, 255, 255, 0.6);
}

trix-editor .attachment__progress::-webkit-progress-value {
  background: #3b82f6;
}




/*
 * Výchozí popisek (název + velikost souboru) je needitovaný stav a
 * Trix jej zobrazuje automaticky, dokud uživatel sám nenapíše vlastní
 * text (pak dostane figcaption třídu "attachment__caption--edited").
 * My chceme, aby popisek byl ve výchozím stavu prázdný — proto ho
 * schováme, dokud není skutečně ručně vyplněný.
 *
 * Jakmile uživatel text napíše, figcaption dostane třídu
 * "attachment__caption--edited" a zobrazí se. Pokud text následně
 * smaže na prázdno, třída "--edited" zase zmizí a popisek se díky
 * tomuto pravidlu opět automaticky schová (místo aby se vrátil
 * název+velikost souboru) — smazání popisku tak funguje přirozeně.
 */
trix-editor figcaption.attachment__caption:not(.attachment__caption--edited) {
  display: none !important;
}
 
/* Nepřehledávatelná příloha (PDF, DOC, ZIP...) — obecný "souborový" box */
trix-editor figure.attachment--file {
  display: flex;
  align-items: center;
  gap: 0.6em;
  padding: 0.6em 0.8em !important;
  background: #f4f5f7 !important;
  border: 1px solid #e2e5e9 !important;
  border-radius: 6px;
  max-width: 320px;
}
 
trix-editor figure.attachment--file::before {
  content: "";
  flex: 0 0 auto;
  width: 28px;
  height: 32px;
  background: #d0d5dd;
  border-radius: 3px;
}
 
trix-editor figure.attachment--file figcaption.attachment__caption {
  margin-top: 0 !important;
  text-align: left;
  flex: 1 1 auto;
  min-width: 0;
}
 
trix-editor .attachment__metadata-container {
  display:none;
}
 
/* Průběh nahrávání */
trix-editor .attachment__progress {
  position: absolute;
  left: 0.5em;
  right: 0.5em;
  bottom: 0.5em;
  height: 4px;
  border: none;
  border-radius: 2px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.6);
}
 
trix-editor .attachment__progress::-webkit-progress-bar {
  background: rgba(255, 255, 255, 0.6);
}
 
trix-editor .attachment__progress::-webkit-progress-value {
  background: #3b82f6;
}


/* Panel nástrojů zobrazený u vybrané přílohy (úprava popisku, odstranění) */
trix-editor .attachment__toolbar {
  position: absolute;
  top: 0.4em;
  right: 0.4em;
  display: flex;
  gap: 0.3em;
}

trix-editor .attachment__toolbar .trix-button {
  background: rgba(0, 0, 0, 0.55) !important;
  border: none !important;
  border-radius: 4px;
}

/* Galerie více obrázků vedle sebe */
trix-editor .attachment-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  margin: 0.75em 0 !important;
}

trix-editor .attachment-gallery figure.attachment {
  flex: 1 1 calc(50% - 0.5em);
  margin: 0 !important;
  min-width: 140px;
}

trix-editor .attachment-gallery.attachment-gallery--grid-4,
trix-editor .attachment-gallery.attachment-gallery--grid-6 {
  flex-basis: calc(33.333% - 0.5em);
}