html, body {
    height: 100%;
    overflow: hidden;
}


/* Foxxy theme */
.theme-fox {
    --color-primary: #F1592A;
    --color-secondary: #FFA62B;
    --color-bg: #000000;
    --color-panel: #1e1e1e;
    --color-text: #FFFFFF;
    --color-muted: #DADADA;
    background-color: var(--color-bg) !important;
    color: var(--color-text) !important;
}

    .theme-fox html,
    .theme-fox body,
    .theme-fox .page,
    .theme-fox main,
    .theme-fox .content,
    .theme-fox article {
        background-color: var(--color-bg) !important;
        color: var(--color-text) !important;
        min-height: 100vh;
    }

    .theme-fox .sidebar {
        background-image: none !important;
        background-color: var(--color-panel) !important;
    }


    /* Navbar top */
    .theme-fox .navbar,
    .theme-fox .navbar-brand {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
    }

    .theme-fox .topbar h4 {
        color: var(--color-secondary);
        text-shadow: 0 0 4px var(--color-primary);
    }

    /* Links */
    .theme-fox .nav-link {
        color: var(--color-muted) !important;
    }

        .theme-fox .nav-link.active {
            background-color: var(--color-primary) !important;
            color: #000 !important;
        }

    /* Dropdowns, knapper */
    .theme-fox .form-select,
    .theme-fox .btn {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
        border-color: var(--color-secondary) !important;
    }

    /* Hover for primær knap */
    .theme-fox .btn-primary:hover {
        background-color: var(--color-secondary) !important;
        border-color: var(--color-secondary) !important;
    }

    /* Valideringsfarver (kan tilpasses) */
    .theme-fox .valid.modified:not([type=checkbox]) {
        outline: 1px solid #26b050;
    }

    .theme-fox .bottombar {
    background-color: var(--color-panel) !important;
    color: var(--color-text) !important;
}

    .theme-fox .invalid {
        outline: 1px solid #e50000;
    }






.theme-dark {
    --color-primary: #007bff;
    --color-secondary: #6c757d;
    --color-bg: #121212;
    --color-panel: #1e1e1e;
    --color-text: #ffffff;
    --color-muted: #aaaaaa;
    background-color: var(--color-bg) !important;
    color: var(--color-text) !important;
}

    .theme-dark .page,
    .theme-dark main,
    .theme-dark .content,
    .theme-dark article {
        background-color: var(--color-bg) !important;
        color: var(--color-text) !important;
    }

    .theme-dark .sidebar {
        background-color: var(--color-panel) !important;
        background-image: none !important;
    }

    .theme-dark .navbar,
    .theme-dark .navbar-brand {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
    }

    .theme-dark .bottombar {
    background-color: var(--color-panel) !important;
    color: var(--color-text) !important;
    border-top: 1px solid var(--color-muted);
    }

    .theme-dark .topbar h4 {
        color: var(--color-secondary);
        text-shadow: 0 0 4px var(--color-primary);
    }

.theme-dark .topbar,
.theme-dark .bottombar {
    background-color: var(--color-panel) !important;
    color: var(--color-text) !important;
    border-top: 1px solid var(--color-muted);
}

    .theme-dark .nav-link {
        color: var(--color-muted) !important;
    }

        .theme-dark .nav-link.active {
            background-color: var(--color-primary) !important;
            color: #fff !important;
        }

    .theme-dark .form-select,
    .theme-dark .btn {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
        border-color: var(--color-secondary) !important;
    }

    .theme-dark .btn-primary:hover {
        background-color: var(--color-secondary) !important;
        border-color: var(--color-secondary) !important;
    }

    .theme-dark .valid.modified:not([type=checkbox]) {
        outline: 1px solid #26b050 !important;
    }

    .theme-dark .invalid {
        outline: 1px solid #e50000 !important;
    }

.theme-retro {
    --color-primary: #ff6600;
    --color-secondary: #ffcc00;
    --color-bg: #fdf6e3;
    --color-panel: #eee8d5;
    --color-text: #333333;
    --color-muted: #777777;
    background-color: var(--color-bg) !important;
    color: var(--color-text) !important;
}

    .theme-retro .page,
    .theme-retro main,
    .theme-retro .content,
    .theme-retro article {
        background-color: var(--color-bg) !important;
        color: var(--color-text) !important;
    }

    .theme-retro .sidebar {
        background-color: var(--color-panel) !important;
        background-image: none !important;
    }

    .theme-retro .navbar,
    .theme-retro .navbar-brand {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
    }

    .theme-retro .topbar h4 {
        color: var(--color-secondary);
        text-shadow: 0 0 4px var(--color-primary);
    }

    .theme-retro .topbar,
    .theme-retro .bottombar {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
        border-top: 1px solid var(--color-muted);
    }



    .theme-retro .nav-link {
        color: var(--color-muted) !important;
    }

    .theme-retro .bottombar {
    background-color: var(--color-panel) !important;
    color: var(--color-text) !important;
    border-top: 1px solid var(--color-muted);
    }

        .theme-retro .nav-link.active {
            background-color: var(--color-primary) !important;
            color: #fff !important;
        }

    .theme-retro .form-select,
    .theme-retro .btn {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
        border-color: var(--color-primary) !important;
    }

    .theme-retro .btn-primary:hover {
        background-color: var(--color-secondary) !important;
        border-color: var(--color-secondary) !important;
    }

    .theme-retro .valid.modified:not([type=checkbox]) {
        outline: 1px solid #009900 !important;
    }

    .theme-retro .invalid {
        outline: 1px solid #cc0000 !important;
    }




.theme-sepia {
    --color-primary: #704214;
    --color-secondary: #a67b5b;
    --color-bg: #f4ecd8;
    --color-panel: #e5d4b1;
    --color-text: #3e2f1c;
    --color-muted: #7b6f5c;
    background-color: var(--color-bg) !important;
    color: var(--color-text) !important;
}



    .theme-sepia .page,
    .theme-sepia main,
    .theme-sepia .content,
    .theme-sepia article {
        background-color: var(--color-bg) !important;
        color: var(--color-text) !important;
    }

    .theme-sepia .sidebar {
        background-color: var(--color-panel) !important;
        background-image: none !important;
    }

.theme-sepia .topbar,
.theme-sepia .bottombar {
    background-color: var(--color-panel) !important;
    color: var(--color-text) !important;
    border-top: 1px solid var(--color-muted);
}

    .theme-sepia .bottombar {
    background-color: var(--color-panel) !important;
    color: var(--color-text) !important;
    border-top: 1px solid var(--color-muted);
    }

    .theme-sepia .navbar,
    .theme-sepia .navbar-brand {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
    }

    .theme-sepia .topbar h4 {
        color: var(--color-secondary);
        text-shadow: 0 0 4px var(--color-primary);
    }


    .theme-sepia .nav-link {
        color: var(--color-muted) !important;
    }

        .theme-sepia .nav-link.active {
            background-color: var(--color-primary) !important;
            color: #fff !important;
        }

    .theme-sepia .form-select,
    .theme-sepia .btn {
        background-color: var(--color-panel) !important;
        color: var(--color-text) !important;
        border-color: var(--color-primary) !important;
    }

    .theme-sepia .btn-primary:hover {
        background-color: var(--color-secondary) !important;
        border-color: var(--color-secondary) !important;
    }

    .theme-sepia .valid.modified:not([type=checkbox]) {
        outline: 1px solid #5c821a !important;
    }

    .theme-sepia .invalid {
        outline: 1px solid #b00000 !important;
    }

.step-block {
    display: flex;
    align-items: center;
    padding: 5px 0;
}



.step-separator {
    width: 100%;
    height: 5px;
    background-color: var(--color-panel);
    margin: 0;
    padding: 0;
}

.step-block div {
    line-height: 1.5; /* cirka 5px ved standard 16px font */
}

.act-dropdown {
    width: 100px !important;
}

.sub {
    margin-left: 20px;
    display: inline-block;
   
}

/* Theme Dropdown */
.theme-dropdown {
    width: 180px;
}

.strikethrough {
    color: gray;
    text-decoration: line-through;
    white-space: pre-wrap;
}

.title-text {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Vertikal centreret */
    font-size: 1.5em; /* Justér efter behov */
    font-weight: bold;
    line-height: 1.0;
    color: orange;
    text-shadow: 0 0 4px #ff6600, 0 0 2px #ff6600;
    margin: 0; /* fjern evt. margin på h4 */
    padding: 0; /* fjern evt. padding */
}

    .title-text span {
        display: block; /* sikrer at hver linje står på egen linje */
    }

.logo {
    height: 2.4em; /* cirka to linjer tekst højde */
    object-fit: contain; /* bevarer proportioner */
    
}

.orange-step {
    color: orange !important;
    font-weight: bold;
}

    .orange-step.checked {
        color: rgba(255, 165, 0, 0.1) !important; /* Meget svag orange */
        font-weight: normal;
    }

.main-content {
    padding-bottom: 104px; /* justér så det svarer til højden på din bottom bar */
    margin-left: 30px;
    margin-top: 30px;
}

.note-selector-row {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-top: 30px;
    margin-left: 30px;
}

    .note-selector-row select {
        width: 200px;
        padding: 6px;
        text-align-last: center;
    }

/* Gælder KUN til code blocks (indrykkede koder med flere linjer) */
.markdown-body pre code {
    background-color: #1e1e1e !important;
    color: #d4d4d4 !important;
    font-family: Consolas, 'Courier New', monospace !important;
    font-size: 14px !important;
    padding: 12px !important;
    border-radius: 6px !important;
    display: block !important;
    overflow-x: auto !important;
    white-space: pre !important;
    margin-left: 10px;
    padding-left: 30px;
    padding-right: 30px;
}

/* Gælder KUN til inline-kode som fx `Skatteberegner` */
.markdown-body p code,
.markdown-body li code,
.markdown-body td code,
.markdown-body h1 code,
.markdown-body h2 code,
.markdown-body h3 code {
    background-color: #2a2a2a;
    color: #d4d4d4;
    font-size: 0.95em;
    padding: 0.1em 0.35em;
    border-radius: 4px;
    font-family: Consolas, 'Courier New', monospace;
}



/* Farver for forskellige C# elementer */
code.hljs .keyword {
    color: #569cd6 !important;
}
/* public, class, static, etc */
code.hljs .string {
    color: #d69d85 !important;
}
/* "..." */
code.hljs .type,
code.hljs .built_in {
    color: #4ec9b0 !important;
}
/* string, List, etc */
code.hljs .literal {
    color: #569cd6 !important;
}
/* true, false, null */
code.hljs .comment {
    color: #6a9955 !important;
    font-style: italic !important;
}

code.hljs .number {
    color: #b5cea8 !important;
}

code.hljs .title.function_ {
    color: #dcdcaa !important;
}
/* PrintAll() */
code.hljs .property,
code.hljs .attr {
    color: #9cdcfe !important;
}
/* Items, IsEnabled */
code.hljs .meta {
    color: #4ec9b0 !important;
}
/* [Serializable] */
code.hljs .namespace {
    color: #4ec9b0 !important;
}

code.hljs .operator,
code.hljs .punctuation {
    color: #d4d4d4 !important;
}

pre, code {
    background: #1e1e1e;
    color: #d4d4d4;
    font-family: Consolas, monospace;
    font-size: 14px;
    padding: 10px;
    border-radius: 6px;
}

.code .comment {
    color: #6a9955;
    font-style: italic;
}

.code .keyword {
    color: #569cd6;
}

.code .string {
    color: #d69d85;
}

.code .type {
    color: #4ec9b0;
}

.code .number {
    color: #b5cea8;
}

/* ────────────────────────────────────────────── */
/* 🧠 PRISM THEME: C# CODE BLOCKS (.highlight-csharp) */
/* ────────────────────────────────────────────── */

pre.highlight-csharp {
    width: 600px;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: auto;
    white-space: pre;
}

.highlight-csharp {
    background: #1e1e1e;
    color: #d4d4d4;
    font-family: Consolas, 'Courier New', monospace;
    font-size: 14px;
    padding: 12px;
    border-radius: 6px;
    overflow-x: auto;
    white-space: pre;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

    /* 🍀 Comments */
    .highlight-csharp .token.comment {
        color: #6a9955;
        font-style: italic;
    }

    /* 🧡 Strings */
    .highlight-csharp .token.string {
        color: #d69d85;
    }

    /* 💚 Numbers */
    .highlight-csharp .token.number {
        color: #b5cea8;
    }

    /* 🌸 Control flow keywords ONLY */
    .highlight-csharp .token.keyword-for,
    .highlight-csharp .token.keyword-foreach,
    .highlight-csharp .token.keyword-try,
    .highlight-csharp .token.keyword-catch,
    .highlight-csharp .token.keyword-finally,
    .highlight-csharp .token.keyword-throw {
        color: #c586c0;
    }

    /* 🔵 Default C# keywords */
    .highlight-csharp .token.keyword {
        color: #569cd6;
    }

    /* 🟢 Known types and classes */
    .highlight-csharp .token.type-class,
    .highlight-csharp .token.class-name {
        color: #4ec9b0;
    }

    /* ⚪ Common .NET / LINQ methods */
    .highlight-csharp .token.dot-method {
        color: #dcdcaa;
    }

    /* ⚪ Operators and punctuation */
    .highlight-csharp .token.operator,
    .highlight-csharp .token.punctuation {
        color: #d4d4d4;
    }

/* Gør bottombar fast og placeret helt i bunden */
.fixed-bottombar {
    position: fixed;
    bottom: 0;
    left: 0;
    height: 108px;
    width: 100%;
    z-index: 1000;
}

/* Sørg for at main-content ikke går bag ved */
.scrollable-content {
    overflow-y: auto;
    padding-bottom: 140px; /* lidt ekstra plads over bottombar */
}