/* Import Inter font */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap");

/* Import Material Icons */
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");

/* Import Material Symbols */
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200");

:root {
  /* Brand colors from themePrimitives.ts */
  --md-primary-fg-color: hsl(208, 86%, 45%); /* brand[500] */
  --md-primary-bg-color: hsl(208, 100%, 97%); /* brand[50] */
  --md-primary-bg-color--light: hsl(208, 94%, 94%); /* brand[100] */

  /* Secondary (Pink) colors */
  --md-accent-fg-color: hsl(340, 90%, 55%); /* secondary[500] */
  --md-accent-fg-color--transparent: hsla(340, 90%, 55%, 0.1);
  --md-accent-bg-color: hsl(340, 100%, 97%); /* secondary[50] */
  --md-accent-bg-color--light: hsl(340, 100%, 94%); /* secondary[100] */

  /* Success color */
  --md-success-fg-color: hsl(164, 75%, 42%); /* success[500] */
  --md-success-bg-color: hsl(164, 95%, 97%); /* success[50] */

  /* Error color */
  --md-error-fg-color: hsl(354, 90%, 55%); /* error[500] */
  --md-error-bg-color: hsl(354, 100%, 98%); /* error[50] */

  /* Warning color */
  --md-warning-fg-color: hsl(45, 90%, 52%); /* warning[500] */
  --md-warning-bg-color: hsl(45, 100%, 98%); /* warning[50] */

  /* Info color */
  --md-info-fg-color: hsl(200, 85%, 50%); /* info[500] */
  --md-info-bg-color: hsl(200, 100%, 97%); /* info[50] */

  /* Neutral colors */
  --md-default-fg-color: hsl(218, 8%, 45%); /* neutral[500] */
  --md-default-fg-color--light: hsl(218, 10%, 65%); /* neutral[400] */
  --md-default-fg-color--lighter: hsl(218, 12%, 80%); /* neutral[300] */
  --md-default-fg-color--lightest: hsl(218, 14%, 90%); /* neutral[200] */
  --md-default-bg-color: hsl(218, 20%, 98%); /* neutral[50] */
  --md-default-bg-color--light: hsl(218, 16%, 95%); /* neutral[100] */
  --md-default-bg-color--lighter: hsl(218, 14%, 90%); /* neutral[200] */
  --md-default-bg-color--lightest: hsl(218, 12%, 80%); /* neutral[300] */

  /* Typography */
  --md-text-font: "Inter", sans-serif;
  --md-code-font: "Inter", sans-serif;
}

.text-primary {
  color: var(--md-primary-fg-color);
}

.text-secondary {
  color: var(--md-accent-fg-color);
}

.text-success {
  color: var(--md-success-fg-color);
}

.text-error {
  color: var(--md-error-fg-color);
}

.text-info {
  color: var(--md-info-fg-color);
}

.text-warning {
  color: var(--md-warning-fg-color);
}

.text-muted {
  color: var(--md-default-fg-color--light);
}
/* Material Icons */
.material-icons {
  font-family: "Material Icons";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

/* Material Symbols */
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

/* Typography styles */
.md-content {
  font-family: var(--md-text-font);
}

.md-content h1 {
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.5px;
}

.md-content h2 {
  font-weight: 600;
  line-height: 1.2;
}

.md-content h3 {
  line-height: 1.2;
}

.md-content h4 {
  font-weight: 600;
  line-height: 1.5;
}

.md-content h5 {
  font-weight: 600;
}

.md-content h6 {
  font-weight: 600;
}

/* Code blocks */
.md-content code {
  font-family: var(--md-code-font);
  font-size: 0.875rem;
}

/* Navigation */
.md-nav__title {
  font-family: var(--md-text-font);
  font-weight: 600;
}

.md-nav__link {
  font-family: var(--md-text-font);
}

/* Search */
.md-search__input {
  font-family: var(--md-text-font);
}

/* Buttons */
.md-button {
  font-family: var(--md-text-font);
  font-weight: 500;
  border-radius: 10px;
}

/* Dark mode adjustments */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: hsl(208, 82%, 55%);
  --md-primary-fg-color--light: hsl(208, 88%, 70%);
  --md-primary-fg-color--dark: hsl(208, 92%, 30%);
  --md-primary-bg-color: hsl(208, 100%, 97%);
  --md-primary-bg-color--light: hsl(208, 94%, 94%);

  --md-default-fg-color: hsl(218, 16%, 95%);
  --md-default-fg-color--light: hsl(218, 14%, 90%);
  --md-default-fg-color--lighter: hsl(218, 12%, 80%);
  --md-default-fg-color--lightest: hsl(218, 10%, 65%);
  --md-default-bg-color: hsl(218, 16%, 12%);
  --md-default-bg-color--light: hsl(218, 14%, 18%);
  --md-default-bg-color--lighter: hsl(218, 12%, 25%);
  --md-default-bg-color--lightest: hsl(218, 10%, 35%);
}

/* Keep header background color consistent */
.md-header {
  background-color: var(--md-primary-fg-color) !important;
}

.md-header__button {
  color: var(--md-primary-bg-color) !important;
}

.md-header__title {
  color: var(--md-primary-bg-color) !important;
}

.md-header__source {
  background-color: var(--md-primary-fg-color--dark) !important;
}

.md-footer-meta {
  display: none;
}