@import url('@fontsource/karla/index.css');
html {
    --lumo-font-family: Karla;
    --lumo-font-size: 1rem;
    --lumo-font-size-xxxl: 3rem;
    --lumo-font-size-xxl: 2.25rem;
    --lumo-font-size-xl: 1.75rem;
    --lumo-font-size-l: 1.375rem;
    --lumo-font-size-m: 1.125rem;
    --lumo-font-size-s: 1rem;
    --lumo-font-size-xs: 0.875rem;
    --lumo-font-size-xxs: 0.8125rem;
    --lumo-border-radius: calc(var(--lumo-size-xl) / 2);
    --lumo-tint-5pct: rgba(244, 238, 225, 0.05);
    --lumo-tint-10pct: rgba(244, 238, 225, 0.1);
    --lumo-tint-20pct: rgba(244, 238, 225, 0.2);
    --lumo-tint-30pct: rgba(244, 238, 225, 0.3);
    --lumo-tint-40pct: rgba(244, 238, 225, 0.4);
    --lumo-tint-50pct: rgba(244, 238, 225, 0.5);
    --lumo-tint-60pct: rgba(244, 238, 225, 0.6);
    --lumo-tint-70pct: rgba(244, 238, 225, 0.7);
    --lumo-tint-80pct: rgba(244, 238, 225, 0.8);
    --lumo-tint-90pct: rgba(244, 238, 225, 0.9);
    --lumo-shade-5pct: rgba(44, 38, 22, 0.05);
    --lumo-shade-10pct: rgba(44, 38, 22, 0.1);
    --lumo-shade-20pct: rgba(44, 38, 22, 0.2);
    --lumo-shade-30pct: rgba(44, 38, 22, 0.3);
    --lumo-shade-40pct: rgba(44, 38, 22, 0.4);
    --lumo-shade-50pct: rgba(44, 38, 22, 0.5);
    --lumo-shade-60pct: rgba(44, 38, 22, 0.6);
    --lumo-shade-70pct: rgba(44, 38, 22, 0.7);
    --lumo-shade-80pct: rgba(44, 38, 22, 0.8);
    --lumo-shade-90pct: rgba(44, 38, 22, 0.9);
    --lumo-primary-text-color: rgb(226, 199, 136);
    --lumo-primary-color-50pct: rgba(226, 199, 136, 0.5);
    --lumo-primary-color-10pct: rgba(226, 199, 136, 0.1);
    --lumo-error-text-color: rgb(237, 127, 151);
    --lumo-error-color-50pct: rgba(237, 127, 151, 0.5);
    --lumo-error-color-10pct: rgba(237, 127, 151, 0.1);
    --lumo-success-text-color: rgb(112, 215, 165);
    --lumo-success-color-50pct: rgba(112, 215, 165, 0.5);
    --lumo-success-color-10pct: rgba(112, 215, 165, 0.1);
    --lumo-tint: #f4eee1;
    --lumo-shade: hsl(42, 33%, 13%);
    --lumo-primary-color: #e2c788;
    --lumo-error-color: #ED7F97;
    --lumo-success-color: #70d7a5;
    --lumo-header-text-color: #b7830b;
}

[theme~="dark"] {
}

vaadin-vertical-layout.hover:hover {
    transform: scale(1.025);
    transform: ease-in ease-out;
}