@import './_core.css';
@import '_sparkassen-colors.css';
@import '../fonts/sparkasse.css';
@import '../fonts/nitti-typewriter.css';

:root {
  /** special portal fonts */
  --font-family-special:
    'Nitti Typewriter', 'Segoe UI', Helvetica, Arial, sans-serif;

  --mw-border-radius-1: 0;
  --mw-border-radius-2: 0;
  --mw-border-radius-3: 0;
  --mw-border-radius-4: 0;
  --mw-input-background-color: var(--mw-color-neutral-100);
  --mw-input-disabled-background-color: var(--mw-color-neutral-200);
}

[data-component='Button'] {
  --mw--button--font-family:
    'Sparkasse Lt', 'Segoe UI', Helvetica, Arial, sans-serif;
  --mw--button--font-weight: 400;
}

[data-component='Headline'] {
  --mw--headline--font-family: var(--font-family-special);
  --mw--headline--text-color: var(--mw-color-secondary-900);
}

[data-component='Ticket'] {
  --mw--ticket--font-family-headline: var(--font-family-special);
}

[data-component='Table'] {
  --mw--table--header-background-color: var(--mw-color-neutral-800);
  --mw--table--body-text-color: var(--mw-color-neutral-800);
  --mw--table--header-text-color: var(--mw-color-neutral-0);
  --mw--table--footer-text-color: var(--mw-color-primary--contrast);
  --mw--table--footer-background-color: var(--mw-color-primary);
}

[data-component='Accordion'] {
  --mw--accordion--headline-color--open: var(--mw-color-primary);
}

[data-component='ContactForm'] {
  --mw--form-heading-border-bottom: 1px solid var(--mw-color-neutral);
  --mw--form-heading-border-bottom-margin-bottom: var(--mw-space-6);
}

[data-component='AngledHeading'] {
  --mw--angled-heading--font-family: var(--font-family-special);
  --mw--angled-heading--text-color: var(--mw-color-neutral-600);
}

[data-component='MediaWithContentSection'] {
  --mw--media-with-content-section--heading--font-family: var(
    --font-family-special
  );
  --mw--media-with-content-section--heading--font-size: clamp(
    var(--mw-font-size-9),
    3vw,
    var(--mw-font-size-10)
  );
  --mw--media-with-content-section--background-color--accent: transparent;
  --mw--media-with-content-section--background-image--accent: url('/img/dasechte-bg.png');
  --mw--media-with-content-section--button--background-color--accent: var(
    --mw-color-primary
  );
  --mw--media-with-content-section--button--background-color--active--default: var(
    --mw-color-primary--active
  );
  --mw--media-with-content-section--button--background-color--default: var(
    --mw-color-primary
  );
  --mw--media-with-content-section--button--background-color--hover--default: var(
    --mw-color-primary--hover
  );
  --mw--media-with-content-section--button--border-color--accent: transparent;
  --mw--media-with-content-section--button--border-color--default: transparent;
  --mw--media-with-content-section--button--text-color--accent: var(
    --mw-color-primary--contrast
  );
  --mw--media-with-content-section--button--text-color--default: var(
    --mw-color-primary--contrast
  );
  --mw--media-with-content-section--text-color--accent: var(
    --mw-color-neutral-0
  );
}

[data-component-site-footer] {
  --mw--site-footer--background-color: var(--mw-color-neutral-700);
  --mw--site-footer--link-color--hover: var(--mw-color-primary-500);
  --mw--site-footer--link-color--active: var(--mw-color-primary-600);
  --mw--site-footer--button-background-color--hover: var(
    --mw-color-primary-500
  );
  --mw--site-footer--button-background-color--active: var(
    --mw-color-primary-600
  );
}

[data-component-site-header] {
  --mw--site-header--background-color: var(--mw-color-secondary);
  --mw--site-header--link--color: var(--mw-color-primary-contrast-on-dark);
  --mw--site-header--link--background-color--hover: var(
    --mw-color-secondary--hover
  );
  --mw--site-header--link--background-color--active: var(
    --mw-color-secondary--active
  );
  --mw--site-header--link--background-color--selected: var(
    --mw-color-secondary--hover
  );
}