/*
=========================================================
PAGE CSS
=========================================================
 * Innehåller styling för mallen Sida och Artikel
 * 
 * Copyright (C) Limepark AB.
 * https://limepark.se/licensvillkor
=========================================================*/


/*
---------------------------------------------------------
SPECIALANPASSNINGAR
--------------------------------------------------------- */

.lp-content .pagecontent {
  max-width: 84rem;
  /* margin-left: auto;
  margin-right: auto; */
}

/*
---------------------------------------------------------
MENY
--------------------------------------------------------- */

.lp-submenu .lp-app-submenu {
  --lp-submenu__link-background-color--level-1: var(--lp-body--background);
  --lp-submenu__link-background-color--level-2: var(--lp-body--background);
  --lp-submenu__link-background-color--level-3: var(--lp-body--background);
  --lp-submenu__link-background-color--level-4: var(--lp-body--background);
  --lp-submenu__link-background-color--level-5: var(--lp-body--background);
  --lp-submenu__link-background-color--level-6: var(--lp-body--background);
  --lp-submenu__link-font-color--level-1: var(--lp-font-color);
  --lp-submenu__link-font-color--level-2: var(--lp-font-color);
  --lp-submenu__link-font-color--level-3: var(--lp-font-color);
  --lp-submenu__link-font-color--level-4: var(--lp-font-color);
  --lp-submenu__link-font-color--level-5: var(--lp-font-color);
  --lp-submenu__link-font-color--level-6: var(--lp-font-color);
  --lp-submenu__link-font-size--level-1: var(--lp-font-size-medium);
  --lp-submenu__toggler-background-color--hover-level-1: var(--lp-font-color);
  --lp-submenu__toggler-background-color--level-1: var(--lp-body--background);
  --lp-submenu__toggler-background-color--level-2: var(--lp-body--background);
  --lp-submenu__toggler-background-color--level-3: var(--lp-body--background);
  --lp-submenu__toggler-background-color--level-4: var(--lp-body--background);
  --lp-submenu__toggler-background-color--level-5: var(--lp-body--background);
  --lp-submenu__toggler-background-color--level-6: var(--lp-body--background);
  --lp-submenu__toggler-font-color--hover-level-1: var(--lp-font-color);
  --lp-submenu__toggler-font-color--level-1: var(--lp-font-color--dark-blue);
  --lp-submenu__toggler-font-color--level-2: var(--lp-font-color--dark-blue);
  --lp-submenu__toggler-font-color--level-3: var(--lp-font-color--dark-blue);
  --lp-submenu__toggler-font-color--level-4: var(--lp-font-color--dark-blue);
  --lp-submenu__toggler-font-color--level-5: var(--lp-font-color--dark-blue);
  --lp-submenu__toggler-font-color--level-6: var(--lp-font-color--dark-blue);
  --lp-submenu__link-indent--level-1: calc(1 * var(--lp-submenu__link-indent));
  --lp-submenu__toggler-font-size: 1.8em;
  --lp-submenu__border: 1px solid var(--lp-font-color--light-blue);
  --lp-submenu__link-font-weight--is-current: 500;
  --lp-submenu__link-font-size: clamp(1.5rem, 1.5vw, 1.6rem);
  --lp-submenu__link-indent: 1.5rem;
  --lp-submenu__link-padding: 1.3rem 1.5rem 1rem;
  --lp-submenu__toggler-background-color--hover: var(--lp-element-secondary--background);
  --lp-submenu__toggler-font-color--hover: var(--lp-element-secondary--contrast);
}

.lp-submenu .lp-app-submenu__menu--level-1 {
  border: var(--lp-submenu__border);
  border-bottom: 0;
}

.lp-submenu .lp-app-submenu__menu-item__link--level-1 {
  font-family: var(--lp-font-family--heading);
  text-transform: uppercase;
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.lp-submenu .lp-app-submenu .lp-app-submenu__menu-item__toggler {
  border-left: 0;
}

.lp-submenu .lp-app-submenu__menu-item__link--is-current {
  color: var(--lp-font-color--dark-blue);
}

.lp-submenu .lp-app-submenu__menu:has(>.lp-app-submenu__menu-item--is-active)>.lp-app-submenu__menu-item:not(.lp-app-submenu__menu-item--is-active) {
  display: none;
}

/*
---------------------------------------------------------
RELATERADE ARTIKLAR
--------------------------------------------------------- */

.lp-related-wrapper-articles {
  margin-top: var(--lp-spacing-x-large);
}