@import "../colors.css";
@import "../spacing.css";
@import "../typography.css";

:root {
  --header-background-color: var(--color-squanchy-gray-20);
  --header-border-color: var(--color-squanchy-gray-20);
  --header-border-style: solid;
  --header-border-width: 0 0 1px;
  --header-height: 72px;
  --header-padding-left: 20px;
  --header-padding-right: 20px;
  --header-width: 100%;

  --header-child-margin-left: var(--spacing-tiny);

  --header-title-color: var(--color-squanchy-gray-300);
  --header-title-font-size: 16px;
  --header-title-font-weight: var(--body-text-weight);

  --header-link-color: var(--color-picklerick-green-100);

  --header-content-link-margin-right: var(--spacing-medium);

  --header-back-button-background-color: transparent;
  --header-back-button-border: none;
  --header-back-button-color: var(--color-picklerick-green-100);
  --header-back-button-font-size: 25px;
  --header-back-button-padding: 0;

  --header-menu-font-size: 14px;
  --header-menu-inner-spacing: var(--spacing-tiny);
  --header-menu-margin-right: var(--spacing-medium);
}