/*
=========================================================
SEARCH CSS
=========================================================
 * Innehåller styling av modulen Sök och Sök Facetterad
 * som är modifierad med exempelvis SVG-ikon
 *
 * Copyright (C) Limepark AB.
 * https://limepark.se/licensvillkor
=========================================================*/


/*
---------------------------------------------------------
SÖK + Sök facetterad
--------------------------------------------------------- */

/* Sökformulär och knapp*/
.lp-search form {
  position: relative;
}

.lp-search input[type='text'] {
  margin: 0; /* Fix för extra margin i Safari*/
  width: 100%;
}

.lp-search input[type='submit'],
.lp-search form button {
  background-color: transparent;
  border: 1px solid transparent;
  bottom: 0;
  margin: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.lp-search button .lp-icon {
  color: #777;
}

.lp-search input[type='submit']:hover,
.lp-search button:hover {
  background-color: transparent;
  border-color: transparent;
}

.lp-search input[type='submit']:hover {
  background-color: transparent;
  border-color: transparent;
}

.lp-search button:focus {
  background-color: #ccc;
  border-color: transparent;
  color: #000;
}

.lp-search button:hover .lp-icon {
  color: #333;
}


/* Facetter */
.lp-search .lp-facets {
  margin: 1rem 0 0;
}

.lp-search .lp-facet-sort,
.lp-search .lp-facet-field {
  display: inline-block;
  margin: 0 1rem 0 0;
}

.lp-search .lp-facets h2 {
  font-size: 1.4rem;
  font-weight: bold;
  margin: 0.5rem 0;
}

.lp-search .lp-facets ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.lp-search .lp-facets li {
  display: inline-block;
  margin: 0 0.4rem 1rem 0;
}

.lp-search .lp-facets a,
.lp-search .lp-facets span {
  border: 1px solid #ccc;
  display: inline-block;
  font-size: 1.4rem;
  line-height: 1.4;
  padding: 0.5rem 1rem;
  text-decoration: none;
}

.lp-search .lp-facets a:hover {
  background: #eee;
}

.lp-search .lp-facets span {
  color: #444;
  font-style: italic;
}

.lp-search .lp-sort-active,
.lp-search .lp-facet-selected a {
  background: #eee;
  color: #000;
}

.lp-search .lp-facets .lp-icon {
  height: 1.2rem;
  margin: 0 0.5rem 0 0;
  width: 1.2rem;
}


/* Sökresultat */
.lp-search .sv-search-result li {
  padding: 2rem !important;
}

.lp-search .sv-search-result li a.subheading {
  font-size: 2.2rem;
}

.lp-search .sv-search-result li img {
  margin-right: 0.8rem;
}

.lp-search .sv-search-result li:nth-child(odd) {
  background: #f5f5f5;
}

.lp-search .sv-search-result li div:last-child span:last-child a:first-child {
  display: none;
}

/* Sök-toggle */
.lp-facett-toggler {
  border-radius: 2px;
  cursor: pointer;
  display: block;
  position: relative;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.lp-facett-toggler h2.subheading {
  font-family: inherit;
  font-size: 18px;
  font-weight: bold;
  margin: 0;
}

.lp-facett-container {
  overflow: auto;
  padding: 10px 10px 0 10px;
}

.lp-facett-container > div {
  float: left;
  margin-bottom: 10px !important;
  width: 50%;
}

.lp-facett-container p {
  font-family: inherit;
  font-size: 20px;
  margin: 0 0 15px;
  padding: 0 0 0 15px;
}

.lp-facett-container li {
  padding: 0 0 0 15px;
}

.lp-facett-container li a {
  margin: 0 0 0 -15px;
  padding: 0 0 0 15px;
  text-decoration: underline;
}

.lp-facett-container .lp-selected a {
  background: no-repeat 0 50% url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOBAMAAADtZjDiAAAAFVBMVEVOTk5OTk5OTk5OTk5OTk5OTk5OTk5UCZgEAAAABnRSTlMBop5tZQXabb1LAAAAVUlEQVQI1zWNsQ2AIBQFD+IA2FAbCzaQ2ooFnAAwf/8RfN+E8i6X93huYLuoHciTZolgL9E62Q4ottsACXOUcPRYBRDk04+nhHBQJJriqJ3qcZnr5wOsGxDfkqIeGwAAAABJRU5ErkJggg==');
  background-size: 7px;
  font-weight: bold;
}

.lp-facett .lp-expandable-content__toggler {
  -webkit-box-align: center;
  align-items: center;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: center;
  -ms-flex-pack: justify;
  width: 100%;

  -webkit-box-pack: justify;
  justify-content: space-between;
}

.lp-facett-container p.subheading {
  display: block;
}