/*
 * Minimal Lexxy extensions for app-specific consistency.
 * Keep this small and prefer the gem defaults unless something is visibly missing.
 */

:where(.post-content) {
  font-family: var(--font-reading, "Source Serif 4", Georgia, serif);
  font-size: 1.125rem;
  line-height: 1.75;
}

:where(.reading-copy) :where(.post-content) {
  font-size: inherit;
  line-height: inherit;
}

:where(.post-content) :where(h1, h2, h3, h4) {
  font-family: var(--font-title, "Satoshi", ui-sans-serif, system-ui, sans-serif);
}

:where(lexxy-editor) :where(.lexxy-editor__content) {
  font-family: var(--font-reading, "Source Serif 4", Georgia, serif);
  font-size: 1.125rem;
  line-height: 1.75;
}

:where(lexxy-editor) :where(.lexxy-editor__content) :where(h1, h2, h3, h4) {
  font-family: var(--font-title, "Satoshi", ui-sans-serif, system-ui, sans-serif);
}

:where(.lexxy-content) :where(.lexxy-content__table-wrapper) {
  margin: 0;
  margin-block: 1ch;
  overflow-x: auto;
}

:where(.lexxy-content) table,
:where(lexxy-editor) table {
  border-collapse: collapse;
  border-spacing: 0;
  inline-size: calc(100% - 0.5ch);
  margin: 0.25ch;
}

:where(.lexxy-content) th,
:where(.lexxy-content) td,
:where(lexxy-editor) th,
:where(lexxy-editor) td {
  border: 1px solid var(--lexxy-color-table-cell-border, var(--lexxy-color-ink-lighter));
  min-width: 5ch;
  max-width: 50ch;
  padding: 1ch;
  text-align: start;
  word-break: normal;
}

:where(.lexxy-content) th.lexxy-content__table-cell--header,
:where(.lexxy-content) td.lexxy-content__table-cell--header,
:where(lexxy-editor) th.lexxy-content__table-cell--header,
:where(lexxy-editor) td.lexxy-content__table-cell--header {
  background-color: var(--lexxy-color-table-header-bg, var(--lexxy-color-ink-lightest));
  font-weight: bold;
}

.lexxy-selection-toolbar {
  align-items: center;
  background: var(--lexxy-color-canvas, white);
  border: 1px solid var(--lexxy-color-ink-lighter, rgb(0 0 0 / 15%));
  border-radius: 8px;
  box-shadow: 0 16px 40px rgb(0 0 0 / 20%);
  color: var(--lexxy-color-ink, #222);
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  left: 0;
  max-inline-size: min(92vw, 36rem);
  padding: 4px;
  position: fixed;
  top: 0;
  z-index: calc(var(--lexxy-z-popup, 1000) + 10);
}

.lexxy-selection-toolbar[hidden] {
  display: none;
}

.lexxy-selection-toolbar__group {
  align-items: center;
  display: inline-flex;
  gap: 2px;
}

.lexxy-selection-toolbar__group+.lexxy-selection-toolbar__group {
  border-inline-start: 1px solid var(--lexxy-color-ink-lighter, rgb(0 0 0 / 15%));
  padding-inline-start: 4px;
}

.lexxy-selection-toolbar button {
  align-items: center;
  aspect-ratio: 1 / 1;
  background: transparent;
  border: 0;
  border-radius: 6px;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 700;
  inline-size: 2rem;
  justify-content: center;
  line-height: 1;
  padding: 0;
}

.lexxy-selection-toolbar summary {
  align-items: center;
  block-size: 2rem;
  border-radius: 6px;
  cursor: pointer;
  display: inline-flex;
  font-weight: 700;
  inline-size: 2rem;
  justify-content: center;
  list-style: none;
  user-select: none;
}

.lexxy-selection-toolbar summary::-webkit-details-marker {
  display: none;
}

.lexxy-selection-toolbar svg {
  -webkit-touch-callout: none;
  block-size: 1.125rem;
  fill: currentColor;
  inline-size: 1.125rem;
  pointer-events: none;
  user-select: none;
}

.lexxy-selection-toolbar button:hover,
.lexxy-selection-toolbar button:focus-visible,
.lexxy-selection-toolbar button[aria-pressed="true"],
.lexxy-selection-toolbar summary:hover,
.lexxy-selection-toolbar summary:focus-visible,
.lexxy-selection-toolbar details[open]>summary {
  background: var(--lexxy-color-selected, rgb(0 0 0 / 8%));
}

.lexxy-selection-toolbar button:focus-visible,
.lexxy-selection-toolbar summary:focus-visible {
  outline: 2px solid var(--lexxy-focus-ring-color, #2563eb);
  outline-offset: 2px;
}

.lexxy-selection-toolbar [data-command="italic"] span {
  font-style: italic;
}

.lexxy-selection-toolbar [data-command="strikethrough"] span {
  text-decoration: line-through;
}

.lexxy-selection-toolbar [data-command="clearFormatting"] span {
  text-decoration: underline;
  text-decoration-thickness: 2px;
}

.lexxy-selection-toolbar__lexxy-toolbar {
  --lexxy-toolbar-button-size: 2rem;
  --lexxy-toolbar-gap: 3px;
  --lexxy-toolbar-spacing: 4px;

  background: transparent;
  border: 0;
  color: inherit;
  display: flex;
  gap: 0;
  max-inline-size: none;
  padding: 0;
}

.lexxy-selection-toolbar__lexxy-toolbar .lexxy-editor__toolbar-dropdown--chevron summary {
  gap: 0.3rem;
  grid-template-columns: auto auto;
  inline-size: 2.75rem;
  justify-content: center;
  padding-inline: 0.25rem;
}

.lexxy-selection-toolbar__lexxy-toolbar .lexxy-editor__toolbar-dropdown-content {
  inset-block-start: calc(100% + 6px);
}

.lexxy-selection-toolbar__lexxy-toolbar lexxy-highlight-dropdown {
  max-inline-size: min(var(--max-inline-size), 90vw);
}

.lexxy-selection-toolbar__lexxy-toolbar lexxy-highlight-dropdown .lexxy-highlight-colors {
  grid-template-columns: repeat(9, minmax(var(--lexxy-toolbar-button-size), 1fr));
}

.lexxy-selection-toolbar__lexxy-toolbar .lexxy-editor__toolbar-overflow {
  display: none !important;
}
