*, *::before, *::after {
    margin: 0;
    padding: 0;
    outline: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
    border: none;
}

:root {
    --background-color: #f8f9fa; /* Lysere grå for at skabe kontrast mod mørk tekst */
    --primary-color: #333333; /* Neutral mørk grå som primær farve */
    --primary-color-hover: #1a1a1a; /* Endnu mørkere grå til hover-effekt */
    --secondary-color: #555555; /* Mellemgrå som sekundær farve */
    --secondary-color-hover: #3c3c3c; /* Mørkere mellemgrå til hover-effekt */
    --danger-color: #b02a37; /* Klar mørkerød til advarsler */
    --danger-color-hover: #8a1f2a; /* Dybere rød til hover-effekt */
    --text-color: #212121; /* Mørk tekstfarve for god læsbarhed */
    --border-color: #d6d6d6; /* Lys grå til kanter */
    --button-border-radius: 6px; /* Let afrundet knapstil */
    --font-size: 16px; /* Standard tekststørrelse */
    --padding: 12px; /* Komfortabel padding */
    --margin-bottom: 24px; /* Harmonisk afstand mellem sektioner */
    --card-background: #ffffff; /* Hvid baggrund for kort */
    --card-shadow: rgba(0, 0, 0, 0.05); /* Lettere skyggeeffekt for at passe til det mørkere farveskema */
    --link-color: #666666; /* Neutral grå til links */
    --link-hover-color: #444444; /* Mørkere grå til link hover-effekt */
    --button-color: #0069d9; /* Livlig og moderne blå */
    --button-color-hover: #0056b3; /* Mørkere blå til hover-effekt */
    --button-text-color: #ffffff; /* Hvid tekst for optimal kontrast */
    --button-border-radius: 6px; /* Behold afrundede hjørner */
}

html, body {
    height: 100%;
}

body {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 32px;
    margin: 0;
}