/*
   CSS styling examples for the Vaadin app.

   This is the style entrypoint for the theme and together with css in ./components/ included
   automatically into the theme.

   Visit https://vaadin.com/docs-beta/latest/theming/application-theme/ for more information.
*/

html {
  /* Theme colors extracted based on src/main/webapp/images/logo.png */

  --lumo-primary-color: hsl(34, 100%, 48%);
  --lumo-primary-color-50pct: hsla(34, 100%, 48%, 0.5);
  --lumo-primary-color-10pct: hsla(34, 100%, 48%, 0.1);
  --lumo-primary-text-color: var(--lumo-primary-color);

  --lumo-secondary-color: hsl(138, 90%, 31%);
  --lumo-secondary-color-50pct: hsla(138, 90%, 31%, 0.5);
  --lumo-secondary-color-10pct: hsla(138, 90%, 31%, 0.1);
  --lumo-secondary-text-color: var(--lumo-secondary-color);
}

[theme~="dark"] {
  --lumo-primary-color: hsl(34, 100%, 51%);
  --lumo-primary-color-50pct: hsla(34, 100%, 51%, 0.5);
  --lumo-primary-color-10pct: hsla(34, 100%, 51%, 0.1);
  --lumo-primary-text-color: var(--lumo-primary-color);

  --lumo-secondary-color: hsl(138, 90%, 41%);
  --lumo-secondary-color-50pct: hsla(138, 90%, 41%, 0.5);
  --lumo-secondary-color-10pct: hsla(138, 90%, 41%, 0.1);
  --lumo-secondary-text-color: var(--lumo-secondary-color);
}

vaadin-app-layout::part(drawer){
  background-image: var(--lumo-base-color);
}