/* ------------------------------------------------------------------ */
/* Packt Brand Colors                                                 */
/* ------------------------------------------------------------------ */

:root {
    --packt-black: #202020;
    --packt-orange: #f97141;
    --packt-light-blue: #57b7f7;
    --packt-green: #00cd8f;
}

/* ------------------------------------------------------------------ */
/* Light Mode                                                         */
/* ------------------------------------------------------------------ */

[data-md-color-scheme="default"] {
    --md-primary-fg-color: #202020;
    --md-primary-fg-color--light: #3a3a3a;
    --md-primary-fg-color--dark: #101010;
    --md-primary-bg-color: #ffffff;
    --md-primary-bg-color--light: #f5f5f5;

    --md-accent-fg-color: #f97141;
    --md-accent-fg-color--transparent: rgba(249, 113, 65, 0.1);
    --md-accent-bg-color: #ffffff;

    --md-typeset-a-color: #f97141;

    --md-code-fg-color: #202020;
    --md-code-bg-color: #f5f5f5;
}

/* ------------------------------------------------------------------ */
/* Dark Mode                                                          */
/* ------------------------------------------------------------------ */

[data-md-color-scheme="slate"] {
    --md-primary-fg-color: #202020;
    --md-primary-fg-color--light: #3a3a3a;
    --md-primary-fg-color--dark: #101010;
    --md-primary-bg-color: #e0e0e0;
    --md-primary-bg-color--light: #cccccc;

    --md-accent-fg-color: #f97141;
    --md-accent-fg-color--transparent: rgba(249, 113, 65, 0.1);
    --md-accent-bg-color: #202020;

    --md-typeset-a-color: #f97141;

    --md-default-bg-color: #1a1a1a;
    --md-default-bg-color--light: #242424;
    --md-default-bg-color--lighter: #2e2e2e;
    --md-default-bg-color--lightest: #3a3a3a;
}

/* ------------------------------------------------------------------ */
/* Typography — Outfit Semibold headings per brand guidelines          */
/* ------------------------------------------------------------------ */

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
    font-weight: 600;
}

/* ------------------------------------------------------------------ */
/* Existing utility styles                                            */
/* ------------------------------------------------------------------ */

.grid-spacing-right {
    padding-right: 8px;
}

div.grid.cards a {
    text-decoration: none;
}

.mermaid {
    text-align: center;
}