:root {
    /* Common Brand Colors */
    --iplan-header-blue: #4b688d;
    --iplan-bg-light: #d8e4eb;
    --iplan-dark-navy: #151b26;
}

/* Light Mode Configuration */
[data-md-color-scheme="default"] {
    /* Header */
    --md-primary-fg-color: var(--iplan-header-blue);

    /* Main Background */
    /* --md-default-bg-color: var(--iplan-bg-light); */

    /* Adjusting text color for better contrast on the light blue background */
    --md-default-fg-color: #1a1a1a;

    /* Sidebar/Drawer (keeping it light or matching brand?) 
     Material default usually matches background or white. 
     Let's force white for paper-like feel or match background. */
    --md-default-bg-color--alt: #f5f5f5;
}

/* Card effect for content in Light Mode */
/* [data-md-color-scheme="default"] .md-content {
    background-color: #fff;
    border-radius: 10px;
    margin-bottom: 20px;
} */

/* Dark Mode Configuration */
[data-md-color-scheme="slate"] {
    /* Header - keeping branding or going darker? */
    --md-primary-fg-color: var(--iplan-dark-navy);

    /* Main Background */
    --md-default-bg-color: var(--iplan-dark-navy);

    /* Sidebar */
    --md-default-bg-color--alt: #0d1117;
    /* Slightly darker than main */

    /* Text & Links - High Contrast */
    --md-default-fg-color: #e6e6e6;

    /* Accent/Links - Making them pop */
    --md-accent-fg-color: #64b5f6;
    /* Bright Blue */

    /* Code blocks background */
    --md-code-bg-color: #0d1117;

    --md-typeset-a-color: #e6e6e6
}

/* Logo Adjustment */
.md-header__button.md-logo img {
    height: 1.8rem;
    width: auto;
}

/* Customizing Link Colors in Dark Mode to be readable */
[data-md-color-scheme="slate"] a {
    color: #64b5f6;
}

[data-md-color-scheme="slate"] a:hover {
    color: #90caf9;
}