/* SPDX-License-Identifier: MIT */
html {
  font-family: var(
    --theme-font-sans,
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Helvetica,
    Arial,
    sans-serif
  );
}
body,
.content {
  font-family: var(
    --theme-font-sans,
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Helvetica,
    Arial,
    sans-serif
  );
}
.title,
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 {
  font-family: var(
    --theme-font-serif,
    var(--theme-font-sans, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif)
  );
}
code,
kbd,
pre,
samp {
  font-family: var(
    --theme-font-mono,
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Consolas,
    'Liberation Mono',
    'Courier New',
    monospace
  );
}
html,
body {
  color: var(--theme-text, inherit);
}
.content p {
  color: var(--theme-text, inherit);
}
.title.is-1,
h1 {
  color: var(--theme-h1, var(--theme-text, inherit));
}
.title.is-2,
h2 {
  color: var(--theme-h2, var(--theme-text, inherit));
}
.title.is-3,
h3 {
  color: var(--theme-h3, var(--theme-text, inherit));
}
.title.is-4,
h4 {
  color: var(--theme-h4, var(--theme-text, inherit));
}
.title.is-5,
h5 {
  color: var(--theme-h5, var(--theme-text, inherit));
}
.title.is-6,
h6 {
  color: var(--theme-h6, var(--theme-text, inherit));
}
.content h1 {
  color: var(--theme-h1, var(--theme-text, inherit));
}
.content h2 {
  color: var(--theme-h2, var(--theme-text, inherit));
}
.content h3 {
  color: var(--theme-h3, var(--theme-text, inherit));
}
.content h4 {
  color: var(--theme-h4, var(--theme-text, inherit));
}
.content h5 {
  color: var(--theme-h5, var(--theme-text, inherit));
}
.content h6 {
  color: var(--theme-h6, var(--theme-text, inherit));
}
.label,
label {
  color: var(--theme-label-color, var(--theme-text, inherit));
}
.content a {
  color: var(--theme-link, var(--bulma-link));
}
.content a:hover {
  color: var(--theme-link-hover, var(--theme-link));
}
.content blockquote {
  border-left: 4px solid var(--theme-blockquote-border, currentColor);
  color: var(--theme-blockquote-fg, inherit);
  background: var(--theme-blockquote-bg, transparent);
  font-style: italic;
}
.content hr,
hr {
  height: 0;
  border: 0;
  border-top: 2px solid
    var(
      --theme-hr-color,
      var(--theme-h1, var(--theme-table-border, var(--bulma-border, currentColor)))
    );
  background: none;
}
input[type='checkbox'],
input[type='radio'],
progress,
input[type='range'] {
  accent-color: var(--theme-link, var(--bulma-link));
}
.input:invalid,
.textarea:invalid,
select:invalid,
input:invalid {
  border-color: var(--bulma-danger);
  box-shadow: none;
}
.input:valid,
.textarea:valid,
select:valid,
input:valid {
  border-color: var(--bulma-success);
  box-shadow: none;
}
.input:focus,
.textarea:focus,
select:focus,
input:focus {
  border-color: var(--bulma-link);
  box-shadow: 0 0 0 0.125em color-mix(in srgb, var(--bulma-link), transparent 80%);
  outline: none;
}
.input:-moz-ui-invalid,
input:-moz-ui-invalid,
select:-moz-ui-invalid {
  border-color: var(--bulma-danger);
  box-shadow: none;
}
::placeholder {
  color: var(--theme-text-muted, currentColor);
  opacity: 1;
}
input:-webkit-autofill {
  -webkit-text-fill-color: var(--theme-text, inherit);
  box-shadow: 0 0 0 1000px var(--theme-surface-1, transparent) inset !important;
  filter: none;
}
input[type='file']::file-selector-button {
  background: color-mix(in srgb, var(--theme-link, var(--bulma-link)) 10%, transparent);
  border: 1px solid var(--theme-link, var(--bulma-link));
  color: var(--theme-text, inherit);
  padding: 0.35rem 0.6rem;
  border-radius: 0.4rem;
}
input[type='file']::file-selector-button:hover {
  background: color-mix(in srgb, var(--theme-link, var(--bulma-link)) 18%, transparent);
}
#theme-flavor-select {
  padding-left: 2rem;
}
#theme-flavor-icon {
  display: none;
}
#theme-flavor-select option[data-icon] {
  background-repeat: no-repeat;
  background-size: 1rem 1rem;
  background-position: 0.5rem center;
  padding-left: 1.75rem;
}
#theme-flavor-select:hover {
  border-color: var(--bulma-link);
  box-shadow: 0 0 0 0.125em color-mix(in srgb, var(--bulma-link), transparent 80%);
}
.dropdown.is-theme .theme-flavor-trigger {
  display: grid;
  place-items: center;
  gap: 0;
  padding: 0;
  background: transparent;
  transition:
    background-color 0.14s ease-out,
    box-shadow 0.14s ease-out;
  width: 40px;
  height: 40px;
  line-height: 0;
  box-sizing: border-box;
}
.dropdown.is-theme .theme-flavor-trigger .icon {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  margin: 0 !important;
  line-height: 0;
}
.dropdown.is-theme .theme-flavor-trigger .icon:first-child {
  margin: 0 !important;
}
.dropdown.is-theme .theme-flavor-trigger #theme-flavor-trigger-label {
  display: none;
}
.dropdown.is-theme .theme-flavor-trigger .icon img,
.dropdown.is-theme .theme-flavor-trigger .icon span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: block;
  margin: 0;
}
.dropdown.is-theme .theme-flavor-trigger .icon img {
  object-fit: cover;
  box-shadow: none;
  transform: translateZ(0);
}
.dropdown.is-theme .theme-flavor-trigger .icon span {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
}
#theme-flavor-dd .dropdown-content {
  max-height: 18rem;
  overflow: auto;
  padding: 0.25rem;
  width: auto;
}
.dropdown.is-theme .dropdown-menu {
  padding: 0.25rem;
  min-width: auto;
  opacity: 0;
  transform: translateY(-6px);
  transition:
    opacity 0.14s ease-out,
    transform 0.14s ease-out;
}
.dropdown.is-theme.is-active .dropdown-menu {
  opacity: 1;
  transform: translateY(0);
}
.dropdown.is-theme .dropdown-content {
  background-color: var(--theme-surface-0, inherit);
  border-radius: 1rem;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--theme-text, #000) 10%, transparent);
}
#theme-flavor-dd .dropdown-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 9999px;
  padding: 0.25rem;
  width: 40px;
  height: 40px;
  position: relative;
  background: transparent;
  transition:
    background-color 0.12s ease,
    box-shadow 0.12s ease;
}
#theme-flavor-dd .dropdown-item:hover {
  background-color: color-mix(
    in srgb,
    var(--theme-surface-0, transparent) 92%,
    var(--theme-link, var(--bulma-link)) 8%
  );
  border-color: var(--bulma-link);
  box-shadow: 0 0 0 0.125em color-mix(in srgb, var(--bulma-link), transparent 80%);
}
#theme-flavor-dd .dropdown-item img,
#theme-flavor-dd .dropdown-item span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: block;
}
#theme-flavor-dd .dropdown-item img {
  display: block;
}
#theme-flavor-dd .dropdown-item span {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: bold;
}
#theme-flavor-dd .dropdown-item.is-active img {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-link, var(--bulma-link)) 60%, transparent);
}
#theme-flavor-dd .dropdown-item.is-active {
  background-color: color-mix(
    in srgb,
    var(--theme-link, var(--bulma-link)) 10%,
    var(--theme-surface-0, transparent)
  );
}
.navbar .navbar-item:hover,
.navbar .navbar-link:hover {
  text-decoration: underline;
  text-decoration-color: var(--theme-link, var(--bulma-link));
  text-underline-offset: 4px;
  color: var(--theme-link, var(--bulma-link));
  background-color: var(--theme-surface-1, transparent);
}
.navbar .navbar-brand > .navbar-item:hover {
  text-decoration: none;
}
.navbar .navbar-item.is-active,
.navbar .navbar-link.is-active {
  position: relative;
  color: var(--theme-link, var(--bulma-link));
  background: color-mix(in srgb, var(--theme-link, var(--bulma-link)) 8%, transparent);
  border-bottom: 3px solid var(--theme-link, var(--bulma-link));
  border-radius: 0.5rem 0.5rem 0 0;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--theme-link, var(--bulma-link)) 22%, transparent);
}
.content code {
  color: var(--theme-code-fg, inherit);
  background: var(--theme-code-bg, transparent);
  padding: 0.2em 0.35em;
  border-radius: 0.25rem;
}
.content pre,
pre,
.highlight pre,
pre.highlight {
  color: var(--theme-pre-fg, inherit);
  background: var(--theme-pre-bg, transparent);
  padding: 1rem;
  border-radius: 0.5rem;
  overflow: auto;
  border: 2px solid var(--theme-pre-border, transparent);
}
.content pre code,
pre code,
.highlight pre code,
pre.highlight code {
  color: var(--theme-pre-fg, inherit);
  background: transparent;
}
::selection {
  color: var(--theme-selection-fg, inherit);
  background: var(--theme-selection-bg, transparent);
}
.navbar,
.hero,
.box,
.card,
.dropdown-content,
.modal-card,
.menu,
.message {
  background-color: var(--theme-surface-0, inherit);
  color: var(--theme-text, inherit);
}
.navbar {
  border-bottom: 1px solid var(--theme-table-border, var(--bulma-border, currentColor));
}
.navbar a.navbar-item,
.navbar .navbar-link {
  color: var(--theme-text, inherit);
}
.navbar .navbar-brand > .navbar-item.is-active {
  box-shadow: none;
  background: none;
  color: inherit;
}
.card .card-content,
.modal-card-body,
.panel,
.table-container {
  background-color: var(--theme-surface-1, inherit);
}
.dropdown-content .dropdown-item.is-active,
.table.is-striped tbody tr:nth-child(even) {
  background-color: var(--theme-table-stripe, var(--theme-surface-2, inherit));
}
.box,
.card,
.dropdown-content,
.menu,
.message,
.panel,
.table,
.table td,
.table th,
.modal-card {
  border-color: var(--theme-table-border, var(--bulma-border, currentColor));
}
.table thead th {
  background-color: var(--theme-table-thead-bg, var(--theme-surface-2, inherit));
}
.input:not(.is-success):not(.is-danger),
.textarea:not(.is-success):not(.is-danger),
.select:not(.is-success):not(.is-danger) select,
.button.is-light {
  background-color: var(--theme-surface-1, inherit);
  color: var(--theme-text, inherit);
  border-color: var(--theme-table-border, var(--bulma-border, currentColor));
}
.input:not(.is-success):not(.is-danger):focus,
.textarea:not(.is-success):not(.is-danger):focus,
.select:not(.is-success):not(.is-danger) select:focus {
  border-color: var(--bulma-link);
  box-shadow: 0 0 0 0.125em color-mix(in srgb, var(--bulma-link), transparent 80%);
}

/* Accessibility contrast fixes (Axe) */
[data-flavor='catppuccin-latte'] .navbar-item,
[data-flavor='catppuccin-latte'] .has-text-centered > p,
[data-flavor='catppuccin-latte'] a.navbar-item,
[data-flavor='catppuccin-latte'] .title,
[data-flavor='catppuccin-latte'] h1,
[data-flavor='catppuccin-latte'] h2,
[data-flavor='catppuccin-latte'] h3,
[data-flavor='catppuccin-latte'] h4 {
  color: #1e293b; /* strong slate for >=4.5:1 on light bg */
}

[data-flavor='catppuccin-latte'] .button.is-text,
[data-flavor='catppuccin-latte'] .button.is-ghost,
[data-flavor='catppuccin-latte'] .navbar-item.is-active {
  color: #0b66d6; /* deeper blue for >=4.5:1 on light bg */
}

[data-flavor='github-dark'] strong,
[data-flavor='github-dark'] th,
[data-flavor='github-dark'] .has-text-centered > p {
  color: #c9d1d9; /* github-dark foreground */
}

[data-flavor='github-dark'] .button.is-text,
[data-flavor='github-dark'] .button.is-ghost {
  color: #58a6ff; /* accessible link blue on dark bg */
}