:root {
    --clr-main: #f2f2f2;
    --clr-prefix: var(--clr-main);
    --clr-count: var(--clr-main);
    --clr-sep: var(--clr-main);
    --clr-goal: var(--clr-main);
    --clr-suffix: var(--clr-main);
    --clr-container: none;
    --set-font: Arial, Helvetica, sans-serif;
    --set-weight: 400;
    --set-size: 16px;
    --set-align: left;
    --set-border: none;
    --set-radius: .25rem;
    --set-padding: 5px;
    --set-shadow: -1px 1px 0 #000;
}

.widget-container {
    box-sizing: border-box;
    width: 100%;
    font-size: var(--set-size);
    font-family: var(--set-font);
    font-weight: var(--set-weight);
}

.events-container {
    display: inline-flex;
    flex-direction: row;
    gap: .35em;
    border: var(--set-border);
    border-radius: var(--set-radius);
    padding: var(--set-padding);
    line-height: 1em;
    background: var(--clr-container);
    color: var(--clr-main);
    text-wrap: nowrap;
    text-shadow: var(--set-shadow);
}

.custom-event-amount::before {
    content: 'x';
    margin: 0 .15em;
}

.custom-event-icon {
    height: .8em;
    max-width: .8em;
    margin: auto .25em auto 0;
}

.event-display {
    display: flex;
    gap: .25em;
}

.custom-suffix::after {
    content: ' - ';
}

.hide-section {
    display: none;
}