:root {
    --lr-accent: #0672eb;
    --lr-accent-dark: oklch(74% 0.13 255);
    --lr-accent-hover: oklch(from #0672eb calc(l - 0.05) c h);
    --lr-accent-soft: oklch(95.5% 0.025 255);
    --lr-sidebar-bg: oklch(96.5% 0.004 255);
    --lr-sidebar-hover: oklch(93.5% 0.007 255);
    --lr-sidebar-active: oklch(94.5% 0.035 255);
    --lr-code-highlight: oklch(74% 0.13 255 / 0.14);
    --lr-code-marker: oklch(74% 0.13 255);
    --lr-alert-primary: #0672eb;
}

:root[data-theme="dark"] {
    --lr-accent-hover: oklch(80% 0.11 255);
    --lr-accent-soft: oklch(28% 0.06 255);
    --lr-sidebar-active: oklch(29% 0.065 255);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --lr-accent-hover: oklch(80% 0.11 255);
        --lr-accent-soft: oklch(28% 0.06 255);
        --lr-sidebar-active: oklch(29% 0.065 255);
    }
}

/* HTTP method badges in the menu of the API pages */
:root {
    --lr-method-get: oklch(52% 0.14 150);
    --lr-method-post: oklch(52% 0.16 255);
    --lr-method-put: oklch(58% 0.15 60);
}

:root[data-theme="dark"] {
    --lr-method-get: oklch(78% 0.14 150);
    --lr-method-post: oklch(78% 0.12 255);
    --lr-method-put: oklch(80% 0.13 70);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) {
        --lr-method-get: oklch(78% 0.14 150);
        --lr-method-post: oklch(78% 0.12 255);
        --lr-method-put: oklch(80% 0.13 70);
    }
}

.lr-nav-link[href$="/api/device-types"] .lr-nav-text::before,
.lr-nav-link[href$="/api/brands"] .lr-nav-text::before,
.lr-nav-link[href$="/api/devices"] .lr-nav-text::before,
.lr-nav-link[href$="/api/customers/list-customers"] .lr-nav-text::before,
.lr-nav-link[href$="/api/customers/create-customer"] .lr-nav-text::before,
.lr-nav-link[href$="/api/customers/update-customer"] .lr-nav-text::before {
    display: inline-block;
    min-width: 2.75em;
    margin-right: 0.5em;
    padding: 0.1em 0.4em;
    border-radius: 0.25rem;
    background: color-mix(in oklch, var(--method) 16%, transparent);
    color: var(--method);
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.02em;
    text-align: center;
    vertical-align: 0.05em;
}

.lr-nav-link[href$="/api/device-types"] .lr-nav-text::before,
.lr-nav-link[href$="/api/brands"] .lr-nav-text::before,
.lr-nav-link[href$="/api/devices"] .lr-nav-text::before,
.lr-nav-link[href$="/api/customers/list-customers"] .lr-nav-text::before {
    --method: var(--lr-method-get);
    content: "GET";
}

.lr-nav-link[href$="/api/customers/create-customer"] .lr-nav-text::before {
    --method: var(--lr-method-post);
    content: "POST";
}

.lr-nav-link[href$="/api/customers/update-customer"] .lr-nav-text::before {
    --method: var(--lr-method-put);
    content: "PUT";
}

/* Tighter spacing around sub-groups in the menu */
.lr-nav-group .lr-nav-list>.lr-nav-group,
.lr-nav-group .lr-nav-list>.lr-nav-group+li {
    margin-top: 0;
}

.lr-nav-group .lr-nav-group>.lr-nav-list,
.lr-nav-group .lr-nav-group>details>.lr-nav-list {
    margin-inline-start: 6px;
    padding-inline-start: 4px;
}