/* Dial Gauge web component CSS variables and their default values. */

dial-gauge {
    /* Element */
    --dg-background-color: #ffffff;
    --dg-border: 1px solid #000000;
    --dg-border-radius: 5px;
    --dg-box-shadow: 3px 3px 5px 1px rgba(0,0,0,0.35);
    --dg-display: inline-block;
    --dg-height: 200px;
    --dg-margin: 7px;
    --dg-width: 200px;
    --dg-z-index: 0;

    /* Title */
    --dg-title-color: #000000;
    --dg-title-font-family: sans-serif, Arial, Helvetica;
    --dg-title-font-size: 1.2em;

    /* Dial Arc */
    --dg-arc-background-color: #efefef;
    --dg-arc-color: #000000; 
    --dg-arc-width: 20;

    /* Numeric Display */
    --dg-numeric-color: #0000cc;
    --dg-title-font-family:  sans-serif, Arial, Helvetica !important;
    --dg-numeric-font-family: Arial, Helvetica,sans-serif;
    --dg-numeric-font-size: 1.6em;

    /* Subtitle */
    --dg-subtitle-color: #000000;
    --dg-title-font-family: sans-serif, Arial, Helvetica;
    --dg-subtitle-font-size: 1.1em;
}