/*
=========================================================
SUBMENU APP CSS
=========================================================
 * Innehåller styling av undermenyn
 *
 * Copyright (C) Limepark AB.
 * https://limepark.se/licensvillkor
=========================================================*/

/*
---------------------------------------------------------
VARIABLER UNDERMENY
---------------------------------------------------------*/
.lp-app-submenu {
  --lp-border-color: rgba(0,0,0,0.1);
  --lp-font-size-small: 1.6rem;
  --lp-font-size-x-small: 1.4rem;
}

/*
---------------------------------------------------------
KNAPPAR
---------------------------------------------------------*/

.lp-app-submenu {
  background-color: #fff;
  border: 1px solid var(--lp-border-color);
  border-radius: 8px;
  overflow: hidden;
  position: relative;
}

.lp-app-submenu:after {
  background-color: #fff;
  bottom: 0;
  content: '';
  height: 1px;
  left: 0;
  position: absolute;
  right: 0;
}

.lp-overlay__container .lp-app-submenu {
  border-bottom: 0;
  border-radius: 0;
}

.lp-overlay__container .lp-app-submenu:after {
  content: none;
}

div .lp-app-submenu__back-link {
  display: block;
}

div .lp-app-submenu__back-link {
  background-color: #214676;
}

div .lp-app-submenu--default-toggler-icons .lp-app-submenu__menu-item__toggler:after,
div .lp-app-submenu--default-toggler-icons .lp-app-submenu__menu-item__toggler:before {
  font-size: 1rem;
}

div .lp-app-submenu__toggler-icon {
  color: #333;
  font-size: 2rem;
}

div .lp-app-submenu__menu-item__link {
  font-size: var(--lp-font-size-x-small);
}

/* Bakgrundsfärg och kantlinjer per nivå - länk och knapp */
div .lp-app-submenu__menu-item__link,
div .lp-app-submenu__menu-item__toggler {
  background-color: #fff;
  border-color: var(--lp-border-color);
  border-left-width: 0;
}

div .lp-app-submenu__menu-item__link--level-1,
div .lp-app-submenu__menu-item__toggler--level-1 {
  background-color: #3c71b6;
  color: #fff;
}

div .lp-app-submenu__menu-item__toggler--level-1:hover {
  background-color: rgba(0, 0, 0, 0.1);
  cursor: pointer;
}

.lp-app-submenu__menu-item__link--level-2,
.lp-app-submenu__menu-item__toggler--level-2 {
  background-color: #fff;
}

div .lp-app-submenu__menu-item__link--level-3,
div .lp-app-submenu__menu-item__toggler--level-3 {
  background-color: #fff;
}

/*
div .lp-app-submenu__menu-item--level-2.lp-app-submenu__menu-item--is-active > * {
  background-color: rgba(255, 255, 255, 1);
}*/

div .lp-app-submenu__menu-item__toggler:hover {
  background-color: rgba(60,113,182, 0.2);
  cursor: pointer;
}

div .lp-app-submenu__menu-item__link--level-4,
div .lp-app-submenu__menu-item__toggler--level-4 {
  background-color: #fff;
}

div .lp-app-submenu__menu-item__link--level-5,
div .lp-app-submenu__menu-item__toggler--level-5 {
  background-color: #fff;
}

div .lp-app-submenu__menu-item__link--level-6,
div .lp-app-submenu__menu-item__toggler--level-6 {
  background-color: #fff;
}

/* Indrag och textstorlek per nivå - länk */

div .lp-app-submenu__menu-item__link--level-1 {
  font-size: var(--lp-font-size-small);
  padding: 1.1rem 1rem 1rem 2rem;
}

div .lp-app-submenu__menu-item__link--level-2 {
  padding-left: 2rem;
}

div .lp-app-submenu__menu-item__link--level-3 {
  padding-left: 3.5rem;
}

div .lp-app-submenu__menu-item__link--level-4 {
  padding-left: 5rem;
}

div .lp-app-submenu__menu-item__link--level-5 {
  padding-left: 6.5rem;
}

div .lp-app-submenu__menu-item__link--level-6 {
  padding-left: 8rem;
}
