[data-component-id='date-selector'] [data-element-id='header'] {
  --background-color: var(
    --base-colors-tint-100,
    var(--base-colors-whiteAlpha-1000)
  );
  --font-color: var(--base-colors-blackAlpha-900);
  --border-color: var(--base-colors-border);
}

[data-component-id='date-selector'] [data-element-id='container'] {
  --background-color: var(--base-colors-whiteAlpha-1000);
}

[data-component-id='date-selector'] [data-element-id='button'] {
  --background-color: var(--base-button-background-color);
  --font-color: var(--base-button-font-color);
  --border-color: transparent;

  --background-color__hover: var(--base-button-background-color__hover);
  --font-color__hover: var(--base-button-font-color__hover);
  --border-color__hover: transparent;

  --background-color__active: var(--base-button-background-color__active);
  --font-color__active: var(--base-button-font-color__active);
  --border-color__active: transparent;
}