/* ============================================================
   hafermilch — gold & yellow theme
   ============================================================ */

/* ---------- Light mode palette ---------- */
[data-md-color-scheme="default"] {
  --md-primary-fg-color:           #B8860B;  /* dark goldenrod */
  --md-primary-fg-color--light:    #DAA520;  /* goldenrod */
  --md-primary-fg-color--dark:     #8B6914;  /* deep gold */
  --md-primary-bg-color:           #FFFEF5;  /* warm white */
  --md-primary-bg-color--light:    #FFFFF0;  /* ivory */

  --md-accent-fg-color:            #F5C518;  /* bright gold */
  --md-accent-fg-color--transparent: rgba(245, 197, 24, 0.12);

  /* Sidebar & nav tints */
  --md-default-bg-color:           #FFFEF8;
  --md-default-fg-color:           #2C2400;
  --md-default-fg-color--light:    rgba(44, 36, 0, 0.70);
  --md-default-fg-color--lighter:  rgba(44, 36, 0, 0.48);
  --md-default-fg-color--lightest: rgba(44, 36, 0, 0.12);

  /* Code blocks */
  --md-code-bg-color:              #FFF8DC;  /* cornsilk */
  --md-code-fg-color:              #5C4400;

  /* Admonition note → golden */
  --md-admonition-icon--note:      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23B8860B' d='M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E");
}

/* ---------- Dark mode palette ---------- */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:           #F5C518;  /* bright gold */
  --md-primary-fg-color--light:    #FFD700;  /* gold */
  --md-primary-fg-color--dark:     #DAA520;  /* goldenrod */
  --md-primary-bg-color:           #1A1500;
  --md-primary-bg-color--light:    #221C00;

  --md-accent-fg-color:            #FFD700;
  --md-accent-fg-color--transparent: rgba(255, 215, 0, 0.12);

  --md-default-bg-color:           #1C1700;
  --md-default-fg-color:           #FFF8DC;
  --md-default-fg-color--light:    rgba(255, 248, 220, 0.72);
  --md-default-fg-color--lighter:  rgba(255, 248, 220, 0.48);
  --md-default-fg-color--lightest: rgba(255, 248, 220, 0.12);

  --md-code-bg-color:              #251E00;
  --md-code-fg-color:              #FFE88A;
}

/* ---------- Header ---------- */
.md-header {
  background: linear-gradient(135deg, #8B6914 0%, #B8860B 50%, #DAA520 100%);
  box-shadow: 0 2px 12px rgba(184, 134, 11, 0.35);
}

[data-md-color-scheme="slate"] .md-header {
  background: linear-gradient(135deg, #2C2400 0%, #3D3300 50%, #4D4100 100%);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
}

.md-header__title {
  font-weight: 700;
  letter-spacing: -0.02em;
}

/* ---------- Logo glow ---------- */
.md-logo svg,
.md-logo img {
  filter: drop-shadow(0 0 6px rgba(255, 215, 0, 0.6));
  transition: filter 0.2s ease;
}

.md-logo:hover svg,
.md-logo:hover img {
  filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.9));
}

/* ---------- Hero landing block ---------- */
.hafermilch-hero {
  background: linear-gradient(145deg, #FFF8DC 0%, #FFFACD 40%, #FFF3A3 100%);
  border: 1px solid rgba(184, 134, 11, 0.25);
  border-radius: 12px;
  padding: 2.5rem 2rem;
  margin-bottom: 2rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.hafermilch-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(245, 197, 24, 0.18) 0%, transparent 70%);
  pointer-events: none;
}

[data-md-color-scheme="slate"] .hafermilch-hero {
  background: linear-gradient(145deg, #251E00 0%, #2E2500 40%, #362C00 100%);
  border-color: rgba(245, 197, 24, 0.2);
}

.hafermilch-hero h1 {
  font-size: 2.6rem;
  font-weight: 800;
  letter-spacing: -0.04em;
  background: linear-gradient(135deg, #8B6914, #DAA520, #F5C518);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  margin: 0 0 0.5rem;
}

.hafermilch-hero p {
  font-size: 1.1rem;
  color: var(--md-default-fg-color--light);
  margin: 0 0 1.5rem;
  max-width: 520px;
  margin-left: auto;
  margin-right: auto;
}

/* ---------- Persona cards grid ---------- */
.persona-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0;
}

.persona-card {
  background: var(--md-default-bg-color);
  border: 1px solid rgba(184, 134, 11, 0.22);
  border-radius: 10px;
  padding: 1.25rem 1rem;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}

.persona-card:hover {
  border-color: var(--md-accent-fg-color);
  box-shadow: 0 4px 20px rgba(245, 197, 24, 0.2);
  transform: translateY(-2px);
}

.persona-card .persona-icon {
  font-size: 2rem;
  margin-bottom: 0.5rem;
  display: block;
}

.persona-card h3 {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--md-primary-fg-color);
  margin: 0 0 0.25rem;
}

.persona-card p {
  font-size: 0.82rem;
  color: var(--md-default-fg-color--light);
  margin: 0;
  line-height: 1.4;
}

/* ---------- Feature badges ---------- */
.badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 1rem 0;
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 600;
  border: 1px solid rgba(184, 134, 11, 0.35);
  background: rgba(245, 197, 24, 0.1);
  color: var(--md-primary-fg-color);
}

/* ---------- Navigation sidebar accent ---------- */
.md-nav__link--active,
.md-nav__link:focus,
.md-nav__link:hover {
  color: var(--md-primary-fg-color--light);
}

.md-nav__link--active {
  font-weight: 600;
}

/* ---------- Scrollbar (webkit) ---------- */
::-webkit-scrollbar-thumb {
  background: rgba(184, 134, 11, 0.35);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(184, 134, 11, 0.6);
}

/* ---------- Admonitions gold tint ---------- */
.md-typeset .admonition.tip,
.md-typeset details.tip {
  border-color: #DAA520;
}

.md-typeset .tip > .admonition-title,
.md-typeset .tip > summary {
  background-color: rgba(218, 165, 32, 0.12);
}

.md-typeset .tip > .admonition-title::before,
.md-typeset .tip > summary::before {
  background-color: #DAA520;
}

/* ---------- Tables ---------- */
.md-typeset table:not([class]) th {
  background-color: rgba(184, 134, 11, 0.12);
  color: var(--md-primary-fg-color);
  border-bottom: 2px solid rgba(184, 134, 11, 0.35);
}

.md-typeset table:not([class]) tr:hover {
  background-color: rgba(245, 197, 24, 0.06);
}

/* ---------- Inline code ---------- */
.md-typeset code {
  background-color: var(--md-code-bg-color);
  color: var(--md-code-fg-color);
  border-radius: 4px;
  padding: 0.05em 0.3em;
}

/* ---------- Footer ---------- */
.md-footer {
  background: linear-gradient(135deg, #6B5100 0%, #8B6914 100%);
}

[data-md-color-scheme="slate"] .md-footer {
  background: linear-gradient(135deg, #0D0B00 0%, #1A1500 100%);
}

/* ---------- Search highlight ---------- */
.md-search-result mark {
  background-color: rgba(245, 197, 24, 0.4);
  color: inherit;
}

/* ---------- Buttons ---------- */
.md-typeset .md-button {
  border-color: var(--md-primary-fg-color);
  color: var(--md-primary-fg-color);
}

.md-typeset .md-button:hover,
.md-typeset .md-button--primary {
  background-color: var(--md-primary-fg-color);
  border-color: var(--md-primary-fg-color);
  color: #FFF8DC;
}