/**
 * Cherry Markdown — Tailwind Preflight Conflict Fixes
 *
 * Tailwind CSS preflight resets many HTML element styles (margins, list-style, heading sizes, etc.)
 * that conflict with Cherry Markdown's previewer rendering. This file restores browser defaults
 * inside .cherry-previewer so themes only need to define their visual style, not undo Tailwind.
 *
 * Include AFTER tailwind CSS and BEFORE theme CSS files.
 */

/* === List reset (Tailwind: list-style: none; margin: 0; padding: 0) === */
.cherry-previewer ul,
.cherry-previewer .cherry-list__square {
  list-style-type: disc;
}
.cherry-previewer ol {
  list-style-type: decimal;
}
.cherry-previewer ul,
.cherry-previewer ol {
  padding-left: 2em;
}

/* === Heading reset (Tailwind: font-size: inherit; font-weight: inherit) === */
.cherry-previewer h1 { font-size: 2em; font-weight: 600; }
.cherry-previewer h2 { font-size: 1.5em; font-weight: 600; }
.cherry-previewer h3 { font-size: 1.25em; font-weight: 600; }
.cherry-previewer h4 { font-size: 1em; font-weight: 600; }
.cherry-previewer h5 { font-size: 0.875em; font-weight: 600; }
.cherry-previewer h6 { font-size: 0.85em; font-weight: 600; }

/* === Margin reset (Tailwind: margin: 0 on blockquote, dd, dl, figure, h1-h6, hr, p, pre) === */
.cherry-previewer h1,
.cherry-previewer h2,
.cherry-previewer h3,
.cherry-previewer h4,
.cherry-previewer h5,
.cherry-previewer h6 {
  margin-top: 24px;
  margin-bottom: 16px;
}
.cherry-previewer p,
.cherry-previewer blockquote,
.cherry-previewer dl,
.cherry-previewer figure,
.cherry-previewer pre {
  margin-top: 0;
  margin-bottom: 16px;
}
.cherry-previewer dd {
  margin-left: 0;
  margin-bottom: 16px;
}

/* === Link reset (Tailwind: color: inherit; text-decoration: inherit) === */
.cherry-previewer a {
  color: #0969da;
  text-decoration: underline;
}

/* === Image reset (Tailwind: display: block; max-width: 100%; height: auto) === */
.cherry-previewer img {
  display: inline;
  max-width: 100%;
  height: auto;
}

/* === HR reset (Tailwind: height: 0; border-top-width: 1px) === */
.cherry-previewer hr {
  height: auto;
  border-top-width: 0;
  border: 0;
}

/* === Table reset (Tailwind: border-collapse: collapse; text-indent: 0) === */
.cherry-previewer table {
  text-indent: 0;
}

/* === Code font reset (Tailwind: font-size: 1em on code, kbd, pre, samp) === */
.cherry-previewer pre,
.cherry-previewer code,
.cherry-previewer kbd,
.cherry-previewer samp {
  font-size: 85%;
}
.cherry-previewer pre code {
  font-size: 100%;
}

/* === Code block line numbers (dimmed, one-dark style) === */
[data-code-block-theme="one-dark"] .cherry-previewer .code-line::before {
  color: #5c6370 !important;
  opacity: 0.7 !important;
  user-select: none !important;
}
[data-code-block-theme="one-dark"] .cherry-previewer .code-line {
  padding-left: 2em !important;
}

/* === Code block hover handler: z-index above ::before title bar === */
.cherry-previewer-codeBlock-hover-handler {
  z-index: 2 !important;
  margin-top: 0 !important;
}

/* === Code block hover buttons (iTerm2 terminal style) === */
.cherry-previewer-codeBlock-hover-handler .cherry-copy-code-block,
.cherry-previewer-codeBlock-hover-handler .cherry-code-block-custom-btn,
.cherry-previewer-codeBlock-hover-handler .cherry-edit-code-block,
.cherry-previewer-codeBlock-hover-handler .cherry-expand-code-block,
.cherry-previewer-codeBlock-hover-handler .cherry-unExpand-code-block {
  background: rgba(58, 63, 75, 0.85) !important;
  color: #abb2bf !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
  cursor: pointer !important;
  box-shadow: none !important;
  top: 6px !important;
  transition: background-color 0.15s ease, color 0.15s ease !important;
}
.cherry-previewer-codeBlock-hover-handler .cherry-copy-code-block:hover,
.cherry-previewer-codeBlock-hover-handler .cherry-code-block-custom-btn:hover,
.cherry-previewer-codeBlock-hover-handler .cherry-edit-code-block:hover,
.cherry-previewer-codeBlock-hover-handler .cherry-expand-code-block:hover,
.cherry-previewer-codeBlock-hover-handler .cherry-unExpand-code-block:hover {
  background: rgba(78, 85, 100, 0.95) !important;
  color: #fff !important;
  border: none !important;
  transform: translateY(0) !important;
}
.cherry-previewer-codeBlock-hover-handler .cherry-copy-code-block:active,
.cherry-previewer-codeBlock-hover-handler .cherry-code-block-custom-btn:active,
.cherry-previewer-codeBlock-hover-handler .cherry-edit-code-block:active,
.cherry-previewer-codeBlock-hover-handler .cherry-expand-code-block:active,
.cherry-previewer-codeBlock-hover-handler .cherry-unExpand-code-block:active {
  background: rgba(92, 99, 112, 0.95) !important;
  color: #fff !important;
  transform: translateY(0) !important;
  box-shadow: none !important;
}

/* === Language selector (iTerm2 terminal style) === */
.cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select {
  appearance: none !important;
  -webkit-appearance: none !important;
  font-size: 12px !important;
  color: #abb2bf !important;
  background-color: rgba(58, 63, 75, 0.85) !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 4px 28px 4px 10px !important;
  cursor: pointer !important;
  outline: none !important;
  box-shadow: none !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23abb2bf' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 10px !important;
  transition: background-color 0.15s ease, color 0.15s ease !important;
}
.cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select:hover {
  background-color: rgba(78, 85, 100, 0.95) !important;
  color: #fff !important;
}
.cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select:focus {
  border: none !important;
  box-shadow: 0 0 0 2px rgba(171, 178, 191, 0.3) !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23abb2bf' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 11 6-6 6 6'/%3e%3c/svg%3e") !important;
}
.cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select option {
  background-color: #21252b !important;
  color: #abb2bf !important;
  font-size: 12px !important;
}

/* === one-dark theme override (higher specificity from cherry-markdown.min.css) === */
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-copy-code-block,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-code-block-custom-btn,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-edit-code-block,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-expand-code-block,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-unExpand-code-block {
  background: rgba(58, 63, 75, 0.85) !important;
  color: #abb2bf !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
  box-shadow: none !important;
  top: 6px !important;
}
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-copy-code-block:hover,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-code-block-custom-btn:hover,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-edit-code-block:hover,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-expand-code-block:hover,
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-unExpand-code-block:hover {
  background: rgba(78, 85, 100, 0.95) !important;
  color: #fff !important;
  border: none !important;
  transform: translateY(0) !important;
}
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select {
  appearance: none !important;
  -webkit-appearance: none !important;
  font-size: 12px !important;
  color: #abb2bf !important;
  background-color: rgba(58, 63, 75, 0.85) !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 4px 28px 4px 10px !important;
  box-shadow: none !important;
  background-image: url("image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23abb2bf' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 10px 10px !important;
}
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select:hover {
  background-color: rgba(78, 85, 100, 0.95) !important;
  color: #fff !important;
}
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select:focus {
  border: none !important;
  box-shadow: 0 0 0 2px rgba(171, 178, 191, 0.3) !important;
}
[data-code-block-theme="one-dark"] .cherry-previewer .cherry-previewer-codeBlock-hover-handler .cherry-code-preview-lang-select option {
  background-color: #21252b !important;
  color: #abb2bf !important;
}