:root {
    --primary: #004899FF;
    --primary-alt: #d91813;
    --primary-black: #000;
    --primary-white: #fff;
    --primary-dark-gray: #222;
    --primary-gray: #666;
    --primary-light-gray: #eaeaea;
    --primary-green: #155715;
    --primary-red: #e81010;

    --secondary: #0075FA;
    --secondary-alt: #f63838;
    --secondary-green: #169116;
    --secondary-dark-gray: #333;
    --secondary-gray: #777;
    --secondary-light-gray: #d3d3d3;
    --secondary-red: #f63838;

    --tertiary: #0063D4;
    --tertiary-alt: #e52b1a;

    --text: #fff;

    --card-primary: #cdcdcd;
    --card-secondary: #dedede;

    --reappearing-bg: #ffd966;
    --reappearing-bg-pulse1: #ffde82;
    --reappearing-bg-pulse2: #ffcf39;

    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

    --label-width: .9rem;

    --gap-sm: .5rem;
    --gap-md: .75rem;
    --gap-lg: 1rem;


    --input-radius: 4px;
    --input-background: var(--primary-white);
    --input-border: 1px solid var(--primary-light-gray);


    --main-content-margin: 1rem;

    --mobile-max-width: 600px;

    --tablet-min-width: 601px;
    --tablet-max-width: 1200px;

    --desktop-min-width: 1201px;

    @media (max-width: 600px) {
        --main-content-margin: .5rem;
    }

    @media (max-width: 1200px) {
        --main-content-margin: .75rem;
    }

    --bg-ticket-unread: #e8eeff;
    --bg-ticket-selected: #eee;
    --bg-ticket-selected-hover: #f8f8f8;
}

html.dark-mode {
    --bg-ticket-unread: #030d2a;
}