/* Designtokens: alle farver, skrifter og mål samles her som CSS-variabler, så resten af stylesheets
   kun henviser til navne. Skifter brandet en farve, rettes den ét sted.
   Farverne er Ben & Jerry's primærpalette fra designguiden (Brand Guidelines, 2015): himmel, græs, guld og sort. */

/* Chunk er brandets display-skrift til overskrifter og knapper. font-display: swap viser tekst med
   reserveskriften, indtil Chunk er hentet, i stedet for usynlig tekst. */
@font-face {
    font-family: Chunk;
    src: url("../fonts/Chunk.ttf") format("truetype");
    font-display: swap;
}

:root {
    --sky: #C4E7F3;
    --sky-deep: #40B4E5;
    --cloud: #ffffff;
    --grass: #82BC00;
    --grass-deep: #41873F;
    --gold: #FDB913;
    --red: #e10600;
    --black: #231F20;
    --cow-black: var(--black);
    --cream: #fff7e6;
    --text: var(--black);
    --text-muted: #4a4a48;
    --card-bg: rgba(255, 255, 255, 0.92);
    --focus: var(--gold);
    --radius: 18px;
    --shadow: 0 6px 0 rgba(35, 31, 32, 0.25);
    --shadow-pressed: 0 2px 0 rgba(35, 31, 32, 0.25);
    --font: "Trebuchet MS", "Arial Rounded MT Bold", "Segoe UI", Arial, sans-serif;
    --display: Chunk, "Trebuchet MS", "Arial Rounded MT Bold", sans-serif;
    /* Mindste trykflade til touch (44 px, Apples anbefaling); bruges af alle runde knapper og chippen. */
    --tap-size: 44px;
}