/*
Documentation:
Purpose: Define the VeasySport MkDocs Material theme overrides (colors, typography, and key UI states).
Role: Centralizes brand styling for docs/user and maps brand tokens to Material CSS variables.
*/

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

[data-md-color-scheme="veasysport"] {
    /* Brand tokens (single source of truth for the scheme). */
    --vs-core-blue: #2351af;
    --vs-system-navy: #002147;
    --vs-cloud-blue: #cfe5f7;
    --vs-interface-white: #f8fafc;

    /* Typography: set Inter for all UI text (code stays monospace). */
    --md-text-font-family: "Inter";

    /* Primary + accent colors used by Material components and UI states. */
    --md-primary-fg-color: var(--vs-system-navy);
    --md-primary-fg-color--light: var(--vs-core-blue);
    --md-primary-fg-color--dark: var(--vs-system-navy);
    --md-primary-bg-color: var(--vs-interface-white);
    --md-primary-bg-color--light: rgba(248, 250, 252, 0.7);

    --md-accent-fg-color: var(--vs-core-blue);
    --md-accent-fg-color--transparent: rgba(35, 81, 175, 0.12);
    --md-accent-bg-color: var(--vs-interface-white);
    --md-accent-bg-color--light: rgba(248, 250, 252, 0.7);

    /* Base text + background. */
    --md-default-fg-color: var(--vs-system-navy);
    --md-default-fg-color--light: rgba(0, 33, 71, 0.7);
    --md-default-fg-color--lighter: rgba(0, 33, 71, 0.4);
    --md-default-fg-color--lightest: rgba(0, 33, 71, 0.12);
    --md-default-bg-color: var(--vs-interface-white);
    --md-default-bg-color--light: rgba(248, 250, 252, 0.7);
    --md-default-bg-color--lighter: rgba(248, 250, 252, 0.4);
    --md-default-bg-color--lightest: rgba(248, 250, 252, 0.12);

    --md-typeset-color: var(--vs-system-navy);
    --md-typeset-a-color: var(--vs-core-blue);

    /* Footer colors aligned with System Navy. */
    --md-footer-fg-color: #ffffff;
    --md-footer-fg-color--light: rgba(255, 255, 255, 0.7);
    --md-footer-fg-color--lighter: rgba(255, 255, 255, 0.7);
    --md-footer-bg-color: var(--vs-system-navy);
    --md-footer-bg-color--dark: rgba(0, 0, 0, 0.32);
}

/* Headings: System Navy + bold weight to emphasize hierarchy. */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
    color: var(--vs-system-navy);
    font-weight: 800;
}

/* Links: Core Blue and underlined; hover in System Navy. */
.md-typeset a {
    color: var(--vs-core-blue);
    text-decoration: underline;
}

.md-typeset a:hover,
.md-typeset a:focus {
    color: var(--vs-system-navy);
}

/* Headings should not be underlined, even when they contain links. */
.md-typeset h1 a,
.md-typeset h2 a,
.md-typeset h3 a,
.md-typeset h4 a,
.md-typeset h5 a,
.md-typeset h6 a {
    color: var(--vs-system-navy);
    text-decoration: none;
}

/* Navigation links: System Navy by default, Core Blue on hover/active. */
.md-nav__link {
    color: var(--vs-system-navy);
}

.md-nav__link:hover,
.md-nav__link:focus,
.md-nav__link--active {
    color: var(--vs-core-blue);
}

/* Header title ("VeasySport Handbuch") in Core Blue. */
.md-header__topic:first-child,
.md-header__topic:first-child .md-ellipsis,
.md-nav--primary > .md-nav__title {
    color: var(--vs-core-blue);
    font-weight: 800;
}

/* Active header title block (site title + current page) in Core Blue. */
.md-header .md-header__title--active .md-header__topic,
.md-header .md-header__title--active .md-header__topic .md-ellipsis {
    color: var(--vs-core-blue);
}

/* Top header bar (logo + search) should keep Cloud Blue background. */
.md-header,
.md-header__inner {
    background-color: var(--vs-cloud-blue);
}

/* Repo link in top navigation should be Core Blue. */
.md-header .md-source,
.md-header .md-source:hover,
.md-header .md-source:focus {
    color: var(--vs-core-blue);
}

/* Table of contents title ("Inhaltsverzeichnis") in Core Blue. */
.md-nav--secondary .md-nav__title {
    color: var(--vs-core-blue);
    font-weight: 800;
}

/* Search input background and text color. */
.md-search__input {
    background-color: var(--vs-interface-white);
    color: var(--vs-system-navy);
}

/* Note admonition styling: System Navy with a Cloud Blue tint on the title only. */
.md-typeset .admonition.note,
.md-typeset details.note {
    border-color: var(--vs-system-navy);
}

.md-typeset .admonition.note > .admonition-title,
.md-typeset details.note > summary {
    color: var(--vs-system-navy);
    background-color: rgba(207, 229, 247, 0.4);
}

.md-typeset .admonition.note > .admonition-title::before,
.md-typeset details.note > summary::before {
    color: var(--vs-system-navy);
}

/* Search icons and placeholder should use System Navy for consistency. */
.md-search .md-search__icon,
.md-search .md-search__icon:hover,
.md-search .md-search__icon:focus {
    color: var(--vs-system-navy);
}

.md-search .md-search__icon svg {
    fill: currentColor;
}

.md-search__input::placeholder {
    color: var(--vs-system-navy);
}

/* Search results: text and icons in System Navy. */
.md-search .md-search-result__meta,
.md-search .md-search-result__title,
.md-search .md-search-result__teaser,
.md-search .md-search-result__more,
.md-search .md-search-result__article,
.md-search .md-search-result__link {
    color: var(--vs-system-navy);
}

.md-search .md-search-result__icon,
.md-search .md-search-result__icon svg {
    color: var(--vs-system-navy);
    fill: currentColor;
}

.md-search .md-search-result mark {
    color: var(--vs-system-navy);
}