/* The starter's default pages in hodlfolio's palette. Loaded after user-management.css and after Bulma, so it also
   repairs what Bulma's element rules change on the starter's markup. The values resolve on <html>, which carries
   data-theme, so most tokens follow the theme through hodlfolio's own variables. */
:root {
    --um-font-family: var(--hf-font-body);
    --um-color-text: var(--text-primary);
    --um-color-text-muted: var(--text-secondary);
    --um-color-background: var(--bulma-body-background-color);
    --um-color-surface: #FFFFFF;
    --um-color-border: var(--border-color);
    --um-color-accent: var(--accent);
    --um-color-accent-contrast: #FFFFFF;
    --um-color-danger: var(--loss);
    --um-color-success: var(--success);
    --um-radius: var(--hf-radius);
}

/* Mint is the dark theme's accent, and white on mint is unreadable; Night is the pairing .button.is-primary uses. */
[data-theme="dark"] {
    --um-color-surface: var(--hf-slate);
    --um-color-accent-contrast: var(--hf-night);
}

/* app.css grows main to fill the page; the starter's card would stretch with it, so the footer takes the slack. */
.um-page-framed > main {
    flex: none;
}

.um-page-framed > .footer {
    margin-top: auto;
}

/* Bulma's reset sets every heading to the body size and weight; the admin pages' headings carry no .um-title. */
.um-page main h1,
.um-page main h2 {
    font-weight: 600;
}

.um-admin-users h1,
.um-admin-user h1 {
    font-size: 1.5rem;
}

.um-admin-user h2 {
    margin-block: 1.5rem 0.5rem;
    font-size: 1.1rem;
}

/* Bulma paints every link its link blue, 3.4:1 on white; the starter only recolours the links it classes. */
.um-page main a:not(.um-button) {
    color: var(--um-color-accent);
}

/* Bulma removes the underline the starter relies on to set a link in running text apart from its sentence. */
.um-page main p a:not(.um-button) {
    text-decoration: underline;
}

/* Bulma gives code its own colour on a grey chip; the admin pages use it for ids and device series. */
.um-page main code {
    padding: 0;
    background: none;
    color: inherit;
}

/* Bulma strips every button's border and background; the admin search submit has no .um-button to restore them. */
.um-admin-search button {
    padding: 0.5rem 1rem;
    border: 1px solid var(--um-color-accent);
    border-radius: var(--um-radius);
    background: var(--um-color-surface);
    color: var(--um-color-accent);
    cursor: pointer;
}
