/* ============================
   COLORS (Child Theme Override)
   ============================ */

/* Define your palette */
:root {
  /* Base colors */
  --color-bg: #ffffff;        /* Page background */
  --color-surface: #ffffff;  /* Cards, containers, footer */
  --color-section-bg: #f4f8fb; /* Section background (light blue/gray) */
  --color-section-border: #e5e5e5; /* Border for light sections */
  --color-text: #222222;      /* Main body text */
  --color-muted: #666666;     /* Secondary text/meta */

  /* Brand colors */
  --color-primary: #00426a;   /* Headings, highlights, links */
  --color-primary-hover: #006bb3;
  --color-accent: #e9c049;   /* Buttons, callouts */
  --color-accent-light: #fef3e0; /* Light accent background */
  --color-accent-dark: #d4a832; /* Dark accent for hover states */
  --color-link: #0099cc;      /* Inline links */
}

/* Base body */
body {
  background-color: var(--color-bg);
  color: var(--color-text);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  color: var(--color-primary);
}

/* Muted text */
small,
.meta,
.wp-block-latest-comments__comment-date,
.wp-block-latest-posts__post-date {
  color: var(--color-muted);
}

/* Links */
a {
  color: var(--color-link);
  text-decoration: none;
}
a:hover,
a:focus {
  color: var(--color-primary-hover);
  text-decoration: underline;
}

/* Buttons */
/* Global button styling has been removed. Individual button styles are handled in component-specific CSS files. */

/* Cards / surfaces */
.card,
.container,
.widget,
.site-footer {
  background-color: var(--color-surface);
}