:root {

  /*

  To change runtime: document.documentElement.style.setProperty(`--primary-button-color`, 'red')

  */

  /* Background for dialogs etc */
  --co-inphoto--dialog-background-color: #ffffff;

  /* Icon */
  --co-inphoto-icon-color: #000;
  --co-inphoto-icon-color-light: #fff;
  --co-inphoto-icon-size: 24px;
  --co-inphoto-icon-size-small: 16px;
  --co-inphoto-icon-size-large: 32px;

  /* Text related stuff */
  --co-inphoto-font-size-label: 14px;
  --co-inphoto-font-size-base: 16px;
  --co-inphoto-font-size-sub-head: 28px;
  --co-inphoto-font-size-head: 20px;
  --co-inphoto-color-dark: #333333;
  --co-inphoto-color-light: #ffffff;

  /* Buttons related stuff */
  --co-inphoto-primary-button-color: #3f51b5;
  --co-inphoto-primary-button-hover-color: #303f9f;
  --co-inphoto-primary-button-border-radius: 4px;
  --co-inphoto-primary-button-border-style: solid;
  --co-inphoto-primary-button-border-width: 1px;
  --co-inphoto-primary-button-border-color: #3f51b5;
  --co-inphoto-primary-button-padding: 8px;
  --co-inphoto-primary-button-text-color: #ffffff;
  --co-inphoto-primary-button-text-size: 12px;
  --co-inphoto-primary-button-icon-width: 24px;
  --co-inphoto-primary-button-icon-height: 24px;
  --co-inphoto-primary-button-icon-color: #ffffff;


  --co-inphoto-secondary-button-color: #212437;
  --co-inphoto-secondary-button-hover-color: #303f9f;
  --co-inphoto-secondary-button-border-radius: 4px;
  --co-inphoto-secondary-button-border-style: solid;
  --co-inphoto-secondary-button-border-width: 1px;
  --co-inphoto-secondary-button-border-color: #212437;
  --co-inphoto-secondary-button-padding: 8px;
  --co-inphoto-secondary-button-text-color: #ffffff;
  --co-inphoto-secondary-button-text-size: 12px;
  --co-inphoto-secondary-button-icon-width: 24px;
  --co-inphoto-secondary-button-icon-height: 24px;
  --co-inphoto-secondary-button-icon-color: #ffffff;

  --co-inphoto-loader-background-dark: rgba(0, 0, 0, 0.5);
  --co-inphoto-loader-background-light: rgba(255, 255, 255, 0.5);

}
