/* Typsnitt */

.sv-theme-pa-ren-svenska h1, 
.sv-theme-pa-ren-svenska h2, 
.sv-theme-pa-ren-svenska h3, 
.sv-theme-pa-ren-svenska h4,
.sv-theme-pa-ren-svenska h1 a, 
.sv-theme-pa-ren-svenska h2 a, 
.sv-theme-pa-ren-svenska h3 a, 
.sv-theme-pa-ren-svenska h4 a {
   font-family: var(--env-ui-text-heading-font-family);
   color: var(--env-ui-text-heading-font-color);
   --env-block-primary-link-font-color: var(--env-ui-text-heading-font-color);
}

.sv-theme-pa-ren-svenska .sv-text-portlet a,
.sv-theme-pa-ren-svenska .env-block .sv-text-portlet a {
   color: var(--env-element-secondary-background-color);
}

.sv-theme-pa-ren-svenska .env-block-secondary .sv-text-portlet a {
   color: var(--env-font-color);
   text-decoration: underline;
}

.sv-theme-pa-ren-svenska .sv-text-portlet a:hover,
.sv-theme-pa-ren-svenska .env-block .sv-text-portlet a:hover {
   color: var(--env-element-secondary-background-color);
   text-decoration: underline;
}

/* button */
.env-button:not(.env-button--ghost,.env-button--link,.env-button--primary,.env-button--secondary,.env-button--success,.env-button--warning,.env-button--danger,.env-button-info):hover {
   background-color: var(--env-element-secondary-background-color);
   border-color: var(--env-element-secondary-background-color);
   color: var(--env-element-secondary-font-color);
}

/* Brödsmulor */
.sv-theme-pa-ren-svenska .sos-breadcrumbs li a, 
.sv-theme-pa-ren-svenska .sos-breadcrumbs li a.normal:link {
   color: var(--env-font-color);
   opacity: 0.65;
}

.sv-theme-pa-ren-svenska .sos-breadcrumbs li a:hover, 
.sv-theme-pa-ren-svenska .sos-breadcrumbs li a.normal:link:hover {
   color: var(--env-element-secondary-background-color);
      opacity: 1;
}

/* Footer */

.sv-theme-pa-ren-svenska footer.env-block {
   --env-block-font-color: #fff;
	--env-block-link-hover-font-color: #fff;
	--env-block-link-font-color: #fff;
   --env-block-background-color: #000;
}

.sv-theme-pa-ren-svenska footer.env-block .sv-text-portlet a, 
.sv-theme-pa-ren-svenska footer.env-block .sv-text-portlet a {
   color: #fff;
   text-decoration: underline;
}


/* Header */
.sv-theme-pa-ren-svenska header.env-block-primary  {
   border-bottom: 1px solid var(--env-border-color);
}

@media(max-width: 641px) {
   .sv-theme-pa-ren-svenska header .env-ui-text-heading {
      font-size: 8vw;
   }
}
.sv-theme-pa-ren-svenska header .env-ui-text-heading:hover {
   text-decoration: none;
   background-color: var(--env-block-secondary-background-color);
}
.sv-theme-pa-ren-svenska header.env-block-primary {
   --env-font-color: var(--env-font-color);
   --env-ui-text-overline-font-color: var(--env-font-color);
   --env-ui-text-heading-font-color: var(--env-font-color);
    --env-ui-text-sectionheading-font-color: var(--env-font-color);
    --env-ui-text-subheading-font-color: var(--env-font-color);
    --env-ui-text-caption-font-color: var(--env-font-color);
    --env-link-font-color: var(--env-link-font-color);
    --env-link-hover-font-color: var(--env-link-hover-font-color);
    --env-link-text-decoration: var(--env-link-text-decoration);
    --env-link-hover-text-decoration: var(--env-link-hover-text-decoration);
    --env-link-secondary-font-color: var(--env-font-color);
    --env-link-secondary-hover-font-color: var(--env-link-hover-font-color);
    --env-link-secondary-text-decoration: var(--env-link-text-decoration);
    --env-link-secondary-hover-text-decoration: var(--env-link-hover-text-decoration);
    background-color: var(--env-background-color);
    color: var(--env-font-color);
}
.sv-theme-pa-ren-svenska header.env-block-primary .sos-header__button {
   background-color: var(--env-element-primary-background-color);
   border-color: var(--env-element-primary-background-color);
  	color: var(--env-element-primary-font-color);
}

.sv-theme-pa-ren-svenska header.env-block-primary .sos-header__button:hover,
.sv-theme-pa-ren-svenska header.env-block-primary .sos-header__button:focus {
   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);
}
.sv-theme-pa-ren-svenska .sos-header__button--search {
   display: none !important;
}
.sv-theme-pa-ren-svenska .sos-overlay__search input::placeholder, .sos-overlay__search input[type="search"] {
   color: var(--env-font-color);
}
   
   
   
.sv-theme-pa-ren-svenska .sos-overlay div[role="navigation"] {
   padding-top: 2em;
   --env-block-primary-link-font-color: var(--env-font-color);
}
.sv-theme-pa-ren-svenska .sos-toggleMenu > ul > li > div > a  {
   border: 0;
}
   @media (max-width: 1024px){
      .sos-toggleMenu > ul > li {
         border-color: rgba(0,0,0,0.5);
      }
   }


/* Hero */
.sv-theme-pa-ren-svenska .sap-hero.sap-hero--startpage .sap-hero__heading span,
.sv-theme-pa-ren-svenska .sap-hero.sap-hero--startpage .sap-hero__heading span {
   font-family: var(--env-ui-text-heading-font-family), serif !important;
   font-weight: var(--env-ui-text-heading-font-weight);
}
.sv-theme-pa-ren-svenska .sap-hero.sap-hero--startpage .sap-hero__heading--version2 .sap-hero__heading--white,
.sv-theme-pa-ren-svenska .sap-hero.sap-hero--startpage .sap-hero__heading--red{
	background-color: var(--env-block-secondary-background-color);
}
.sv-theme-pa-ren-svenska.mac-os .sap-hero.sap-hero--startpage .sap-hero__heading span {
   line-height: 0.75;
   padding-bottom:  0.125em;
}
   
   
/* Newslist */
.sv-theme-pa-ren-svenska .sv-newslist .sv-newslist__gallery-item article header > small:before {
   display: none;
   content: "";
}
   
@media(min-width: 641px) {
   .sv-theme-pa-ren-svenska .sv-newslist {
     margin-left: calc(var(--env-spacing-xx-large)* -1);
    margin-right: calc(var(--env-spacing-xx-large)* -1);
   }
   .sv-theme-pa-ren-svenska .sv-newslist .sv-newslist__gallery-item {
      padding: var(--env-spacing-xx-large);
      margin-bottom: 0;
   }
   .sv-theme-pa-ren-svenska .sv-newslist .sv-newslist__gallery-item article {
      flex-direction: row-reverse;
   }
   .sv-theme-pa-ren-svenska .sv-newslist .sv-newslist__gallery-item article > div:not(.sv-newslist__gallery-item__image) {
      flex-grow: 1;
      padding: 0 !important;
      padding-right: var(--env-spacing-large) !important;
      
   }
   .sv-theme-pa-ren-svenska .sv-newslist .sv-newslist__gallery-item article > div.sv-newslist__gallery-item__image {
      aspect-ratio: 4/3;
      max-width: 300px;
   } 
}


/* articles with tags */
.con-articles-container {
   display: flex;
   gap: 4em;
}
.con-article-list {
   flex-grow: 1;
   display: flex;
   flex-direction: column;
   margin-left: calc(var(--env-spacing-xx-large) * -1);
   margin-right: calc(var(--env-spacing-xx-large) * -1);
}
.con-article {
   display: flex;
   flex-direction: row-reverse;
   padding: var(--env-spacing-xx-large);
}
.con-article:hover, .con-article:focus {
   background-color: var(--env-ui-color-brand-10);
}
   
.con-article img {
   aspect-ratio: 4/3;
   object-fit: cover;
   max-width: 300px;
}
.con-article-content {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
   padding-right: var(--env-spacing-large);
   box-sizing: border-box;
}
.con-article--header {
   display: flex;
   gap: var(--env-spacing-medium);
   margin-bottom: var(--env-spacing-medium);
}
.con-article--header time {
   font-weight: 300;
}
.con-article-tags {
   display: flex;
   gap: var(--env-spacing-xx-small);
   flex-wrap: wrap;
}

.con-article--main {
   flex-grow: 1;
}
   .con-article--footer {
      margin-top: 2em;
   }
.con-article--footer .env-badge--brand-10:hover {
   background-color: var(--env-ui-color-brand-20);
   color: var(--env-ui-color-brand-20-contrast);
}
@media (max-width: 640px) {
   .con-article-list {
      margin: 0;
      gap: 2rem;
   }
   .con-article {
      flex-direction: column;
      padding: 0;
   }
   .con-article-content {
      padding: 1em;
   }
   .con-article--footer {
      margin-top: 1.25em;
   }
   .con-article img {
      aspect-ratio: 16/9;
      max-width: unset;
      width: 100%;
   }
   .con-filter-tags--selected {
      margin-bottom: 2em !important;
   }
}

/* FILTER */

.con-filter--tags {
   min-width: 220px;
   background-color: var(--env-ui-color-brand-10);
   padding: var(--env-spacing-xx-large);
   position: relative;
   margin-top: var(--env-spacing-xx-large);
}

.con-filter--tags > div {
   position: sticky;
   top: var(--env-spacing-xx-large);
}

.con-filter--tags-list {
   display: flex;
   flex-direction: column;
   gap: var(--env-spacing-small);
   margin-top: var(--env-spacing-medium);
}

.con-filter--tag {
   display: inline-block;
   padding: var(--env-spacing-xx-small) var(--env-spacing-small);
   background-color: var(--env-ui-color-brand-20);
   color: var(--env-ui-color-brand-25-contrast); 
   font-size: var(--env-font-size-small);
   font-weight: 500;
   border-radius: 5em;
   text-decoration: none;
}

.con-filter--tag:hover {
   background-color: var(--env-ui-color-brand-25);
   color: var(--env-ui-color-brand-30-contrast); 
}

.con-filter-tags--selected {
   display: flex;
   flex-wrap: wrap;
   gap: var(--env-spacing-small);
   margin: var(--env-spacing-x-small) 0;
}
   
.con-filter-tags--selected .con-filter--tag {
	background-color: var(--env-ui-color-brand-10);
	color: var(--env-ui-color-brand-20-contrast);
}
      
.con-filter-tags--selected .con-filter--tag:hover,
   .con-filter-tags--selected .con-filter--tag:focus{
   background-color: var(--env-ui-color-brand-20);
  	color: var(--env-ui-color-brand-30-contrast);
}

.con-filter-tags--selected .con-filter--tag-selected {
   display: inline-flex;
   align-items: center;
   gap: var(--env-spacing-x-small);
   background-color: var(--env-element-secondary-background-color);
   color: var(--env-element-secondary-font-color);
}

.con-filter--tag-selected .env-icon {
   width: var(--env-spacing-x-small);
  	height: var(--env-spacing-x-small);
      
}
   
/* Env collapse */
.con-filter-tags--top .env-collapse-header {
   padding: var(--env-spacing-x-small) var(--env-spacing-small);
}
.env-collapse-header > span {
   font-weight: 500;
}
.env-collapse:has(.con-filter-tags--list) {
   background-color: var(--env-ui-color-brand-10);
   border-radius: var(--env-border-radius-medium);
   padding: var(--env-spacing-medium) var(--env-spacing-small);
}
   
.con-filter-tags--list {
   display: flex;
   flex-wrap: wrap;
   gap: var(--env-spacing-x-small);
}
   
/* Puffar */
.con-article-list--puffs {
   gap: 2em;
   margin-left: 0;
   margin-right: 0;
   margin-bottom: 2em;
}
.con-article--puff {
   display: flex;
   flex-direction:column;
   padding: 0;
   background-color: #fff;
}  
.con-article--puff:hover {
	background-color: #fff;
}
.con-article--puff .con-article--thumbnail {
   max-width: unset;
   width: 100%;
   object-fit: cover;
   aspect-ratio: 4/3;
}
.con-article--puff .con-article--header {
   margin-bottom: 0;
   font-size: var(--env-font-size-small) !important;
}
.con-article--puff .con-article-content {
   padding: 1em;
}
.con-article--puff .con-article--main .con-article--heading,
.con-article--puff .con-article--main .con-article--heading a {
   font-size: var(--env-font-size-x-large);
   margin: 0;
   margin-top: 0.5em;
}
.con-article--puff .con-article--footer {
   margin-top: 1em;
}

@media(min-width: 641px){
   .con-article-list--puffs {
		flex-direction: row;
      flex-wrap: wrap;
   }
   .con-article--puff {
      box-sizing: border-box;
      width: calc(50% - 1em);
   }
}
   
@media(min-width: 1100px){

   .con-article--puff {
      box-sizing: border-box;
      width: calc(100%/3 - 1.5em);
   }
   .con-article--puff .con-article--header {
      font-size: var(--env-font-size-x-small) !important;
   }
   
   .con-article--puff .con-article--main .con-article--heading {
      font-size: var(--env-font-size-x-large) !important;
   }
}