@layer base {
  :root {
    --background-color-navigation-button: transparent;
    --background-color-navigation-button-hover: transparent;
    --background-color-navigation-button-disabled: transparent;

    --fill-color-navigation-button: #98979E;
    --fill-color-navigation-button-hover: #7978FF;
    --fill-color-navigation-button-disabled: #F2F2F3;

    --border-radius-navigation-button: 12px;
    --border-width-navigation-button: 1px;
    --border-color-navigation-button: #EBEAEC;
    --border-color-navigation-button-hover: #7978FF;
    --border-color-navigation-button-disabled: #F2F2F3;

    --padding-left-navigation-button-prev: 8px;
    --padding-right-navigation-button-prev: 8px;
    --padding-left-navigation-button-next: 8px;
    --padding-right-navigation-button-next: 8px;
    --padding-y-navigation-button: 8px;
  }

  .theme-lawinsider {
    --background-color-navigation-button: transparent;
    --background-color-navigation-button-hover: transparent;
    --background-color-navigation-button-disabled: transparent;

    --fill-color-navigation-button: black;
    --fill-color-navigation-button-hover: #28538B;
    --fill-color-navigation-button-disabled: #E8E8EA;

    --border-radius-navigation-button: 10px;
    --border-width-navigation-button: 1px;
    --border-color-navigation-button: #DEDEE0;
    --border-color-navigation-button-hover: #28538B;
    --border-color-navigation-button-disabled: #E8E8EA;

    --padding-left-navigation-button-prev: 8px;
    --padding-right-navigation-button-prev: 8px;
    --padding-left-navigation-button-next: 8px;
    --padding-right-navigation-button-next: 8px;
    --padding-y-navigation-button: 8px;
  }
}