:root {
    --gcl-font-family: Arial, Helvetica, sans-serif;

    /* Colors */
    --gcl-color-primary: #3880ff;
    --gcl-color-on-primary: #fff;

    --gcl-color-secondary: #0cd1e8;
    --gcl-color-on-secondary: #032517;

    --gcl-color-tertiary: #f4a942;
    --gcl-color-on-tertiary: #4419aa;

    --gcl-color-info: #e6f7ff;
    --gcl-color-on-info: #1f87b8;

    --gcl-color-success: #f6ffed;
    --gcl-color-on-success: #10dc60;

    --gcl-color-warning: #fffbe6;
    --gcl-color-on-warning: #ffce00;

    --gcl-color-danger: #fff2f0;
    --gcl-color-on-danger: #f14141;
    
    --gcl-color-light: #f4f5f8;
    --gcl-color-medium: #989aa2;
    --gcl-color-dark: #222428;

    --gcl-background-color:#fff;

    --gcl-hoverable-background-color:rgb(211, 227, 233);
    --gcl-hoverable-color: black;

    --gcl-selected-background-color:#8ebeba;
    --gcl-selected-color: gold;

    --gcl-header-background-color: #1d62d8;

    /* Border width */
    --gcl-border-width: 2px;

    /* Heights */
    --gcl-min-height-large: 1.5rem;
    --gcl-min-height-medium: 1.25rem;
    --gcl-min-height-small: 1rem;

    /* Font sizes */
    --gcl-font-size-large: 2rem;
    --gcl-font-size-medium: 1.5rem;
    --gcl-font-size-small: 1rem;

    /* Padding sizes */
    --gcl-padding-size-large: .375rem;
    --gcl-padding-size-medium: .25rem;
    --gcl-padding-size-small: .125rem;

    /* Radius sizes */
    --gcl-radius-size-large: .3rem;
    --gcl-radius-size-medium: .25rem;
    --gcl-radius-size-small: .2rem;

    /* Width (of borders) sizes */
    --gcl-width-size-large: .15rem;
    --gcl-width-size-medium: .1rem;
    --gcl-width-size-small: .05rem;

    --gcl-icon-size-large: 2rem;
    --gcl-icon-size-medium: 1.5rem;
    --gcl-icon-size-small: 1rem;
}

body {
    margin: 0px;
    padding: 0px;
    user-select: none;
    box-sizing: border-box;
    font-family: var(--gcl-font-family);
}