/*
=========================================================
FILTERABLE LIST
=========================================================
 * Innehåller styling av modulen Filtrerbar listning
 *
 * Copyright (C) Limepark AB.
 * https://limepark.se/licensvillkor
=========================================================*/

/*
---------------------------------------------------------
VARIABLER
---------------------------------------------------------*/

body .lp-filterable-list {
  --lp-filterable-list__border-color: var(--lp-color-1);
  --lp-filterable-list__border-radius: var(--lp-border-radius);
  --lp-filterable-list__box-grid: var(--lp-grid-default);
  --lp-filterable-list__control--border-color: var(--lp-color-1);
  --lp-filterable-list__control--border-radius: var(--env-badge-border-radius);
  --lp-filterable-list__font-color: var(--lp-font-color);
  --lp-filterable-list__font-family: var(--lp-font-family);
  --lp-filterable-list__grid-gap: var(--env-spacing-medium);
  --lp-filterable-list__margin: var(--lp-spacing-small);
  --lp-filterable-list__padding: var(--lp-spacing);
  --lp-filterable-list__primary-color: var(--lp-color-1);
  --lp-filterable-list__reset--background: transparent;
  --lp-filterable-list__reset-button--color: var(--env-element-primary-background-color);
  --lp-filterable-list__reset-icon: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22%23006875%22%20aria-hidden%3D%22true%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20d%3D%22M24%204C12.972%204%204%2012.972%204%2024s8.972%2020%2020%2020%2020-8.972%2020-20S35.028%204%2024%204zm0%203c9.407%200%2017%207.593%2017%2017s-7.593%2017-17%2017S7%2033.407%207%2024%2014.593%207%2024%207zm6.486%208.979a1.5%201.5%200%200%200-1.047.46L24%2021.88l-5.44-5.44a1.5%201.5%200%200%200-1.076-.455%201.5%201.5%200%200%200-1.045%202.577L21.88%2024l-5.44%205.44a1.5%201.5%200%201%200%202.122%202.12L24%2026.122l5.44%205.44a1.5%201.5%200%201%200%202.12-2.122L26.122%2024l5.44-5.44a1.5%201.5%200%200%200-1.075-2.581z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
  --lp-filterable-list__reset-icon--hover: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22%23fff%22%20aria-hidden%3D%22true%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20d%3D%22M24%204C12.972%204%204%2012.972%204%2024s8.972%2020%2020%2020%2020-8.972%2020-20S35.028%204%2024%204zm0%203c9.407%200%2017%207.593%2017%2017s-7.593%2017-17%2017S7%2033.407%207%2024%2014.593%207%2024%207zm6.486%208.979a1.5%201.5%200%200%200-1.047.46L24%2021.88l-5.44-5.44a1.5%201.5%200%200%200-1.076-.455%201.5%201.5%200%200%200-1.045%202.577L21.88%2024l-5.44%205.44a1.5%201.5%200%201%200%202.122%202.12L24%2026.122l5.44%205.44a1.5%201.5%200%201%200%202.12-2.122L26.122%2024l5.44-5.44a1.5%201.5%200%200%200-1.075-2.581z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
  --lp-filterable-list__transition: var(--lp-transition-default);
}

/*
---------------------------------------------------------
FILTRERING
---------------------------------------------------------*/

div .lp-filterable-list .lp-filterable-list-filter {
  border-bottom: 0;
  margin-bottom: var(--lp-spacing-small);
  padding-bottom: 0;
}

div .lp-filterable-list .lp-filterable-list-text-search input {
  border-radius: var(--lp-button-border-radius);
  border-width: 1px;
  box-sizing: border-box;
  font-size: var(--lp-font-size-2);
  max-width: 100%;
  outline: none !important;
  padding: 0.8em 1.2em;
  width: 100%;
}

div .lp-filterable-list .lp-filterable-list-text-search__label label,
div .lp-filterable-list .lp-filterable-list-category-field__heading,
div .lp-filterable-list .lp-filterable-list-date__label label,
div .lp-filterable-list .lp-filterable-list-category-field__label {
  display: inline-block;
  font-size: var(--lp-font-size-2);
  font-weight: 500;
  margin-bottom: 0.4em;
}

div .lp-filterable-list .lp-filterable-list-date input {
  border-radius: var(--env-badge-border-radius);
  border-width: 1px;
  font-size: var(--lp-font-size-1);
  font-weight: 300;
  line-height: 1.4;
  padding: 0.6em 0.9em;
}

div .lp-filterable-list .lp-filterable-list-date input::-webkit-calendar-picker-indicator {
  background-color: var(--lp-filterable-list__primary-color);
  background-image: none;
  cursor: pointer;
  transition: var(--lp-transition-default);

  -webkit-mask-image: var(--lp-icon-lp-calendar-dark);
  mask-image: var(--lp-icon-lp-calendar-dark);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
}

div .lp-filterable-list .lp-filterable-list-date input::-webkit-calendar-picker-indicator:hover {
  transform: scale(1.2);
}

div .lp-filterable-list .lp-filterable-list-filter select {
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22%23006875%22%20aria-hidden%3D%22true%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20d%3D%22M43.486%2011.979a1.5%201.5%200%200%200-1.047.46L24%2030.88%205.56%2012.439a1.5%201.5%200%200%200-1.076-.455%201.5%201.5%200%200%200-1.045%202.577l19.5%2019.5a1.5%201.5%200%200%200%202.122%200l19.5-19.5a1.5%201.5%200%200%200-1.075-2.582z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
  background-position: calc(100% - 0.9em) 50%;
  background-repeat: no-repeat;
  background-size: 1em 1em;
  border-radius: var(--env-badge-border-radius);
  font-size: var(--lp-font-size-1);
  font-weight: 300;
  line-height: 1.5;
  max-width: 27rem;
  padding: 0.6em 0.9em;
  width: 100%;

  appearance: none;
}

div .lp-filterable-list .lp-filterable-list-category-field__wrapper,
div .lp-filterable-list .lp-filterable-list-control-group__wrapper {
  gap: 0.8em;
}

div .lp-filterable-list .lp-filterable-list-category input[type='checkbox'] + label,
div .lp-filterable-list .lp-filterable-list-category input[type='radio'] + label,
div .lp-filterable-list .lp-filterable-list-control input[type='checkbox'] + label,
div .lp-filterable-list .lp-filterable-list-control input[type='radio'] + label {
  border-radius: var(--env-badge-border-radius);
  font-size: var(--lp-font-size-1);
  font-weight: 300;
  padding: 0.6em 0.9em;
  padding-left: 2.8em;
  transition: var(--lp-transition-default);
}

div .lp-filterable-list .lp-filterable-list-category input[type='checkbox'] + label:hover,
div .lp-filterable-list .lp-filterable-list-category input[type='radio'] + label:hover,
div .lp-filterable-list .lp-filterable-list-control input[type='checkbox'] + label:hover,
div .lp-filterable-list .lp-filterable-list-control input[type='radio'] + label:hover {
  color: var(--lp-link-color);
}

div .lp-filterable-list .lp-filterable-list-category input[type='checkbox'] + label:before,
div .lp-filterable-list .lp-filterable-list-category input[type='radio'] + label:before,
div .lp-filterable-list .lp-filterable-list-control input[type='checkbox'] + label:before,
div .lp-filterable-list .lp-filterable-list-control input[type='radio'] + label:before {
  height: 1.2em;
  left: 0.9em;
  width: 1.2em;
}

div .lp-filterable-list .lp-filterable-list-category input[type='checkbox'] + label:before,
div .lp-filterable-list .lp-filterable-list-control input[type='checkbox'] + label:before {
  background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D\'0%200%2024%2024\'%20xmlns%3D\'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\'%20fill%3D\'%23fff\'%3E%3Cpath%20%20d%3D%22M14.15%2010.43L9%2015.58l-2.14-2.14-2.14-2.14-.71.71-.71.71%202.85%202.85L9%2018.42l5.86-5.86%205.86-5.86-.71-.71-.71-.71-5.15%205.15%22%2F%3E%3C%2Fsvg%3E');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 90% auto;
  border-radius: var(--env-badge-border-radius);
}

div .lp-filterable-list .lp-filterable-list-category input[type='checkbox']:checked + label:before,
div .lp-filterable-list .lp-filterable-list-control input[type='checkbox']:checked + label:before {
  box-shadow: none;
}

div .lp-filterable-list .lp-filterable-list-category input[type='checkbox']:checked + label:after,
div .lp-filterable-list .lp-filterable-list-category input[type='radio']:checked + label:after,
div .lp-filterable-list .lp-filterable-list-control input[type='checkbox']:checked + label:after,
div .lp-filterable-list .lp-filterable-list-control input[type='radio']:checked + label:after {
  content: none;
}

div .lp-filterable-list .lp-filterable-list-filter-info {
  align-items: start;
  display: flex;
  flex-direction: column;
  padding: 0;

  gap: 0;
}

div .lp-filterable-list .lp-filterable-list-filter-info:after {
  content: none;
}

div .lp-filterable-list .lp-filterable-list-filter-info-text__hits {
  font-weight: 500;
}

div .lp-filterable-list .lp-filterable-list-filter-info__reset {
  align-items: center;
  background-color: transparent;
  border: 1px solid var(--env-element-primary-background-color);
  border-radius: var(--lp-button-border-radius);
  box-sizing: border-box;
  color: var(--env-element-primary-background-color);
  display: inline-flex;
  font-family: var(--env-button-font-family);
  font-size: var(--env-font-size-medium);
  font-weight: 500;
  line-height: 1.5;
  margin-left: 0;
  margin-top: 1em;
  min-height: 2.75em;
  padding: 0 1.3125em;
  padding-bottom: 0.5em;
  padding-top: 0.5em;
  text-align: center;
  text-decoration: none;
  transition: var(--lp-transition-default);
}

div .lp-filterable-list .lp-filterable-list-filter-info__reset:hover {
  background-color: var(--env-element-primary-background-color-dark);
  border-color: var(--env-element-primary-background-color-dark);
  color: var(--env-element-primary-font-color);
}

div .lp-filterable-list .lp-filterable-list-filter-info__reset:after {
  height: 1.2em;
  margin-bottom: -0.1em;
  width: 1.2em;
}

div .lp-filterable-list .lp-filterable-list-filter-info__reset:hover:after {
  background-image: var(--lp-filterable-list__reset-icon--hover);
}


/*
---------------------------------------------------------
LISTNING
---------------------------------------------------------*/

div .lp-filterable-list .lp-filterable-list-list {
  margin-top: var(--lp-spacing-large);
}

div .lp-filterable-list .lp-filterable-list-item {
  border: var(--lp-box-border);
  box-shadow: var(--lp-box-shadow);
  transition: var(--lp-transition-default);
}

div .lp-filterable-list-item:focus-within {
  box-shadow: 0 0 0 var(--env-focus-size) var(--env-focus-inner-color);
  outline: var(--env-focus-size) solid var(--lp-link-color);
  outline-offset: var(--env-focus-offset);
}

div .lp-filterable-list-item:focus-within a:focus-visible {
  box-shadow: none;
  outline: none;
}

div .lp-filterable-list .lp-filterable-list-item.lp-filterable-list--clickable-area:hover {
  box-shadow: var(--lp-box-shadow--hover);
  transform: scale(1.02);
}

div .lp-filterable-list .lp-filterable-list-item-content__heading {
  font-size: var(--lp-font-size-4);
  font-weight: 500;
  margin-bottom: 0.3em;
}

div .lp-filterable-list .lp-filterable-list-item-content__heading a:hover,
div .lp-filterable-list--clickable-area:hover .lp-filterable-list-item-content__heading a {
  color: var(--lp-link-color);
  text-decoration: underline;
}

div .lp-filterable-list .lp-filterable-list-item-content__description {
  font-size: var(--lp-font-size-2);
  margin-bottom: 0.5em;
  margin-top: 0;
}

div .lp-filterable-list .lp-filterable-list-item-categories {
  margin-top: 0.5em;
}

div .lp-filterable-list .lp-filterable-list-item-category:after {
  content: none;
}

div .lp-filterable-list .lp-filterable-list-item-category {
  background-color: var(--env-ui-color-status-neutral);
  border-radius: var(--env-badge-border-radius);
  color: var(--lp-color-3-contrast);
  color: var(--env-ui-color-status-neutral-contrast);
  font-size: var(--lp-font-size-1);
  padding: 0.6em 0.9em;
  text-decoration: none;
  transition: var(--lp-transition-default);
}

div .lp-filterable-list a.lp-filterable-list-item-category:hover {
  color: var(--lp-link-color);
  text-decoration: underline;
}

/*
---------------------------------------------------------
KORTVY
---------------------------------------------------------*/

div .lp-filterable-list--template-cards h2.lp-filterable-list-item-content__heading a {
  display: block;
  font-size: clamp(1.6rem, 1.9vw, 1.9rem);
  font-weight: 600;
  margin: 0 0 0.6em;
  padding-right: 1.3em;
  text-decoration: none;
}

div .lp-filterable-list--template-cards h2.lp-filterable-list-item-content__heading a:hover {
  display: block;
  font-size: clamp(1.6rem, 1.9vw, 1.9rem);
  font-weight: 600;
  margin: 0 0 0.6em;
  padding-right: 1.3em;
  text-decoration: none;
}

div .lp-filterable-list--template-cards h2.lp-filterable-list-item-content__heading a:after {
  background-color: #000;
  background-repeat: no-repeat;
  content: '';
  display: inline-block;
  font-size: 1em;
  height: 1em;
  margin-bottom: -0.1em;
  margin-left: 0.3em;
  margin-right: -1.3em;
  overflow: hidden;
  transition: var(--lp-transition-default);
  vertical-align: -0.05em;
  width: 1em;

  mask-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22%23000%22%20aria-hidden%3D%22true%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20d%3D%22M34.484%2011.984a1.5%201.5%200%200%200-1.045%202.577L40.88%2022H3.5a1.5%201.5%200%201%200%200%203h37.379l-7.44%207.44a1.5%201.5%200%201%200%202.122%202.12l10-10a1.5%201.5%200%200%200%200-2.12l-10-10a1.5%201.5%200%200%200-1.077-.456z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
}


div .lp-filterable-list--template-cards h2.lp-filterable-list-item-content__heading a:hover:after,
div .lp-filterable-list--clickable-area:hover a:after {
  background-color: var(--lp-link-color) !important;
  transform: translateX(0.3em);
}



/*
---------------------------------------------------------
LISTVY
---------------------------------------------------------*/

div .lp-filterable-list--template-list .lp-filterable-list-item {
  flex-direction: column;
}

div .lp-filterable-list--template-list .lp-filterable-list-item-content {
  display: flex;
  flex-direction: column;
}

div .lp-filterable-list--template-list .lp-filterable-list-item-content__details {
  order: 3;
}

/*
---------------------------------------------------------
EVENEMANG
---------------------------------------------------------*/

div .lp-filterable-list .lp-filterable-list-list--event {
  display: grid;
  list-style: none;
  margin: 0;
  margin-bottom: var(--lp-spacing-box);
  padding: 0;

  gap: var(--lp-filterable-list__grid-gap);
  grid-template-columns: 1fr;
}

div .lp-filterable-list-list--event .lp-filterable-list-item {
  align-items: start;
  background-color: #fff;
  display: flex;
  padding: var(--lp-filterable-list__padding);

  gap: var(--lp-spacing-small);
}


div .lp-filterable-list-list--event .lp-filterable-list-item-content {
  display: flex;
  flex-direction: column;
  max-width: 68rem;
  padding: 0;

  flex: 1 1 auto;
}

div .lp-filterable-list-list--event .lp-filterable-list-item-content__heading {
  margin-bottom: 0.5em;
  margin-top: -0.2em;
}

div .lp-filterable-list-list--event .lp-filterable-list-item__date-tag {
  align-items: center;
  border: 1px solid var(--lp-filterable-list__primary-color);
  border-radius: var(--env-badge-border-radius);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-width: 8rem;
  overflow: hidden;
}

div .lp-filterable-list-list--event .lp-filterable-list-item__date-tag-month {
  background-color: var(--lp-color-1);
  box-sizing: border-box;
  color: var(--lp-color-1-contrast);
  display: block;
  font-size: var(--lp-font-size-3);
  font-weight: 500;
  margin: 0;
  padding: 0.1em 0.2em;
  text-align: center;
  text-transform: uppercase;
  width: 100%;
}

div .lp-filterable-list-list--event .lp-filterable-list-item__date-tag-day {
  box-sizing: border-box;
  font-size: clamp(2.8rem, 3.8vw, 4.8rem);
  font-weight: 700;
  line-height: 1.2;
  margin: 0;
  text-align: center;
  width: 100%;
}

div .lp-filterable-list-list--event .lp-filterable-list-item-content__details {
  display: flex;
  margin-bottom: 0.7em;

  flex-wrap: wrap;
  gap: 0.5em var(--lp-spacing-small);
}

div .lp-filterable-list-list--event [class*='lp-filterable-list-item-content-detail__'] {
  align-items: center;
  display: inline-flex;
  font-size: var(--lp-font-size-1);
  font-weight: 500;
  margin: 0;
}

div .lp-filterable-list-list--event [class*='lp-filterable-list-item-content-detail__']:before {
  background-image: var(--lp-icon-lp-arrow-right-dark);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  display: inline-block;
  height: 1.2em;
  margin-right: 0.3em;
  width: 1.2em;

  flex-shrink: 0;
}

div .lp-filterable-list-list--event .lp-filterable-list-item-content-detail__types:before {
  background-image: var(--lp-icon-lp-mapneedle-dark);
}

div .lp-filterable-list-list--event .lp-filterable-list-item-content-detail__time:before {
  background-image: var(--lp-icon-lp-clock-dark);
}

div .lp-filterable-list-list--event .lp-filterable-list-item-content-detail__location:before {
  background-image: var(--lp-icon-lp-home-dark);
}

div .lp-filterable-list-list--event .lp-filterable-list-item-content__tags {
  display: flex;
  margin-top: 0.5em;

  flex-wrap: wrap;
  gap: 1rem;
}

div .lp-filterable-list-list--event [class*='lp-filterable-list-item-content-tag__'] {
  background-color: var(--env-ui-color-status-neutral);
  border-radius: var(--env-badge-border-radius);
  color: var(--lp-color-3-contrast);
  color: var(--env-ui-color-status-neutral-contrast);
  font-size: var(--lp-font-size-1);
  margin: 0;
  padding: 0.6em 0.9em;
  text-decoration: none;
  transition: var(--lp-transition-default);
}

div .lp-filterable-list-list--event a[class*='lp-filterable-list-item-content-tag__']:hover {
  color: var(--lp-link-color);
  text-decoration: underline;
}

/* Filter - Categories 

body .lp-filterable-list-filter {
  border-bottom: none;
  margin: calc(var(--lp-filterable-list__margin) * 1.5) 0;
  padding-bottom: 0;
}

body .lp-filterable-list-category-field__heading,
body .lp-filterable-list-filter label,
body .lp-filterable-list-filter legend {
  font-weight: 600;
}

body .lp-filterable-list-category input[type='checkbox'] + label,
body .lp-filterable-list-category input[type='radio'] + label,
body .lp-filterable-list-date input,
body .lp-filterable-list-text-search input,
body .lp-filterable-list-filter select {
  border-radius: calc(var(--lp-filterable-list__border-radius) / 2);
  border-width: 1px;
  opacity: 1;
}

body .lp-filterable-list-filter-info {
  font-size: var(--lp-font-size-1);
  padding-left: 0;
}

body .lp-filterable-list-filter-info:after {
  background-color: transparent;
}

/* List 

body .lp-filterable-list-list {
  margin: var(--lp-spacing-small) 0 var(--lp-spacing-large);
}

body .lp-filterable-list-item {
  border: none;
  border-bottom: 1px solid var(--lp-filterable-list__border-color);
  border-radius: 0;
  transition: var(--lp-filterable-list__transition);
}

body .lp-filterable-list-item:first-child {
  border-top: 1px solid var(--lp-filterable-list__border-color);
  padding-top: var(--lp-filterable-list__padding);
}

/* body .lp-filterable-list-item:hover {
  transform: scale(1.02);
} 

body .lp-filterable-list-item-category:after {
  background-color: var(--lp-filterable-list__primary-color);
  background-color: #332e24;
  border-radius: calc(var(--lp-filterable-list__border-radius) / 2);
  opacity: 1;
}

body .lp-filterable-list-item-content__heading {
  font-size: var(--lp-font-size-3);
  margin-bottom: calc(var(--lp-filterable-list__margin) / 2);
}

body .lp-filterable-list-item-category {
  color: var(--lp-color-1-contrast);
  font-size: var(--lp-font-size-1);

  isolation: isolate;
}


/* Events 

body .lp-filterable-list-list--event {
  padding: 0;
}

body .lp-filterable-list-list--event .lp-filterable-list-item {
  border: none;
  border-radius: var(--lp-border-radius);
  box-shadow: var(--lp-box-shadow);
  display: flex;
  padding: var(--lp-spacing);

  flex-wrap: wrap;
  gap: 1em var(--lp-filterable-list__padding);
}

body .lp-filterable-list-list--event .lp-filterable-list-item:not(:last-child) {
  margin-bottom: var(--lp-spacing);
}

body .lp-filterable-list-list--event .lp-filterable-list-item__date-tag {
  align-items: center;
  border: 1px solid var(--lp-color-brand);
  border-radius: var(--lp-border-radius);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  margin-top: 5px;
  min-width: 70px;
  overflow: hidden;

  align-self: start;
  justify-content: center;
}

body .lp-filterable-list-list--event .lp-filterable-list-item__date-tag * {
  font-weight: 600;
  margin: 0;
  padding: 0.4em 0.8em 0.6em;
  text-align: center;
  text-transform: uppercase;
}

body .lp-filterable-list-list--event .lp-filterable-list-item__date-tag .lp-filterable-list-item__date-tag-month {
  background-color: var(--lp-color-brand);
  box-sizing: border-box;
  color: var(--env-element-primary-font-color);
  padding: 0.2em 0.8em 0.3em;
  width: 100%;
}

body .lp-filterable-list-list--event .lp-filterable-list-item-content {
  min-width: min(35rem, 100%);
  padding: 0;

  flex: 1 1 1px;
}

body .lp-filterable-list-list--event .lp-filterable-list-item-content__heading {
  font-size: var(--lp-font-size-4);
}

body .lp-filterable-list-list--event .lp-filterable-list-item-content__details {
  align-items: center;
  display: flex;
  margin-top: 1rem;

  flex-wrap: wrap;
  gap: 1rem 2rem;
}

body .lp-filterable-list-list--event .lp-filterable-list-item-content__details > * {
  align-items: center;
  display: flex;
  font-size: 1.5rem;
  margin-bottom: 0;
  margin-top: 0;
}

/* I dekoration 

.lp-important-box .lp-filterable-list {
  --lp-border-color-default: rgba(0,0,0,0.2);
}

.lp-important-box .lp-filterable-list-item:first-child {
  padding-top: 0;
}

.lp-important-box .lp-filterable-list-item-content {
  padding: var(--lp-spacing-small);
}

.lp-important-box .lp-filterable-list-item-content:not(:has(.lp-filterable-list-item-content__details > p)) .lp-filterable-list-item-content__heading {
  margin-bottom: 0;
}

.lp-important-box .lp-filterable-list--template-list .lp-filterable-list-list {
  gap: 0;
}

.lp-important-box .lp-filterable-list-filter-info {
  background-color: rgba(255,255,255, 0.3);
  border-radius: var(--lp-border-radius);
  padding-left: var(--lp-filterable-list__padding);
}
*/

/*
---------------------------------------------------------
RÅDGIVARE
---------------------------------------------------------*/

div .lp-filterable-list .lp-filterable-list-list--contact {
  display: grid;
  list-style: none;
  margin: 0;
  padding: 0;

  gap: var(--lp-spacing);
  grid-template-columns: repeat(auto-fill, minmax(min(40rem, 100%), 1fr));
}

div .lp-filterable-list .lp-filterable-list-list.lp-filterable-list-list--contact {
  margin-top: var(--lp-spacing);
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content {
  padding: var(--lp-spacing-small);
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content__heading {
  font-size: var(--lp-font-size-3);
  margin-bottom: 0.6em;
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content-detail__heading {
  font-size: var(--lp-font-size-2);
  font-weight: 500;
  margin-bottom: 0.8em;
  margin-top: 1.2em;
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content-tag__municipality {
  margin: 0;
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content__details p,
div .lp-filterable-list-list--contact .lp-filterable-list-item-content__details a {
  font-size: var(--lp-font-size-1);
  margin-bottom: 0.8em;
  margin-top: 0;
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content__details a {
  color: var(--lp-link-color);
  transition: var(--lp-transition-default);

  text-underline-offset: 0.15em;
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content__details a:hover {
  text-underline-offset: 0.3em;
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content__details p.lp-filterable-list-item-category {
  margin-bottom: 0;
}

div .lp-filterable-list-list--contact .lp-filterable-list-item-content__phone-wrapper {
  display: flex;

  flex-wrap: wrap;
  gap: 0 1.2em;
}

/*
---------------------------------------------------------
SELECT MED SÖK
---------------------------------------------------------*/

div .lp-filterable-list--select .select2-container {
  max-width: 68rem;
  width: 100% !important;
}

div .lp-filterable-list--select .select2-container .select2-selection {
  background-color: #fff;
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22%23006875%22%20aria-hidden%3D%22true%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20d%3D%22M43.486%2011.979a1.5%201.5%200%200%200-1.047.46L24%2030.88%205.56%2012.439a1.5%201.5%200%200%200-1.076-.455%201.5%201.5%200%200%200-1.045%202.577l19.5%2019.5a1.5%201.5%200%200%200%202.122%200l19.5-19.5a1.5%201.5%200%200%200-1.075-2.582z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
  background-position: calc(100% - 0.9em) 50%;
  background-repeat: no-repeat;
  background-size: 1em 1em;
  border-color: var(--lp-filterable-list__border-color);
  border-radius: var(--env-badge-border-radius);
  box-shadow: none;
  color: var(--lp-font-color);
  font-family: var(--lp-filterable-list__font-family);
  font-size: var(--lp-font-size-1);
  font-weight: 300;
  height: auto;
  line-height: 1.5;
  padding: 0.6em 0.9em;
  width: 100%;

  appearance: none;
}

div .lp-filterable-list--select .select2-container .select2-selection .select2-selection__placeholder {
  color: var(--lp-font-color);
  font-family: var(--lp-filterable-list__font-family);
  font-size: var(--lp-font-size-1);
}

div .lp-filterable-list--select .select2-container--default
div .lp-filterable-list--select .select2-selection--single
div .lp-filterable-list--select .select2-selection__placeholder {
  color: var(--lp-font-color);
}

div .lp-filterable-list--select .select2-container .select2-selection .select2-selection__arrow {
  display: none;
}

div .lp-filterable-list--select .select2-container .select2-selection .select2-selection__rendered {
  line-height: 1.5;
  padding: 0;
  padding-right: 1em;
}

.select2-container {
  --lp-filterable-list__border-color: var(--lp-color-1);
  --lp-filterable-list__font-family: var(--lp-font-family);
}

.select2-container .select2-dropdown {
  border-color: var(--lp-filterable-list__border-color);
  border-radius: 0 0 var(--env-badge-border-radius) var(--env-badge-border-radius);
}

.select2-container .select2-dropdown .select2-search {
  padding: 1rem;
}

.select2-container .select2-dropdown .select2-search .select2-search__field {
  border-color: var(--lp-border-color-default);
  border-radius: var(--env-form-input-border-radius);
  color: var(--lp-font-color);
  font-family: var(--lp-filterable-list__font-family);
  font-size: var(--lp-font-size-1);
  line-height: 1.5;
  padding: 0.3em 0.5em;
}

.select2-container .select2-dropdown .select2-results__option {
  color: var(--lp-font-color);
  font-family: var(--lp-filterable-list__font-family);
  font-size: var(--lp-font-size-1);
  line-height: 1.5;
  padding: 0.8rem 1rem;
}

.select2-container .select2-dropdown .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--lp-color-1);
  color: var(--lp-color-1-contrast);
}

.select2-container .select2-dropdown .select2-results__option--selected {
  background-color: var(--lp-color-4);
  color: var(--lp-color-4-contrast);
}

/*
---------------------------------------------------------
ADMIN
---------------------------------------------------------*/

div .lp-filterable-list--admin .lp-filterable-list {
  --lp-filterable-list__grid-gap: 1rem;
  --lp-filterable-list__padding: var(--lp-spacing-small);
}

div .lp-filterable-list--admin .lp-filterable-list .lp-filterable-list-item-content__heading {
  font-size: var(--lp-font-size-2);
}

div .lp-filterable-list--admin .lp-filterable-list-item-date {
  margin-bottom: 0;
}

div .lp-filterable-list--admin .lp-filterable-list-list {
  counter-reset: section;
}

div .lp-filterable-list--admin .lp-filterable-list .lp-filterable-list-item {
  align-items: center;
  flex-direction: row;
  overflow: visible;
  padding-left: var(--lp-filterable-list__padding);
  position: relative;

  gap: 0;
}

div .lp-filterable-list--admin .lp-filterable-list-item:before {
  align-items: center;
  background-color: var(--lp-color-1);
  border-radius: 50%;
  box-sizing: border-box;
  color: var(--lp-color-1-contrast);
  content: counter(section);
  counter-increment: section;
  display: flex;
  flex-direction: column;
  font-size: 1.8rem;
  min-height: 3rem;
  padding: 0.2em;

  aspect-ratio: 1 / 1;
  flex-grow: 0;
  flex-shrink: 0;
  justify-content: center;
}
