@import './_core.css';
@import './_sparkassen-colors.css';

:root {
  --mw-color-primary-50: #fffefe;
  --mw-color-primary-100: #fceced;
  --mw-color-primary-200: #f9d9db;
  --mw-color-primary-300: #f3b7bc;
  --mw-color-primary-400: #e3828d;
  --mw-color-primary-500: #c94b61;
  --mw-color-primary-600: #b12647;
  --mw-color-primary-700: #910030; /* Default */
  --mw-color-primary-800: #66001b; /* Hover */
  --mw-color-primary-900: #540013; /* Active */
  --mw-color-primary-950: #2c0006;
  --mw-color-primary-contrast-on-light: #292929;
  --mw-color-primary-contrast-on-dark: #ffffff;

  --mw-color-primary: var(--mw-color-primary-700);
  --mw-color-primary--hover: var(--mw-color-primary-800);
  --mw-color-primary--active: var(--mw-color-primary-900);
  --mw-color-primary--contrast: var(--mw-color-primary-contrast-on-dark);

  --mw-button-border-radius: var(--mw-border-radius-5);
}

[data-component-search-form-scaffold] {
  [data-component='InputSubmitControl'] {
    --mw--input-submit-control--border-radius-normal: var(--mw-border-radius-5);
    [data-component='Button'] {
      --mw--button--padding: var(--mw-space-6);
    }
  }
}

[data-component='Ticket'] {
  --mw--ticket--text-highlight-color: var(--mw-color-secondary);
  --mw--ticket--aside-background-color: var(--mw-color-secondary);
  --mw--ticket--aside-on-background-color: var(--mw-color-secondary--contrast);
}

[data-component-site-footer] {
  --mw--site-footer--background-color: var(--mw-color-neutral-0);
  --mw--site-footer--text-color: var(--mw-color-neutral-800);
  --mw--site-footer--link-color: var(--mw-color-neutral-800);
  --mw--site-footer--link-color--hover: var(--mw-color-primary--hover);
  --mw--site-footer--link-color--active: var(--mw-color-primary--active);
  --mw--site-footer--button-background-color--hover: var(
    --mw-color-primary--hover
  );
  --mw--site-footer--button-background-color--active: var(
    --mw-color-primary--active
  );
}

[data-component-site-header] {
  --mw--site-header--background-color: var(--mw-color-neutral-0);
  --mw--site-header--link--color: var(--mw-color-neutral-800);
  --mw--site-header--link--background-color--hover: var(--mw-color-neutral-100);
  --mw--site-header--link--background-color--active: var(
    --mw-color-neutral-200
  );
  --mw--site-header--link--background-color--selected: var(
    --mw-color-neutral-100
  );
  --mw--site-header--shadow: var(--mw-shadow-level-2);
}
