:host, :root {
  /* Color Memo
  Just refer - Photon's dark color
  --button-primary-bgcolor: #0060DF;
  --button-primary-hover-bgcolor: #003EAA;
  --button-primary-active-bgcolor: #002275;
  --lwt-brighttext-url-color: #74c0ff;
  --lwt-toolbarbutton-icon-fill-attention: #45a1ff;

  Just refer - Proton's light color
  --in-content-accent-color: #0a84ff;
  --in-content-accent-color-active: #0060df;
  --in-content-primary-button-background: #0061e0;
  --in-content-primary-button-background-hover: #0250bb;
  --in-content-primary-button-background-active: #053e94;

  --blue-40: #45a1ff; rgb(69, 161, 255)
  --blue-50: #0a84ff; rgb(10, 132, 255)
  --blue-60: #0060df; rgb(0, 96, 223)
  --blue-70: #003eaa; rgb(0, 62, 170)
  --blue-80: #002275; rgb(0, 34, 117)

  Relation
  lighten(#0060df,   29%): #74b0ff;
  lighten(#0060df, 19.8%): #4595ff
  lighten(#0060df,  8.3%): #0a74ff
  #0060df
  darken(#0060df, 15.5%):  #003e90;
  darken(#0060df, 28.1%):  #002250;
 */
  --blue-20: #b6d6ff; /* lighten(#0060df, 42%) - rgb(182, 214, 255), Add for link active color*/
  --blue-30: #74c0ff; /* rgb(116, 192, 255), Add for active color */
}

@mixin DarkBlueContent() {
  --in-content-primary-button-text-color: var(--in-content-page-color) !important;
  --in-content-primary-button-background: var(--blue-60) !important;
  --in-content-primary-button-background-hover: var(--blue-50) !important;
  --in-content-primary-button-background-active: var(--blue-40) !important;

  --in-content-focus-outline-color: var(--blue-40) !important;
  --in-content-accent-color: var(--blue-40) !important;
  --in-content-accent-color-active: var(--blue-30) !important;

  --in-content-table-background: rgb(35, 34, 43) !important;
  --in-content-table-border-color: rgba(249,249,250,0.2) !important;
  --in-content-table-header-background: rgb(5, 64, 150) !important;
  --in-content-table-header-color: var(--in-content-page-color) !important;

  --in-content-link-color: var(--blue-40) !important;
  --in-content-link-color-hover: var(--blue-30) !important;
  --in-content-link-color-active: var(--blue-20) !important;
  --in-content-link-color-visited: var(--blue-40) !important;
}
